@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

body {
    line-height: 1.5;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500;
    overflow-x: hidden;
    background-color: rgb(250, 250, 250);
    scroll-behavior: smooth;
}

* {
    margin: 0;
    box-sizing: border-box;
}

/* scroll */
*::-webkit-scrollbar {
    width: 7px;
}

*::-webkit-scrollbar-track {
    background: #fff;
}

*::-webkit-scrollbar-thumb {
    background: #aaa;
}

*::-webkit-scrollbar-thumb:hover {
    background: #555;
}

:before,
:after {
    box-sizing: border-box;
}

.container {
    max-width: 1200px;
    margin: auto;
}

.row {
    display: flex;
    flex-wrap: wrap;
}

.v-center {
    align-items: center;
}

.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

h1 {
    color: #064554;
    font-weight: 600;
    font-size: 2.5rem;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: #064554;
}

.btn-primary {
    background-color: #077f9d;
    color: #fff;
}

.btn-primary:hover {
    background-color: #0c9dc2;
    color: #fff;
}

.btn-outline {
    padding: 8px 15px;
    background-color: transparent;
    color: #ed7326;
    border-radius: 5px;
    transition: .7s all;
    border: 1px solid #ed7326;
}

.btn-outline:hover {
    background-color: #ed7326;
    color: #fff;
}

.btn-outline-website {
    padding: 8px 15px;
    background-color: transparent;
    color: #064554;
    border-radius: 5px;
    transition: .7s all;
    border: 1px solid #064554;
}

.btn-outline-website:hover {
    background-color: #064554;
    color: #fff;
}

.btn-disabled {
    padding: 15px 0;
    width: 90%;
    margin: 5px auto;
    text-align: center;
    border-radius: 3px;
    transition: .2s all;
    border: none;
    background-color: #ccccccdb;
    color: #fff;
    cursor: no-drop;
}

.btn-apply-code {
    padding: 9px 15px;
    background-color: #ed7326;
    color: #fff;
    border-radius: 5px;
    transition: .7s all;
    border: 1px solid #ed7326;
    font-size: 12px;
    width: 100%;
    margin-left: 10px;
    height: auto !important;
}

.btn-apply-code:hover {
    background-color: #ed7226dd;
    color: #fff;
}

.btn-proceed {
    padding: 9px 15px;
    background-color: #ed7326;
    color: #fff;
    border-radius: 5px;
    transition: .7s all;
    border: 1px solid #ed7326;
    font-size: 14px;
}

/* header */
/* header profile */
.profile {
    position: relative;
    padding: 0 15px;
}

.profile img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    cursor: pointer;
}

.profile .profile-link {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: #ffff;
    padding: 10px 0;
    box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    width: 140px;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s ease;
}

.profile .profile-link.show {
    opacity: 1;
    pointer-events: visible;
    top: 100%;
}

.profile .profile-link a {
    padding: 6px;
    display: flex;
    grid-gap: 10px;
    font-size: 14px;
    color: #064554;
    align-items: center;
    transition: all 0.3s ease;
    font-weight: 500;
}

.profile .profile-link a:hover {
    color: #ed7326;
}

.btn-retuen {
    background-color: #ed7326;
    color: white;
    border-radius: 5px;
    padding: 10px 20px;
    border: none;
    cursor: pointer;
    transition: all 0.6s;
}

.btn-retuen:hover {
    background-color: transparent;
    color: #ed7326;
    border: 1px solid #ed7326;
}

/* header */
.header {
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 15px;
}

.header .item-left {
    flex: 0 0 15%;
}

.header .logo a {
    font-size: 30px;
    color: #064554;
    font-weight: 700;
    text-decoration: none;
}

.header .logo img {
    width: 120px;
    /* height: 50px; */
}

.logo {
    width: 120px;
    height: 50px;
}

.header .item-center {
    flex: 0 0 47%;
}

.header .item-right {
    flex: 0 0 35%;
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
}

.header .item-right a {
    text-decoration: none;
    color: #555555;
    display: inline-block;
    margin-left: 7px;
    transition: color 0.3s ease;
}

.header .item-right .button-nav {
    padding: 8px 15px;
    background-color: #ed7326;
    color: #fff;
    border-radius: 5px;
    border: none;
    transition: .7s ease;
}

.header .item-right .button-organizer {
    padding: 8px 15px;
    background-color: transparent;
    color: #ed7326;
    border-radius: 5px;
    transition: .7s all;
    border: 1px solid #ed7326;
}

.header .item-right .button-nav:hover {
    border: 1px solid #ed7326;
    background-color: transparent;
    color: #ed7326;
}

.header .item-right .button-organizer:hover {
    background-color: #ed7326;
    color: #fff;
    border: none;
}

@media screen and (max-width: 830px) {
    .btn-apply-code {
        font-size: 10px;
        margin-left: 0px;
    }
}

@media (max-width:780px) {

    .header .item-right {
        flex: 0 0 60%;
        display: flex;
        justify-content: flex-end;
    }

    .header .item-right .button-organizer {
        padding: 8px 12px;

    }

    .header .mobile-menu-trigger {
        margin-left: 3px;
    }

    .profile {
        position: relative;
        padding: 0 5px;
    }

    /* .header .item-right .button-nav {
    display: none;
  } */

    .header .mobile-menu-trigger {
        margin-left: 5px !important;
    }

    .header .item-left {
        flex: 0 0 30%;
    }

    .btn-disabled,
    .btn-ticket {
        width: 100%;
        padding: 12px 0;
    }

    .header .logo img {
        width: 90px;
        height: auto;
    }

}

@media screen and (max-width: 400px) {
    .header .item-right .button-organizer {
        padding: 8px 10px;
        font-size: 10px;
    }
}

@media screen and (max-width:390px) {
    .header .item-right {
        flex: 1 0 60%;
    }
}

.header .menu>ul>li {
    display: inline-block;
    line-height: 50px;
    margin-left: 12px;
}

.header .menu>ul>li>a {
    font-size: 16px;
    font-weight: 600;
    color: #064554;
    position: relative;
    text-transform: capitalize;
    transition: color 0.3s ease;

}

.header .menu>ul>li .sub-menu {
    position: absolute;
    z-index: 500;
    background-color: #ffffff;
    box-shadow: -2px 2px 70px -25px rgba(0, 0, 0, 0.3);
    padding: 20px 30px;
    transition: all 0.5s ease;
    margin-top: 25px;
    opacity: 0;
    visibility: hidden;
}

@media(min-width: 992px) {
    .header .menu>ul>li.menu-item-has-children:hover .sub-menu {
        margin-top: 0;
        visibility: visible;
        opacity: 1;
    }
}

.header .menu>ul>li .sub-menu>ul>li {
    line-height: 1;
}

.header .menu>ul>li .sub-menu>ul>li>a {
    display: inline-block;
    padding: 10px 0;
    font-size: 15px;
    color: #555555;
    transition: color 0.3s ease;
    text-decoration: none;
    text-transform: capitalize;
}

.header .menu>ul>li .single-column-menu {
    min-width: 200px;
    max-width: 350px;
}

.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li {
    line-height: 1;
    display: block;
}

.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
    padding: 10px 0;
    display: inline-block;
    font-size: 15px;
    color: #555555;
    transition: color 0.3s ease;
}

.header .menu>ul>li .sub-menu.mega-menu {
    left: 50%;
    transform: translateX(-50%);
}

.header .menu>ul>li .sub-menu.mega-menu-column-4 {
    max-width: 1225px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 20px 15px;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item {
    flex: 0 0 25%;
    padding: 0 15px;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item .title {
    font-size: 16px;
    color: #ed7326;
    font-weight: 500;
    line-height: 1;
    padding: 10px 0;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title {
    text-align: center;
}

.header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img {
    max-width: 100%;
    width: 100%;
    vertical-align: middle;
    margin-top: 20px;
}

.header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a:hover,
.header .menu>ul>li .sub-menu>ul>li>a:hover,
.header .item-right a:hover,
.header .menu>ul>li:hover>a {
    color: #ed7326;
}

/* banner section */
.banner-section {
    background-image: url('../img/banner.jpg');
    background-size: cover;
    background-position: center;
    height: 700px;
    width: 100%;
    display: block;
}

.mobile-menu-head,
.mobile-menu-trigger {
    display: none;
}

/*responsive*/
@media(max-width: 991px) {

    /* html {
    overflow: hidden;
  } */

    .header .item-center {
        order: 3;
        flex: 0 0 100%;
    }

    .v-center {
        justify-content: space-between;
    }

    .header .mobile-menu-trigger {
        display: flex;
        height: 30px;
        width: 30px;
        margin-left: 15px;
        cursor: pointer;
        align-items: center;
        justify-content: center;
    }

    .header .mobile-menu-trigger span {
        display: block;
        height: 2px;
        background-color: #333333;
        width: 24px;
        position: relative;
    }

    .header .mobile-menu-trigger span:before,
    .header .mobile-menu-trigger span:after {
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #333333;
    }

    .header .mobile-menu-trigger span:before {
        top: -6px;
    }

    .header .mobile-menu-trigger span:after {
        top: 6px;
    }

    .header .item-right {
        align-items: center;
    }

    .header .menu {
        position: fixed;
        width: 320px;
        background-color: #ffffff;
        color: #064554;
        left: 0;
        top: 0;
        height: 100%;
        overflow: hidden;
        transform: translate(-100%);
        transition: all 0.5s ease;
        z-index: 1099;
    }

    .header .menu.active {
        transform: translate(0%);
    }

    .header .menu>ul>li {
        line-height: 1;
        margin: 0;
        display: block;
    }

    .header .menu>ul>li>a {
        line-height: 50px;
        height: 50px;
        padding: 0 50px 0 15px;
        display: block;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    .header .menu>ul>li>a i {
        position: absolute;
        height: 50px;
        width: 50px;
        top: 0;
        right: 0;
        text-align: center;
        line-height: 50px;
        transform: rotate(-90deg);
    }

    .header .menu .mobile-menu-head {
        display: flex;
        height: 50px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        justify-content: space-between;
        align-items: center;
        position: relative;
        z-index: 501;
        position: sticky;
        background-color: #ffffff;
        top: 0;
    }

    .header .menu .mobile-menu-head .go-back {
        height: 50px;
        width: 50px;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
        cursor: pointer;
        line-height: 50px;
        text-align: center;
        color: #064554;
        font-size: 16px;
        display: none;
    }

    .header .menu .mobile-menu-head.active .go-back {
        display: block;
    }

    .header .menu .mobile-menu-head .current-menu-title {
        font-size: 15px;
        font-weight: 500;
        color: #064554;
    }

    .header .menu .mobile-menu-head .mobile-menu-close {
        height: 50px;
        width: 50px;
        border-left: 1px solid rgba(0, 0, 0, 0.1);
        cursor: pointer;
        line-height: 50px;
        text-align: center;
        color: #000000;
        font-size: 25px;
    }

    .header .menu .menu-main {
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .header .menu>ul>li .sub-menu.mega-menu,
    .header .menu>ul>li .sub-menu {
        visibility: visible;
        opacity: 1;
        position: absolute;
        box-shadow: none;
        margin: 0;
        padding: 15px;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding-top: 65px;
        max-width: none;
        min-width: auto;
        display: none;
        transform: translateX(0%);
        overflow-y: auto;
    }

    .header .menu>ul>li .sub-menu.active {
        display: block;
    }

    @keyframes slideLeft {
        0% {
            opacity: 0;
            transform: translateX(100%);
        }

        100% {
            opacity: 1;
            transform: translateX(0%);
        }
    }

    @keyframes slideRight {
        0% {
            opacity: 1;
            transform: translateX(0%);
        }

        100% {
            opacity: 0;
            transform: translateX(100%);
        }
    }

    .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item img {
        margin-top: 0;
    }

    .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center .title {
        margin-bottom: 20px;
    }

    .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item.text-center:last-child .title {
        margin-bottom: 0px;
    }

    .header .menu>ul>li .sub-menu.mega-menu-column-4>.list-item {
        flex: 0 0 100%;
        padding: 0px;
    }

    .header .menu>ul>li .sub-menu>ul>li>a,
    .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul>li>a {
        display: block;
    }

    .header .menu>ul>li .sub-menu.mega-menu>.list-item>ul {
        margin-bottom: 15px;
    }

    .menu-overlay {
        position: fixed;
        background-color: rgba(0, 0, 0, 0.5);
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 1098;
        visibility: hidden;
        opacity: 0;
        transition: all 0.5s ease;
    }

    .menu-overlay.active {
        visibility: visible;
        opacity: 1;
    }
}

@media (max-width: 450px) {
    .header {
        padding: 15px 0;
    }
}


/* new slider */
/*old slider */
.slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.slider_content {
    width: 100%;
    height: 650px;
    display: none;
    /* overflow: hidden; */
}

/*.prev,*/
/*.next {*/
/*  position: absolute;*/
/*  top: 50%;*/
/*  transform: translate(0, -50%);*/
/*  font-size: 32px;*/
/*  padding: 15px;*/
/*  cursor: pointer;*/
/*  color: #ed7326;*/
/*  transition: 0.1s;*/
/*  user-select: none;*/
/*}*/

/*.prev:hover,*/
/*.next:hover {*/
/*  color: #ed7226db;*/
/*}*/

/*.next {*/
/*  right: 0;*/
/*}*/

.dotsbox {
    display: none;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    bottom: 20px;
    cursor: pointer;
}

.dot {
    display: inline-block;
    width: 15px;
    height: 15px;
    border: 3px solid #ffffffbb;
    border-radius: 50%;
    margin: 0 10px;
    cursor: pointer;
}

/* javascript */
.active,
.dot:hover {
    border-color: #ed7326;
    /* blue */
}

/* 2 */
.fade {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes fade {
    from {
        opacity: 0.8
    }

    to {
        opacity: 1
    }
}

@keyframes fade {
    from {
        opacity: 0.8
    }

    to {
        opacity: 1
    }
}

/* 3 */
.slide_text {
    position: absolute;
    color: #fff;
    letter-spacing: 1px;
    line-height: 35px;
    top: 35%;
    left: 8%;
    -webkit-animation-name: posi;
    -webkit-animation-duration: 2s;
    animation-name: posi;
    animation-duration: 2s;
    z-index: 1;
    width: 35%;
}

@-webkit-keyframes posi {
    from {
        left: 25%;
    }

    to {
        left: 8%;
    }
}


@keyframes posi {
    from {
        left: 25%;
    }

    to {
        left: 8%;
    }
}

.slide_text h1 {
    color: #fff;
    font-size: 30px;
    margin-bottom: 20px;
    font-weight: bold;
}

.slide_text p {
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 25px;
}

.slide_text a {
    text-decoration: none;
    color: #fff;
    background-color: #ed7326;
    padding: 15px 30px;
    border-radius: 5px;
    font-size: 16px;
    letter-spacing: 0;
}

/* responsiveness for All Devices */
@media (max-width: 1200px) {
    h1 {
        font-size: 1.8rem;
    }

    .slider_content {
        height: 400px;
    }

    .slide_text {
        width: 50%;
        top: 30%;
    }

    .slide_text h1 {
        font-size: 28px;
    }

    .slide_text p {
        font-size: 18px;
    }

    .slide_text a {
        padding: 8px 16px;
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .slider_content {
        height: 350px;
    }

    .slide_text {
        width: 70%;
        top: 25%;
    }

    .slide_text h1 {
        font-size: 25px;
    }

    .slide_text p {
        font-size: 16px;
        letter-spacing: 0;

    }

    .slide_text a {
        padding: 6px 12px;
        font-size: 14px;
    }

    /* .prev,
  .next {
    font-size: 20px;
    padding: 10px;
  } */
}

@media (max-width: 480px) {
    .slider_content {
        height: 200px;
    }

    .slide_text h1,
    .slide_text p {
        margin-bottom: 6px;
    }

    .slide_text {
        width: 85%;
        top: 23%;
        left: 8%;
        line-height: 25px;
        letter-spacing: 2px;
    }

    .slide_text h1 {
        font-size: 20px;
        font-weight: bold;
    }

    .slide_text p {
        font-size: 13px;
    }

    .slide_text a {
        padding: 5px 10px;
        font-size: 12px;
    }

    /* .prev,
  .next {
    font-size: 15px;
    padding: 8px;
  } */

    .dot {
        width: 10px;
        height: 10px;
    }
}

/* @media screen and (max-width: 390px) {
  .slider_content {
    height: 165px;
  }

  .header {
    padding: 10px 0 !important;
  }
} */

/* category */
/* styles.css */
.category {
    margin: 4rem 3rem;
}

.category h1,
#Events h1 {
    font-size: 30px;
    font-weight: 600;
    margin-top: 60px;
    color: #064554;
    /* user-select: none; */
}

.row-container {
    display: flex;
    justify-content: space-around;
    width: 100%;
    margin: 0 auto;
    flex-wrap: wrap;
}

.card-body {
    text-align: center;
}

.card-body i {
    color: #ed7226c0;
}

.card {
    margin: 0 10px;
    padding: 15px 10px;
    text-align: left;
    border: none;
    transition: transform 0.2s;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* .card:hover {
  transform: scale(1.05);
} */

.card-title {
    font-weight: 600;
    color: #064554;
}

.card-text {
    color: #777;
    font-size: 13px !important;
}

.btn-success {
    padding: 12px 22px;
    color: #ed7326;
    background-color: transparent;
    border: 1px solid #ed7326;
    transition: .7s all;
}

.btn-success:hover {
    padding: 12px 22px;
    background-color: #ed7326;
    border: none;
}

/* Custom media queries */
@media (min-width: 1200px) {
    .row-container {
        width: 90%;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .row-container a {
        flex: 0 0 48%;
        max-width: 48%;
    }

    .row-container a:nth-child(odd) {
        margin-right: 4%;
    }
}

@media (max-width: 767px) {
    .row-container a {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .category {
        margin: 4rem 2rem;
    }
}

@media (max-width: 450px) {
    .category {
        margin: 4rem 1rem;
    }

    .category h1,
    #Events h1 {
        font-size: 25px;
        margin-top: 30px;
    }
}

/* make it slider in mobile app */
@media (max-width: 800px) {
    .row-container {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        gap: 10px !important;
        padding-bottom: 10px !important;
        scrollbar-width: none !important;
        /* Hides scrollbar in Firefox */
    }

    .row-container::-webkit-scrollbar {
        display: none !important;
        /* Hides scrollbar in WebKit browsers */
    }

    .row-container a {
        flex: 0 0 80% !important;
        max-width: 80% !important;
        scroll-snap-align: start !important;
    }
}

/* end category */
/* Top Events */
.Events {
    text-align: center;
    margin: 40px 0;
}

.product-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
    flex-wrap: wrap;
    width: 85%;
    margin: 0 auto;
}

.Events .product {
    width: 23%;
    min-width: 300px;
    border-radius: 20px;
    cursor: pointer;
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
    margin: 15px 0;
    transition: 1s ease;
    position: relative;
    height: auto;

}

.Events .product:hover {
    box-shadow: 20px 20px 30px rgb(0, 0, 0, 0.2);
    transition: 1s ease;
}

.Events .product img {
    width: 100%;
    /* object-fit: cover; */
    border-radius: 7px 7px 0 0;
    /* height: 360px; */
    /* object-fit: fill; */
}

.Events .product .des {
    text-align: start;
    padding: 20px 15px;
}

.Events .product .des p {
    color: #777;
    font-size: .9rem;
    margin-bottom: 10px;
}

.Events .product .des h5 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #455864;
}

/* .Events .product .des span {
  padding-top: 7px;
  font-size: 16px;
  font-weight: 700;
} */

.Events .product .cart {
    /* width: 80px;
  height: 80px; */
    font-size: 22px;
    /* background-color: green; */
    line-height: 40px;
    border-radius: 50%;
    font-weight: 500;
    color: #fff;
    position: absolute;
    right: 10px;
    top: 10px;
    padding: 0px 10px;

}

.product-name {
    font-size: 18px;
    font-weight: 600;
    padding: 5px;
    color: #455864;
}

.hosted {
    margin: 10px 0;
    font-size: .9rem;
    color: #777;
}

/* make it responsive for devices like ipad   */

@media (max-width:799px) {

    .product-container {
        justify-content: center;
    }

    .Events .product {
        margin: 10px 0;
    }

    .product-container {
        width: 95%;
    }
}

/* make it responsive for Mobile    */

@media (max-width:470px) {

    /* product */
    .Events .product {
        width: 100%;
    }

}

/* subscribe */
.section-p1 {
    margin: 40px 0;
    padding: 60px 80px;
}

/* #subscribe {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    background-color: #005062;
} */

/* #subscribe h4 {
    color: #fff;
    font-weight: 700;
    font-size: 22px;
}

#subscribe p {
    color: #818ea0;
    font-weight: 600;
    font-size: 14px;
}

#subscribe p span {
    color: #ed7326;
}

#subscribe .form {
    display: flex;
}

#subscribe input {
    height: 45px;
    width: 100%;
    padding: 0 10px;
    font-size: 14px;
    border: 1px solid transparent;
    border-radius: 5px;
    outline: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#subscribe button {
    background-color: #dd5907;
    color: #fff;
    white-space: nowrap;
    border-radius: 5px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border: none;
    padding: 0 5px;
} */


/* elementor-section */
.elementor-section {
    margin: 40px 80px;

}

.elementor {
    background-color: #005062;
    color: #fff;
    padding: 50px 30px;
    border-radius: 5px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.elmentor-data {
    flex: 1 1 calc(25% - 20px);
    margin: 20px 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
}

.elmentor-text {
    text-align: center;
}

.elmentor-text i {
    font-size: 2rem;
    margin-bottom: 10px;
    color: #ed7326;
}

.plus {
    color: #fff;
}

.elmentor-text h1 {
    font-size: 30px;
    margin: 5px 0;
    color: #fff !important;

}

.elmentor-text p {
    font-size: 14px;
    margin: 5px 0;
    color: #fff;
}

@media (max-width: 570px) {

    /* elementor */
    .elementor-section {
        margin: 10px ;
    }

    .elementor {
        padding: 20px 10px;
    }
    .elmentor-text h1 {
      font-size: 20px;
    }
    .elmentor-data {
        flex: 1 1 calc(50% - 20px);
    }

    .section-p1 {
        padding: 60px 20px;
    }
}

/* end elementor section */


/* footer */
.footer-section {
    background: #064554;
    position: relative;
}

.footer-cta {
    border-bottom: 1px solid #373636;
}

.single-cta i {
    color: #ed7326;
    font-size: 30px;
    float: left;
    margin-top: 8px;
}

.cta-text {
    padding-left: 15px;
    display: inline-block;
}

.cta-text h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 2px;
}

.cta-text span {
    color: #757575;
    font-size: 15px;
}

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

.footer-pattern img {
    position: absolute;
    top: 0;
    left: 0;
    height: 330px;
    background-size: cover;
    background-position: 100% 100%;
}

.footer-logo {
    margin-bottom: 15px;
}

.footer-logo img {
    max-width: 140px;
    height: 60px;
}

.footer-text p {
    margin-bottom: 14px;
    font-size: 14px;
    color: #7e7e7e;
    line-height: 28px;
}

.footer-social-icon span {
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: 700;
    /* font-family: 'Poppins', sans-serif; */
    margin-bottom: 20px;
}

.footer-social-icon a {
    color: #fff;
    font-size: 16px;
    margin-right: 15px;
}

.footer-social-icon i {
    height: 35px;
    width: 35px;
    text-align: center;
    line-height: 35px;
    border-radius: 50%;
}

.footer-social-icon .logo-app {
    margin: 15px 0;
    width: 130px;
    text-align: center;
}

.facebook-bg {
    background: #3B5998;
}

.x-bg {
    background-color: #000;
    color: #fff;
}

.twitter-bg {
    background: #55ACEE;
}

.instagram-bg {
    background: linear-gradient(45deg, #ed282f 0%, #fa9478 99%, #fad0c4 100%);
}

.google-bg {
    background: #DD4B39;
}

.whatsapp-bg {
    background: #25D366;
}

.footer-widget-heading h3 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 40px;
    position: relative;
}

.footer-widget-heading h3::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -15px;
    height: 2px;
    width: 50px;
    background: #ed7326;
}

.footer-widget ul li {
    display: inline-block;
    width: 100%;
    margin-bottom: 12px;
}

.footer-widget ul li a:hover {
    color: #ed7326;
}

.footer-widget ul li a {
    color: #878787;
    text-transform: capitalize;
}

.subscribe-form {
    position: relative;
    overflow: hidden;
}

.subscribe-form input {
    width: 100%;
    padding: 14px 28px;
    background: #064554;
    border: 1px solid #004c5f;
    color: #fff;
}

.subscribe-form button {
    position: absolute;
    right: 0;
    background: #ed7326;
    padding: 13px 20px;
    border: 1px solid #ed7326;
    top: 0;
}

.subscribe-form button i {
    color: #fff;
    font-size: 22px;
    transform: rotate(-6deg);
}

.copyright-area {
    background: #005062;
    padding: 25px 0;
}

.copyright-area .row {
    align-items: baseline;
}

.copyright-text p {
    margin: 0;
    font-size: 14px;
    color: #878787;
}

.copyright-text p a {
    color: #ed7326;
}

.footer-menu li {
    display: inline-block;
    margin-left: 20px;
}

.footer-menu li:hover a {
    color: #ed7326;
}

.footer-menu li a {
    font-size: 14px;
    color: #878787;
}

@media screen and (max-width:790px) {
    .footer-cta .row {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .row .single-cta {
        display: flex;
    }

    .footer-social-icon {
        padding: 15px 0;
    }

    .footer-widget {
        padding: 10px 0;
    }

    .footer-menu {
        padding: 15px 0;
    }
}

@media screen and (max-width:600px) {
    .single-cta {
        padding: 10px 0;
    }
}

.footer-social-gallery {
    background: linear-gradient(to bottom,
            rgba(255, 255, 255, 0.05),
            var(--primary-color));
    padding: 1.5rem 0;
    position: relative;
}

.social-gallery-header {
    margin-bottom: 0.5rem;
    position: relative;
}

.social-gallery-title {
    text-align: left;
    font-size: 1.5rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 1rem;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.social-gallery-title a {
    color: #fff !important;
    text-decoration: none;
    font-weight: 500;
    font-size: 1.5rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
}

.instagram-handle {
    color: #fff;
    font-weight: 500;
    position: relative;
    transition: color 0.3s ease;
}

.instagram-handle::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #fff;
    transform: scaleX(0);
    transition: transform 0.3s ease;
    transform-origin: right;
}

.social-gallery-title:hover .instagram-handle {
    color: var(--text-inverse);
}

.social-gallery-title:hover .instagram-handle::after {
    transform: scaleX(1);
    transform-origin: left;
}

.social-gallery-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 1rem;
    margin: 0 auto;
    max-width: 1400px;
}

.social-gallery-item {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 12px;
    transition: all 0.4s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.social-gallery-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.social-post-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
    filter: brightness(0.95);
}

.social-gallery-item:hover .social-post-image {
    transform: scale(1.08);
    filter: brightness(1);
}

@media screen and (max-width: 768px) {
    .social-gallery-title {
        font-size: 1.2rem;
    }

    .social-gallery-item {
        width: 100%;
    }

    .social-gallery-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* End section footer */


/* page salesEvent */

#saleDetailes {
    display: flex;
    margin-top: 20px;

}

#saleDetailes .single-product {
    width: 40%;
    margin-right: 50px;
    ;
}

.small-img-group {
    display: flex;
    justify-content: space-between
}

.small-img-col {
    cursor: pointer;
    flex-basis: 24%;
}

#saleDetailes .Aboutproduct {
    width: 50%;
    padding-top: 30px;
}

#saleDetailes .Aboutproduct h6 {
    font-size: 16px;
}

#saleDetailes .Aboutproduct h4 {
    padding: 40px 0 20px 0;
    font-weight: bold;
    font-size: 30px;
    /* font-family: initial; */
}

#saleDetailes .Aboutproduct h3 {
    padding-bottom: 10px;
    font-size: 25px;
}

#saleDetailes .Aboutproduct h2 {
    font-size: 25px;
}

#saleDetailes .Aboutproduct select {
    display: block;
    padding: 5px 10px;
    margin-bottom: 10px;
}

#saleDetailes .Aboutproduct input {
    width: 50px;
    height: 50px;
    padding-left: 10px;
    font-size: 15px;
    margin-right: 10px;
    border-radius: 6px;
}

#saleDetailes .Aboutproduct .btn-Noramal {
    background-color: #ed7326;
    color: #FFF;
    padding: 15px 35px;
    border: none;
    border-radius: 7px;
}

#saleDetailes .Aboutproduct span {
    line-height: 25px;
    color: #848484;
}

.card-info-payment {
    padding: 10px;
}

.card-info-payment h5 {
    margin-bottom: 10px;
    font-size: 15px;
}

.card-info-payment p {
    font-size: 14px;
}

/*single-product */
@media (max-width:470px) {
    #saleDetailes {
        display: flex;
        flex-direction: column;
    }

    #saleDetailes .single-product {
        width: 100%;
    }

    #saleDetailes .Aboutproduct {
        width: 100%;
    }
}

.single-product .img-cover {
    height: 450px;
    margin-bottom: 10px;
    /* object-fit: cover; */
}

@media (max-width: 991px) {
    .single-product .img-cover {
        object-fit: cover;
    }
}

/* new card  */

/*=============== VARIABLES CSS ===============*/
:root {
    /*========== Colors ==========*/
    /*Color mode HSL(hue, saturation, lightness)*/
    --first-color: hsl(82, 60%, 28%);
    --title-color: hsl(0, 0%, 15%);
    --text-color: hsl(0, 0%, 35%);
    --body-color: hsl(0, 0%, 95%);
    --container-color: hsl(0, 0%, 100%);

    /*========== Font and typography ==========*/
    /*.5rem = 8px | 1rem = 16px ...*/
    --body-font: "Poppins", sans-serif;
    --h2-font-size: 1.25rem;
    --small-font-size: .813rem;
}

/*=============== BASE ===============*/
/*
img {
  display: block;
  max-width: 100%;
  height: auto;
} */

/*=============== CARD ===============*/
.custom-container {
    width: 97%;
    margin: 35px auto;
}

.container-card-event {
    display: grid;
    place-items: center;
    margin-inline: 1.5rem;
    padding-block: 5rem;
}

.card__container {
    display: grid;
    row-gap: 3.5rem;
}

.card__article {
    position: relative;
    overflow: hidden;
}

.card__article {
    position: relative;
}

.heart-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(237, 114, 38, 0.908);
    border: none;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;

    transition: opacity 0.3s ease, background 0.3s ease;
}

.heart-icon:hover {
    background-color: #fff;
    color: #ed7326 !important;
}

.heart-icon i {
    font-size: 18px;
    color: #fff !important;
}

.heart-icon:hover i {
    color: #ed7326 !important;
}


.sponsored {
    position: absolute;
    top: 15px;
    left: 10px;
    font-size: 14px;
    background-color: #fff;
    color: #064554;
    padding: 5px 10px;
    border-radius: 7px;
}

.card__img {
    width: 100%;
    height: 450px;
    border-radius: 1.5rem;
    object-fit: cover;
}

.card__data {
    width: 90%;
    background-color: var(--container-color);
    padding: .75rem 1.1rem;
    box-shadow: 0 8px 24px hsla(0, 0%, 0%, .15);
    border-radius: 1rem;
    position: absolute;
    bottom: -6rem;
    left: 0;
    right: 0;
    margin-inline: auto;
    opacity: 0;
    transition: opacity 1s 1s;
    text-align: center;
}

.card__description {
    display: block;
    font-size: 17px;
    font-weight: 500;
    margin-bottom: .1rem;
}

.card__title {
    font-size: 20px;
    font-weight: 600;
    color: var(--title-color);
    margin: .5rem 0rem;
}

.card__button {
    text-decoration: none;
    font-size: var(--small-font-size);
    font-weight: 500;
    color: var(--first-color);
}

.card__button:hover {
    text-decoration: underline;
}

/* Naming animations in hover */
.card__article:hover .card__data {
    animation: show-data 1s forwards;
    opacity: 1;
    transition: opacity .5s;
}

.card__article:hover {
    animation: remove-overflow 2s forwards;
}

.card__article:not(:hover) {
    animation: show-overflow 2s forwards;
}

.card__article:not(:hover) .card__data {
    animation: remove-data 1s forwards;
}

/* Card animation */
@keyframes show-data {
    50% {
        transform: translateY(-10rem);
    }

    100% {
        transform: translateY(-7rem);
    }
}

@keyframes remove-overflow {
    to {
        overflow: initial;
    }
}

@keyframes remove-data {
    0% {
        transform: translateY(-7rem);
    }

    50% {
        transform: translateY(-10rem);
    }

    100% {
        transform: translateY(.5rem);
    }
}

@keyframes show-overflow {
    0% {
        overflow: initial;
        pointer-events: none;
    }

    50% {
        overflow: hidden;
    }
}

.nav-item .nav-link {
    color: #3d3d3d !important;
}

.nav-item .nav-link.active {
    color: #e67529 !important;
}

.event-date-container {
    margin: 5px auto;
    padding: 10px 15px;
}

.event-date-container .event-date {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    border-bottom: 1px solid #868686;
    padding: 15px 5px;
}

.event-date-container .event-date .event-details {
    flex: 1;
}

.event-date .event-details .event-day,
.event-date .event-details .event-location {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.event-day .icon,
.event-location .icon {
    margin-right: 10px;
    font-size: 18px;
    color: #e67529;
}

.event-action {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    margin-left: 20px;
}

.event-action .event-price {
    color: #e47916;
    font-weight: bold;
    margin-bottom: 15px;
}

.event-action .buy-tickets {
    background-color: #ed7326;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    transition: all 0.3s ease;
}

.event-action .buy-tickets:hover {
    background-color: transparent;
    color: #ed7326;
    border: 1px solid #ed7326;
}


/*=============== BREAKPOINTS ===============*/
/* For small devices */
@media screen and (max-width: 900px) {
    .custom-container {
        width: 90%;
        margin: 25px auto;
        display: flex;
        justify-content: flex-start;
    }
}

@media screen and (max-width: 340px) {
    .container-card-event {
        margin-inline: 1rem;
    }

    .card__data {
        width: 250px;
        padding: 1rem;
    }

}

@media screen and (max-width:450px) {
    .Events .product img {
        /* height: 420px; */
        /* object-fit: cover; */
        width: 100%;
    }

    .heart-icon {
        position: absolute;
        right: 10px;
        font-size: 20px;
    }

    .Events {
        margin: 30px 0;
    }
}

/* For medium devices */
@media screen and (min-width: 768px) {
    .card__container {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 1.5rem;
    }

}

/* For large devices */
@media screen and (min-width: 1120px) {
    /* .container {
    height: 100vh;
  } */

    .card__container {
        grid-template-columns: repeat(4, 1fr);
    }

    .card__img {
        width: 100%;
        height: 450px;
    }

    .card__data {
        width: 90%;
        padding-inline: 1rem;
    }
}

@media (max-width: 600px) {
    .event-date-container {
        padding: 10px 7px;
    }

    .event-action {
        align-items: flex-start;
        margin-left: 0;
        margin-top: 15px;
    }

    .event-date-container .event-date {
        display: block;
        flex-direction: column;
    }
}

/* page event details  */

/*------- portfolio -------*/
.project {
    margin: 15px 0;
}

.no-gutter .project {
    margin: 0 !important;
    padding: 0 !important;
}

.has-spacer {
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 30px;
}

.has-spacer-extra-space {
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 30px;
}

.has-side-spacer {
    margin-left: 30px;
    margin-right: 30px;
}

.project-title {
    font-size: 1.25rem;
}

.project-skill {
    font-size: 0.9rem;
    font-weight: 400;
    letter-spacing: 0.06rem;
}

.project-info-box {
    margin: 15px 0;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 30px 20px;
    border-radius: 5px;
}

.project-info-box h4 {
    margin-bottom: 15px;
}

.project-info-box p {
    margin-bottom: 7px;
    padding-bottom: 7px;
    /* border-bottom: 1px solid #d5dadb; */
}

.project-info-box p:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}



img {
    width: 100%;
    max-width: 100%;
    height: auto;
    -webkit-backface-visibility: hidden;
}

.rounded {
    border-radius: 5px !important;
}

.btn-xs.btn-icon {
    width: 34px;
    height: 34px;
    max-width: 34px !important;
    max-height: 34px !important;
    font-size: 10px;
    line-height: 34px;
}

/* complete order css */
.input-container {
    position: relative;
}

.input-container i {
    position: absolute;
    /* left: 10px; */
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    background-color: #cccccc7e;
    border-radius: 7px 0 0 7px;
    padding: 11px;
}

button.btn-primary {
    padding: 10px 20px;
}

.project-info-box h4 {
    font-size: 22px;
    font-weight: bold;
    color: #000;
}

/* fixed cart in the bottom of page new update in page complete order */
/* .box-ticket-info {
  position: sticky;
  top: 2%;
} */

.ticket-box {
    background: #fff;
    border: .5px solid #ed7326;
    border-radius: 10px;
    padding: 5px 10px;
    margin-bottom: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.ticket-box.active {
    background-color: #ed722616;
    border: 2px solid #ed7326;
}

/* Hide the radio button */
.ticket-box input[type="radio"] {
    display: none;
}

.ticket-quantity .quantity {
    width: 40px;
    height: 35px;
    text-align: center;
    border: 1px solid #8080805c;
    padding: 5px 0;
    border-radius: 10px;
}

.ticket-header {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 10px;
    color: #ed7326;
}

.ticket-price {
    font-size: 1rem;
    font-weight: bold;
    color: #000;
}

.btn-custom {
    border-radius: 50%;
    padding: 5px 10px;
    font-size: 0.9rem;
}

.remove {
    color: #8d8dbb;
    float: right;
    text-decoration: dashed;
    cursor: pointer;
    margin: 5px;
}

.payment-container {
    margin: 15px 0;
}

.payment-title {
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold;
}

.payment-methods {
    display: flex;
    flex-direction: row;
    gap: 15px;
    margin-bottom: 7px;
}

.payment-option {
    display: flex;
    align-items: center;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    padding: 7px 20px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.payment-option.active {
    border-color: #ff99006d;
    background-color: #fff8e1c7;
}

.radio-input {
    display: none;
}

.payment-content {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.payment-icon {
    width: 50px;
    height: auto;
}

.payment-text {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.payment-subtext {
    font-size: 12px;
    color: #888;
}

.valu-text {
    color: #00c4b3;
    font-size: 20px;
}

.payment-option input:checked~.payment-content {
    color: #ff9800;
}

/* gallery section  */
/* Gallery CSS */
.gallery-feedback-section {
    padding: 60px 0;
    background: #1a1a1a;
    margin-top: 20px;
}

.gallery-wrapper {
    width: 100%;
    padding: 20px;
}

.gallery-inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* Changed to always show 3 columns */
    gap: 20px;
}

.gallery-img {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.gallery-img img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

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

.gallery-img video {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.modal-content-gallery video {
    max-width: 100%;
    max-height: 60vh;
    margin: auto;
    display: block;
}

/* Modal Styles */
.modal-gallery {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 1000;
    padding: 20px;
}

.modal-content-gallery {
    max-width: 50% !important;
    max-height: 60vh !important;
    margin: auto;
    display: block;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.close-modal {
    position: absolute;
    top: 15px;
    right: 25px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

/* Navigation Buttons */
.nav-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.1);
    color: white;
    padding: 15px 20px;
    cursor: pointer;
    border: none;
    border-radius: 5px;
    font-size: 24px;
    transition: background-color 0.3s;
}

.nav-button:hover {
    background: rgba(255, 255, 255, 0.3);
}

.prev-button {
    left: 20px;
}

.next-button {
    right: 20px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .project-info-box h4 {
        font-size: 19px;
    }

    .project-info-box {
        margin-bottom: 10px;
    }

    .gallery-feedback-section {
        padding: 40px 0;
    }

    .gallery-inner {
        grid-template-columns: repeat(2, 1fr);
        /* Show 2 columns on tablets */
        gap: 15px;
    }

    .gallery-img img,
    .gallery-img video {
        height: 150px;
    }

    .nav-button {
        padding: 10px 15px;
        font-size: 20px;
    }

    .modal-content-gallery {
        max-width: 88% !important;
    }
}

@media (max-width: 480px) {
    .gallery-feedback-section {
        padding: 25px 0;
    }

    .nav-button {
        padding: 5px;
        font-size: 18px;
    }

    .gallery-img img,
    .gallery-img video {
        height: 120px;
    }

}

@media screen and (max-width: 700px) {

    .box-ticket-info,
    .event-info-data {
        position: fixed;
        bottom: 25px;
        padding: 0;
        margin: 0;
        z-index: 9;
    }

    .ticket-box {
        padding: 0 10px;
    }

    .payment-container {
        margin: 10px 0;
    }

    .payment-methods {
        gap: 7px;
    }

    .payment-option {
        padding: 15px 7px;
    }
}

/* facebook button */
.btn-facebook,
.btn-facebook:active,
.btn-facebook:focus {
    color: #fff !important;
    background: #4e68a1;
    border: 2px solid #4e68a1;
}

.btn-facebook:hover {
    color: #fff !important;
    background: #3b4f7a;
    border: 2px solid #3b4f7a;
}

.btn-facebook-link,
.btn-facebook-link:active,
.btn-facebook-link:focus {
    color: #4e68a1 !important;
    background: transparent;
    border: none;
}

.btn-facebook-link:hover {
    color: #3b4f7a !important;
}

.btn-outline-facebook,
.btn-outline-facebook:active,
.btn-outline-facebook:focus {
    color: #4e68a1 !important;
    background: transparent;
    border: 2px solid #4e68a1;
}

.btn-outline-facebook:hover {
    color: #fff !important;
    background: #4e68a1;
    border: 2px solid #4e68a1;
}

/* twitter button */
.btn-twitter,
.btn-twitter:active,
.btn-twitter:focus {
    color: #fff !important;
    background: #65b5f2;
    border: 2px solid #65b5f2;
}

.btn-twitter:hover {
    color: #fff !important;
    background: #5294c6;
    border: 2px solid #5294c6;
}

.btn-twitter:hover {
    color: #fff !important;
    background: #5294c6;
    border: 2px solid #5294c6;
}

.btn-twitter-link,
.btn-twitter-link:active,
.btn-twitter-link:focus {
    color: #65b5f2 !important;
    background: transparent;
    border: none;
}

.btn-twitter-link:hover {
    color: #5294c6 !important;
}

.btn-outline-twitter,
.btn-outline-twitter:active,
.btn-outline-twitter:focus {
    color: #65b5f2 !important;
    background: transparent;
    border: 2px solid #65b5f2;
}

.btn-outline-twitter:hover {
    color: #fff !important;
    background: #65b5f2;
    border: 2px solid #65b5f2;
}

/* google button */
.btn-google,
.btn-google:active,
.btn-google:focus {
    color: #fff !important;
    background: #e05d4b;
    border: 2px solid #e05d4b;
}

.btn-google:hover {
    color: #fff !important;
    background: #b94c3d;
    border: 2px solid #b94c3d;
}

.btn-google-link,
.btn-google-link:active,
.btn-google-link:focus {
    color: #e05d4b !important;
    background: transparent;
    border: none;
}

.btn-google-link:hover {
    color: #b94c3d !important;
}

.btn-outline-google,
.btn-outline-google:active,
.btn-outline-google:focus {
    color: #e05d4b !important;
    background: transparent;
    border: 2px solid #e05d4b;
}

.btn-outline-google:hover {
    color: #fff !important;
    background: #e05d4b;
    border: 2px solid #e05d4b;
}

/* linkedin button */
.btn-linkedin,
.btn-linkedin:active,
.btn-linkedin:focus {
    color: #fff !important;
    background: #2083bc;
    border: 2px solid #2083bc;
}

.btn-linkedin:hover {
    color: #fff !important;
    background: #186592;
    border: 2px solid #186592;
}

.btn-linkedin-link,
.btn-linkedin-link:active,
.btn-linkedin-link:focus {
    color: #2083bc !important;
    background: transparent;
    border: none;
}

.btn-linkedin-link:hover {
    color: #186592 !important;
}

.btn-outline-linkedin,
.btn-outline-linkedin:active,
.btn-outline-linkedin:focus {
    color: #2083bc !important;
    background: transparent;
    border: 2px solid #2083bc;
}

.btn-outline-linkedin:hover {
    color: #fff !important;
    background: #2083bc;
    border: 2px solid #2083bc;
}

/* pinterest button */
.btn-pinterest,
.btn-pinterest:active,
.btn-pinterest:focus {
    color: #fff !important;
    background: #d2373b;
    border: 2px solid #d2373b;
}

.btn-pinterest:hover {
    color: #fff !important;
    background: #ad2c2f;
    border: 2px solid #ad2c2f;
}

.btn-pinterest-link,
.btn-pinterest-link:active,
.btn-pinterest-link:focus {
    color: #d2373b !important;
    background: transparent;
    border: none;
}

.btn-pinterest-link:hover {
    color: #ad2c2f !important;
}

.btn-outline-pinterest,
.btn-outline-pinterest:active,
.btn-outline-pinterest:focus {
    color: #d2373b !important;
    background: transparent;
    border: 2px solid #d2373b;
}

.btn-outline-pinterest:hover {
    color: #fff !important;
    background: #d2373b;
    border: 2px solid #d2373b;
}

/* dribble button */
.btn-dribbble,
.btn-dribbble:active,
.btn-dribbble:focus {
    color: #fff !important;
    background: #ec5f94;
    border: 2px solid #ec5f94;
}

.btn-dribbble:hover {
    color: #fff !important;
    background: #b4446e;
    border: 2px solid #b4446e;
}

.btn-dribbble-link,
.btn-dribbble-link:active,
.btn-dribbble-link:focus {
    color: #ec5f94 !important;
    background: transparent;
    border: none;
}

.btn-dribbble-link:hover {
    color: #b4446e !important;
}

.btn-outline-dribbble,
.btn-outline-dribbble:active,
.btn-outline-dribbble:focus {
    color: #ec5f94 !important;
    background: transparent;
    border: 2px solid #ec5f94;
}

.btn-outline-dribbble:hover {
    color: #fff !important;
    background: #ec5f94;
    border: 2px solid #ec5f94;
}

/* instagram button */
.btn-instagram,
.btn-instagram:active,
.btn-instagram:focus {
    color: #fff !important;
    background: #4c5fd7;
    border: 2px solid #4c5fd7;
}

.btn-instagram:hover {
    color: #fff !important;
    background: #4252ba;
    border: 2px solid #4252ba;
}

.btn-instagram-link,
.btn-instagram-link:active,
.btn-instagram-link:focus {
    color: #4c5fd7 !important;
    background: transparent;
    border: none;
}

.btn-instagram-link:hover {
    color: #4252ba !important;
}

.btn-outline-instagram,
.btn-outline-instagram:active,
.btn-outline-instagram:focus {
    color: #4c5fd7 !important;
    background: transparent;
    border: 2px solid #4c5fd7;
}

.btn-outline-instagram:hover {
    color: #fff !important;
    background: #4c5fd7;
    border: 2px solid #4c5fd7;
}

/* youtube button */
.btn-youtube,
.btn-youtube:active,
.btn-youtube:focus {
    color: #fff !important;
    background: #e52d27;
    border: 2px solid #e52d27;
}

.btn-youtube:hover {
    color: #fff !important;
    background: #b31217;
    border: 2px solid #b31217;
}

.btn-youtube-link,
.btn-youtube-link:active,
.btn-youtube-link:focus {
    color: #e52d27 !important;
    background: transparent;
    border: none;
}

.btn-youtube-link:hover {
    color: #b31217 !important;
}

.btn-outline-youtube,
.btn-outline-youtube:active,
.btn-outline-youtube:focus {
    color: #e52d27 !important;
    background: transparent;
    border: 2px solid #e52d27;
}

.btn-outline-youtube:hover {
    color: #fff !important;
    background: #e52d27;
    border: 2px solid #e52d27;
}

.btn-xs.btn-icon span,
.btn-xs.btn-icon i {
    line-height: 34px;
}

.btn-icon.btn-circle span,
.btn-icon.btn-circle i {
    margin-top: -1px;
    margin-right: -1px;
}

.btn-icon i {
    margin-top: -1px;
}

.btn-icon span,
.btn-icon i {
    display: block;
    line-height: 50px;
}

a.btn,
a.btn-social {
    display: inline-block;
}

.mr-5 {
    margin-right: 5px !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.btn-facebook,
.btn-facebook:active,
.btn-facebook:focus {
    color: #fff !important;
    background: #4e68a1;
    border: 2px solid #4e68a1;
}

.btn-circle {
    border-radius: 50% !important;
}

.project-info-box p {
    margin-bottom: 7px;
    padding-bottom: 7px;
    /* border-bottom: 1px solid #d5dadb; */
}

.details .row p {
    color: #666;
    font-size: .9rem;
    margin-bottom: 10px;
}

b,
strong {
    font-weight: 700 !important;
    display: contents;
}

.btn-ticket {
    padding: 15px 0;
    width: 100%;
    margin: 5px auto;
    background-color: #ed7326;
    color: #fff;
    text-align: center;
    border-radius: 3px;
    transition: .2s all;
    border: none;
}

.btn-ticket:hover {
    border: 1px solid #ed7326;
    color: #ed7326;
    background-color: transparent;
}

/* .img-details {
    height: 400px;
} */

.value-button {
    display: flex;
    justify-content: center;
    margin: 0px;
    width: 35px;
    height: 35px;
    text-align: center;
    vertical-align: middle;
    padding: 6px 0;
    background: #ed7326;
    color: #fff;
    border-radius: 7px;

}

.value-button:hover {
    cursor: pointer;
}

input#quantity {
    text-align: center;
    border-radius: 1px solid #fff;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin: 0px;
    width: 45px;
    height: 35px;
}


input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

@media (max-width:880px) {



    .filter {
        padding: 15px 10px;
    }

    /* .img-details {
        height: 300px;
    } */
}

@media (max-width:1000px) {
    .project-info-box {
        padding: 15px 20px;
    }
}

@media (max-width:450px) {
    /* .img-details {
        height: 200px;
    } */

    .project-info-box {
        margin-bottom: 2rem;
        padding: 12px;
    }

    .mobile-card-body {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        text-align: left;
    }
}

@media (max-width:400px) {
    .span-data {
        font-size: 12px;
        font-weight: 600
    }
}

.card-data,
.tab-pane {
    background-color: #fff;
    color: #000;
    padding: 15px 0;
}

.card-bottom {
    border-bottom: 1px solid #e3e3e3;
}


.card-body {
    padding: 1rem;
}

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

.card-subtitle {
    font-size: 1rem;
}

.card-text {
    margin-bottom: 1rem;
}

.badge {
    font-size: 1rem;
}

.tab-content {
    border: 1px solid #dee2e6;
    border-top: 0;
    /* padding: 1rem; */
}

.container-details {
    margin: 20px 0;
}

@media (max-width: 576px) {

    .card-title,
    .card-subtitle,
    .card-text,
    .badge {
        font-size: 0.875rem;
    }
}

/* facilities section , map section , event details section */
.ticket-container {
    display: flex;
    justify-content: center;
    gap: 5px;
    flex-wrap: wrap;
}

.ticket-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.ticket-type {
    color: #6c757d;
    font-size: 0.7rem;
    text-transform: uppercase;
    text-align: left;
}

.ticket-name {
    color: #e47916;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.ticket-details {
    padding: 5px;
    border-radius: 8px;
}

.ticket-price {
    background-color: #f0f0f0;
    border-radius: 8px;
    padding: 5px;
    font-weight: bold;
    display: inline-block;
}

.ticket-status {
    padding: 10px;
    border-radius: 8px;
    font-weight: bold;
    display: inline-block;
    font-size: 1.3rem;
}

.status-available {
    color: #e47916;
    text-shadow: 0 0 8px rgba(40, 167, 69, 0.3);
    font-weight: 700;
}

.status-limited {
    color: #e47916;
    text-shadow: 0 0 8px rgba(40, 167, 69, 0.3);
    font-weight: 700;
}

.status-sold-out {
    color: #e47916;
    text-shadow: 0 0 8px rgba(40, 167, 69, 0.3);
    font-weight: 700;
}

@media (max-width: 992px) {
    .ticket-container {
        flex-direction: column;
        align-items: center;
    }

}

.map-desktop {
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 50.25%;
    /* Reduced height ratio */
    height: 0;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background: #f8f9fa;
    transition: all 0.3s ease;
}

.map-desktop:hover {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
}

.map-desktop iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.map-header {
    display: flex;
    align-items: center;
    padding: 10px 0;
    background: #fff;
    border-bottom: 1px solid #eee;
    border-radius: 8px 8px 0 0;
}

.map-header h5 {
    margin: 0;
    color: #333;
    font-size: 1rem;
    font-weight: 600;
}

.map-header i {
    margin-right: 8px;
    color: #ed7326;
    font-size: 0.9rem;
}

.map-mobile {
    display: none;
}

.map-card {
    padding: 10px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

@media (max-width: 768px) {
    .map-card {
        display: none;
    }

    .map-mobile {
        display: block;
    }

    .map-desktop {
        padding-bottom: 50%;
        /* Reduced height for mobile */
        border-radius: 6px;
    }

    .map-header {
        padding: 5px 0;
    }

    .map-header h5 {
        font-size: 0.9rem;
    }

    .map-card {
        margin: 8px 0;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .map-desktop {
        padding-bottom: 25%;
        /* Reduced height for tablets */
    }
}

.facilities-section {
    padding: 15px;
    margin: 10px 0;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.facilities-section-desktop {
    display: block;
}

.facilities-section-mobile {
    display: none;
}

.facilities-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
}

.facilities-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}

.facility-item {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px;
}

.facility-item i {
    font-size: 1.2rem;
    color: #ed7326;
    width: 24px;
}

.facility-text {
    font-size: 0.95rem;
    color: #333;
}

@media (max-width: 768px) {
    .facilities-section-desktop {
        display: none;
    }

    .facilities-section-mobile {
        display: block;
    }

    .facilities-title {
        font-size: 1rem;
    }

    .facility-item {
        padding: 6px;
    }
}

/* page all events */
.head-filter {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 10px;
}

.head-filter input {
    border: 1px solid #d6d6d6;
    border-radius: 5px;
    outline: none;
    background: #fff;
    font-size: 17px;
    padding: 0px 20px;
    transition: 0.2s ease;
}

.section-all-event {
    margin: 50px 80px;
}

.all-event {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 75%;
    gap: 5px;
}


.all-event .product {
    width: 32%;
    margin-right: 10px;
    margin-bottom: 25px;
    border-radius: 7px;
    box-shadow:0 8px 12px rgba(0, 0, 0, 0.1);
    border-radius: 7px ;
    transition: all .5s;
}
.all-event .product:hover {
  box-shadow:0 8px 12px rgba(0, 0, 0, 0.3);
}
 .all-event .product a img {
    border-radius: 7px 7px 0 0 ;
    height: 200px;
} 

.card-event {
    background-color: #fff;
    transition: 1s ease;
}

.card-event i {
    color: #ed7326;
    font-size: 14px;
}

.card-event .des {
    padding: 10px;
    /* height: 170px; */
}

.product.card-event .price {
    display: flex;
    align-items: center;
    font-weight: 600;
    margin: 10px 0 0 0;
    justify-content: space-between;
}

.product.card-event .price span {
    padding: 10px 0;
    font-size: 15px !important;
    font-weight: 600 !important;
}

.product.card-event .price .currency {
    font-weight: 100;
    color: #606063;
    font-size: 15px;
    margin-left: 5px;
    padding: 0;
}

/* .product.card-event .price i {
  margin-left: 10px;
  color: #ed7326;
  cursor: pointer;
} */

.price {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dropdown {
    position: relative;
    display: inline-block;
    width: 100%;
}

.dropbtn {
    background-color: transparent;
    border: 1px solid #999;
    border-radius: 4px;
    color: #064554;
    padding: 16px;
    font-size: 16px;
    cursor: pointer;
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 15px 0;

}

.dropbtn .arrow-down {
    margin-left: 8px;
}

.dropdown-content {
    display: none;
    transition: .5s all;
}

.dropdown-content label {
    width: 100%;
    padding: 7px 15px;

}

.container-new-events {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    /* justify-content: flex-start; */

    gap: 15px;
}

.empty-data {
    height: 400px;
}

@media screen and (max-width:1100px) {
    .all-event {
        width: 75%;
    }

    .section-all-event {
        margin: 50px 20px;
    }

    .dropbtn {
        padding: 10px 16px;
        font-size: 14px;
    }

    .empty-data {
        height: 350px;
    }

    .all-event .product {
        width: 48%;
    }
}

@media screen and (max-width:770px) {
    .section-all-event {
        margin: 50px 20px;
    }

    .all-event .product {
        width: 45%;
        margin-bottom: 15px;
    }

    .head-filter {
        flex-direction: column;
    }

    .head-filter input {
        padding: 10px;
    }

    .empty-data {
        height: 300px;
    }
}

@media screen and (max-width:750px) {
    .all-event {
        width: 100%;
    }

    .section-all-event {
        margin: 50px 20px;
    }

    .all-event .product {
        width: 90%;
        margin: 15px auto;

    }
}

@media screen and (max-width:500px) {
    .head-filter {
        flex-direction: column;
    }

    .head-filter input {
        width: 98%;
    }

    .empty-data {
        height: 250px;
    }
}

/* pagination in page all events */

#pagination-container {
    text-align: center;
    margin-top: 20px;
}

.pagination-button {
    padding: 12px 20px;
    margin: 0 5px;
    border: none;
    background-color: #ce5306;
    color: white;
    cursor: pointer;
    border-radius: 30px;
}

.pagination-button.active {
    background-color: #ed7326;

}

.pagination-button :disabled {
    background-color: #cccccc;
    cursor: not-allowed;
}

.auth-background {
    background: linear-gradient(301.63deg, #fff -91.59%, #caecea 26.22%, #b0c5ef 97.7%), #fbfbfb !important;
}

.auth-organize-background {
    background: linear-gradient(301.63deg, #fff -91.59%, #caecea 26.22%, #b0c5ef 97.7%), #fbfbfb !important;
}

/* ***************************  css organizer  ****************************** */
/* index page */

/* section home */
.section {
    background: linear-gradient(301.63deg, #fff -91.59%, #e4edff 26.22%, #d7fde6 97.7%), #fbfbfb;
}

.home_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    padding: 120px 20px;
}

.home_data {
    text-align: center;
    padding: 20px;
}

.home_title {
    font-size: 35px;
    margin-bottom: 40px;
    font-weight: 100;
    color: #444;
    line-height: 1.5;
}

.home_title span {
    font-weight: bold;
}

.home_description {
    font-size: 15px;
    margin-bottom: 40px;
    color: #888;
}

.home-paragraph {
    font-size: 16px;
    line-height: 30px;
    color: #888;
}

.home_image img {
    max-width: 100%;
    height: auto;
}

.buttons-home {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
}

.buttons-home .button-home {
    margin-right: 30px;
}

.button-home {
    background-color: #ed7326;
    color: #fff;
    padding: 10px 30px;
    font-size: 16px;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    text-align: center;
}

.button-home:hover {
    background-color: #ed7326;
    color: #fff;
}

.button-learn {
    background-color: transparent;
    color: #ed7326;
    padding: 10px 30px;
    font-size: 16px;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    text-align: center;
}

.button-learn i {
    margin-right: 10px;
    font-size: 16px;
}

.home_data .paragraph {
    font-size: 16px;
    font-weight: 100;
    color: #888;
    margin-top: 70px;
}

@media (min-width: 992px) {
    .home_container {
        flex-direction: row;
    }

    .home_data {
        text-align: left;
    }
}

@media (max-width: 991.98px) {
    .home_container {
        flex-direction: column;
    }

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

    .home_container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-start;
        padding: 60px 20px;
    }

}

@media (max-width: 500px) {
    .home_title {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .home_container {
        padding: 10px 15px;
    }

    .buttons-home {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .buttons-home .button-home {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .home_description {
        margin-bottom: 30px;
    }

    .home_data .paragraph {
        margin-top: 20px;
        font-size: 14px;
    }
}

/* customers */

.section-customers {
    padding-top: 70px;
    padding-bottom: 70px;
}

.section-customers .header-section {
    margin-bottom: 35px;
}

.section-customers .header-section .title,
.section-how-work .header-section .title,
.section-pricing .header-section .title,
.section-blogs .header-section .title {
    position: relative;
    margin-bottom: 40px;
    padding-bottom: 25px;
    text-transform: uppercase;
    font-weight: 700;
}

.section-customers .header-section .title:before,
.section-how-work .header-section .title:before,
.section-pricing .header-section .title:before,
.section-blogs .header-section .title:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 1px;
    background-color: #ed7326;
}

.section-customers .header-section .title:after,
.section-how-work .header-section .title:after,
.section-pricing .header-section .title:after,
.section-blogs .header-section .title:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 45px;
    height: 3px;
    background-color: #ed7326;
}

.section-customers .header-section .title span,
.section-how-work .header-section .title span,
.section-pricing .header-section .title span,
.section-blogs .header-section .title span {
    color: #ed7326;
}

.section-customers .header-section .description,
.section-how-work .header-section .description,
.section-pricing .header-section .description,
.section-blogs .header-section .description {
    color: #6f6f71;
}

.section-customers .single-customer {
    margin-top: 30px;
    background-color: #fff;
    color: #064554;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
    border-radius: 10px;
}

.section-customers .single-customer .part-1 {
    padding: 20px 15px 15px;
    border-bottom: 2px solid #e5e5e5e3;
}

.section-customers .single-customer .part-1 i {
    margin-bottom: 15px;
    font-size: 50px;
    color: #ed7326;
}

.section-customers .single-customer .part-1 img {
    width: 50px;
    height: 50px;
    margin-bottom: 15px;
}

.section-customers .single-customer .part-1 .title {
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.8em;
}

.section-customers .single-customer .part-2 {
    padding: 20px 10px 20px;
}

.section-customers .single-customer .part-2 .description {
    margin-bottom: 22px;
    color: #6f6f71;
    font-size: 16px;
    line-height: 1.8em;
}

.section-customers .single-customer .part-2 a {
    color: #fff;
    font-size: 14px;
    text-decoration: none;
}

/* .section-customers .single-customer .part-2 a i {
  margin-right: 10px;
  color: #f70037;
} */

@media screen and (max-width: 790px) {
    .section-customers {
        margin: 0 15px;
    }

    .section-customers .single-customer .part-1 .title {
        font-size: 18px;
    }

    .section-customers .single-customer .part-2 {
        padding: 10px 10px 10px;
    }

    .section-customers .single-customer .part-2 .description {
        margin-bottom: 12px;
        font-size: 14px;
    }

    .section-customers {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .section-customers .single-customer {
        margin-top: 20px;
    }
}

@media screen and (max-width: 500px) {
    .section-customers .header-section .title {
        font-size: 20px;
    }

}

/* benefits */


.section_all {
    position: relative;
    padding-top: 15px;
    padding-bottom: 20px;
    background: linear-gradient(301.63deg, #fff -91.59%, #e4edff 26.22%, #d7fde6 97.7%), #fbfbfb;
}

.section_title_all .title {
    position: relative;
    margin-bottom: 40px;
    padding-bottom: 15px;
    text-transform: uppercase;
    font-weight: 700;
}

.section_title_all .title:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 1px;
    background-color: #ed7326;
}

.section_title_all .title:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 45px;
    height: 3px;
    background-color: #ed7326;
}

.section-title {
    font-weight: 700;
    text-transform: capitalize;
    letter-spacing: 1px;
}

.section-subtitle {
    letter-spacing: 0.4px;
    line-height: 28px;
    max-width: 550px;
}

.section-title-border {
    background-color: #064554;
    height: 1 3px;
    width: 44px;
}

.section-title-border-white {
    height: 2px;
    width: 100px;
}

.text_custom {
    color: #ed7326;
    padding: 2px 10px;
    background-color: #fff;
    width: 30px;
    text-align: center;
    border-radius: 50%;
}

.about_icon i {
    font-size: 22px;
    height: 65px;
    width: 65px;
    line-height: 65px;
    display: inline-block;
    background: #fff;
    border-radius: 35px;
    color: #ed7326;
    box-shadow: 0 8px 20px -2px rgba(158, 152, 153, 0.5);
}

.about_header_main .about_heading {
    max-width: 450px;
    font-size: 24px;
}

.about_icon span {
    position: relative;
    top: -10px;
}

.about_content_box_all {
    padding: 28px;
}

.img_about img {
    width: 400px;
    height: 220px;
    border-radius: 15px;
}



/* how it works */
.section-how-work {
    padding: 40px 0;
    margin: 20px 0;
}

.container-how-it-works {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 0;
    margin: 20px 0;
}

.timeline {
    width: 80%;
    height: auto;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}

.timeline ul {
    list-style: none;
}

.timeline ul li {
    padding: 20px;
    background-color: #fff;
    color: #064554;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
    border-radius: 10px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.timeline ul li:last-child {
    margin-bottom: 0;
}

.timeline-content h1 {
    font-weight: bold;
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 10px;
    color: #ed7326;
}

.timeline-content p {
    font-size: 16px;
    line-height: 30px;
    font-weight: 300;
    color: #777;
}

.timeline-content .date {
    font-size: 14px;
    font-weight: 300;
    margin-bottom: 10px;
    /* letter-spacing: 2px; */
}

.button-event {
    padding: 10px 30px;
    background-color: #ed7326;
    color: #fff;
    border-radius: 7px;
    transition: all .5s;
    cursor: pointer;
    text-decoration: none;
    border: none;
}

@media only screen and (min-width: 768px) {
    .timeline:before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 2px;
        height: 100%;
        background-color: gray;
    }

    .timeline ul li {
        width: 50%;
        position: relative;
        margin-bottom: 50px;
    }

    .timeline ul li:nth-child(odd) {
        float: left;
        clear: right;
        transform: translateX(-30px);
        border-radius: 20px 0px 20px 20px;
    }

    .timeline ul li:nth-child(even) {
        float: right;
        clear: left;
        transform: translateX(30px);
        border-radius: 0px 20px 20px 20px;
    }

    .timeline ul li::before {
        content: "";
        position: absolute;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        background-color: gray;
        top: 0px;
    }

    .timeline ul li:nth-child(odd)::before {
        transform: translate(50%, -50%);
        right: -30px;
    }

    .timeline ul li:nth-child(even)::before {
        transform: translate(-50%, -50%);
        left: -30px;
    }

    .timeline-content .date {
        position: absolute;
        top: -30px;
    }

    .timeline ul li:hover::before {
        background-color: #ed7326;
    }


}


@media screen and (max-width: 768px) {
    .section-how-work {
        padding: 20px 0;
        margin: 10px 0;
    }

    .container-how-it-works {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px 0;
        margin: 10px 0;
    }



}

@media screen and (max-width: 500px) {
    .timeline-content h1 {
        font-size: 16px;
    }

    .timeline-content p {
        font-size: 14px;
        line-height: 25px;
    }


}

/* section pricing  */

.section-pricing {
    width: 92%;
    margin: 40px auto;
}

.section-pricing .wrapper {
    max-width: 1090px;
    width: 100%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.section-pricing .wrapper .table {
    background: #fff;
    width: calc(33% - 20px);
    padding: 30px 30px;
    position: relative;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

.table .price-section {
    display: flex;
    justify-content: center;
}

.table .price-area {
    height: 120px;
    width: 120px;
    border-radius: 50%;
    padding: 2px;
}

.price-area .inner-area {
    height: 100%;
    width: 100%;
    border-radius: 50%;
    border: 3px solid #fff;
    line-height: 117px;
    text-align: center;
    color: #fff;
    position: relative;
}

.price-area .inner-area .text {
    font-size: 25px;
    font-weight: 400;
    position: absolute;
    top: -10px;
    left: 17px;
}

.price-area .inner-area .price {
    font-size: 45px;
    font-weight: 500;
    margin-left: 16px;
    padding: 0 7px;
}

.table .package-name {
    width: 100%;
    height: 2px;
    margin: 35px 0;
    position: relative;
}

.table .package-name::before {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 25px;
    font-weight: 500;
    background: #fff;
    padding: 0 15px;
    transform: translate(-50%, -50%);
}

.table .features li {
    margin-bottom: 7px;
    list-style: none;
    display: flex;
    justify-content: space-between;
}

.features li .list-name {
    font-size: 17px;
    font-weight: 400;
}

.features li .icon {
    font-size: 15px;
}

.features li .icon.check {
    color: #2db94d;
}

.features li .icon.cross {
    color: #cd3241;
}

.table .btn {
    width: 100%;
    display: flex;
    margin-top: 35px;
    justify-content: center;
}

.table .btn button {
    width: 80%;
    height: 50px;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    border: none;
    outline: none;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.table .btn button:hover {
    border-radius: 5px;
}

.basic .features li::selection {
    background: #ffd861;
}

.basic ::selection,
.basic .price-area,
.basic .inner-area {
    background: #ffd861;
}

.basic .btn button {
    border: 2px solid #ffd861;
    background: #ffd861;
    color: #fff;
}

.basic .btn button:hover {
    background: #fac936;
    color: #fff;
}

.premium ::selection,
.premium .price-area,
.premium .inner-area,
.premium .btn button {
    background: #a26bfa;
}

.premium .btn button:hover {
    background: #833af8;
}

.ultimate ::selection,
.ultimate .price-area,
.ultimate .inner-area {
    background: #43ef8b;
}

.ultimate .btn button {
    border: 2px solid #43ef8b;
    color: #fff;
    background: #43ef8b;
}

.ultimate .btn button:hover {
    background: #24f179;
    color: #fff;
}

.basic .package-name {
    background: #ffecb3;
}

.premium .package-name {
    background: #d0b3ff;
}

.ultimate .package-name {
    background: #baf8d4;
}

.basic .package-name::before {
    content: "E-Base";
    font-size: 20px;
}

.premium .package-name::before {
    content: "E-Pro";
    font-size: 20px;
}

.ultimate .package-name::before {
    content: "E-Ultimat";
    font-size: 20px;
}

@media (max-width: 1020px) {
    .section-pricing .wrapper .table {
        width: calc(50% - 20px);
        margin-bottom: 40px;
    }
}

@media (max-width: 698px) {
    .section-pricing .wrapper .table {
        width: 95%;
        margin: 20px auto;
    }
}

.table .ribbon {
    width: 150px;
    height: 150px;
    position: absolute;
    top: -10px;
    left: -10px;
    overflow: hidden;
}

.table .ribbon::before,
.table .ribbon::after {
    position: absolute;
    content: "";
    z-index: -1;
    display: block;
    border: 7px solid #4606ac;
    border-top-color: transparent;
    border-left-color: transparent;
}

.table .ribbon::before {
    top: 0px;
    right: 15px;
}

.table .ribbon::after {
    bottom: 15px;
    left: 0px;
}

.table .ribbon span {
    position: absolute;
    top: 30px;
    right: 0;
    transform: rotate(-45deg);
    width: 200px;
    background: #a26bfa;
    padding: 10px 0;
    color: #fff;
    text-align: center;
    font-size: 17px;
    text-transform: uppercase;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
}

/* section customer edited */

.customer-wrapper {
    padding: 10px 10%;
}

.customer-box-area {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 40px;
    /* margin-top: 50px; */
}

.customer-box {
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.5);
}

.customer-box img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
    transition: transform 0.5s;
    cursor: pointer;
}

.customer-box .overlay {
    height: 0;
    width: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.5), #1c1c1c 58%);
    border-radius: 10px;
    position: absolute;
    left: 0;
    bottom: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 0 20px;
    text-align: center;
    font-size: 14px;
    transition: height 0.5s;
}

.customer-box .overlay h3 {
    font-weight: bold;
    margin-bottom: 5px;
    margin-top: 40%;
    font-size: 25px;
    color: #fff;
}

.customer-box .overlay p {
    padding-top: 5px;
    color: #fff;
    font-size: 14px;
}

.customer-box .overlay a {
    color: #262626;
    text-decoration: none;
    font-size: 14px;
    background: #fff;
    border-radius: 50px;
    padding: 5px 15px;
    text-align: center;
}

.customer-box:hover img {
    transform: scale(1.1);
}

.customer-box:hover .overlay {
    height: 100%;
}

@media (max-width:770px) {
    .customer-wrapper {
        padding: 10px;
    }

    .customer-box .overlay h3 {
        margin-top: 20%;
        font-size: 16px;
        font-weight: 600;
    }

    .customer-box .overlay p {
        font-size: 13px;
    }

    .customer-box img {
        height: 200px;
    }
}


/* section blog-container */
.section-blogs {
    margin-top: 60px;
}

.section-blog {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.blog-container {
    position: relative;
    width: 900px;
    min-width: 350px;
    min-height: 250px;
    padding-bottom: 40px;
    overflow: hidden;
    margin: 0 auto;
}

.blog-wrapper {
    width: 300%;
    /* 300% 'caz we have 3 cards */
    min-height: 100%;
    display: flex;
    justify-content: space-between;
    transition: 1s;
}

.card-wrapper {
    /* width: 900px; */
    min-height: 100%;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    margin: 0 10px;
}

.card-wrapper-thumb {
    width: 70%;
    height: 250px;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    position: relative;
}

.card-wrapper-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-name {
    position: absolute;
    bottom: 10px;
    right: 10px;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    padding: 5px 20px;
    background: #fff;
    text-transform: capitalize;
    font-size: 14px;
    border-radius: 5px;
}

.card-blog-body {
    width: 120%;
    min-height: 100%;
    height: auto;
    border-radius: 10px;
    margin-left: 20px;
    position: relative;
    padding-bottom: 50px;
}

.blog-title {
    font-size: 24px;
    margin-top: 40px;

}

.blog-review {
    font-size: 15px;
    line-height: 30px;
    margin-top: 10px;
    color: #666;

}

.indicators {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.indicators button {
    background: none;
    border: none;
    outline: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 2px solid #ed7326;
    cursor: pointer;
    margin-left: 5px;
    transition: .5s;
}

button.active {
    width: 40px;
    border-radius: 50px;
    background: #ed7326;
}

@media screen and (max-width: 770px) {
    .blog-title {
        font-size: 18px;
        font-weight: bold;
    }

    .blog-review {
        font-size: 14px;
        line-height: 25px;
        margin-top: 10px;
    }

    .blog-container {
        width: 50%;
        margin: auto;
    }

    .card-wrapper {
        flex-direction: column;
    }

    .card-wrapper-thumb {
        width: 100%;
        border-radius: 10px;
    }

    .card-blog-body {
        width: 100%;
        min-height: auto;
        margin-left: 0;
    }

}

/* section-box */
.section-box {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 40px 0;
}

.container-custom {
    max-width: 1100px;
    margin: 0 auto;
    padding: 15px;
}

.card-boxs {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.card-boxs .col-md-4 {
    margin-bottom: 15px;
}

.container-boxs {
    width: 1100px;
    max-width: 100%;
    margin: 0 auto;
}

.row-boxs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.box-info {
    width: 350px;
    height: 250px;
    background: #fff;
    transition: all 0.4s;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.2);
    font-size: 30px;
    font-weight: 900;
}

.box-info:hover {
    border-radius: 15px;
    cursor: pointer;
    box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);
    background: #fff;
}

.first-content {
    height: 100%;
    width: 100%;
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    opacity: 1;
    border-radius: 15px;
}

.first-content img {
    width: 60px;
    height: 60px;
    margin-bottom: 20px;
}

.first-content h1 {
    color: #ed7326;
    font-size: 45px;
    font-weight: 900;
}

.box-info:hover .first-content {
    height: 0px;
    opacity: 0;
}

.second-content {
    height: 0%;
    width: 100%;
    opacity: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    transition: all 0.4s;
    font-size: 0px;
    transform: rotate(90deg);
    text-align: center;
}

.second-content span {
    font-size: 18px;
}

.box-info:hover .second-content {
    opacity: 1;
    height: 100%;
    font-size: 1.8rem;
    transform: rotate(0deg);
}

/* Responsive  */
@media (max-width: 768px) {
    .box-info {
        width: 100%;
        margin-bottom: 15px;
    }

    .card-boxs {
        justify-content: center;
    }
}

@media (max-width: 992px) {
    .card-boxs {
        justify-content: space-around;
    }

    .card-boxs .col-md-4 {
        width: 50%;
    }
}

@media (max-width: 1200px) {
    .container-custom {
        padding: 10px;
    }

    .card-boxs .col-md-4 {
        width: 30%;
    }
}

@media screen and (max-width: 575.98px) {
    .card-boxs .col-md-4 {
        width: 100%;
    }

    .column-reverse {
        display: flex;
        flex-direction: column-reverse;
    }
}

/* end page index */

/**********************************************************  front next pages  ******************************************************** */
/* pages dropdown in the first link */
/* page Constructor */

.pages_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    padding: 85px 20px;
}

.pages_data {
    text-align: left;
    padding: 20px;
}

.pages_title {
    font-size: 35px;
    margin-bottom: 40px;
    font-weight: 100;
    color: #064554;
    line-height: 1.5;
}

.pages_title span {
    font-weight: bold;
}

.pages_description {
    font-size: 15px;
    margin-bottom: 40px;
    color: #888;
}

.pages-paragraph {
    font-size: 16px;
    line-height: 30px;
    color: #888;
}

.pages_image img {
    max-width: 100%;
    height: auto;
}

.buttons-pages {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;

}

.buttons-pages .button-pages {
    margin-right: 30px;
}

.button-pages {
    background-color: #ed7326;
    color: #fff;
    padding: 10px 30px;
    font-size: 16px;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    text-align: center;
}

.button-pages:hover {
    background-color: #36aff0;
    color: #fff;
}

.button-learn {
    background-color: transparent;
    color: #ed7326;
    padding: 10px 30px;
    font-size: 16px;
    border-radius: 5px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    text-align: center;
}

.button-learn i {
    margin-right: 10px;
    font-size: 16px;
}


@media (min-width: 992px) {
    .pages_container {
        flex-direction: row;
    }

    .pages-data {
        text-align: left;
    }
}

@media (max-width: 991.98px) {
    .pages_container {
        flex-direction: column;
    }

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

    .pages_container {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        padding: 60px 20px;
    }

    .pages_description {
        text-align: center;
    }

}

@media (max-width: 500px) {
    .pages_title {
        font-size: 20px;
        margin-bottom: 20px;
    }

    .pages_container {
        padding: 10px 15px;
    }

    .buttons-pages {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .buttons-pages .button-pages {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .pages_description {
        margin-bottom: 30px;
        text-align: center;
    }

}


/* section-constructor */

.section-constructor {
    color: #202020;
    padding-top: 50px;
    padding-bottom: 50px;
}

.section-constructor .header-section {
    margin-bottom: 34px;
}

.section-constructor .header-section .title {
    position: relative;
    padding-bottom: 14px;
    margin-bottom: 25px;
    font-weight: 700;
    font-size: 32px;
}

.section-constructor .header-section .title:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    height: 3px;
    background-color: #ed7326;
    border-radius: 3px;
}

.section-constructor .header-section .title:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(30px);
    width: 10px;
    height: 3px;
    background-color: #504f93;
    border-radius: 3px;
}

.section-constructor .header-section .description {
    font-size: 14px;
    color: #282828;
}

.section-constructor .single-constructor {
    position: relative;
    margin-top: 30px;
    background-color: #fff;
    border-radius: 10px;
    padding: 40px 30px;
    overflow: hidden;
}

.section-constructor .single-constructor .content {
    position: relative;
    z-index: 20;
}

.section-constructor .single-constructor .circle-before {
    position: absolute;
    top: 0;
    right: 0px;
    transform: translate(40%, -40%);
    width: 150px;
    height: 150px;
    background-color: #ed7326d3;
    border: 6px solid #504f93;
    border-radius: 50%;
    opacity: 0.5;
    z-index: 10;
    transition: all .8s;
}

.section-constructor .single-constructor:hover .circle-before {
    width: 100%;
    height: 100%;
    transform: none;
    border: 0;
    border-radius: 0;
    opacity: 1;
}

.section-constructor .single-constructor .icon {
    display: inline-block;
    margin-bottom: 26px;
    width: 70px;
    height: 70px;
    background-color: #ed7326d3;
    border-radius: 5px;
    line-height: 70px;
    text-align: center;
    color: #fff;
    font-size: 30px;
    transition: all .3s;
}

.section-constructor .single-constructor:hover .icon {
    background-color: #fff;
    color: #ed7326d3;
}

.section-constructor .single-constructor .title {
    margin-bottom: 18px;
    font-weight: 700;
    font-size: 23px;
    transition: color .3s;
}

.section-constructor .single-constructor:hover .title {
    color: #fff;
}

.section-constructor .single-constructor .description {
    margin-bottom: 20px;
    font-size: 14px;
    transition: color .3s;
}

.section-constructor .single-constructor:hover .description {
    color: #fff;
}

.section-constructor .single-constructor a {
    position: relative;
    font-size: 18px;
    color: #202020;
    text-decoration: none;
    font-weight: 500;
    transition: color .3s;
}

.section-constructor .single-constructor:hover a {
    color: #fff;
}

.section-constructor .single-constructor a:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #ed7326d3;
    transition: background-color .3s;
}

.section-constructor .single-constructor:hover a:after {
    background-color: #fff;
}

/* page contact us  */

.container-contact {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
    color: #064554;

}

.container-contact .row-contact {
    display: flex;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    padding: 30px;
    border-radius: 15px;
}

.row-contact section.col-contact {
    display: flex;
    flex-direction: column;
}

.row-contact section.left-contact {
    flex-basis: 35%;
    min-width: 320px;
    margin-right: 60px;
}

.row-contact section.right-contact {
    flex-basis: 60%;
}

section.left-contact .contactTitle h2 {
    position: relative;
    font-size: 28px;
    color: #064554;
    display: inline-block;
    margin-bottom: 25px;
}

section.left-contact .contactTitle h2::before {
    content: '';
    position: absolute;
    width: 50%;
    height: 1px;
    background-color: #888;
    top: 120%;
    left: 0;
}

section.left-contact .contactTitle h2::after {
    content: '';
    position: absolute;
    width: 25%;
    height: 3px;
    background-color: #ed7326;
    top: calc(120% - 1px);
    left: 0;
}

section.left-contact .contactTitle p {
    font-size: 15px;
    color: #666;
    letter-spacing: 1px;
    padding-bottom: 22px;
}

section.left-contact .contactInfo {
    margin-bottom: 16px;
}

.contactInfo .iconGroup {
    display: flex;
    align-items: center;
    margin: 25px 0px;
}

.iconGroup .icon {
    width: 45px;
    height: 45px;
    border: 2px solid #d6d6d6;
    border-radius: 50%;
    margin-right: 20px;
    position: relative;
}

.iconGroup .icon i {
    font-size: 20px;
    color: #ed7326;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.iconGroup .details span {
    display: block;
    color: #888;
    font-size: 18px;
}

.iconGroup .details span:nth-child(1) {
    /* text-transform: uppercase; */
    color: #333;
}

section.left-contact .socialMedia {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin: 22px 0px 20px;
}

.socialMedia a {
    width: 35px;
    height: 35px;
    text-decoration: none;
    text-align: center;
    margin-right: 15px;
    border-radius: 5px;
    background-color: dodgerblue;
    transition: 0.4s;
}

.socialMedia a i {
    color: #ddd;
    font-size: 18px;
    line-height: 35px;
    border: 1px solid transparent;
    transition-delay: 0.4s;
}

.socialMedia a:hover {
    transform: translateY(-5px);
    background-color: #2e2e2e;
    color: dodgerblue;
    border: 1px solid dodgerblue;
}

.socialMedia a:hover i {
    color: dodgerblue;
}

/* Code for the right section (column) */

.row-contact section.right-contact .messageForm {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 30px;
}

.row-contact section.right-contact .inputGroup {
    margin: 18px 0px;
    position: relative;
}

.messageForm .halfWidth {
    flex-basis: 48%;
}

.messageForm .fullWidth {
    flex-basis: 100%;
}

.messageForm input,
.messageForm textarea {
    width: 100%;
    font-size: 18px;
    padding: 2px 0px;
    background-color: transparent;
    color: #222;
    border: none;
    border-bottom: 2px solid #666;
    outline: none;
}

.messageForm textarea {
    resize: none;
    height: 220px;
    display: block;
}

textarea::-webkit-scrollbar {
    width: 5px;
}

textarea::-webkit-scrollbar-track {
    background-color: #1e1e1e;
    border-radius: 15px;
}

textarea::-webkit-scrollbar-thumb {
    background-color: dodgerblue;
    border-radius: 15px;
}

.inputGroup label {
    position: absolute;
    left: 0;
    bottom: 4px;
    color: #888;
    font-size: 18px;
    transition: 0.4s;
    pointer-events: none;
}

.inputGroup:nth-child(4) label {
    top: 2px;
}

.inputGroup input:focus~label,
.inputGroup textarea:focus~label,
.inputGroup input:valid~label,
.inputGroup textarea:valid~label {
    transform: translateY(-30px);
    font-size: 16px;
}

.inputGroup button {
    padding: 8px 16px;
    font-size: 18px;
    background-color: #ed7326;
    color: #fff;
    border: 1px solid transparent;
    border-radius: 25px;
    outline: none;
    cursor: pointer;
    transition: 0.4s;
    margin: 15px 0;
}

.inputGroup button:hover {
    background-color: transparent;
    color: #ed7326;
    border: 1px solid #ed7326;
}

@media (max-width: 1100px) {
    .messageForm .halfWidth {
        flex-basis: 100%;
    }
}

@media (max-width: 900px) {
    .container-contact .row-contact {
        flex-wrap: wrap;
    }

    .row-contact section.left-contact,
    .row-contact section.right-contact {
        flex-basis: 100%;
        margin: 0px;
    }

    .container-contact {
        padding: 30px 10px;
    }

    .container-contact .row-contact {
        padding: 30px 10px;
    }
}

/* end contact section */

/* home-organizer-part */
.home-organizer-part {
    height: 85vh;
    position: relative;
}

.home-organizer-part video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-content-organizer {
    position: relative;
    padding-top: 250px;
    color: #fff;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.home-content-organizer h1 {
    color: #fff;
    margin-bottom: 40px;
}

.home-content-organizer p {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 40px;
    color: #fff;
}

.home-content-organizer button {
    display: block;
    font-size: clamp(14px, 1.5vw, 18px);
    border: 1px solid #f1f1f1;
    border-radius: 5px;
    background: transparent;
    color: #fff;
    margin: 50px auto 0;
    padding: 12px 20px;
    cursor: pointer;
}

@media screen and (max-width: 900px) {
    .home-organizer-part {
        height: 60vh;
    }

    .home-content-organizer {
        padding-top: 200px;
    }
}

@media screen and (max-width: 500px) {
    .home-content-organizer {
        padding-top: 120px;
        margin: 0 20px;
    }

    .home-organizer-part {
        height: 65vh;
    }

    .home-content-organizer p {
        font-size: 15px;
    }

    .home-content-organizer h1 {
        font-size: 22px;
    }
}

/* end home-organizer-part */

/* blogs page  */

/* Blog page */
/* #page-blog {
  background-image: url("img/banner/b19.jpg");
  background-size: cover;
  height: 40vh;
  width: 100%;
  display: flex;
  justify-content: center;
  text-align: center;
  flex-direction: column;
  padding: 14px;
} */



#blog {
    /* padding: 60px 100px 0 100px; */
    padding: 60px 160px 0 160px;
}

.hero-blog {
    position: relative;
    width: 100%;
    height: 400px;
    overflow: hidden;
}

.image-hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-blog-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    text-align: center;
    padding: 20px;
    border-radius: 10px;
}

.hero-blog-text h1 {
    color: #fff;
}

@media screen and (max-width: 768px) {
    .hero-blog {
        height: 100%;
    }
}

#blog .blog-box {
    display: flex;
    align-items: center;
    width: 100%;
    padding-bottom: 80px;
}

#blog .blog-img {
    width: 50%;
    margin-right: 40px;
}

#blog img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 5px;
}

#blog .blog-text {
    width: 50%;
}

.blog-text h4 {
    display: block;
    margin-block-end: 1.33em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    color: #064554;
}

#blog .btn-Noramal {
    font-size: 16px;
}

#blog .btn-Noramal:hover {
    color: rgb(119, 188, 188);
    background-color: transparent;
}

@media (max-width: 1100px) {
    #blog {
        padding: 60px 40px 0 40px;
    }

}

@media (max-width:470px) {
    #blog {
        padding: 60px 20px 0 20px;
    }

    #blog .blog-box {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    #blog .blog-img {
        width: 100%;
        margin-bottom: 28px;
    }

    #blog .blog-text {
        width: 100%;
    }

    #blog img {
        height: 200px;
    }

    .blog-text h4 {
        font-size: 18px;
    }
}

/* page faqs */
/* according */


.accordion-section {
    width: 90%;
    max-width: 1000px;
    margin: 2rem auto;
}

.accordion-item {
    background-color: #fff;
    color: #111;
    margin: 1rem 0;
    border-radius: 0.5rem;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}

.accordion-item-header {
    padding: 1.2rem 3rem 1.2rem 1rem;
    min-height: 4.5rem;
    line-height: 1.25rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    position: relative;
    cursor: pointer;
}

.accordion-item-header h3 {
    font-size: 18px;
    font-weight: 600;

}

.accordion-item-header::after {
    content: "\002B";
    font-size: 1.3rem;
    position: absolute;
    right: 1rem;
}

.accordion-item-header.active::after {
    content: "\2212";
}

.accordion-item-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.accordion-item-body-content {
    padding: 1rem;
    line-height: 1.5rem;
    border-top: 1px solid;
    border-image: linear-gradient(to right, transparent, #34495e, transparent) 1;
}

@media(max-width:767px) {
    html {
        font-size: 14px;
    }

    .accordion-item-header h3 {
        font-size: 15px;
        font-weight: 600;
    }
}

/* page company profile */

#about-company-section {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px 5%;
}

.about-company-left img {
    width: 100%;
    max-width: 420px;
    height: 500px;
    margin-bottom: 30px;
    border-radius: 5px;
}

/* .about-company-right {
  width: 100%;
  max-width: 600px;
} */

.about-company-right ul {
    list-style-type: none;
}

.about-company-right ul li {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.about-company-right h1 {
    color: #064554;
    font-size: 2rem;
    margin-bottom: 10px;
}

.about-company-right h4 {
    margin-bottom: 5px;
}

.about-company-right p {
    color: #444;
    line-height: 1.6;
    font-size: 0.9rem;
    margin-bottom: 15px;
}

.about-company-right .address {
    margin: 25px 0;
}

.address .address-logo {
    margin-right: 15px;
    color: #ed7326;
}

.address .saprater {
    margin: 0 10px;
}

.about-company-right .expertise ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 20px;
}

.expertise h5 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
}

.expertise .expertise-logo {
    font-size: 1.2rem;
    margin-right: 10px;
    color: #ed7326;
}

.ticket-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0;
}

.ticket-content .form-check-input {
    border: 2px solid #ed722690;
}

.ticket-content .form-check-input:checked {
    background-color: #ed7326;
    box-shadow: none;
    border-color: #ed7326;
}

/* Album events images  */
.gallery-feedback-section {
    padding: 50px 0;
    background-color: #1a1a1a;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gallery-feedback-section h1 {
    color: white;
    text-align: center;
    margin-bottom: 40px;
    font-size: 2.5rem;
}

.Album-events {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding: 20px;
}

.event-gallery-item {
    cursor: pointer;
    overflow: hidden;
    border-radius: 12px;
    /* aspect-ratio: 4/3; */
    position: relative;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    height: 250px;
    /* width: 380px; */
}

.event-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

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

.event-gallery-item:hover .event-Name {
    opacity: 1;
}

.event-gallery-item .event-Name {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0, 0, 0, 1));
    color: white;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
    font-size: 1.5em;
    font-weight: 600;
}

.modal-events {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.95);
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.modal-events.show {
    opacity: 1;
}

.modal-content-event {
    position: relative;
    width: 95%;
    max-width: 1000px;
    height: 85vh;
    margin: 80px auto;
}

.slideImageEvent {
    display: none;
    height: 100%;
    position: relative;
    animation: fadeOut 0.3s ease;
}

.slideImageEvent.active {
    display: block;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0.9);
    }
}

.slideImageEvent img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.close_popup {
    position: absolute;
    top: -40px;
    right: 0;
    color: white;
    font-size: 35px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.close_popup:hover {
    transform: rotate(90deg);
}

.prev_slide,
/*.next_slide {*/
/*  position: absolute;*/
/*  top: 50%;*/
/*  transform: translateY(-50%);*/
/*  color: white;*/
/*  font-size: 25px;*/
/*  cursor: pointer;*/
/*  padding: 7px;*/
/*  background-color: rgba(0, 0, 0, 0.6);*/
/*  border: none;*/
/*  border-radius: 8px;*/
/*  transition: all 0.3s ease;*/
/*}*/

.prev_slide:hover,
.next_slide:hover {
    background-color: rgba(0, 0, 0, 0.9);
    transform: translateY(-50%) scale(1.1);
}

.prev_slide {
    left: 20px;
}

.next_slide {
    right: 20px;
}

/* Responsive breakpoints */
@media (max-width: 1200px) {
    .Album-events {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media (max-width: 992px) {
    .Album-events {
        grid-template-columns: repeat(2, 1fr);
    }

    .event-gallery-item {
        height: 280px;
    }
}

@media (max-width: 768px) {
    .gallery-feedback-section h1 {
        font-size: 2rem;
    }

    .modal-content-event {
        width: 95%;
        height: 60vh;
        margin: 100px auto;
    }

    .prev_slide,
    .next_slide {
        padding: 15px;
        font-size: 24px;
    }

    .event-gallery-item {
        height: 220px;
    }
}

@media (max-width: 576px) {
    .Album-events {
        /* grid-template-columns: 1fr; */
        width: 100%;
        padding: 10px;
    }

    .event-gallery-item {
        height: 120px;
        border-radius: 5px;
    }

    .gallery-feedback-section h1 {
        font-size: 1.8rem;
        padding: 0 20px;
    }

    .prev_slide,
    .next_slide {
        padding: 7px;
        font-size: 20px;
    }

    .event-gallery-item .event-Name {
        padding: 10px;
        font-size: 1.2em;
    }
}

/* Album events images  */

@media screen and (min-width: 768px) {
    #about-company-section {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        padding: 80px 5%;
    }

    .about-company-left {
        width: 35%;
    }

    .about-company-right {
        width: 60%;
    }

    .about-company-left img {
        margin-bottom: 0;
    }
}

@media screen and (min-width: 1024px) {
    #about-company-section {
        padding: 80px 12%;
    }

    .about-company-right h1 {
        font-size: 2.3rem;
    }

    .about-company-right p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 850px) {
    .about-company-left img {
        height: 400px;
    }

    .expertise h5 {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 15px;
    }
}

/* confirmation page  */

.confirm-box {
    background-color: #ffffff;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    padding: 15px 30px;
    margin: 30px 0;
    transition: all 0.3s ease;
}

.thank-you-message {
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 10px;
}

.list-group-item {
    border: none;
    padding: 12px 20px;
    background-color: #f8f9fa;
    margin-bottom: 5px;
    border-radius: 8px;
}

.btn-confirm {
    border-radius: 25px;
    padding: 10px 25px;
    font-weight: bold;
    transition: all 0.3s ease;
}

.btn-confirm:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.qr-code {
    text-align: center;
    margin-top: 20px;
}

.qr-code img {
    max-width: 150px;
    height: auto;
}

@media screen and (max-width: 768px) {
    .confirm-box {
        padding: 15px 10px;
    }
}


/* ticket confirm page */
.ticket-section {
    width: 100%;
    max-width: 600px;
    margin: 70px auto;
    display: grid;
    /* font-family: sans-serif; */
    color: black;
    font-size: 14px;
    letter-spacing: 0.1em;
}

.ticket-data {
    margin: auto;
    display: flex;
    background: white;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
    border-radius: 10px;

}

.ticket-data .left {
    display: flex;
    width: 70%;

}

.ticket-data .left .ticket-number {
    height: 250px;
    width: 250px;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 5px;
}

.ticket-data .left .ticket-info {
    padding: 10px;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: space-between;
    align-items: center;
}

.ticket-info .date {
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
    padding: 5px 0;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
}

.ticket-info .date span {
    width: 100px;
}

.ticket-info .date span:first-child {
    text-align: left;
}

.ticket-info .date span:last-child {
    text-align: right;
}

.ticket-info .date .day {
    color: #ed7326;
    font-size: 20px;
}

.ticket-info .ticket-name h1 {
    font-size: 25px;
    color: #ed7326;
    font-weight: 600;
}

.event-time p {
    padding: 10px 0;
    color: #4a437e;
    text-align: center;
    /* display: flex;
  flex-direction: column; */
    gap: 10px;
    font-weight: 700;
}

.event-time span {
    font-weight: 600;
    color: #4a437e;
}

.event-time {
    font-size: 16px;
}

.ticket-info .Company-Name {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    padding-top: 8px;
    border-top: 1px solid gray;
}

.ticket-data .right {
    width: 30%;
    border-left: 1px dashed #404040;
}

.ticket-data .right .right-info-container {
    height: 320px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}

.right-info-container .logo img {
    width: 150px;
    height: 60px;
}

.ticket-data .right .show-name h1 {
    font-size: 18px;
}

.right-info-container .barcode {
    height: 100px;
}

.right-info-container .barcode img {
    height: 100%;
}

.right .ticket-number {
    color: gray;
}

.right .event-time p {
    font-size: 12px;
}

@media screen and (max-width: 700px) {
    .ticket-section {
        width: 90%;
        margin: 30px auto;
    }

    .ticket-data {
        display: flex;
        flex-direction: column;
    }

    .ticket-data .left .ticket-info {
        padding: 5px 0;
    }

    .ticket-info .ticket-name h1 {
        font-size: 25px;
        padding: 20px 0;
    }

    .ticket-info .Company-Name {
        font-size: 12px;
    }

    .ticket-data .left {
        width: 100%;
    }

    .ticket-info .date {
        border-top: none;
    }

    .ticket-data .right {
        width: 100%;
        border: none;
    }

    .ticket-data .right .right-info-container {
        height: auto;
        margin: 11px 0;
    }
}


/* modal register in page checkout */
/* Basic styling for modal */
.modal-dialog-centered {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Custom animation: slide-down */
@keyframes modal-slide-down {
    0% {
        transform: translateY(-100px);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes modal-zoom-in {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.custom-modal-animation {
    animation: modal-slide-down 0.5s ease-out;
}

.modal.show .custom-modal-animation {
    animation: modal-zoom-in 0.5s ease-out;
}

.modal.hide .custom-modal-animation {
    animation: modal-slide-down-reverse 0.5s ease-out;
}

@keyframes modal-slide-down-reverse {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        transform: translateY(-100px);
        opacity: 0;
    }
}


@media screen and (max-width: 390px) {
    .slider_content {
        height: 175px;
    }

    .slide_text {
        top: 17%;
    }

    .header {
        padding: 10px 0 !important;
    }
}


/* new event card  */
/* Swiper container */

.CustomEvents {
    margin: 40px auto;
}

.container-events {
    max-width: 1400px;
    margin: 40px auto 0 auto;
}

.new-event-card {
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);
    width: 100% !important;
    max-width: 350px;
    margin: 0 auto;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.new-event-card:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.new-event-card img {
    width: 100%;
    height: 200px;
    /* object-fit: cover; */
}

.new-event-card .event-content {
    padding: 20px 15px;
    position: relative;
}

.new-event-card .event-content i {
    color: #ed7326;
    font-size: 14px;
}

.new-event-card .event-content a {
    font-weight: bold;
    text-decoration: none;
    color: #333;
}

.new-event-card .event-content h5 {
    margin-bottom: 10px;
    font-weight: 600 !important;
    color: #455864;
}

.new-event-card .event-content p {
    margin-bottom: 10px;
    font-size: .9rem;
    color: #666;
}

.new-event-card .event-content .price {
    margin: 10px 0 0 0;
}

.new-event-card .event-content .price span {
    padding: 10px 0;
    font-size: 15px !important;
    font-weight: 600 !important;


}

.new-event-card .event-content .hosted {
    font-size: .9rem;
    color: #666;
    margin: 0;
    margin-bottom: 10px;
}

.new-event-card .like-button {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(237, 114, 38, 0.908);
    border: none;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    /* opacity: 0; */
    transition: opacity 0.3s ease, background 0.3s ease;
}

/* .new-event-card:hover .like-button {
  opacity: 1;
} */

.new-event-card .like-button:hover {
    background-color: #fff;
}

.new-event-card .like-button i {
    font-size: 18px;
    color: #fff;
}

.new-event-card .like-button:hover i {
    color: #ed7326;
}

/* Pagination styling */
.swiper-events .swiper-pagination {
    position: relative;
    margin-top: 30px;
}

.swiper-events .swiper-pagination-bullet {
    background-color: #ed7326;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .new-event-card {
        width: 100%;
        max-width: 350px;
    }
}

@media (max-width: 390px) {
    .new-event-card {
        width: 100%;
        max-width: 320px;
    }
}


/* Update in css hosted by  */
.event-info {
    display: flex;
    flex-direction: column;
    gap: 12px;
    /* تباعد بين العناصر */
}

.event-location {
    display: flex;
    align-items: center;
    border-radius: 10px;
}

.icon-box {
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
}

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

.icon-card {
    padding: 10px;
    border-radius: 8px;
    margin-right: 12px;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
    background: #ed73261c;
    color: #ed7326;
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.icon-card i {
    font-size: 20px;
}

/* لون خاص بالموقع الجغرافي */
.icon-box {
    text-align: center;
    border-radius: 8px;
    width: 50px;
    display: inline-block;
    overflow: hidden;

}

.icon-box.offline {
    background: #ed73261c;
}

.icon-box.offline i {
    color: #ed7326;
}

/* لون خاص بالاجتماع عبر الإنترنت */
.icon-box.online {
    background-color: #ed73261c;
}

.icon-box.online i {
    color: #ed7326;
}

.location-details {
    display: flex;
    flex-direction: column;
}

.location-link {
    font-weight: bold;
    text-decoration: none;
    color: #686c6d;
    font-size: 16px;
}

.sub-location {
    font-size: 14px;
    color: #8d6e63;
}

/* date  */
.event-date-container-details {
    display: flex;
    gap: 10px;
    padding: 0px;
    border-radius: 8px;
}

.date-box {
    padding: 0;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    background-color: #ed73261c;
    width: 50px;
    display: inline-block;
    overflow: hidden;
    font-family: Arial, sans-serif;
}

.date-box .month {
    font-size: 10px;
    color: #fff;
    text-transform: uppercase;
    background-color: #ed7326;
    padding: 3px 0;
    margin: 0;
    letter-spacing: 0.5px;
}

.date-box .day {
    font-size: 15px;
    font-weight: bold;
    color: #333;
    padding: 5px 0;
    margin: 0;
}

.date-details {
    display: flex;
    flex-direction: column;
}

.date-details .day-name {
    font-size: 16px;
    font-weight: bold;
    color: #ed7326;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    ;
}

.date-details .time-range {
    font-size: 14px;
    color: #8d6e63;
}

/* hosted by  */
.desktop-show {
    display: none;
    margin: 0;
}

.mobile-show {
    display: block;
    margin: 0;
}

.profile-img {
    width: 80px;
    height: 80px;
    /* object-fit: cover; */
    border: 3px solid #ddd;
}

/* follow us */

.follow-btn {
    border-radius: 25px;
    font-weight: 600;
    transition: all 0.3s ease-in-out;
}

.follow-btn.btn-outline-primary {
    color: #ed7326;
    border-color: #ed7326;
    background-color: transparent;
}

.follow-btn.btn-outline-primary:hover {
    background-color: #ed7326;
    color: white;
}

.follow-btn.btn-primary {
    background-color: #ed7326;
    color: white;
    border-color: #ed7326;
}

.follow-btn.btn-primary:hover {
    background-color: #ed7326;
    border-color: #ed7326;
}

/* تأثير عند التغيير */
.follow-btn.transitioning {
    transform: scale(0.9);
    opacity: 0.7;
}

.social-icons .social-link {
    font-size: 20px;
    color: #555;
    transition: color 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.social-icons .social-link:hover {
    transform: translateY(-3px);
}

.card-custom {
    border-radius: 10px;
    background: #fff;
    transition: box-shadow 0.3s ease-in-out;
}

.card-custom:hover {
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
}

/* icons hosted by */

.share-links p {
    padding: 0;
    margin: 0;
}

.links {
    display: flex;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: flex-start;
}

.social-icons a {
    text-decoration: none;
    color: gray;
    padding: 7px;
    font-size: 20px;
    transition: all 0.3s ease;

}

.social-icons a i {
    font-size: 20px;
    transition: all 0.3s ease;
    padding: 10px;
    border-radius: 50%;
    background-color: #fff;
    text-align: center;
    transition: .5s;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
}

.social-icons a i:hover {
    transform: translate(0, -15%);
}

.social-icons a .fa-facebook:hover {
    background-color: #3b5998;
    color: #fff;
}

.social-icons a .fa-x-twitter:hover {
    background-color: #111;
    color: #fff;
}

.social-icons a .fa-linkedin:hover {
    background-color: #007bb6;
    color: #fff;
}

.social-icons a .fa-youtube:hover {
    background-color: #c4302b;
    color: #fff;
}

.social-icons a .fa-google-plus:hover {
    background-color: #dd4b39;
    color: #fff;
}

.social-icons a .fa-twitter:hover {
    background-color: #1da1f2;
    color: #fff;
}

.social-icon a .fa-tiktok:hover {
    background-color: #000 !important;
    color: #fff;
}

.social-icons a .fa-whatsapp:hover {
    background-color: #24cc63;
    color: #fff;
}

.social-icons a .fa-instagram:hover {
    background-color: #E4405F;
    color: #fff;
}

.social-icons a .fa-copy:hover {
    background-color: #000;
    color: #fff;
}

@media screen and (max-width: 900px) {
    .social-icons a {
        padding: 7px;

    }

    .social-icons a i {
        font-size: 14px;
        padding: 7px;
    }

    .social-icons {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .social-icons .social-link {
        margin: 0;
    }

    .desktop-show {
        display: block;
    }

    .mobile-show {
        display: none;
    }
}

@media screen and (max-width: 480px) {

    .icon-box {

        width: 40px;
    }

    .icon-box {
        padding: 5px;
    }

    .date-box {
        width: 40px;
        height: 40px;
    }

    .date-box .day {
        padding: 0;
        font-size: 13px;
    }

    .icon-card {
        padding: 5px;
        margin-right: 7px;
        width: 40px;
        height: 40px;
    }

    .icon-card i {
        font-size: 15px;
    }

}

/* new ticket */

/* UPDATE HEADER */

.event-header {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    position: relative;
    top: 0;
    z-index: 1000;
}

.event-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 24px;
}

.event-top-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    background-color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.event-logo {
    display: flex;
    align-items: center;
    font-size: 28px;
    font-weight: 700;
    color: #1a202c;
    text-decoration: none;
    transition: all 0.3s ease;
}

.event-logo:hover {
    color: #ed7326;
    transform: translateY(-2px);
}

.event-logo-icon {
    width: 120px;
    height: 55px;
}

.event-location {
    font-size: 16px;
    color: #4a5568;
    /* margin-left: 8px; */
    position: relative;
    display: flex;
    align-items: center;
}

.event-location-dropdown {
    background: none;
    border: none;
    color: #4a5568;
    cursor: pointer;
    padding: 6px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.event-location-dropdown:hover {
    background: rgba(237, 115, 38, 0.1);
    color: #ed7326;
}

.event-search-container {
    flex: 1;
    max-width: 700px;
    margin: 0 10px;
    position: relative;
}

.event-search-box {
    width: 100%;
    padding: 12px 48px 12px 16px;
    border: 2px solid rgba(237, 115, 38, 0.2);
    border-radius: 30px;
    font-size: 20px;
    background: rgba(255, 255, 255, 0.95);
    transition: all 0.3s ease;
    outline: none;
}

.event-search-box:focus {
    border-color: #ed7326;
    box-shadow: 0 0 20px rgba(237, 115, 38, 0.2);
    transform: translateY(-1px);
}

.event-search-icon {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #ed7326;
    font-size: 18px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.event-search-icon:hover {
    transform: translateY(-50%) scale(1.1);
}

.event-user-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.event-create-btn {
    /* background: linear-gradient(135deg, #ed7326, #ff9f43); */
    color: #ed7326;
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    border: 1px solid #ed7326 ;
    /* box-shadow: 0 4px 15px rgba(237, 115, 38, 0.3); */
}

.event-create-btn:hover {
    transform: translateY(-1px);
    background-color: #ed7326;
    color:#fff;
    /* box-shadow: 0 8px 25px rgba(237, 115, 38, 0.4); */
}

.event-create-btn-mobile {
    display: none;
}

.event-signin-btn {
    color: #1a202c;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    padding: 8px 16px;
    border-radius: 20px;
}

.event-signin-btn:hover {
    background: rgba(237, 115, 38, 0.1);
    color: #ed7326;
}

/* .event-main-nav {
          padding: 0;
          overflow-x: auto;
          scrollbar-width: none;
      } */

.event-main-nav::-webkit-scrollbar {
    display: none;
}

.event-nav-list {
    display: flex;
    list-style: none;
    align-items: center;
    white-space: nowrap;
    min-width: max-content;
    margin: 0;
    padding: 0;
    scrollbar-width: none;
}

.event-nav-item {
    position: relative;
}

.event-nav-link {
    display: block;
    padding: 16px 24px;
    color: #4a5568;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
    position: relative;
    overflow: hidden;
}

.event-nav-link::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
            transparent,
            rgba(237, 115, 38, 0.1),
            transparent);
    transition: left 0.5s ease;
}

.event-nav-link:hover::before {
    left: 100%;
}

.event-nav-link:hover,
.event-nav-link.event-active {
    color: #ed7326;
    border-bottom-color: #ed7326;
    background: rgba(237, 115, 38, 0.05);
}

.event-nav-link.event-active {
    font-weight: 700;
}

.event-dropdown-arrow {
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.event-nav-link[aria-expanded="true"] .event-dropdown-arrow {
    transform: rotate(180deg);
}

.event-dropdown {
    position: relative;
}

.event-dropdown-menu {
    position: absolute;
    top: 100%;
    left: -10px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 180px;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(237, 115, 38, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
    overflow: hidden;
}

.event-dropdown.event-open .event-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

@media (min-width: 769px) {
    .event-dropdown:hover .event-dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}

.event-dropdown-item {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    color: #4a5568;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
}

.event-dropdown-item:last-child {
    border-bottom: none;
}

.event-dropdown-item:hover {
    background: linear-gradient(135deg, #ed7326, #ff9f43);
    color: white;
    /* transform: translateX(5px); */
}

.event-dropdown-item i {
    margin-right: 12px;
    width: 16px;
}

.event-user-profile {
    position: relative;
    /* display: none; */
    align-items: center;
    cursor: pointer;
    padding: 8px 16px;
    border-radius: 30px;
    transition: all 0.3s ease;
    background: rgba(237, 115, 38, 0.1);
}

.event-user-profile:hover {
    background: rgba(237, 115, 38, 0.2);
}

.event-user-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ed7326, #ff9f43);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    margin-right: 12px;
    box-shadow: 0 2px 8px rgba(237, 115, 38, 0.3);
}

.event-user-name {
    font-weight: 600;
    color: #1a202c;
    margin-right: 6px;
}

.event-user-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 240px;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(237, 115, 38, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
    overflow: hidden;
    margin-top: 12px;
}

.event-user-profile.event-open .event-user-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

@media (min-width: 769px) {
    .event-user-profile:hover .event-user-dropdown {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}

.event-profile-section {
    padding: 16px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.event-profile-section h4 {
    color: #718096;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
    font-weight: 600;
}

.event-profile-info {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.event-profile-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ed7326, #ff9f43);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    margin-right: 12px;
    box-shadow: 0 2px 8px rgba(237, 115, 38, 0.3);
}

.event-profile-details h5 {
    color: #1a202c;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 2px;
}

.event-profile-details span {
    color: #718096;
    font-size: 12px;
}

.event-profile-stats {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 12px;
    color: #718096;
    font-size: 12px;
}

.event-app-promo {
    background: linear-gradient(135deg, #ed7326, #ff9f43);
    color: white;
    padding: 12px 20px;
    margin: 12px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: all 0.3s ease;
}

.event-app-promo:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(237, 115, 38, 0.3);
}

.event-app-promo .event-new-badge {
    background: #e53e3e;
    color: white;
    font-size: 10px;
    padding: 3px 8px;
    border-radius: 12px;
    font-weight: 600;
}

.event-location-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    min-width: 220px;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(237, 115, 38, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
    overflow: hidden;
    margin-top: 6px;
}

.event-location.event-dropdown-open .event-location-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.event-location-item {
    display: flex;
    align-items: center;
    padding: 12px 20px;
    color: #4a5568;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
}

.event-location-item:last-child {
    border-bottom: none;
}

.event-location-item:hover {
    background: linear-gradient(135deg, #ed7326, #ff9f43);
    color: white;
    transform: translateX(5px);
}

.event-location-item.event-active {
    background: rgba(237, 115, 38, 0.1);
    color: #ed7326;
    font-weight: 600;
}

.event-mobile-menu-btn {
    display: none;
    background: none;
    border: none;
    font-size: 24px;
    color: #1a202c;
    cursor: pointer;
    padding: 12px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.event-mobile-menu-btn:hover {
    background: rgba(237, 115, 38, 0.1);
    color: #ed7326;
}

.event-hero-title {
    font-size: 3.5rem;
    color: white;
    margin-bottom: 24px;
    /* text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); */
    font-weight: 700;
}

.event-hero-subtitle {
    font-size: 1.25rem;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 32px;
    /* text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); */
}

.event-filter-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 32px;
}

.event-filter-btn {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border: 2px solid rgba(255, 255, 255, 0.3);
    padding: 12px 28px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
    backdrop-filter: blur(10px);
}

.event-filter-btn:hover,
.event-filter-btn.event-active {
    background: rgba(255, 255, 255, 0.95);
    color: #ed7326;
    border-color: white;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}

/* Accessibility Improvements */
.event-nav-link:focus,
.event-create-btn:focus,
.event-signin-btn:focus,
.event-location-dropdown:focus,
.event-search-box:focus,
.event-filter-btn:focus {
    /* outline: 2px solid #ed7326; */
    outline-offset: 2px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .event-search-container {
        margin: 0 24px;
        max-width: 450px;
    }

    .event-nav-link {
        padding: 16px 20px;
        font-size: 13px;
    }

    .event-hero-title {
        font-size: 3rem;
    }

    .event-user-actions {
        gap: 10px;
    }

    .event-create-btn {
        padding: 10px 20px;
        font-size: 12px;
        gap: 2px;
    }
}

@media (max-width: 1050px) {
    .event-container {
        padding: 0 5px;
    }

    .event-top-nav {
        flex-wrap: wrap;
        gap: 5px;
    }

    .event-search-container {
        order: 3;
        flex: 1 1 100%;
        margin: 0;
        max-width: none;
    }

    .event-mobile-menu-btn {
        display: block;
    }

    .event-main-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: rgba(255, 255, 255, 0.98);
        backdrop-filter: blur(12px);
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
        z-index: 999;
    }

    .event-main-nav.event-mobile-open {
        display: block;
    }

    .event-nav-list {
        flex-direction: column;
        align-items: stretch;
    }

    .event-nav-link {
        padding: 16px 20px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        border-left: none;
    }

    .event-dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        background: rgba(0, 0, 0, 0.02);
        border-radius: 0;
        transform: none;
        opacity: 1;
        visibility: visible;
        display: none;
    }

    .event-dropdown.event-open .event-dropdown-menu {
        display: block;
    }

    .event-hero-title {
        font-size: 2.5rem;
    }

    .event-hero-subtitle {
        font-size: 1.1rem;
    }

    .event-filter-buttons {
        gap: 12px;
    }

    .event-filter-btn {
        padding: 10px 24px;
        font-size: 14px;
    }

    .event-user-actions {
        gap: 5px;
    }
}

@media (max-width: 480px) {
    .event-top-nav {
        padding: 0;
    }

    .event-logo {
        font-size: 24px;
    }

    .event-logo-icon {
        width: 80px;
        height: 40px;
    }

    .event-create-btn {
        display: none;
    }

    .event-create-btn-mobile {
        display: block;
    }

    .event-create-btn-mobile a {
        color: #ed7326 !important;
        text-decoration: none;
        font-weight: 600;
        font-size: 18px;
    }

    .event-hero-title {
        font-size: 2.25rem;
    }

    .event-hero-subtitle {
        font-size: 1rem;
    }

    .event-filter-btn {
        padding: 8px 20px;
        font-size: 13px;
    }

    .event-user-name {
        font-size: 12px;
    }

    .event-user-profile {
        padding: 8px;
    }

    .event-user-avatar {
        width: 30px;
        height: 30px;
        font-size: 12px;
        margin-right: 6px;
    }
}

/* Animation for filter buttons */
@keyframes event-pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

.event-filter-btn.event-active {
    animation: event-pulse 2s infinite;
}

/* Loading animation */
.event-loading {
    display: inline-block;
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: white;
    animation: event-spin 1s ease-in-out infinite;
}

@keyframes event-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Enhanced Event Search Container */
.event-search-container .wrapper .search_box {
    width: 100%;
    background: #fff;
    border-radius: 8px;
    /* Slightly reduced border-radius */
    display: flex;
    align-items: center;
    flex-wrap: nowrap !important;
    padding: 8px;
    /* Reduced padding */
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
    /* Softer shadow */
    transition: all 0.2s ease;
    /* Faster transition */
    flex-wrap: wrap;
}

.wrapper .search_box:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    /* Reduced shadow on hover */
}

.event-search-container .wrapper .search_box .location_field {
    position: relative;
    width: 150px;
    /* Slightly reduced width */
    padding-right: 8px;
    /* Reduced padding */
    border-right: 1px solid #e0e3ee;
    color: #5a5f73;
    cursor: pointer;
}

.event-search-container .wrapper .search_box .location_field .default_option {
    padding: 8px 0;
    /* Reduced padding */
    font-size: 16px;
    /* Slightly smaller font */
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.event-search-container .wrapper .search_box .location_field .default_option i {
    margin-right: 7px;
    color: #ed7326;
}

.event-search-container .wrapper .search_box .location_field ul {
    position: absolute;
    top: 100%;
    left: 0;
    width: 150px;
    /* Adjusted width */
    border-radius: 6px;
    /* Smaller radius */
    padding: 8px;
    /* Reduced padding */
    display: none;
    z-index: 10;
    background: #fff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    /* Softer shadow */
}

.event-search-container .wrapper .search_box .location_field ul.active {
    display: block;
}

.event-search-container .wrapper .search_box .location_field ul li {
    padding: 10px;
    /* Reduced padding */
    font-size: 15px;
    /* Smaller font */
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
}

.event-search-container .wrapper .search_box .location_field ul li i {
    margin-right: 6px;
    /* Reduced margin */
    color: #ed7326;
}

.event-search-container .wrapper .search_box .location_field ul li:hover {
    color: #fff !important;
    padding-left: 3px;
    /* Reduced hover padding */
}

.event-search-container .wrapper .search_box .location_field:before {
    content: "▼";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    font-size: 15px;
    font-weight: 600;
    /* Smaller icon */
    color: #7a7f93;
    padding-right: 6px;
}

.event-search-container .wrapper .search_box .search_field {
    flex: 1;
    min-width: 180px;
    /* Reduced min-width */
    /* height: 45px; */
    /* Reduced height */
    position: relative;
    padding: 0 8px;
    font-size: 18px;
    /* Reduced padding */
}

.event-search-container .wrapper .search_box .search_field .input::placeholder {
    font-size: 12px;
    font-weight: bold;
}

.event-search-container .wrapper .search_box .search_field .input:focus {
    outline: none;
}

.wrapper .search_box .search_field .fas {
    position: absolute;
    top: 50%;
    right: 8px;
    /* Reduced positioning */
    transform: translateY(-50%);
    font-size: 15px;
    /* Smaller icon */
    color: #ed7326;
    cursor: pointer;
}

.wrapper .search_box .date_field {
    position: relative;
    width: 150px;
    /* Reduced width */
    padding-left: 8px;
    /* Reduced padding */
    /* border-left: 1px solid #e0e3ee; */
}

.event-search-container .wrapper .search_box .date_field .date_input {
    width: 100%;
    height: 45px;
    /* Reduced height */
    border: 0;
    font-size: 16px;
    font-weight: 600;
    /* Smaller font */
    padding: 0 25px 0 8px;
    /* Adjusted padding */
    color: #4a4f63;
    background: transparent;
    cursor: pointer;
}

.event-search-container .wrapper .search_box .date_field .fa-calendar-alt {
    position: absolute;
    top: 50%;
    right: 8px;
    /* Reduced positioning */
    transform: translateY(-50%);
    font-size: 15px;
    /* Smaller icon */
    color: #ed7326;
    pointer-events: none;
}

.autocomplete-suggestions {
    position: absolute;
    top: 100%;
    left: 8px;
    /* Reduced positioning */
    right: 8px;
    background: #fff;
    border-radius: 6px;
    /* Smaller radius */
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    /* Softer shadow */
    z-index: 10;
    max-height: 180px;
    /* Reduced height */
    overflow-y: auto;
    display: none;
}

.autocomplete-suggestions.active {
    display: block;
}

.autocomplete-suggestions li {
    padding: 10px;
    /* Reduced padding */
    font-size: 15px;
    /* Smaller font */
    color: #4a4f63;
    cursor: pointer;
    transition: all 0.2s ease;
}

.autocomplete-suggestions li:hover {
    background: #e47916;
    color: #fff !important;
}

/* Simple Search Suggestions */
.event-suggestion-item,
.category-suggestion-item {
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.2s ease;
    cursor: pointer;
}

.event-suggestion-item:last-child,
.category-suggestion-item:last-child {
    border-bottom: none;
}

.event-suggestion-item:hover h6 {
    color: white !important;
}

.category-suggestion-item:hover span {
    color: #ed7326 !important;
}

.autocomplete-suggestions {
    max-height: 300px;
    overflow-y: auto;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(237, 115, 38, 0.15);
    background: white;
}

/* Responsive for suggestions */
@media (max-width: 768px) {
    .autocomplete-suggestions {
        max-height: 250px;
    }

    .suggestion-wrapper {
        padding: 8px !important;
        gap: 8px !important;
    }

    .suggestion-wrapper img {
        width: 35px !important;
        height: 35px !important;
    }

    .suggestion-wrapper h6,
    .suggestion-wrapper span {
        font-size: 13px !important;
    }
}

@media (max-width: 480px) {
    .autocomplete-suggestions {
        max-height: 200px;
    }

    .suggestion-wrapper {
        padding: 6px !important;
        gap: 6px !important;
    }

    .suggestion-wrapper img {
        width: 30px !important;
        height: 30px !important;
    }

    .suggestion-wrapper h6,
    .suggestion-wrapper span {
        font-size: 12px !important;
    }
}

input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    color: transparent;
    background: transparent;
}

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-clear-button {
    display: none;
    -webkit-appearance: none;
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder {
    color: #a7aab8;
}

/* Responsive adjustments for screens up to 768px */
@media (max-width: 768px) {
    .event-search-container .wrapper {
        padding: 10px;
        /* Reduced padding */
    }

    .event-search-container .wrapper .search_box {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        height: auto;
        padding: 8px;
        /* Reduced padding */
        gap: 8px;
        /* Reduced gap */
    }

    .event-search-container .wrapper .search_box .location_field,
    .event-search-container .wrapper .search_box .search_field,
    .event-search-container .wrapper .search_box .date_field {
        flex: 1;
        min-width: 0;
        border: none;
        padding: 4px 0;
        /* Reduced padding */
        border-bottom: 1px solid #e0e3ee;
    }

    .event-search-container .wrapper .search_box .location_field ul {
        top: 100%;
        width: 100%;
        max-height: 140px;
        /* Reduced height */
        overflow-y: auto;
    }

    .event-search-container .wrapper .search_box .search_field {
        min-width: 0;
    }

    .event-search-container .wrapper .search_box .date_field {
        border-bottom: 1px solid #e0e3ee;
    }

    .autocomplete-suggestions {
        top: 100%;
        left: 0;
        right: 0;
        max-height: 140px;
        /* Reduced height */
    }

    .event-search-container .wrapper .search_box .location_field .default_option {
        font-size: 16px;
        /* Smaller font */
    }

    .event-search-container .wrapper .search_box .search_field .input {
        font-size: 13px;
        /* Smaller font */
    }

    .event-search-container .wrapper .search_box .date_field .date_input {
        font-size: 15px;
        /* Smaller font */
    }
}

/* Responsive adjustments for screens up to 480px */
@media (max-width: 480px) {
    .event-search-container .wrapper {
        padding: 4px;
        /* Reduced padding */
    }

    .event-search-container .wrapper .search_box {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 4px;
        /* Reduced padding */
        border-radius: 6px;
        /* Smaller radius */
        gap: 4px;
        /* Reduced gap */
    }

    .event-search-container .wrapper .search_box .location_field {
        flex: 1;
        min-width: 0;
    }

    .event-search-container .wrapper .search_box .search_field .input {
        font-size: 12px;
        /* Smaller font */
        padding: 0 20px 0 6px;
        /* Reduced padding */
    }

    .event-search-container .wrapper .search_box .search_field .fas {
        font-size: 13px;
        /* Smaller icon */
    }

    .event-search-container .wrapper .search_box .date_field .date_input {
        font-size: 13px;
        /* Smaller font */
        padding: 0 20px 0 6px;
        /* Reduced padding */
    }

    .event-search-container .wrapper .search_box .date_field .fa-calendar-alt {
        font-size: 13px;
        /* Smaller icon */
    }

    .event-search-container .wrapper .search_box .location_field ul li,
    .autocomplete-suggestions li {
        font-size: 11px;
        /* Smaller font */
        padding: 5px 0;
        /* Reduced padding */
    }

    .event-search-container .wrapper .search_box .location_field ul li i {
        font-size: 11px;
        /* Smaller icon */
    }
}

.event-main-nav {
    scrollbar-width: none;
    /* Hide scrollbar for Firefox */
    white-space: nowrap;
    /* Ensure items stay in a single row */
    -webkit-overflow-scrolling: touch;
    /* Smooth scrolling on touch devices */
}

.event-main-nav::-webkit-scrollbar {
    display: none;
    /* Hide scrollbar for WebKit browsers */
}

.event-nav-list {
    display: flex;
    list-style: none;
    /* align-items: center; */
    white-space: nowrap;
    min-width: max-content;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    /* Smooth scrolling for programmatic control */
}

/* Enhanced Search and Filter Styles */
.event-search-container {
    position: relative;
    z-index: 100;
}

.wrapper .search_box {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 25px;
    background: linear-gradient(135deg,
            rgba(102, 126, 234, 0.95) 0%,
            rgba(118, 75, 162, 0.95) 100%);
    border-radius: 50px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}

.wrapper .search_box:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

/* Enhanced Location Field */
.location_field {
    position: relative;
    min-width: 180px;
}

.location_field .default_option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 15px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 25px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.location_field .default_option:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-1px);
}

.location_field .default_option i {
    color: #667eea;
    font-size: 16px;
    display: block !important;
}

.location_field ul {
    position: absolute;
    top: 120%;
    left: 0;
    right: 0;
    background: white;
    border-radius: 15px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
    list-style: none;
    padding: 0;
    margin: 0;
}

.location_field ul.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.location_field ul li {
    padding: 12px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.location_field ul li:last-child {
    border-bottom: none;
}

.location_field ul li:hover {
    background: #e47916;
    color: white !important;
    transform: translateX(2px);
}

.location_field ul li i {
    color: #667eea;
    transition: color 0.2s ease;
}

.location_field ul li:hover i {
    color: white !important;
}

/* Enhanced Date Field */
.date_field {
    position: relative;
    min-width: 160px;
}

.date_field .date_input {
    padding: 12px 15px;
    border: 2px solid transparent;
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.9);
    font-size: 14px;
    color: #333;
    transition: all 0.3s ease;
    width: 100%;
}

.date_field .date_input:focus {
    outline: none;
    background: rgba(255, 255, 255, 1);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-1px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.date_field i {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #667eea;
    pointer-events: none;
    font-size: 16px;
}

/* Enhanced Search Field */
.search_field {
    position: relative;
    flex: 1;
    min-width: 250px;
}

.search_field .input {
    width: 100%;
    padding: 12px 40px 12px 15px;
    border: 2px solid transparent;
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.9);
    font-size: 14px;
    color: #333;
    transition: all 0.3s ease;
}

.search_field .input::placeholder {
    color: #666;
    font-style: italic;
}

.search_field i {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #667eea;
    font-size: 16px;
    pointer-events: none;
}

/* Enhanced Autocomplete Suggestions */
.autocomplete-suggestions {
    position: absolute;
    top: 120%;
    left: 0;
    right: 0;
    background: white;
    border-radius: 15px;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-15px);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 1000;
    max-height: 350px;
    overflow-y: auto;
    list-style: none;
    padding: 0;
    margin: 0;
    border: 1px solid rgba(102, 126, 234, 0.1);
}

.autocomplete-suggestions.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.autocomplete-suggestions::-webkit-scrollbar {
    width: 6px;
}

.autocomplete-suggestions::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.autocomplete-suggestions::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 10px;
}

.autocomplete-suggestions li {
    list-style: none;
    margin: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.autocomplete-suggestions li:last-child {
    border-bottom: none;
}

.autocomplete-suggestions li a {
    display: block;
    padding: 0;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}

.suggestion-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    transition: all 0.3s ease;
}

.suggestion-icon {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.suggestion-content {
    flex: 1;
    min-width: 0;
}

.suggestion-title {
    font-weight: 600;
    font-size: 16px;
    color: #333;
    margin-bottom: 4px;
    transition: color 0.3s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suggestion-meta {
    display: flex;
    gap: 15px;
    font-size: 12px;
    color: #666;
    transition: color 0.3s ease;
    flex-wrap: wrap;
}

.suggestion-meta span {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.suggestion-meta i {
    font-size: 11px;
    opacity: 0.8;
}

.autocomplete-suggestions li:hover .suggestion-title,
.autocomplete-suggestions li:hover .suggestion-meta,
.autocomplete-suggestions li:hover .suggestion-meta i {
    color: white;
}

/* Loading State */
.autocomplete-suggestions.loading::before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    border: 3px solid #667eea;
    border-top: 3px solid transparent;
    border-radius: 50%;
    margin: 20px auto;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* No Results State */
.no-results {
    padding: 30px 20px;
    text-align: center;
    color: #666;
    font-style: italic;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.no-results i {
    font-size: 24px;
    color: #ccc;
}

/* Responsive Design */
@media (max-width: 768px) {
    .wrapper .search_box {
        flex-direction: column;
        gap: 12px;
        padding: 20px;
    }

    .location_field,
    .date_field,
    .search_field {
        width: 100%;
        min-width: auto;
    }

    .search_field {
        order: 3;
        flex: 2;
        min-width: 250px;
    }

    .date_field {
        order: 2;
    }

    .location_field {
        order: 1;
    }
}

/* Additional mobile responsive for search field width */
@media (max-width: 480px) {
    .search_field {
        flex: 3;
        min-width: 220px;
        width: 100% !important;
    }
}

/* Search Field Focus Animation */
.search_field.focused {
    animation: searchPulse 0.6s ease-out;
}

@keyframes searchPulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.02);
    }

    100% {
        transform: scale(1);
    }
}

/* Highlight matched text in suggestions */
.highlight {
    background: rgba(255, 235, 59, 0.3);
    font-weight: 600;
    padding: 1px 2px;
    border-radius: 2px;
}

/* Search Results Dropdown Styles */
.search_field {
    position: relative;
}

.search-results-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    max-height: 400px;
    overflow-y: auto;
    display: none;
}

.search-results-dropdown.show {
    display: block;
}

.search-results-list {
    padding: 8px 0;
}

.search-result-item {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    cursor: pointer;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #f7fafc;
    text-decoration: none;
    color: inherit;
}

.search-result-item:hover {
    background-color: #f0f4ff;
    color: inherit;
    text-decoration: none;
}

.search-result-item:last-child {
    border-bottom: none;
}

.search-result-image {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    object-fit: cover;
    margin-right: 10px;
    flex-shrink: 0;
}

.search-result-content {
    flex: 1;
    min-width: 0;
}

.search-result-title {
    font-weight: 500;
    color: #2d3748;
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-result-details {
    display: none;
}

.search-result-date {
    display: none;
}

.search-result-location {
    display: none;
}

.search-results-footer {
    padding: 5px 10px;
    border-top: 1px solid #e2e8f0;
    background-color: #f7fafc;
}

.view-all-results {
    color: #3182ce;
    text-decoration: none;
    font-weight: 500;
    font-size: 13px;
    display: block;
    text-align: center;
}

.view-all-results:hover {
    color: #2c5aa0;
    text-decoration: none;
}

.no-results {
    padding: 15px;
    text-align: center;
    color: #718096;
    font-size: 13px;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .search-results-dropdown {
        max-height: 250px;
    }

    .search-result-item {
        padding: 6px 10px;
    }

    .search-result-image {
        width: 30px;
        height: 30px;
        margin-right: 8px;
    }

    .search-result-title {
        font-size: 13px;
    }

    .view-all-results {
        font-size: 12px;
    }

    .no-results {
        padding: 12px;
        font-size: 12px;
    }
}

/* end update header */

/* start new category section */

/* Categories Container */


/* Categories Container */
.categories-container-event {
  width: 100%;
  margin: 30px auto;
  text-align: center;
}

.categories-container-event h1 {
  font-size: 2.5rem;
  font-weight: 600;
  margin-bottom: 20px;
  color: #064554;
}

/* Categories List */
.categories-list-event {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  overflow-x: auto;
  padding-top: 10px;
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

/* Hide Scrollbar for webkit browsers */
.categories-list-event::-webkit-scrollbar {
  display: none;
}

.category-link-event {
  text-decoration: none;
  color: inherit;
  display: block; /* Ensures full clickable area */
}

/* Category Item */
.categories-list-event .category-item-event {
  flex: 0 1 calc(10% - 30px);
  width: fit-content; 
  min-width: 120px;
  text-align: center;
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.2s ease;
  margin-bottom: 8px;
  border-radius: 12px; /* Added rounded corners */
  padding: 12px 8px; /* Increased padding for better touch targets */
  border: 2px solid #e0e0e0; /* Added border */
  background-color: #fff; /* White background */
}

.categories-list-event .category-item-event:hover {
  transform: translateY(-3px);
  z-index: 99;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Added subtle shadow */
  border-color: #e67e22; /* Change border color on hover */
}

/* Category Icon */
.categories-list-event .category-item-event .category-icon-event {
  width: 50px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  transition: background-color 0.2s ease; /* Smooth background transition */
}


.categories-list-event .category-item-event .category-image-event {
  width: 25px;
  height: 40px;
  object-fit: contain;
  transition: transform 0.2s ease; /* Added icon scaling effect */
  filter: brightness(0) saturate(100%) invert(42%) sepia(6%) saturate(6%) hue-rotate(349deg) brightness(95%) contrast(88%);
}


/* Category Name */
.categories-list-event .category-item-event .category-name-event {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--icon-text, #333); /* Added fallback color */
  padding-top: 10px;
  transition: color 0.2s ease;
}


/* Loading Message */
.loading-message-event {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
}

.loading-message-event p {
  font-size: 1.2em;
  color: var(--icon-text, #666);
  margin-bottom: 20px;
}

.loading-spinner-event {
  width: 40px;
  height: 40px;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}




/* Responsive Design */
@media screen and (max-width: 1200px) {
  .categories-list-event .category-item-event {
      flex: 0 1 calc(12.5% - 30px); /* 8 items per row */
      width: 110px; /* Consistent width */
  }
}

@media screen and (max-width: 1024px) {
  .categories-list-event {
      gap: 10px;
  }

  .categories-list-event .category-item-event {
      flex: 0 1 calc(16.66% - 25px); /* 6 items per row */
      width: 100px; /* Consistent width */
      padding: 12px 8px;
  }

  .categories-list-event .category-item-event .category-icon-event {
      width: 70px;
      height: 50px;
  }

  .categories-list-event .category-item-event .category-image-event {
      width: 35px;
      height: 35px;
  }

  .categories-list-event .category-item-event .category-name-event {
      font-size: 0.85rem;
  }
}

@media screen and (max-width: 768px) {
  .categories-container-event {
      width: 98%;
      padding: 15px;
      margin: 35px auto;
  }

  .categories-list-event {
      gap: 10px;
      justify-content: flex-start;
      flex-wrap: nowrap;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      padding: 15px 5px;
      -webkit-overflow-scrolling: touch;
  }

  .categories-list-event .category-item-event {
      flex: 0 0 auto;
      scroll-snap-align: center;
      min-width: 100px; /* Fixed consistent width */
      width: max-content; /* Fixed width for mobile */
      padding: 12px 8px;
  }

  .categories-list-event .category-item-event .category-icon-event {
      width: 40px;
      height: 40px;
      margin: 0 auto;
  }

  .categories-list-event .category-item-event .category-image-event {
      width: 30px;
      height: 30px;
  }

  .categories-list-event .category-item-event .category-name-event {
      font-size: 0.8rem;
      padding: 8px 0 4px 0;
  }
}

@media screen and (max-width: 480px) {
  .categories-container-event {
      width: 100%;
      padding: 10px 5px;
      margin: 20px auto;
  }

  .categories-container-event h1 {
      font-size: 2rem;
      margin-bottom: 15px;
  }

  .categories-list-event {
      gap: 10px;
      padding: 10px 5px;
  }



  .categories-list-event .category-item-event .category-icon-event {
      width: 40px;
      height: 40px;
  }

  .categories-list-event .category-item-event .category-image-event {
      width: 25px;
      height: 25px;
  }

  .categories-list-event .category-item-event .category-name-event {
      font-size: 0.75rem;
      padding: 6px 0 2px 0;
      line-height: 1.2;
  }
}

/* Custom Scrollbar for webkit browsers on mobile */
@media screen and (max-width: 768px) {
  .categories-list-event::-webkit-scrollbar {
      height: 3px;
      display: block;
  }

  .categories-list-event::-webkit-scrollbar-track {
      background: rgba(241, 241, 241, 0.8);
      border-radius: 2px;
      margin: 0 20px;
  }

  .categories-list-event::-webkit-scrollbar-thumb {
      background: #e67e22;
      border-radius: 2px;
      transition: background 0.2s ease;
  }

  .categories-list-event::-webkit-scrollbar-thumb:hover {
      background: #d35400;
  }
}

/* Reduced motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  .categories-list-event .category-item-event {
      transition: none;
  }
  
  .categories-list-event .category-item-event:hover {
      transform: none;
  }
  
  .loading-spinner-event {
      animation: none;
  }
}

/* end new category section */
/* Exclusive Events section */
.header-exclusive {
    text-align: center;
    margin-top: 40px;
}

.header-exclusive h1 {
    color: #064554;
    font-size: 2.5rem;
    margin-bottom: 10px;
    /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.07); */
}

.header-exclusive p {
    color: #666;
    font-size: 1.2rem;
}

.slider-controls-exclusive {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    margin: 10px 0;
}

.slider-btn-exclusive {
    background: #ed7326;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
    box-shadow: 0 4px 16px rgba(237, 115, 38, 0.15);
    z-index: 2;
}

.slider-btn-exclusive:active {
    background: #d65a1a;
    transform: scale(0.95);
}

.events-container-exclusive {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
    padding: 0 15px;
}

.event-card-exclusive {
    background: #fff;
    border-radius: 25px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    display: flex;
    min-height: 300px;
    transition: all 0.3s ease;
    position: relative;
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    animation: fadeIn 0.5s;
}

.event-card-exclusive:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 60px rgba(237, 115, 38, 0.15);
}

.event-image-exclusive {
    width: 450px;
    height: auto;
    background: linear-gradient(45deg, #ed7326, #ff8c42);
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.event-image-exclusive img {
    width: 100%;
    height: 100%;
    transition: transform 0.3s;
}

.event-category-exclusive {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #fff;
    color: #ed7326;
    padding: 8px 15px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 6px;
    z-index: 3;
    border: 1px solid #ed7326;
}

.event-like-exclusive {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: rgba(255, 255, 255, 0.95);
    color: #ed7326;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    z-index: 3;
}

.event-like-exclusive:hover {
    background: #ed7326;
    color: white;
    transform: scale(1.1);
}

.event-date-exclusive {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255, 255, 255, 0.95);
    padding: 10px 15px;
    border-radius: 25px;
    font-size: 0.9rem;
    font-weight: bold;
    color: #ed7326;
    box-shadow: 0 4px 12px rgba(237, 115, 38, 0.1);
    display: flex;
    align-items: center;
    gap: 7px;
}

.event-date-exclusive i {
    color: #ed7326;
    font-size: 1.1rem;
}

.event-content-exclusive {
    width: 850px;
    min-width: 0;
    max-width: 100%;
    padding: 20px 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    overflow: hidden;
}

.event-title-exclusive {
  font-size: 18px;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
  flex: 1;
  margin: 5px 0px;
}

.event-title-exclusive i {
    color: #ed7326;
    font-size: 1rem;
}

.event-organizer-exclusive {
    color: #777;
    font-size: .9rem;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.event-organizer-exclusive i {
    color: #ed7326;
    font-size: 1rem;
}

.event-location-exclusive {
    color: #777;
    /* font-weight: 600; */
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;

}

.event-location-exclusive i {
    color: #ed7326;
    font-size: .9rem;
}

.event-description-exclusive {
    color: #777;
    line-height: 1.7;
    margin-bottom: 10px;
    font-size: .9rem;
    flex: 1;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.event-description-exclusive i {
    color: #ed7326;
    font-size: .9rem;
    margin-top: 3px;
}

/* .event-meta-exclusive {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 15px;
  border-top: 2px solid #f0f0f0;
  gap: 15px;
} */
.event-meta-exclusive {
    padding: 10px;
    background-color: #d6d6d643;
    border-radius: 15px;
}

.event-time-container-exclusive {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.event-time-exclusive {
    color: #888;
    font-size: 1rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 7px;
}

.event-time-exclusive i {
    color: #ed7326;
    font-size: .9rem;
}

.event-actions-exclusive {
    display: flex;
    flex-direction: row;
    /* Ensure row layout */
    gap: 10px;
    margin-top: 5px;
    align-items: center;
    justify-content: space-between;
}

.event-price-exclusive {
    /* background: #ed7326; */
    color: #ed7326;
    /* padding: 10px 20px; */
    /* border-radius: 25px; */
    font-weight: 600;
    font-size: 1.2rem;
    /* box-shadow: 0 4px 15px rgba(237, 115, 38, 0.2); */
    display: flex;
    align-items: center;
    gap: 7px;
}

.event-price-exclusive i {
    color: #ed7326;
    font-size: .9rem;
}

.event-view-details-exclusive {
    background: #fff;
    color: #ed7326;
    padding: 12px;
    border-radius: 9px;
    /* font-weight: 600; */
    font-size: 0.9rem;
    text-decoration: none;
    border: 1px solid #ed7326;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 5px;
}

.event-view-details-exclusive:hover {
    background: #ed7326;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(237, 115, 38, 0.3);
}

.event-view-details-exclusive i {
    font-size: 0.9rem;
}

/* Responsive Design */
@media (max-width: 1350px) {
    .event-content-exclusive {
        width: calc(100% - 450px);
        max-width: 100%;
        padding: 15px 25px;
    }

    .event-actions-exclusive {
        flex-direction: row;
        gap: 15px;
    }
}

@media (max-width: 900px) {
    .events-container-exclusive {
        padding: 0 10px;
        gap: 10px;
    }

    .event-card-exclusive {
        flex-direction: column;
        min-height: auto;
        /* max-width: 100%; */
        width: 94vw;
        border-radius: 15px;
        margin: 0;
    }

    .event-image-exclusive {
        width: 100%;
        height: 200px;
    }

    .event-content-exclusive {
        width: 100%;
        padding: 15px;
        gap: 10px;
    }

    .event-title-exclusive {
        font-size: 1.2rem;
        margin-bottom: 10px;
    }

    .event-description-exclusive {
        font-size: 0.95rem;
        margin-bottom: 10px;
    }

    .event-meta-exclusive {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding-top: 10px;
    }

    .event-actions-exclusive {
        flex-direction: row;
        width: 100%;
        justify-content: space-between;
        gap: 10px;
    }

    /* .event-price-exclusive {
      padding: 8px 16px;
      font-size: 0.9rem;
  } */

    .event-view-details-exclusive {
        padding: 6px 12px;
        font-size: 0.85rem;
    }
    .header-exclusive {
      text-align: center;
      margin-top: 30px;
  }
    .header-exclusive h1 {
        font-size: 2rem;
    }

    .header-exclusive p {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .events-container-exclusive {
        padding: 0 5px;
    }
    .header-exclusive {
      margin-top: 20px;
  }
    .event-content-exclusive {
        padding: 12px;
    }

    .event-title-exclusive {
        font-size: 1.4rem;
    }

    .event-description-exclusive {
        font-size: 0.9rem;
    }

    .event-actions-exclusive {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .event-price-exclusive,
    .event-view-details-exclusive {
        text-align: center;
        justify-content: center;
    }

    .header-exclusive h1 {
        font-size: 1.8rem;
    }

    .header-exclusive p {
        font-size: 0.9rem;
    }
}

/* end exclusive events section */



.mobile-app-menu {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    border-top: 1px solid #e0e0e0;
}

.menu-app-container {
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 4px 0;
    max-width: 500px;
    margin: 0 auto;
}

.menu-app-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #666;
    padding: 8px 12px;
    border-radius: 8px;
    transition: all 0.3s ease;
    min-width: 60px;
}

.menu-app-item:hover {
    color: #ed7326;
    background: rgba(237, 115, 38, 0.1);
    transform: translateY(-2px);
}

.menu-app-item.active {
    color: #ed7326;
    background: rgba(237, 115, 38, 0.1);
}

.menu-app-item i {
    font-size: 1rem;
    margin-bottom: 2px;
}

.menu-app-item span {
    font-size: 0.75rem;
    font-weight: 500;
    text-align: center;
}

/* Hide on desktop */
@media (min-width: 768px) {
    .mobile-app-menu {
        display: none;
    }
}

/* Show only on mobile */
@media (max-width: 767px) {
    .mobile-app-menu {
        display: block;
    }

    /* Add padding to body to prevent content from being hidden behind menu */
    body {
        padding-bottom: 50px;
    }
}

/* Action Links in Row Layout */


.view-details-link {
    background: linear-gradient(45deg, #ed7326, #ff8c42);
    color: white;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 12px rgba(237, 115, 38, 0.2);
    white-space: nowrap;
    /* Prevent text wrapping */
}

.view-details-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(237, 115, 38, 0.3);
    color: white;
    text-decoration: none;
}

.edit-link {
    background: #28a745;
    color: white;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.2);
    white-space: nowrap;
    /* Prevent text wrapping */
}

.edit-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(40, 167, 69, 0.3);
    color: white;
    text-decoration: none;
}

/* Mobile Responsive for Links */
@media (max-width: 900px) {
    .event-actions-exclusive {
        flex-direction: row;
        /* Keep as row on mobile */
        gap: 6px;
        margin-top: 8px;
        flex-wrap: wrap;
        /* Allow wrapping if needed */
    }

    .view-details-link,
    .edit-link {
        padding: 6px 10px;
        font-size: 0.8rem;
        min-width: fit-content;
    }
}

@media (max-width: 480px) {
    .event-actions-exclusive {
        gap: 4px;
        justify-content: space-between;
        /* Spread links across width */
    }

    .view-details-link,
    .edit-link {
        padding: 5px 8px;
        font-size: 0.75rem;
        flex: 1;
        /* Make links take equal space */
        justify-content: center;
    }
}


/* Trusted companies - Enhanced Design */
.trusted-section {
    padding: 3rem 1rem;
    width: 100%;
    overflow: hidden;
    position: relative;
}


.trusted-section .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
    position: relative;
    z-index: 2;
}

.trusted-section .title-product {
    text-align: center;
    margin-bottom: 2rem;
    position: relative;
}



.trusted-section .title-product h2 {
    font-size: 2.5rem;
    font-weight: 600;
    letter-spacing: 1px;
    color: #064554;
    animation: slideIn 0.8s ease-out;
    margin-bottom: 1rem;
    /* text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); */
}

.trusted-section .title-product .accent {
    color: #064554;
    position: relative;
    display: inline-block;
}


.trusted-section .logo-container {
    display: flex;
    flex-wrap: nowrap;
    width: max-content;
    animation: scroll 25s linear infinite;
    margin: 0.25rem 0;
    padding: 0.25rem 0;
    position: relative;

}

.trusted-section .logo-container::before,
.trusted-section .logo-container::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100px;
    z-index: 3;
    pointer-events: none;
}

.trusted-section .logo-container::before {
    left: 0;
    /* background: linear-gradient(90deg, rgba(248,249,250,1) 0%, rgba(248,249,250,0) 100%); */
}

.trusted-section .logo-container::after {
    right: 0;
    /* background: linear-gradient(90deg, rgba(248,249,250,0) 0%, rgba(248,249,250,1) 100%); */
}

.trusted-section .logo-container:hover {
    animation-play-state: paused;
}

.trusted-section .logo-item {
    flex: 0 0 auto;
    width: 180px;
    height: 140px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 3rem;
    /* background: rgba(255, 255, 255, 0.9); */
    border-radius: 15px;
    /* box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08); */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    opacity: 0.85;
    filter: grayscale(30%);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.8);
}


.trusted-section .logo-item:hover::before {
    left: 100%;
}

/* .trusted-section .logo-item:hover {
    opacity: 1;
    filter: grayscale(0%);
    transform: translateY(-8px) scale(1.05);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
    background: rgba(255, 255, 255, 1);
} */

.trusted-section .logo-item img {
    width: 80%;
    height: 80%;
    object-fit: contain;
    transition: all 0.3s ease;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.trusted-section .logo-item:hover img {
    transform: scale(1.1);
    /* filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15)); */
}

/* Enhanced Scroll animation */
@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* Enhanced Animations */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes expand {
    from {
        width: 0;
    }

    to {
        width: 100px;
    }
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-5px);
    }
}

/* Enhanced Responsive Design */
@media (max-width: 1400px) {
    .trusted-section .container {
        max-width: 1200px;
        padding: 0 1.5rem;
    }

    .trusted-section .logo-item {
        width: 160px;
        height: 130px;
        margin-right: 2.5rem;
    }
}

@media (max-width: 1200px) {
    .trusted-section .logo-item {
        width: 150px;
        height: 120px;
        margin-right: 2rem;
    }

    /* .trusted-section .logo-container {
        margin: 1.5rem 0;
    } */
}

@media (max-width: 1024px) {
    .trusted-section {
        padding: 3rem 1rem;
    }

    .trusted-section .logo-item {
        width: 140px;
        height: 110px;
        margin-right: 1.8rem;
    }

    .trusted-section .title-product h2 {
        font-size: 2rem;
    }
}

@media (max-width: 768px) {
    .trusted-section {
        padding: 2rem 0.75rem;
    }

    .trusted-section .container {
        padding: 0 1rem;
    }

    .trusted-section .logo-item {
        width: 130px;
        height: 100px;
        margin-right: 1.5rem;
    }

    .trusted-section .title-product h2 {
        font-size: 1.8rem;
    }

    .trusted-section .title-product {
        margin-bottom: 2rem;
    }

    .trusted-section .logo-container {
        animation-duration: 20s;
    }
}

@media (max-width: 480px) {
    /* .trusted-section {
        padding: 1rem 0.5rem;
    } */

    .trusted-section .logo-item {
        width: 110px;
        height: 90px;
        margin-right: 1.2rem;
    }

    .trusted-section .title-product h2 {
        font-size: 1.5rem;
    }

    .trusted-section .logo-container {
        animation-duration: 17s;
    }

    .trusted-section .title-product::after {
        width: 80px;
    }

    .trusted-section .title-product {
        margin-bottom: 1rem;
    }
}


/* filtration section that will appear when the user click on the filter icon in header */

/* section events-filter */
.section-events-filteration {
    padding: 40px 0;
    /* background-color: #f8f9fa; */
    width: 1400px;
    max-width: 100%;
    margin: 0 auto;
}

.section-events-filteration .container-evnts-filteration {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 10px;
}

.section-events-filteration .events-header {
    text-align: center;
    margin-bottom: 40px;
}

.section-events-filteration .events-title {
    font-size: 2.5em;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    position: relative;
}

.section-events-filteration .events-title::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #ed7326, #ff6b35);
    border-radius: 2px;
}

.section-events-filteration .events-subtitle {
    font-size: 1.2em;
    color: #666;
    margin-bottom: 40px;
    font-weight: 300;
}

.section-events-filteration .events-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.section-events-filteration .event-card {
    background-color: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.section-events-filteration .event-card:hover {
    transform: translateY(-10px) scale(1.01);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
    border-color: rgba(237, 115, 38, 0.3);
}

.section-events-filteration .event-card .event-image {
    position: relative;
    height: 200px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.4s ease;
}

/* .section-events-filteration .event-card .event-image:hover {
  transform: scale(1.05);
} */

.section-events-filteration .event-card .event-image img {
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
    transition: transform 0.4s ease;
}

/* .section-events-filteration .event-card .event-image:hover img {
  transform: scale(1.15);
} */

.section-events-filteration .event-card .heart-icon-filter {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #ed7326;
    color: #fff;
    padding: 6px 10px;
    border-radius: 50%;
    font-size: 1.1rem;
    font-weight: bold;
    z-index: 3;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(237, 115, 38, 0.2);
}

.section-events-filteration .event-card .heart-icon-filter:hover {
    background-color: #fff;
    color: #ed7326;
    transform: scale(1.15) rotate(5deg);
    box-shadow: 0 5px 20px #fff;
    border-color: #fff;
}

.section-events-filteration .event-card .heart-icon-filter.favorited {
    background-color: #e74c3c;
    color: #fff;
    border-color: #e74c3c;
}

.section-events-filteration .event-card .event-category {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #ed7326;
    color: #fff;
    padding: 7px 12px;
    border-radius: 25px;
    font-size: 0.85em;
    font-weight: 600;
    z-index: 3;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 8px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(237, 115, 38, 0.2);
    transition: all 0.3s ease;
}

.section-events-filteration .event-card .event-category:hover {
    background-color: #fff;
    color: #ed7326;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px #fff;
}

.section-events-filteration .event-card .event-category i {
    font-size: 0.9em;
    color: inherit;
}

.section-events-filteration .event-card .event-content {
    padding: 25px 15px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
}

.section-events-filteration .event-card .event-title {
    font-size: 1.3em;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 1rem;
    transition: color 0.3s ease;
}

.section-events-filteration .event-card:hover .event-title {
    color: #ed7326;
}

.section-events-filteration .event-card .event-meta {
    margin-bottom: 10px;
    font-size: 1rem;
    color: #555;
    flex-grow: 1;
}

.section-events-filteration .event-card .event-meta .event-meta-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    font-size: 0.9em;
    transition: all 0.3s ease;
}

.section-events-filteration .event-card .event-meta .event-meta-item:hover {
    color: #ed7326;
    transform: translateX(5px);
}

.section-events-filteration .event-card .event-meta .event-meta-item i {
    margin-right: 10px;
    color: #ed7326;
    width: 18px;
    text-align: center;
    font-size: 0.95em;
    transition: transform 0.3s ease;
}

.section-events-filteration .event-card .event-meta .event-meta-item:hover i {
    transform: scale(1.2);
}

.section-events-filteration .event-card .event-price {
    background: linear-gradient(135deg, #ed7326 0%, #ff6b35 100%);
    color: #fff;
    padding: 10px;
    border-radius: 12px;
    font-size: 0.95em;
    font-weight: 700;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: auto;
    width: fit-content;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.section-events-filteration .event-card .event-price::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
            transparent,
            rgba(255, 255, 255, 0.2),
            transparent);
    transition: left 0.5s ease;
}

.section-events-filteration .event-card .event-price:hover::before {
    left: 100%;
}

.section-events-filteration .event-card .event-price:hover {
    background: linear-gradient(135deg, #d3682e 0%, #e55a2b 100%);
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(237, 115, 38, 0.4);
}

.section-events-filteration .event-card .event-price.free {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
}

.section-events-filteration .event-card .event-price.free:hover {
    background: linear-gradient(135deg, #218838 0%, #1ea085 100%);
    box-shadow: 0 8px 25px rgba(40, 167, 69, 0.4);
}

.section-events-filteration .event-card .event-price i {
    font-size: 1em;
    transition: transform 0.3s ease;
}

.section-events-filteration .event-card .event-price:hover i {
    transform: scale(1.1);
}

.section-events-filteration .pagination-container {
    text-align: center;
    margin-top: 60px;
}

.section-events-filteration .pagination {
    display: inline-flex;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    padding: 5px;
}

.section-events-filteration .pagination .page-link {
    padding: 12px 18px;
    font-size: 1em;
    color: #555;
    text-decoration: none;
    border-radius: 50%;
    transition: all 0.3s ease;
    font-weight: 500;
    margin: 0 3px;
    border: none;
}

.section-events-filteration .pagination .page-link:hover {
    background-color: #f8f9fa;
    color: #ed7326;
    transform: translateY(-2px);
}

.section-events-filteration .pagination .page-link.active {
    background: linear-gradient(135deg, #ed7326 0%, #ff6b35 100%);
    color: #fff;
    font-weight: 700;
    box-shadow: 0 4px 15px rgba(237, 115, 38, 0.3);
    border: none;
}

.section-events-filteration .pagination .page-link.next,
.section-events-filteration .pagination .page-link.prev {
    padding: 12px 20px;
    font-weight: 600;
}

@media screen and (max-width: 1200px) {
    .section-events-filteration {
        width: 100%;
    }

    .section-events-filteration .container-evnts-filteration {
        max-width: 100%;
    }

    .section-events-filteration .events-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 25px;
    }
}

@media screen and (max-width: 992px) {
    .section-events-filteration .events-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .section-events-filteration .event-card .event-content {
        padding: 20px;
    }
}

@media screen and (max-width: 768px) {
    .section-events-filteration {
        padding: 40px 0;
    }

    .section-events-filteration .events-title {
        font-size: 1.8em;
    }

    .section-events-filteration .events-subtitle {
        font-size: 1em;
    }

    .section-events-filteration .event-card .event-title {
        font-size: 1.2em;
    }

    .section-events-filteration .event-card .event-meta .event-meta-item {
        font-size: 0.85em;
    }

    .section-events-filteration .event-card .event-price {
        padding: 10px 16px;
        font-size: 0.9em;
    }
}

@media screen and (max-width: 576px) {
    .section-events-filteration .events-grid {
        grid-template-columns: 1fr;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 15px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .section-events-filteration .event-card {
        flex-direction: column;
        width: 95%;
    }

    .section-events-filteration .event-card:hover {
        transform: translateY(-5px) scale(1);
    }

    .section-events-filteration .event-card .event-content {
        padding: 20px 15px;
    }

    .section-events-filteration .event-card .event-title {
        font-size: 1.3em;
        min-height: auto;
    }

    .section-events-filteration .event-card .event-meta .event-meta-item {
        font-size: 0.8em;
    }

    .section-events-filteration .event-card .event-price {
        padding: 8px 14px;
        font-size: 0.85em;
    }
}

@media screen and (max-width: 385px) {
    .section-events-filteration {
        padding: 30px 0;
    }

    .section-events-filteration .events-title {
        font-size: 1.5em;
    }

    .section-events-filteration .events-subtitle {
        font-size: 0.9em;
    }
}

/* section events-filter */


/* owner section */

/* Request owner Section */
.section-you-owner {
  padding: 5rem 0;
  position: relative;
  overflow: hidden;
  color: var(--white);
  background: linear-gradient(135deg, #064554 0%, #064554 50%, #064554 100%);
}

.section-you-owner::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.15) 0%, transparent 60%),
    radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.12) 0%, transparent 60%),
    radial-gradient(circle at 40% 60%, rgba(237, 115, 38, 0.1) 0%, transparent 40%);
  pointer-events: none;
}

.section-you-owner::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,255,255,0.03)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
  animation: backgroundMove 30s linear infinite;
  pointer-events: none;
  z-index: 1;
}

@keyframes backgroundMove {
  0% { transform: translate(0, 0); }
  100% { transform: translate(-10px, -10px); }
}

/* owner Container */
.section-you-owner .owner-container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2rem;
  position: relative;
  z-index: 2;
}

/* owner Content */
.section-you-owner .owner-container .owner-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  position: relative;
}

/* owner Background Shapes */
.section-you-owner .owner-container .owner-content .owner-background-shapes {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  z-index: -1;
}

.section-you-owner .owner-container .owner-content .owner-background-shapes .shape-1 {
  position: absolute;
  top: 10%;
  left: 5%;
  width: 180px;
  height: 180px;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.08), rgba(237, 115, 38, 0.1));
  border-radius: 50%;
  animation: float 6s ease-in-out infinite;
  filter: blur(1px);
}

.section-you-owner .owner-container .owner-content .owner-background-shapes .shape-2 {
  position: absolute;
  bottom: 20%;
  right: 10%;
  width: 120px;
  height: 120px;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.05), rgba(237, 115, 38, 0.08));
  border-radius: 25px;
  transform: rotate(45deg);
  animation: float 8s ease-in-out infinite reverse;
  filter: blur(0.5px);
}

.section-you-owner .owner-container .owner-content .owner-background-shapes .shape-3 {
  position: absolute;
  top: 60%;
  left: 20%;
  width: 100px;
  height: 100px;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0.06), rgba(237, 115, 38, 0.09));
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  animation: float 7s ease-in-out infinite;
  filter: blur(0.8px);
}

@keyframes float {
  0%, 100% { transform: translateY(0px) scale(1); }
  50% { transform: translateY(-25px) scale(1.05); }
}

/* owner Text Content */
.section-you-owner .owner-container .owner-content .owner-text-content {
  padding-right: 2rem;
  animation: slideInLeft 1s ease-out;
}

@keyframes slideInLeft {
  0% { 
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* owner Header */
.section-you-owner .owner-container .owner-content .owner-text-content .owner-header {
  margin-bottom: 2rem;
}

.section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-title {
  font-size: 3rem;
  font-weight: 800;
  color: var(--white);
  margin-bottom: 1.5rem;
  line-height: 1.1;
  position: relative;
  background: linear-gradient(135deg, #fff 0%, #f0f0f0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}


.section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-subtitle {
  font-size: 1.2rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.7;
  margin: 0;
  text-align: justify;
  max-width: 550px;
  font-weight: 400;
  letter-spacing: 0.3px;
}

/* CTA Button */
.owner-cta {
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}

.owner-cta .owner-button {
  /* background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%); */
  color: #ed7326;
  padding: 15px 30px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  border: 2px solid #ed7326;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  gap: 8px;
  display: inline-flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  /* box-shadow: 0 4px 15px rgba(237, 115, 38, 0.2); */
}

.owner-cta .owner-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transition: left 0.6s ease;
}

.owner-cta .owner-button:hover::before {
  left: 100%;
}

.owner-cta .owner-button:hover {
  background: linear-gradient(135deg, #ed7326 0%, #ff8c42 100%);
  color: #fff;
  /* transform: translateY(-3px) scale(1.05); */
  box-shadow: 0 8px 25px rgba(237, 115, 38, 0.4);
  border-color: #ff8c42;
}

.owner-cta .owner-button i {
  transition: transform 0.3s ease;
}

.owner-cta .owner-button:hover i {
  transform: translateX(5px);
}

/* owner Visual Content */
.section-you-owner .owner-container .owner-content .owner-visual-content {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  animation: slideInRight 1s ease-out;
}

@keyframes slideInRight {
  0% { 
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container {
  position: relative;
  max-width: 550px;
  width: 100%;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup {
  position: relative;
  border-radius: 25px;
  overflow: hidden;
  box-shadow: 
    0 25px 60px rgba(0, 0, 0, 0.4),
    0 15px 30px rgba(237, 115, 38, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  /* transform: perspective(1200px) rotateY(-8deg) rotateX(3deg); */
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(145deg, transparent 40%, rgba(237, 115, 38, 0.1) 100%);
  pointer-events: none;
  z-index: 1;
}



/* Enhanced Image Styling with Fixed Dimensions */
.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup .owner-image {
  width: 100%;
  height: 400px; /* Fixed height */
  max-width: 550px; /* Fixed max width */
  min-height: 350px; /* Minimum height for consistency */
  object-fit: cover;
  object-position: center;
  display: block;
  transition: all 0.5s ease;
  border-radius: 20px;
  position: relative;
  z-index: 2;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup:hover .owner-image {
  transform: scale(1.02);
  filter: brightness(1.1) contrast(1.05);
}

/* Additional Visual Enhancements */
.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container::before {
  content: '';
  position: absolute;
  top: -20px;
  left: -20px;
  right: -20px;
  bottom: -20px;
  background: linear-gradient(45deg, 
    rgba(237, 115, 38, 0.1) 0%, 
    transparent 25%, 
    transparent 75%, 
    rgba(237, 115, 38, 0.1) 100%);
  border-radius: 35px;
  animation: glow 4s ease-in-out infinite alternate;
  z-index: -1;
}

@keyframes glow {
  0% { opacity: 0.3; transform: scale(0.98); }
  100% { opacity: 0.8; transform: scale(1.02); }
}

/* Floating Elements for Enhanced Visual Appeal */
.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  z-index: 3;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element {
  position: absolute;
  background: rgba(255, 255, 255, 0.95);
  color: #333;
  padding: 0.8rem 1.2rem;
  border-radius: 15px;
  font-size: 0.85rem;
  font-weight: 600;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  /* animation: floatElements 3s ease-in-out infinite; */
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(1) {
  top: 15%;
  right: -10%;
  animation-delay: 0s;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(2) {
  bottom: 20%;
  left: -15%;
  animation-delay: 1s;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(3) {
  top: 50%;
  right: -20%;
  animation-delay: 2s;
}

@keyframes floatElements {
  0%, 100% { 
    transform: translateY(0px) scale(1);
    opacity: 0.9;
  }
  50% { 
    transform: translateY(-15px) scale(1.05);
    opacity: 1;
  }
}

/* Enhanced Typography */
.section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-title {
  font-size: 3rem;
  font-weight: 900;
  margin-bottom: 1.5rem;
  line-height: 1.1;
  position: relative;
  background: linear-gradient(135deg, #fff 0%, #f0f0f0 50%, #e0e0e0 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  letter-spacing: -1px;
}



@keyframes underlineGlow {
  0% { box-shadow: 0 3px 10px rgba(237, 115, 38, 0.5); }
  100% { box-shadow: 0 5px 20px rgba(237, 115, 38, 0.8); }
}

/* Responsive Design */
@media (max-width: 992px) {
  .section-you-owner .owner-container .owner-content {
    grid-template-columns: 1fr;
    gap: 3rem;
    text-align: center;
  }
  
  .section-you-owner .owner-container .owner-content .owner-text-content {
    padding-right: 0;
    order: 2;
  }
  
  .section-you-owner .owner-container .owner-content .owner-visual-content {
    order: 1;
  }
  
  .section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-title {
    font-size: 3rem;
  }

  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup .owner-image {
    height: 350px;
    min-height: 300px;
  }
}

@media (max-width: 768px) {
  .section-you-owner {
    padding: 4rem 0;
  }
  
  .section-you-owner .owner-container {
    padding: 0 1rem;
  }
  
  .section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-title {
    font-size: 2.5rem;
  }
  
  .section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-subtitle {
    text-align: center;
    font-size: 1.1rem;
  }

  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup .owner-image {
    height: 300px;
    min-height: 250px;
    max-width: 100%;
  }
  
  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element {
    font-size: 0.75rem;
    padding: 0.6rem 1rem;
  }
  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(1) {
    top: 15%;
    right: -2%;
    animation-delay: 0s;
  }
  
  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(2) {
    bottom: 20%;
    left: 0;
    animation-delay: 1s;
  }
  
  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-floating-elements .floating-element:nth-child(3) {
    top: 50%;
    right: -2%;
    animation-delay: 2s;
  }
}

@media (max-width: 576px) {
  .section-you-owner .owner-container .owner-content .owner-text-content .owner-header .owner-title {
    font-size: 2rem;
    letter-spacing: -0.5px;
  }

  .section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup .owner-image {
    height: 250px;
    min-height: 200px;
  }

  .owner-cta .owner-button {
    padding: 12px 24px;
    font-size: 0.9rem;
  }
}

/* Additional Enhancement: Parallax Effect */
.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container {
  transform-style: preserve-3d;
}

.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container:hover {
  transform: translateZ(20px);
}

/* Loading Animation */
.section-you-owner .owner-container .owner-content .owner-visual-content .owner-image-container .owner-mockup .owner-image {
  opacity: 0;
  animation: fadeInImage 1.5s ease-out 0.5s forwards;
}

@keyframes fadeInImage {
  0% { 
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}



/* cards and newsletter */

    .New-card-event-results-section {
      padding: 10px 0;
  }

  .New-card-event-results-container {
      max-width: 1400px;
      margin: 30px auto;
  }

  .New-card-event-results-header {
      margin-bottom: 30px;
  }

  .New-card-event-results-header-content {
      display: flex;
      justify-content: center;
      align-items: flex-start;
      gap: 20px;
  }

  .New-card-event-results-controls {
      display: flex;
      align-items: center;
      gap: 20px;
      flex-shrink: 0;
  }

  .New-card-event-results-count {
      color: #666;
      font-size: 14px;
      background: #f8f9fa;
      padding: 8px 16px;
      border-radius: 20px;
      border: 1px solid #e0e0e0;
      white-space: nowrap;
  }

  .New-card-event-results-title {
      font-size: 2.5rem;
      font-weight: 600;
      color: #064554;
      margin: 5px;
  }

  .New-card-event-results-subtitle {
      color: #666;
      font-size: 16px;
  }

  .New-card-event-cards-container {
      position: relative;
  }

  .New-card-event-cards-grid {
      display: grid;
      /* justify-content: center; */
      align-items: center;
      grid-template-columns: repeat(4, 1fr);
      gap: 15px;
    
  }

  .New-card-event-cards-grid.slider-view-top {
      display: flex;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      scroll-behavior: smooth;
      /* gap: 15px; */
      padding-bottom: 20px;
      padding-top: 10px;

  }

  .New-card-event-cards-grid.slider-view-top::-webkit-scrollbar {
      height: 8px;
  }

  .New-card-event-cards-grid.slider-view-top::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 8px;
  }

  .New-card-event-cards-grid.slider-view-top::-webkit-scrollbar-thumb {
      background: #ed7326;
      border-radius: 8px;
  }

  .New-card-event-cards-grid.slider-view-top .New-card-event-card {
      flex: 0 0 320px;
      scroll-snap-align: start;
  }

  .New-card-event-cards-grid.slider-view-top .New-card-event-card:last-child {
      margin-right: 0;
  }

  .New-card-event-card {
      background: white;
      border-radius: 16px;
      padding: 0;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
      transition: all 0.3s ease;
      border: 1px solid #f0f0f0;
      overflow: hidden;
      position: relative;
  }

  .New-card-event-card:hover {
      /* transform: translateY(-2px); */
      box-shadow: 0 8px 35px rgba(237, 115, 38, 0.15);
      border-color: #ed7326;
  }

  /* .New-card-event-card:hover .New-card-event-card-image {
      transform: scale(1.05);
  } */

  .New-card-event-card-image {
      transition: transform 0.3s ease;
      position: relative;
  }

  .New-card-event-favorite-btn {
      position: absolute;
      top: 12px;
      right: 12px;
      background: rgba(255, 255, 255, 0.9);
      border: none;
      border-radius: 50%;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.3s ease;
      z-index: 10;
  }
  .New-card-event-favorite-btn i {
      font-size: 18px;
      color: #ed7326;
      transition: all 0.3s ease;
  }
  .New-card-event-favorite-btn:hover {
      transform: scale(1.1);
  }
  .New-card-event-cards-grid.slider-view-top .New-card-event-card:hover {
      transform: translateY(-3px) scale(1.02);
  }

  .New-card-event-card-image {
      width: 100%;
      height: 200px;
      /* object-fit: cover; */
      border-radius: 0;
  }

  .New-card-event-card-content {
      padding: 10px;
  }

  .New-card-event-card-header {
      display: flex;
      flex-direction: column;
  }

  .New-card-event-card-title {
      font-size: 18px;
      font-weight: 700;
      color: #333;
      line-height: 1.3;
      flex: 1;
      margin: 5px 0px;
  }

  .New-card-event-card-category {
      margin-top: 5px;
      background: #9e9e9e40;
      color: #333;
      padding: 4px 10px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 500;
      text-transform: uppercase;
      /* letter-spacing: 0.5px; */
      width: fit-content;
  }

  .New-card-event-card-description {
      color: #666;
      font-size: 14px; 
      line-height: 1.4;
      margin-top: 1rem;
      font-weight: 400;
  }

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

  .New-card-event-card-details {

      display: flex;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 10px;
  }

  .New-card-event-card-detail {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
  }

  .New-card-event-card-detail-icon {
      color: #ed7326;
      font-size: 16px;
  }

  .New-card-event-card-detail-label {
      color: #999;
      font-weight: 500;
  }

  .New-card-event-card-detail-value {
      color: #333;
      font-weight: 600;
  }

  .New-card-event-card-footer {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px 20px;
      border-top: 1px solid #d6d6d639;
      background: #d6d6d643;
  }

  .New-card-event-card-price {
      display: flex;
      align-items: center;
      gap: 5px;
  }
  .button-card-event {
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 20px;
  }
  .New-card-event-details-btn {
      background: #ed7326;
      color: white;
      border: none;
      padding: 7px 10px;
      border-radius: 8px;
      font-size: 12px;
      font-weight: 400;
      cursor: pointer;
      transition: all 0.3s ease;
      text-decoration: none;
      display: inline-block;
  }

  .New-card-event-details-btn:hover {
      background: #d65a1b;
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(237, 115, 38, 0.3);
  }
  .button-card-event .New-card-event-details-btn {
    margin-top: 10px;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 300;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    border-radius: 8px;
    background: #fff;
    color: #ed7326;
    border: 1px solid #ed7326;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
  }
  .button-card-event .New-card-event-details-btn:hover {
    background: #ed7326;
    color: white;
    border: none;
    box-shadow: 0 4px 12px rgba(237, 115, 38, 0.3);
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-block;
  }
  /* Pagination Styles */
  .New-card-event-pagination {
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 40px;
      padding: 20px;
      gap: 10px;
  }

  .New-card-event-pagination-btn {
      background: white;
      border: 2px solid #e0e0e0;
      color: #666;
      padding: 10px 15px;
      border-radius: 8px;
      cursor: pointer;
      transition: all 0.3s ease;
      font-size: 14px;
      font-weight: 500;
      min-width: 40px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
  }

  .New-card-event-pagination-btn:hover {
      border-color: #ed7326;
      color: #ed7326;
      transform: translateY(-2px);
  }

  .New-card-event-pagination-btn.active {
      background: #ed7326;
      border-color: #ed7326;
      color: white;
  }

  .New-card-event-pagination-btn.disabled {
      background: #f5f5f5;
      border-color: #e0e0e0;
      color: #ccc;
      cursor: not-allowed;
      transform: none;
  }

  .New-card-event-pagination-btn.disabled:hover {
      background: #f5f5f5;
      border-color: #e0e0e0;
      color: #ccc;
      transform: none;
  }

  .New-card-event-pagination-dots {
      color: #999;
      font-size: 16px;
      padding: 0 5px;
  }

  .New-card-event-card-price-amount {
      font-size: 20px;
      font-weight: 700;
      color: #ed7326;
  }

  .New-card-event-card-price-currency {
      font-size: 14px;
      color: #999;
  }

  /* Enhanced Responsive Design */

  /* Large Desktop (1440px and above) */
  @media (min-width: 1440px) {
      .New-card-event-main-container {
          font-size: 16px;
      }

      .New-card-event-search-container {
          max-width: 700px;
      }

      .New-card-event-cards-grid {
          grid-template-columns: repeat(4, 1fr);
          gap: 15px;
      }

      .New-card-event-categories-container {
          max-width: 1200px;
      }
  }

  /* iPad Pro and Large Tablets (1024px - 1439px) */
  @media (max-width: 1439px) and (min-width: 1025px) {
      .New-card-event-cards-grid {
          grid-template-columns: repeat(3, 1fr);
          gap: 15px;
      }

      .New-card-event-search-container {
          max-width: 650px;
      }
  }

  /* iPad and Large Tablets (769px - 1024px) */
  @media (max-width: 1024px) and (min-width: 769px) {
      .New-card-event-main-container {
          font-size: 15px;
      }

      .New-card-event-header-wrapper {
          padding: 30px 20px 45px;
      }

      .New-card-event-search-container {
          max-width: 550px;
          padding: 0 20px;
      }

      .New-card-event-search-input {
          padding: 16px 20px 16px 50px;
          font-size: 16px;
          min-height: 56px;
          border-radius: 28px;
      }

      .New-card-event-search-icon {
          left: 22px;
          font-size: 18px;
      }

      .New-card-event-categories-container {
          padding: 0 20px;
      }

      .New-card-event-categories-row {
          gap: 16px;
          padding: 0 10px;
          width: 100%;
          max-width: 100%;
          justify-content: space-between;
      }

      .New-card-event-category-item {
          min-width: 100px;
          max-width: 120px;
          padding: 16px 12px;
          flex: 1;
      }

      .New-card-event-category-icon {
          width: 46px;
          height: 46px;
      }

      .New-card-event-category-label {
          font-size: 13px;
      }

      .New-card-event-filters-section {
          padding: 10px 5px;
      }

      .New-card-event-filters-row {
          grid-template-columns: repeat(2, 1fr);
          gap: 18px;
      }

      .New-card-event-filter-select {
          min-height: 48px;
          font-size: 15px;
          padding: 12px 40px 12px 16px;
      }

      .New-card-event-cards-grid {
          grid-template-columns: repeat(2, 1fr);
          gap: 18px;
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card {
          flex: 0 0 340px;
      }

      .New-card-event-results-header-content {
          gap: 18px;
          flex-direction: row;
          align-items: center;
      }

      .New-card-event-results-controls {
          gap: 15px;
      }

      .New-card-event-results-count {
          font-size: 14px;
          padding: 8px 16px;
      }

      .New-card-event-toggle-btn {
          min-height: 44px;
          padding: 10px 16px;
          font-size: 13px;
      }

      .New-card-event-card-title {
          font-size: 17px;
      }

      .New-card-event-card-description {
          font-size: 14px;
      }

      .New-card-event-card-footer {
          padding: 14px 18px;
      }

      .New-card-event-pagination {
          gap: 8px;
          padding: 18px;
      }

      .New-card-event-pagination-btn {
          min-width: 40px;
          min-height: 40px;
          padding: 10px 14px;
          font-size: 14px;
      }
  }

  /* Small Tablets and Large Phones (481px - 768px) */
  @media (max-width: 768px) and (min-width: 481px) {
      .New-card-event-main-container {
          font-size: 14px;
      }

      .New-card-event-header-wrapper {
          padding: 25px 15px 40px;
      }

      .New-card-event-search-container {
          padding: 0 15px;
          margin: 0 auto 20px;
          max-width: 400px;
      }

      .New-card-event-search-input {
          padding: 14px 16px 14px 42px;
          font-size: 15px;
          min-height: 50px;
          border-radius: 25px;
      }

      .New-card-event-search-icon {
          left: 18px;
          font-size: 16px;
      }

      .New-card-event-categories-container {
          padding: 0 15px;
      }

      .New-card-event-categories-row {
          gap: 12px;
          padding: 0 8px;
          width: 100%;
          max-width: 100%;
          overflow-x: auto;
          scroll-snap-type: x mandatory;
      }

      .New-card-event-category-item {
          min-width: 85px;
          max-width: 100px;
          padding: 14px 10px;
          flex: 0 0 auto;
          scroll-snap-align: start;
          touch-action: manipulation;
      }

      .New-card-event-category-icon {
          width: 42px;
          height: 42px;
      }

      .New-card-event-category-label {
          font-size: 12px;
      }

      .New-card-event-slider-controls {
          margin-top: 12px;
      }

      .New-card-event-slider-btn {
          width: 40px;
          height: 40px;
          font-size: 16px;
          touch-action: manipulation;
      }

      .New-card-event-filters-row {
          grid-template-columns: 1fr;
          gap: 12px;
      }

      .New-card-event-filter-select {
          min-height: 44px;
          font-size: 14px;
          padding: 11px 36px 11px 12px;
      }

      .New-card-event-cards-grid {
          grid-template-columns: 1fr;
          gap: 12px;
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card {
          flex: 0 0 320px;
      }

      .New-card-event-results-header-content {
          flex-direction: column;
          gap: 12px;
          text-align: center;
      }

      .New-card-event-results-controls {
          align-self: stretch;
          gap: 12px;
          justify-content: center;
      }

      .New-card-event-results-count {
          font-size: 12px;
          padding: 6px 12px;
      }

      .New-card-event-toggle-btn {
          min-height: 40px;
          padding: 8px 12px;
          touch-action: manipulation;
          font-size: 11px;
      }

      .New-card-event-card-title {
        font-size: 1.4rem;
      }

      .New-card-event-card-description {
          font-size: 13px;
      }

      .New-card-event-card-footer {
          padding: 10px 15px;
      }

      .New-card-event-pagination {
          flex-wrap: wrap;
          gap: 5px;
          padding: 12px;
      }

      .New-card-event-pagination-btn {
          min-width: 36px;
          min-height: 36px;
          padding: 8px 10px;
          font-size: 12px;
      }

      .New-card-event-categories-header {
          flex-direction: column;
          gap: 15px;
          align-items: center;
          text-align: center;
      }

      .New-card-event-category-count {
          font-size: 13px;
          padding: 7px 14px;
      }

      .New-card-event-slider-indicators {
          margin-top: 12px;
      }

      .New-card-event-categories-slider.grid-view
          .New-card-event-categories-row {
          grid-template-columns: repeat(auto-fit, minmax(95px, 1fr));
          gap: 12px;
      }

      .New-card-event-actions-row {
          flex-direction: column;
          align-items: stretch;
          gap: 12px;
      }

      .New-card-event-action-button {
          justify-content: center;
          min-height: 46px;
          padding: 12px 18px;
          font-size: 14px;
          touch-action: manipulation;
      }

      .New-card-event-details-btn {
          padding: 9px 18px;
          touch-action: manipulation;
      }

      .New-card-event-favorite-btn {
          width: 36px;
          height: 36px;
          top: 10px;
          right: 10px;
      }

      .New-card-event-favorite-icon {
          font-size: 16px;
      }

      .New-card-event-results-title {
          font-size: 26px;
      }

      .New-card-event-results-subtitle {
          font-size: 15px;
      }
  }

  /* Mobile Phones (up to 480px) */
  @media (max-width: 480px) {
      .New-card-event-main-container {
          font-size: 14px;
      }

      .New-card-event-header-wrapper {
          padding: 25px 5px;
      }

      .New-card-event-search-container {
          padding: 0 12px;
          margin: 0 auto 18px;
          max-width: none;
      }

      .New-card-event-search-input {
          padding: 14px 12px 14px 38px;
          font-size: 16px;
          min-height: 48px;
          border-radius: 24px;
          border-width: 1px;
      }

      .New-card-event-search-icon {
          font-size: 16px;
          left: 20px;
      }

      .New-card-event-categories-container {
          padding: 0 12px;
      }

      .New-card-event-category-title {
          font-size: 16px;
          margin-bottom: 12px;
      }

      .New-card-event-categories-header {
          flex-direction: column;
          gap: 12px;
          align-items: center;
          text-align: center;
      }

      .New-card-event-category-item {
          min-width: 85px;
          padding: 12px 6px;
          border-radius: 12px;
          -webkit-tap-highlight-color: transparent;
          -webkit-user-select: none;
          user-select: none;
          touch-action: manipulation;
      }

      .New-card-event-category-item:active {
          transform: scale(0.95);
      }

      .New-card-event-category-item.selected:active {
          transform: translateY(-1px) scale(0.98);
      }

      .New-card-event-category-icon {
          width: 38px;
          height: 38px;
          border-radius: 10px;
          margin-bottom: 6px;
      }

      .New-card-event-category-icon img {
          width: 20px;
          height: 20px;
      }

      .New-card-event-category-label {
          font-size: 11px;
          line-height: 1.2;
      }

      .New-card-event-slider-btn {
          width: 38px;
          height: 38px;
          font-size: 15px;
      }

      .New-card-event-slider-controls {
          margin-top: 12px;
      }

      .New-card-event-slider-indicators {
          margin-top: 8px;
      }

      .New-card-event-slider-indicator {
          width: 6px;
          height: 6px;
      }

      .New-card-event-filters-row {
          grid-template-columns: 1fr;
          gap: 12px;
      }

      .New-card-event-filter-select {
          min-height: 44px;
          font-size: 15px;
          padding: 11px 35px 11px 12px;
          border-radius: 6px;
      }

      .New-card-event-select-arrow {
          right: 10px;
          margin-top: 10px;
      }

      .New-card-event-filter-label {
          font-size: 13px;
          margin-bottom: 6px;
      }

      .New-card-event-results-section {
          padding: 8px 0;
      }

      .New-card-event-results-container {
          padding: 0 2px;
      }

      .New-card-event-results-title {
          font-size: 22px;
          margin: 3px 0;
      }

      .New-card-event-results-subtitle {
          font-size: 14px;
          margin: 3px 0;
      }

      .New-card-event-results-header-content {
          gap: 12px;
          flex-direction: column;
          align-items: center;
          text-align: center;
      }

      .New-card-event-results-controls {
          /* flex-direction: column; */
          gap: 10px;
          align-items: center;
      }

      .New-card-event-results-count {
          font-size: 12px;
          padding: 6px 12px;
      }

      .New-card-event-view-toggle {
          width: 100%;
          justify-content: center;
          max-width: 200px;
      }

      .New-card-event-toggle-btn {
          min-height: 38px;
          padding: 8px 12px;
          font-size: 12px;
          flex: 1;
      }

      .New-card-event-cards-grid {
          grid-template-columns: 1fr;
          gap: 15px;
          padding: 0 10px;
      }

      .New-card-event-cards-grid.slider-view-top {
          /* gap: 15px; */
          padding-bottom: 15px;
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card {
          flex: 0 0 320px;
          margin-right: 0;
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card:last-child {
          margin-right: 0;
      }

      .New-card-event-card {
          border-radius: 12px;
      }
      .New-card-event-card:hover {
          transform: translateY(-1px);
      }
      .New-card-event-card-content {
          padding: 12px;
      }

      .New-card-event-card-title {
        font-size: 1.4rem;
          margin: 4px 0;
      }

      .New-card-event-card-description {
          font-size: 13px;
          margin-bottom: 8px;
          line-height: 1.3;
      }

      .New-card-event-card-category {
          font-size: 11px;
          padding: 3px 10px;
      }

      .New-card-event-card-details {
          gap: 12px;
          margin-bottom: 8px;
      }

      .New-card-event-card-detail {
          font-size: 13px;
          gap: 6px;
      }

      .New-card-event-card-footer {
          /* flex-direction: column; */
          gap: 8px;
          text-align: center;
          padding: 12px 15px;
      }

      .New-card-event-card-price-amount {
          font-size: 18px;
      }

      .New-card-event-details-btn {
          /* width: 100%; */
          padding: 10px 16px;
          font-size: 13px;
          border-radius: 6px;
      }

      .New-card-event-favorite-btn {
          width: 34px;
          height: 34px;
          top: 8px;
          right: 8px;
      }

      .New-card-event-favorite-icon {
          font-size: 15px;
      }

      .New-card-event-actions-row {
          flex-direction: column;
          align-items: stretch;
          gap: 10px;
      }

      .New-card-event-action-button {
          min-height: 44px;
          padding: 12px 16px;
          font-size: 14px;
          border-radius: 6px;
          justify-content: center;
      }

      .New-card-event-pagination {
          flex-wrap: wrap;
          gap: 4px;
          padding: 12px;
          margin-top: 25px;
      }

      .New-card-event-pagination-btn {
          min-width: 36px;
          min-height: 36px;
          padding: 8px 10px;
          font-size: 12px;
          border-radius: 6px;
      }

      .New-card-event-pagination-dots {
          font-size: 14px;
      }

      .New-card-event-cards-controls {
          margin-top: 15px;
      }

      .New-card-event-cards-indicators {
          margin-top: 10px;
      }

      .New-card-event-categories-slider.grid-view
          .New-card-event-categories-row {
          grid-template-columns: repeat(auto-fit, minmax(85px, 1fr));
          gap: 10px;
      }
  }

  /* Extra Small Devices (320px - 360px) */
  @media (max-width: 360px) {
      .New-card-event-search-container {
          padding: 0 8px;
      }

      .New-card-event-search-input {
          padding: 12px 10px 12px 35px;
          min-height: 44px;
          font-size: 15px;
      }

      .New-card-event-search-icon {
          font-size: 15px;
          left: 15px;
      }

      .New-card-event-categories-container {
          padding: 0 8px;
      }

      .New-card-event-category-item {
          min-width: 75px;
          padding: 10px 4px;
          -webkit-tap-highlight-color: transparent;
          -webkit-user-select: none;
          user-select: none;
          touch-action: manipulation;
      }

      .New-card-event-category-item:active {
          transform: scale(0.95);
      }

      .New-card-event-category-item.selected:active {
          transform: translateY(-1px) scale(0.98);
      }

      .New-card-event-category-icon {
          width: 35px;
          height: 35px;
      }

      .New-card-event-category-icon img {
          width: 18px;
          height: 18px;
      }

      .New-card-event-category-label {
          font-size: 10px;
      }

      .New-card-event-results-container,
      .New-card-event-filters-container {
          padding: 0 4px;
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card {
          flex: 0 0 310px;
          /* margin-right: 15px; */
      }

      .New-card-event-cards-grid.slider-view-top .New-card-event-card:last-child {
          margin-right: 0;
      }

      .New-card-event-card-title {
          font-size: 1.4rem;
      }

      .New-card-event-results-title {
          font-size: 20px;
      }
  }

  /* Landscape Orientation for Mobile */
  @media (max-height: 500px) and (orientation: landscape) {
      .New-card-event-header-wrapper {
          padding: 15px 5px;
      }

      .New-card-event-category-item {
          padding: 12px 8px;
      }

      .New-card-event-category-icon {
          width: 35px;
          height: 35px;
          margin-bottom: 4px;
      }

      .New-card-event-slider-controls {
          margin-top: 10px;
      }
  }

  /* High DPI / Retina Displays */
  @media (-webkit-min-device-pixel-ratio: 2),
      (min-resolution: 192dpi) {
      .New-card-event-category-icon img {
          image-rendering: -webkit-optimize-contrast;
          image-rendering: -webkit-crisp-edges;
          image-rendering: pixelated;
          image-rendering: crisp-edges;
      }
  }

  /* Print Styles */
  @media print {
      .New-card-event-slider-controls,
      .New-card-event-slider-indicators,
      .New-card-event-cards-controls,
      .New-card-event-cards-indicators,
      .New-card-event-pagination {
          display: none !important;
      }

      .New-card-event-cards-grid {
          grid-template-columns: repeat(2, 1fr) !important;
      }

      .New-card-event-card {
          break-inside: avoid;
          page-break-inside: avoid;
      }
  }
/* end cards events */
  /* Newsletter Subscription Section */
  .newsletter-section-new {
      position: relative;
      overflow: hidden;
  }

  .newsletter-container-new {
      max-width: 1400px;
      margin: 30px auto;
      position: relative;
      z-index: 2;
  }

  .newsletter-content-new {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 60px;
      align-items: center;
      background: rgba(230, 230, 230, 0.453);
      border-radius: 20px;
      padding: 60px;
      backdrop-filter: blur(10px);
  }

  .newsletter-text-new {
      color: #333;
  }

  .newsletter-title-new {
      font-size: 2.5rem;
      font-weight: 700;
      color: #2c3e50;
      margin-bottom: 20px;
      line-height: 1.2;
  }

  .newsletter-description-new {
      font-size: 1.1rem;
      color: #6c757d;
      margin-bottom: 30px;
      line-height: 1.6;
  }

  .newsletter-features-new {
      display: flex;
      flex-direction: column;
      gap: 15px;
  }

  .newsletter-feature-new {
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 1rem;
      color: #495057;
  }

  .newsletter-feature-new i {
      color: #ed7326;
      font-size: 1.2rem;
      width: 20px;
  }

  .newsletter-form-container-new {
      display: flex;
      flex-direction: column;
      justify-content: center;
  }

  .newsletter-form-new {
      width: 100%;
  }

  .newsletter-input-group-new {
      display: flex;
      flex-direction: column;
      gap: 15px;
      margin-bottom: 20px;
  }

  .newsletter-input-wrapper-new {
      position: relative;
      display: flex;
      align-items: center;
  }

  .newsletter-input-icon-new {
      position: absolute;
      left: 20px;
      color: #6c757d;
      font-size: 1.1rem;
      z-index: 2;
  }

  .newsletter-input-new {
      width: 100%;
      padding: 18px 20px 18px 55px;
      border: 2px solid #e9ecef;
      border-radius: 12px;
      font-size: 1rem;
      background: #fff;
      transition: all 0.3s ease;
      outline: none;
  }

  .newsletter-input-new:focus {
      border-color: #ed7326;
      box-shadow: 0 0 0 3px rgba(237, 115, 38, 0.1);
  }

  .newsletter-input-new::placeholder {
      color: #adb5bd;
  }

  .newsletter-btn-new {
      background: linear-gradient(135deg, #ed7326 0%, #f39c12 100%);
      color: white;
      border: none;
      padding: 18px 30px;
      border-radius: 12px;
      font-size: 1.1rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      box-shadow: 0 4px 15px rgba(237, 115, 38, 0.3);
  }

  .newsletter-btn-new:hover {
      background: linear-gradient(135deg, #d65a1b 0%, #e67e22 100%);
      transform: translateY(-2px);
      box-shadow: 0 8px 25px rgba(237, 115, 38, 0.4);
  }

  .newsletter-btn-new:active {
      transform: translateY(0);
  }

  .newsletter-btn-icon-new {
      transition: transform 0.3s ease;
  }

  .newsletter-btn-new:hover .newsletter-btn-icon-new {
      transform: translateX(3px);
  }

  .newsletter-privacy-new {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 0.9rem;
      color: #6c757d;
      justify-content: center;
  }

  .newsletter-privacy-new i {
      color: #ed7326;
  }

  /* Responsive Design for Newsletter */
  @media (max-width: 768px) {
      .newsletter-container-new {
          padding: 0 15px;
      }

      .newsletter-content-new {
          grid-template-columns: 1fr;
          gap: 40px;
          padding: 40px 30px;
      }

      .newsletter-title-new {
          font-size: 2rem;
      }

      .newsletter-description-new {
          font-size: 1rem;
      }

      .newsletter-input-group-new {
          gap: 15px;
      }

      .newsletter-input-new {
          padding: 16px 18px 16px 50px;
      }

      .newsletter-btn-new {
          padding: 16px 25px;
          font-size: 1rem;
      }
  }

  @media (max-width: 480px) {
      .newsletter-content-new {
          padding: 30px 20px;
      }

      .newsletter-title-new {
          font-size: 1.5rem;
      }

      .newsletter-description-new {
          font-size: 0.95rem;
          margin-bottom: 20px;
      }

      .newsletter-input-new {
          padding: 14px 16px 14px 45px;
          font-size: 0.95rem;
      }

      .newsletter-input-icon-new {
          left: 16px;
          font-size: 1rem;
      }

      .newsletter-btn-new {
          padding: 14px 20px;
          font-size: 0.95rem;
      }

      .newsletter-features-new {
          gap: 12px;
      }

      .newsletter-feature-new {
          font-size: 0.9rem;
      }
  }

  /* new-counter-section */

  /* Main Counter Section */
  .New-counter-section {
    padding: 40px 10px;
    position: relative;
    overflow: hidden;
}

/* Container */
.New-counter-section .container {
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* Header Section */
.New-counter-section .container .header , .New-card-event-results-container .header , .categories-container-event .header, .trusted-section .header ,.categories-container-event .header , .exclusive .header {
    text-align: center;
    margin-bottom: 10px;
}

.New-counter-section .container .header .subtitle-badge {
    display: inline-block;
    background: #4f46e5;
    color: white;
    padding: 8px 24px;
    border-radius: 25px;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 16px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.New-counter-section .container .header .title , .New-card-event-results-container .header .title , .categories-container-event .header .title , .trusted-section .header .title ,.categories-container-event .header .title , .exclusive .header .title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 15px;
    position: relative;
    line-height: 1.2;
}

.New-counter-section .container .header .title::after ,.New-card-event-results-container .header .title::after , .categories-container-event .header .title::after , .trusted-section .header .title::after ,.categories-container-event .header .title::after , .exclusive .header .title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #ed7326, #f56500);
    border-radius: 2px;
}

.New-counter-section .container .header .subtitle , .New-card-event-results-container .header .subtitle , .trusted-section .header .subtitle ,.categories-container-event .header .subtitle , .exclusive .header .subtitle {
    font-size: 1.2rem;
    color: #718096;
    font-weight: 400;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Counters Grid */
.New-counter-section .container .counters-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

/* Individual Counter Item */
.New-counter-section .container .counters-grid .counter-item {
    text-align: center;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    padding:  10px;
    border-radius: 16px;
}

/* Counter Icon */
.New-counter-section .container .counters-grid .counter-item .counter-icon {
    width: 60px;
    height: 60px;
    border-radius: 10%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
    font-size: 1.5rem;
    color: white;
    transition: all 0.3s ease;
    position: relative;
}

.New-counter-section .container .counters-grid .counter-item .counter-icon.green {
  background: linear-gradient(135deg, #3edca896, #007a5485);

}

.New-counter-section .container .counters-grid .counter-item .counter-icon.red {
  background: linear-gradient(135deg, #ef44448a, #dc2626c2);
}

.New-counter-section .container .counters-grid .counter-item .counter-icon.purple {
    background: linear-gradient(135deg, #8b5cf68a, #7c3aedc2);
}

.New-counter-section .container .counters-grid .counter-item .counter-icon.blue {
    background: linear-gradient(135deg, #3b82f68a, #2563ebc2);
}



/* Counter Number */
.New-counter-section .container .counters-grid .counter-item .counter-number {
    font-size: 2rem;
    font-weight: 800;
    color: #1f2937;
    margin-bottom: 15px;
    display: block;
    line-height: 1;
    background: linear-gradient(135deg, #10b9818a, #059669c2);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.New-counter-section .container .counters-grid .counter-item:nth-child(1) .counter-number {
    background: linear-gradient(135deg, #0bf5a7, #01d593);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.New-counter-section .container .counters-grid .counter-item:nth-child(2) .counter-number {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.New-counter-section .container .counters-grid .counter-item:nth-child(3) .counter-number {
    background: linear-gradient(135deg, #8b5cf6, #7c3aed);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

.New-counter-section .container .counters-grid .counter-item:nth-child(4) .counter-number {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
}

/* Counter Label */
.New-counter-section .container .counters-grid .counter-item .counter-label {
    font-size: 0.95rem;
    color: #6b7280;
    font-weight: 500;
    margin-bottom: 2px;
    line-height: 1.3;
}

/* Counter Description */
.New-counter-section .container .counters-grid .counter-item .counter-description {
    font-size: 0.9rem;
    color: #718096;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .New-counter-section .container .counters-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
}

@media (max-width: 1024px) {
    .New-counter-section .container .header .title , .New-card-event-results-container .header .title , .categories-container-event .header .title , .trusted-section .header .title ,.categories-container-event .header .title , .exclusive .header .title {
        font-size: 2.4rem;
    }

    .New-counter-section .container .counters-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .New-counter-section .container .counters-grid .counter-item {
        padding: 35px 25px;
    }
}

@media (max-width: 768px) {
    .New-counter-section {
        padding: 40px 10px;
    }

    .New-counter-section .container .header .title , .New-card-event-results-container .header .title , .categories-container-event .header .title , .trusted-section .header .title ,.categories-container-event .header .title {
        font-size: 2rem;
    }

    .New-counter-section .container .header .subtitle ,.New-card-event-results-container .header .subtitle , .categories-container-event .header .subtitle , .trusted-section .header .subtitle ,.categories-container-event .header .subtitle {
        font-size: 1.1rem;
    }

    .New-counter-section .container .counters-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }

    .New-counter-section .container .counters-grid .counter-item {
        padding: 30px 20px;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-icon {
        width: 70px;
        height: 70px;
        font-size: 1.5rem;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-number {
        font-size: 2rem;
    }
}

@media (max-width: 480px) {
    .New-counter-section {
        padding: 30px 5px;
    }
    .New-card-event-results-container {
      margin: 15px auto;
    }
    .New-counter-section .container .header .title , .New-card-event-results-container .header .title , .categories-container-event .header .title , .trusted-section .header .title ,.categories-container-event .header .title , .exclusive .header .title {
        font-size: 1.8rem;
    }

    .New-counter-section .container .counters-grid {
      grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .New-counter-section .container .counters-grid .counter-item {
        padding: 10px;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-icon {
        width: 60px;
        height: 60px;
        font-size: 1.3rem;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-number {
        font-size: 1.8rem;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-label {
        font-size: 0.9rem;
    }

    .New-counter-section .container .counters-grid .counter-item .counter-description {
        font-size: 0.85rem;
    }
}

/* Animation States */
.counter-item.animated .counter-number {
    animation: countUp 0.8s ease-out;
}

.counter-item.animated .counter-icon {
    animation: pulse 2s ease-in-out infinite;
}

.eventSearchContainer-header {
  display: none;
}