.hero-section,
.hover-img,
footer {
    overflow: hidden
}

.footer-social-icons li a,
.login-btns a.dropdown-toggle-btn,
a.event-arrow i {
    width: 48px;
    height: 48px;
    place-content: center
}
a.si-instagram {
    display: none;
}

.bottom-bar a,
.lang-item,
.page-btn,
.report-card .download-btn,
.see-all-btn,
.social-icon {
    text-decoration: none
}

.event-header,
.missio-box,
.reg-slide,
.speakers,
ul.content-ul,
ul.trade-list-1 li {
    box-sizing: border-box
}

.events-share-popup,
.select-arrow,
.side-modal,
.social-popup {
    pointer-events: none
}

.events-lists-home,
.mfb-tags-scroll,
html {
    scroll-behavior: smooth
}

.mfb-clear-btn,
.mfb-tag,
.scroll-label,
.toggle-text {
    white-space: nowrap
}

:root {
    --primary-100: rgba(138, 140, 228, 1);
    --primary-200: rgba(107, 109, 196, 1);
    --primary-300: rgba(81, 82, 158, 1);
    --primary-400: rgba(55, 56, 127, 1);
    --primary-500: rgba(38, 39, 97, 1);
    --primary-600: rgba(31, 31, 80, 1);
    --primary-700: rgba(25, 25, 64, 1);
    --primary-800: rgba(18, 18, 48, 1);
    --primary-900: rgba(10, 10, 26, 1);
    --secondary-100: rgba(255, 247, 230, 1);
    --secondary-200: rgba(255, 228, 179, 1);
    --secondary-300: rgba(255, 209, 128, 1);
    --secondary-400: rgba(255, 190, 77, 1);
    --secondary-500: rgba(245, 166, 35, 1);
    --secondary-600: rgba(217, 143, 31, 1);
    --secondary-700: rgba(179, 119, 25, 1);
    --secondary-800: rgba(140, 95, 19, 1);
    --secondary-900: rgba(102, 72, 13, 1);
    --gray-50: rgba(255, 255, 255, 1);
    --gray-100: rgba(255, 255, 255, 0.8);
    --gray-200: rgba(249, 249, 249, 1);
    --gray-300: rgba(242, 242, 242, 1);
    --gray-400: rgba(230, 230, 230, 1);
    --gray-500: rgba(217, 217, 217, 1);
    --gray-600: rgba(204, 204, 204, 1);
    --gray-700: rgba(191, 191, 191, 1);
    --gray-800: rgba(179, 179, 179, 1);
    --gray-900: rgba(166, 166, 166, 1);
    --gray-1000: rgba(153, 153, 153, 1);
    --gray-1100: rgba(140, 140, 140, 1);
    --gray-1200: rgba(128, 128, 128, 1);
    --gray-1300: rgba(102, 102, 102, 1);
    --gray-1400: rgba(77, 77, 77, 1);
    --gray-1500: rgba(51, 51, 51, 1);
    --gray-1600: rgba(31, 31, 31, 1);
    --gray-1700: rgba(20, 20, 20, 1);
    --gray-1800: rgba(10, 10, 10, 1);
    --success-light: rgba(38, 153, 79, 1);
    --success: rgba(31, 122, 63, 1);
    --success-dark: rgba(25, 92, 48, 1);
    --warning-light: rgba(255, 211, 137, 1);
    --warning: rgba(245, 166, 35, 1);
    --warning-dark: rgba(204, 137, 26, 1);
    --error-light: rgba(237, 111, 111, 1);
    --error: rgba(214, 69, 69, 1);
    --error-dark: rgba(170, 42, 42, 1);
    --info-light: rgba(102, 127, 255, 1);
    --info: rgba(77, 106, 255, 1);
    --info-dark: rgba(51, 81, 233, 1);
    --bg-dark: var(--gray-1800);
    --bg-mobile-menu: rgb(18, 18, 48);
    --gradient-white-gray-light: linear-gradient(180deg,
            #ffffff 0%,
            #f2f2f2 100%);
    --bg-card-gradient: linear-gradient(180deg,
            #ffffff 0%,
            #f0f0f0 100%);
    --bg-card-gradient-hover: linear-gradient(180deg,
            #f9f9f9 0%,
            #e6e6e6 100%);
    --bg-gradient-forms: linear-gradient(180deg,
            rgba(255, 255, 255, 0.9) 0%,
            rgba(240, 240, 240, 0.9) 100%);
    --container-xl: 1440px;
    --container-xs: 412px;
    --container-padding-xl: 48px;
    --container-padding-xs: 20px;
    --radius-8: 8px;
    --radius-12: 12px;
    --radius-16: 16px;
    --radius-20: 20px;
    --radius-24: 24px;
    --radius-48: 48px;
    --radius-58: 58px;
    --opacity-10: 0.1;
    --opacity-20: 0.2;
    --opacity-30: 0.3;
    --opacity-40: 0.4;
    --opacity-50: 0.5;
    --opacity-60: 0.6;
    --opacity-80: 0.8;
    --opacity-90: 0.9;
    --shadow-sm: 0 4px 12px rgba(138, 140, 228, 0.2);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 20px rgba(0, 0, 0, 0.12);
    --space-1: 0.5rem;
    --space-2: 1rem;
    --space-3: 1.5rem;
    --space-4: 2rem;
    --space-5: 2.5rem;
    --space-6: 3rem;
    --space-8: 4rem;
    --space-10: 5rem;
    --space-12: 6rem;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 2rem;
    --text-4xl: 2.5rem;
    --text-5xl: 3.5rem;
    --text-6xl: 4rem;
    --gradient-primary: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, 0.9) 0%, rgba(55, 56, 127, 0.9) 100%);
    --gradient-secondary: radial-gradient(81.73% 163.15% at 15.58% 27.08%, #FFBE4D 0%, #F5A623 100%);
    --gradient-card: linear-gradient(129.5deg, rgba(138, 140, 228, 0) 67.58%, rgba(138, 140, 228, 0.115) 95.31%), rgba(255, 255, 255, 0.8);
}

/* .row {
   --bs-gutter-x: clamp(40px, 6.67vw, 96px);
} */

.container {
    max-width: var(--container-xl);
    padding-right: 48px;
    padding-left: 48px;
}

html {
    font-size: 18px
}

body,
html {
    overflow-x: clip
}

body.modal-open {
    padding-right: 0 !important
}

a {
    text-decoration: none !important
}

@media (max-width:1499px) and (min-width:1366px) {
    html {
        font-size: 16px
    }
}

@media (max-width:1365px) and (min-width:1200px) {
    html {
        font-size: 15px
    }
}

@media (max-width:1199px) {
    html {
        font-size: 14px
    }
}

body {
    font-family: Urbanist, sans-serif;
    font-weight: 500;
    top: 0 !IMPORTANT;
}

p {
    font-size: 18px;
    font-weight: 400;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: 0.01em;
}

.header .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 32px;
    padding-bottom: 32px;
    transition: .4s;
    /* padding-right: calc(var(--bs-gutter-x) * .5); */
    /* padding-left: calc(var(--bs-gutter-x) * .5); */
}

.login-btns,
ul.menus {
    align-items: center;
    display: flex
}

ul.menus {
    gap: 5px
}

dl,
ol,
ul {
    padding: 0;
    margin: 0
}

li {
    list-style: none
}

header.header {
    position: fixed;
    top: 10px;
    width: 100%;
    z-index: 99;
    color: #fff;
    transition: .4s;
}

.c-share-1 a,
.footer-social-icons li a {
    transition: .3s cubic-bezier(.4, 0, .2, 1)
}

ul.menus li a {
    font-size: 17px;
    color: #fff;
    transition: .3s;
    position: relative;
    width: 100%;
    display: inline-block
}

.login-btns {
    gap: 4px
}

.login-btns a.dropdown-toggle-btn {
    border-radius: 58px;
    font-size: 18px;
    display: inline-grid;
    color: #fff;
    border: 2px solid transparent;
    margin: 0 1px
}

.profile-dropdown .profile-header {
    display: flex;
    align-items: center;
    padding: 18px 20px;
    line-height: normal;
    gap: 8px
}

.toggle-btn-active-language {
    position: absolute;
    font-size: 10px;
    background: var(--secondary-500);
    color: #000;
    padding: 2px 7px;
    border-radius: 8px;
    top: 0;
    left: 0;
    font-weight: 600
}

.dropdown-item-wrapper,
.endorsment-box,
.filter-search,
.footer-contact-info li,
.home-logos-header,
.input-box,
.input-icon,
.input-wrapper,
.login-btns,
.login-card .input-wrapper,
.search-results-sidebar,
.select-box,
.select-wrapper {
    position: relative
}

.dropdown-item-wrapper.active .toggle-btn-active-language,
.footer-contact-info li:last-child:before,
.language-dropdown li:last-child:before,
.mobile-filter-bar,
.reports-accordion .accordion-item:last-child:before,
.share-divider,
.share-label,
ul.content-ul li:last-child:before {
    display: none
}

.login-btns {
    display: flex;
    align-items: center
}

.checkbox-item,
.lang-item {
    align-items: center;
    gap: 10px
}

.custom-dropdown {
    position: absolute;
    top: 145%;
    right: 0;
    left: -150px;
    width: 380px;
    max-width: 90vw;
    background: #fff;
    padding: 32px;
    border-radius: 10px;
    display: none;
    z-index: 999;
    color: #000;
    box-shadow: 0 30px 150px 0 rgba(38, 39, 97, .2)
}

.custom-dropdown ul li,
.custom-dropdown>div {
    padding: 0 0 17px;
    border-bottom: 1px solid var(--gray-400)
}

.input-box .svg-icon,
.input-box i {
    position: absolute;
    left: 5%;
    top: 31%;
    color: var(--gray-1100);
    width: 20px;
    height: 20px
}

.input-icon i,
.select-arrow,
.select-wrapper i {
    top: 50%;
    transform: translateY(-50%)
}

.custom-dropdown li {
    margin-bottom: 15px;
    color: var(--gray-1400);
    position: relative
}

.custom-dropdown li:last-child {
    margin-bottom: 0;
    padding: 0;
    border: 0
}

.custom-dropdown input {
    width: 100%;
    padding-left: 45px
}

.custom-dropdown.search-dropdown {
    width: 460px;
    left: -230px;
    right: inherit
}

.custom-dropdown.profile-dropdown {
    padding: 0;
    width: 280px;
    left: -105px
}

.profile-header img {
    width: 50px !important;
    height: 50px !important;
    object-fit: cover
}

.profile-header h6 {
    color: var(--primary-300);
    font-size: 16px
}

.profile-header small {
    color: var(--gray-1400);
    font-size: 14px;
    font-style: italic;
    font-weight: 500
}

.hero-event h2,
.hero-heading,
.hero-heading span {
    font-family: Urbanist, sans-serif;
    font-style: normal
}

.custom-dropdown::before {
    content: "";
    position: absolute;
    top: -6px;
    right: 50%;
    width: 16px;
    height: 16px;
    background: #fff;
    transform: rotate(45deg)
}

.form-group label {
    font-weight: 700;
    font-size: 14px;
    display: block;
    margin-bottom: 7px;
    color: var(--gray-1500)
}

.input-icon i {
    position: absolute;
    left: 15px;
    color: #999
}

.input-icon input {
    width: 100%;
    padding: 12px 15px 12px 40px;
    border-radius: 30px;
    border: 1px solid #ddd
}

.select-wrapper select {
    width: 100%;
    padding: 12px 40px 12px 15px;
    border-radius: 30px;
    border: 1px solid #ddd;
    appearance: none
}

.select-wrapper i {
    position: absolute;
    right: 15px
}

.checkbox-list {
    border-top: 1px solid #eee;
    padding-top: 10px
}

.checkbox-item {
    display: flex;
    padding: 8px 0
}

.language-box {
    width: 200px
}

.lang-item {
    display: flex;
    padding: 10px 0;
    color: #333
}

.lang-item img {
    width: 20px;
    border-radius: 3px
}

.custom-dropdown.search-dropdown:before {
    right: inherit;
    left: 250px;
}

.select-box select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 40px
}

.select-arrow {
    position: absolute;
    right: 25px;
    width: 20px;
    height: 20px;
    color: #666
}



@media (max-width:1499px) and (min-width:1366px) {
    .container {
        max-width: 1360px;
        padding-right: calc(var(--bs-gutter-x) * .5);
        padding-left: calc(var(--bs-gutter-x) * .5);
    }
}

@media (max-width:1365px) and (min-width:1200px) {
    .container {
        max-width: 1280px;
        padding-right: calc(var(--bs-gutter-x) * .5);
        padding-left: calc(var(--bs-gutter-x) * .5);
    }
}

@media (max-width:1199px) and (min-width:992px) {
    .container {
        max-width: 1200px
    }
}

@media (max-width:991px) and (min-width:768px) {
    .container {
        max-width: 720px
    }
}

@media (max-width:767px) and (min-width:576px) {
    .container {
        padding-left: var(--container-padding-xs);
        padding-right: var(--container-padding-xs);
        max-width: 540px
    }
}

.hero-section {
    background-size: cover;
    padding: 11rem 0 0;
    color: #fff;
    position: relative;
    height: 100%;
    z-index: 4
}

.hero-bg-video {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    z-index: -1;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hero-overlay,
.hero-overlay:after,
.hero-overlay:before {
    height: 100%;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0
}

.hero-overlay:before {
    content: "";
    background: rgb(0 0 20 / 45%);
    z-index: 2;
    background: linear-gradient(to top, #0a0a1a, transparent);
    opacity: .5
}

.hero-overlay {
    z-index: -1;
    background: #00002b;
    opacity: .6
}

.hero-overlay:after {
    content: "";
    background: linear-gradient(to bottom, #0a0a1a, transparent);
    opacity: .5
}

.hero-section:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 55%;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, 0) 48.31%)
}

.hero-section:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 80%;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, #0a0a1a 99.99%)
}

.footer .container,
.hero-section .container,
.share-wrapper {
    position: relative;
    z-index: 2
}

.hero-heading {
    font-weight: 600;
    font-size: 120px;
    line-height: normal;
    letter-spacing: -.02em;
    color: var(--secondary-100)
}

.hero-heading span {
    font-weight: 400;
    font-size: 105px;
    line-height: 80%;
    /* letter-spacing: -.02em; */
    color: var(--gray-100);
    /* position: static; */
    display: block;
    margin-top: 15px;
    text-align: right;
}

/* "At Its Best" is hard-right for the desktop split layout, but on tablet/
   mobile the hero centres (and small-desktop left-aligns) — so below 1200px
   let the second line follow "Networking"'s alignment instead of staying
   stuck to the right edge. `inherit` picks up the heading's text-align. */
@media (max-width: 1200px) {
    .hero-heading span {
        text-align: inherit;
    }
}

.hero-counter {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 95%;
    gap: 20px;
    color: var(--gray-100);
    margin-left: auto
}

.hero-count-box {
    width: 44%
}

.hero-count-box p {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.3;
    color: #FFFFFFE5;
}

.hero-count-box span {
    font-weight: 500;
    font-size: 48px;
    color: var(--secondary-200)
}

.hero-paragraph {
    font-size: 24px;
    font-weight: 400
}

.hero-video-1 {
    display: flex;
    align-items: end;
    justify-content: space-between;
    padding-top: 32px;
    width: 85%;
    gap: 30px
}

.hero-video-1 .web-img img {
    width: 185px;
    height: 140px;
    object-fit: cover;
    border-radius: var(--radius-20);
    flex-shrink: 0;
    display: inline-block
}

.hero-video-1 .text p {
    font-size: 20px;
    margin: 0
}

.hero-video-1 .text .hero-video-1-text {
    color: var(--primary-100);
    font-size: 16px;
    font-weight: 700;
    margin: 0
}

.btn-play-primary {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 74px;
    height: 74px;
    border: 20px solid rgba(138, 140, 228, .2);
    border-radius: 100%;
    z-index: 3;
    backdrop-filter: blur(18.125px);
    flex-shrink: 0
}

.btn-play-primary a {
    display: grid;
    place-content: center;
    align-items: center;
    width: 56px;
    height: 56px;
    background: var(--primary-200);
    border: 8px solid rgba(138, 140, 228, .1);
    border-radius: 100%;
    font-size: 30px;
    flex-shrink: 0;
}

.event-tag-secondary {
    display: inline-flex;
    align-items: center;
    padding: 6px 16px;
    gap: 10px;
    background: var(--secondary-300);
    backdrop-filter: blur(13px);
    width: max-content;
    border-radius: var(--radius-58);
    color: var(--gray-1600);
    margin: 0 0 20px;
    font-weight: 600;
    font-size: 14px
}

.blur-card-bg,
.c-share-1 a,
.footer-social-icons li a {
    backdrop-filter: blur(13.05px)
}

.about-img-box,
.about-main-content {
    margin: auto;
    position: relative
}

.hero-event h2 {
    font-weight: 500;
    font-size: 36px;
    color: #fff;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.speaker-box.active span,
.hero-event p {
    color: var(--gray-100)
}

.date-1 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-style: italic;
    font-weight: 500;
    letter-spacing: .2px
}

.section-para,
.section-title {
    font-family: Urbanist, sans-serif;
    font-style: normal
}

.arrow-secondary {
    width: 60px;
    height: 60px;
    display: grid;
    place-content: center;
    background: var(--secondary-400);
    color: var(--gray-1700);
    font-size: 32px;
    border-radius: 100%;
    font-weight: 700;
    z-index: 1;
    transform: rotate(180deg);
    position: relative
}

.hero-event:hover .event-tag-secondary,
.membership-flex-2 img {
    background: #fff
}

.hero-event:hover h3 {
    color: var(--secondary-200)
}

.py-100 {
    padding: 100px 0 !important
}

.pb-100 {
    padding-bottom: 100px
}

.pt-100 {
    padding-top: 100px
}

.section-title {
    font-weight: 500;
    font-size: 64px;
    line-height: 120%;
    letter-spacing: -.01em
}

.section-para {
    font-weight: 400;
    font-size: 24px;
    line-height: 130%;
    color: var(--gray-100);
}

.about-img-box {
    width: 70%;
    height: 540px;
    border-radius: var(--radius-24)
}

.company-m-logo img,
.country-img img,
.event-main-img img,
.hover-img img,
.logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

img {
    transition: .4s;
    max-width: 100%
}

.hover-img:hover img {
    transform: scale(1.02);
    transform: scale(1.1) rotate(2deg)
}

.missio-box {
    padding: 32px;
    position: absolute;
    width: 405px;
    height: auto;
    left: 48px;
    top: 248px
}

.blur-card-bg {
    /* border: 1px solid; */
    border-radius: var(--radius-24);
    color: #fff;
    background: #37387F4D
}

.mission-felx {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    margin: 0 0 1rem
}

.mission-felx span {
    color: var(--secondary-300);
    font-size: 26px
}

.missio-box i,
.missio-box svg {
    color: var(--secondary-300);
    transform: rotate(-45deg);
    width: 16px !important;
    height: 16px !important
}

.vision-box {
    position: absolute;
    width: 429px;
    height: auto;
    left: 963px;
    top: 64px
}

.about-section-1 {
    background-image: url(../images/__bg.webp);
    background-color: var(--primary-900);
    background-size: 100% 100%;
    border-radius: 0 0 50px 50px;
    color: #fff;
    margin-top: -2px;
}

.members-left-home .section-title,
.news-detail-content h3 {
    font-size: 48px
}

blockquote {
    padding: 32px;
    background: var(--gray-300);
    border-radius: 16px;
    border-left: 2px solid var(--secondary-300);
    font-size: 24px;
    color: var(--gray-1500);
    font-weight: 400;
    font-style: italic;
}

.section-tag {
    font-size: 16px;
    color: var(--secondary-400);
    font-weight: 700;
    display: inline-block;
    margin: 0 0 6px
}

.btn-style-1,
.dark-bg .about-content p,
.members-left-home,
footer {
    color: var(--gray-50)
}

.members-flex {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 0 1rem
}

.members-box {
    margin: 1.2rem 0 0;
    position: relative;
    padding: 1.2rem 0 0
}

.members-flex p {
    color: var(--secondary-300);
    font-size: 24px;
    font-weight: 500
}

.members-box:before {
    position: absolute;
    content: "";
    width: 200px;
    height: 2px;
    top: 0;
    background: linear-gradient(90deg, rgba(255, 228, 179, .5) 0, rgba(217, 217, 217, 0) 61.06%)
}

.events-main-hm,
.events-main-img,
.members-img,
footer {
    position: relative
}

.members-img {
    width: 90%;
    border-radius: 16px;
    height: 670px;
    margin: auto
}

.member-card {
    backdrop-filter: blur(80px);
    width: 75%;
    padding: 30px;
    border-radius: var(--radius-24);
    margin: -210px auto 0;
    background: radial-gradient(94.04% 82.51% at 90.65% 78.29%, rgba(255, 190, 77, .2) 0, rgba(255, 190, 77, .4) 100%)
}

.btn-style-1,
.btn-style-2 {
    align-items: center;
    padding: 14px 28px 14px 32px;
    backdrop-filter: blur(13px);
    display: inline-flex;
    font-size: 18px
}

.btn-style-1 {
    gap: 10px;
    background: rgba(255, 255, 255, .1);
    border: 2px solid rgba(255, 255, 255, .2);
    border-radius: var(--radius-58)
}

.btn-style-2,
.footer-news-letter form button.btn {
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, #ffbe4d 0, #f5a623 100%);
    font-weight: 600
}

.btn-style-2 {
    gap: 10px;
    border: 2px solid rgba(255, 190, 77, .3);
    border-radius: var(--radius-58);
    color: var(--primary-600);
    justify-content: center
}


.testimonial-slider .testimonial-card {
    width: 97%;
    margin: auto
}


.testimonial-card {
    background: rgba(55, 56, 127, .3);
    backdrop-filter: blur(80px);
    padding: 30px;
    border-radius: var(--radius-24);
    border: 1px solid rgba(255, 255, 255, .15)
}

.test-star svg,
.test-star i {
    color: var(--secondary-500);
    margin: 0 0 .5rem;
    display: inline-flex
}

span.test-name {
    color: #ffe4b3;
    display: inline-block;
    margin: 0 0 .5rem
}

.test-flex {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 30px
}

.test-flex img {
    width: 64px;
    height: 64px;
    border-radius: 100px
}

.home-logos-header {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*align-items: center;*/
    /*justify-content: space-around;*/
    width: 100%;
}

.home-logo img {
    width: 100px;
    height: 70px;
    object-fit: contain;
    margin: 1rem auto
}

.btn-style-3 {
    display: inline-flex;
    align-items: center;
    padding: 14px 28px 14px 32px;
    gap: 10px;
    border: 2px solid var(--primary-300);
    backdrop-filter: blur(13px);
    border-radius: var(--radius-58);
    color: var(--primary-300);
    font-weight: 600;
    font-size: 18px;
    background: 0 0
}

footer {
    padding: 0 0 3rem;
    color: #fff;
    z-index: 6;
    position: relative;
}

/*footer::before {*/
/*  content: "";*/
/*  position: absolute;*/
/*  top: 0;*/
/*  left: 0;*/
/*  width: 48px;*/
/*  height: 48px;*/
/*  background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 0L0 0L0 48C1.22034 19.1186 22.7797 0.81356 48 0Z' fill='currentColor'/%3E%3C/svg%3E") no-repeat;*/
/*  background-size: contain;*/
/*    z-index: 9;*/
/*}*/

/*.footer::after {*/
/*  content: "";*/
/*  position: absolute;*/
/*  top: 0;*/
/*  right: 0;*/
/*  width: 48px;*/
/*  height: 48px;*/
/*  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L48 0L48 48C46.7797 19.1186 25.2203 0.81356 0 0Z' fill='currentColor'/%3E%3C/svg%3E") no-repeat;*/
/*  background-size: contain;*/
/*  z-index: 9;*/
/*}*/

.footer-social-icons li a {
    display: inline-grid;
    background: rgba(255, 255, 255, .1);
    border: 2px solid rgba(255, 255, 255, .2);
    border-radius: 58px;
    line-height: 1
}

.footer-news-letter {
    background: #ffbe4d0d;
    padding: 35px;
    border-radius: 24px;
    width: 90%;
    margin-left: auto;
    background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0, rgba(255, 190, 77, .05) 100%);
    backdrop-filter: blur(40px)
}

.footer-news-letter form input[type=email] {
    width: 75%;
    border-radius: 58px;
    padding: 13px 15px
}

.footer-news-letter form button.btn {
    border-radius: 58px;
    border: 0;
    border: 2px solid #ffbE4D4D;
    padding: 5px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-contact-info li a:hover {
    color: var(--secondary-300);
}

footer h4 {
    color: var(--secondary-300);
    font-size: 20px
}

.footer-links-row ul li {
    margin: 0 0 12px
}

.footer-copyright small,
.footer-copyright p {
    font-size: 16px;
    margin-bottom: 0px;
}

.footer-copyright a {
    color: var(--secondary-400) !important;
}

.footer-news-letter i.bi-newspaper {
    color: var(--secondary-300);
    font-size: 24px
}

.footer-contact-info {
    gap: 32px
}

.divider-contact {
    width: 1px;
    height: 16px;
    background: #FFFFFF;
    opacity: 0.2;
}

/*.footer-contact-info li:before {*/
/*    position: absolute;*/
/*    content: "";*/
/*    width: 1px;*/
/*    height: 16px;*/
/*    background: var(--gray-100);*/
/*    right: -15px;*/
/*    top: 5px;*/
/*    opacity: .5*/
/*}*/

hr {
    background: linear-gradient(90deg, rgb(96 97 165) 0, rgba(96, 97, 165, .363) 30%, rgba(255, 228, 179, 0) 100%);
    border: 0;
    width: 100%;
    height: 2px
}

.events-list-hm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 2px solid #fff;
    background: #fff;
    padding: 10px;
    gap: 10px;
    transition: .4s;
    border-radius: 8px;
    box-shadow: rgba(99, 99, 99, .2) 0 2px 8px 0;
    width: 97%;
    margin: auto
}

.events-list-hm img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
    flex-shrink: 0
}

.events-list-hm span {
    color: #666;
    font-style: italic;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    display: block;
    margin: 0 0 5px
}

.events-list-hm .event-lits-a,
.events-main-hm-text h4 {
    font-style: normal;
    font-family: Urbanist, sans-serif;
    font-weight: 500
}

.events-list-hm .event-lits-a {
    font-size: 15px;
    line-height: 130%;
    display: flex;
    align-items: flex-end;
    color: #1f1f50
}

.events-list-hm i,
.inner-content a,
.left-content p {
    font-size: 18px
}

.events-list-hm .svg-icon {
    width: 15px;
    height: 15px;
    color: var(--primary-500)
}

.speaker-box.active p,
.event-content,
.events-list-hm:hover .svg-icon,
.membership-flex-2 .heading-26 {
    color: #fff
}

.events-lists-home {
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: .4s;
    width: 99%;
    height: 445px;
    overflow: auto
}

.btn-style-4,
.category-style-1 {
    display: inline-flex;
    gap: 10px;
    backdrop-filter: blur(13px)
}

.events-lists-home::-webkit-scrollbar {
    width: 8px
}

.events-lists-home::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, .05);
    border-radius: 10px
}

.events-lists-home::-webkit-scrollbar-thumb {
    background: var(--primary-300);
    border-radius: 10px;
    transition: .3s
}

.events-lists-home::-webkit-scrollbar-thumb:hover {
    background: var(--primary-300)
}

.events-list-hm:hover {
    border-color: var(--primary-400);
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, .9) 0, rgba(55, 56, 127, .9) 100%);
    color: #fffFFFCC
}

.events-list-hm:hover a,
.events-list-hm:hover span {
    color: #fffFFFCC
}

.category-style-1 {
    align-items: center;
    padding: 6px 16px;
    background: var(--primary-300);
    border-radius: var(--radius-58);
    color: #fff;
    font-size: 14px
}

.events-main-hm {
    width: 96%;
    align-items: center;
    justify-content: space-between;
    margin: auto;
    z-index: 9
}

.events-main-hm-text,
.speakers {
    flex-direction: column;
    position: absolute
}

.events-main-hm .events-main-hm-img {
    position: relative;
    width: 70%;
    height: 435px;
    margin-bottom: 4rem
}

.events-main-img {
    width: 100%;
    height: 100%;
    border-radius: 16px
}

.events-main-hm .events-main-hm-img .category-style-1 {
    position: absolute;
    top: 20px;
    z-index: 99;
    left: 20px
}

.events-main-hm-text {
    padding: 25px;
    width: 55%;
    height: auto;
    background: var(--gradient-card);
    border: 1px solid #d9d9d9;
    backdrop-filter: blur(13px);
    border-radius: var(--radius-16);
    right: 0;
    top: 70px
}

.events-main-hm-text h4 {
    max-width: 406px;
    /*height: 66px;*/
    font-size: 26px;
    line-height: 125%;
    color: #191940;
    flex: none;
    order: 0;
    flex-grow: 1
}

.events-main-hm-text p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}





.btn-style-4 {
    align-items: center;
    padding: 14px 28px 14px 32px;
    background: var(--gradient-primary);
    border: 2px solid rgba(107, 109, 196, .3);
    border-radius: var(--radius-58);
    font-size: 18px;
    color: #fff;
    width: fit-content
}

.c-share-1 a {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0;
    gap: 16px;
    width: 40px;
    height: 40px;
    border-radius: 58px;
    color: rgba(128, 128, 128, 1);
    border: 1px solid rgba(128, 128, 128, 1);
}

.resource-box .c-share-1 a {
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: white;
    backdrop-filter: blur(26px);
}

.resource-text,
.speakers,
.resoure-links {
    height: auto;
    display: flex
}

.resource-text h5,
.resoure-links {
    font-style: normal;
    color: var(--primary-500)
}

.speakers {
    background: #37387F0A;
    backdrop-filter: blur(80px);
    width: 100%;
    align-items: flex-start;
    padding: 24px 32px;
    gap: 14px;
    isolation: isolate;
    width: revert-layer;
    left: 48px;
    bottom: -50px;
    background: rgba(10, 10, 26, .2);
    border: 1px solid rgba(255, 255, 255, .1);
    backdrop-filter: blur(13.05px);
    border-radius: 16px;
    z-index: 2;
    font-size: 22px
}

.speakers img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 1px solid #fff;
}

.speaker-img-flex img {
    position: relative;
    margin-left: -10px;
}

.speaker-img-flex img:first-child {
    margin-left: 0;
}

img.defalut-speaker {
    width: 148px !important;
    height: auto !important;
    border-radius: 0 !important;
    border: 0 !important;
    margin: 0!important;
}

.resource-text {
    flex-direction: column;
    align-items: flex-start;
    padding: 25px;
    gap: 10px;
    width: 100%;
    min-height: 244px;
    background: var(--gradient-card);
    backdrop-filter: blur(13px);
    border-radius: var(--radius-16);
    margin: -15px 0 0;
    transition: .4s;
    color: var(--gray-1400);
}

/* The cards are equal height but the divider + date/Read More row floated with
   the excerpt, so a two-line and a three-line card sat ~20px out of line.
   Push the footer to the bottom of the column. (!important beats the .my-1
   utility on the <hr> itself.) */
.resource-text > hr {
    margin-top: auto !important;
}

.accordion-button,
.btn,
.card,
.home-resource-tabs .nav-tabs .nav-link,
.hover-effect,
.member-card,
.member-company-boxes,
.resource-box,
.testimonial-card,
[role=button],
a,
.resoure-links,
button,
input,
select,
textarea {
    transition: .3s cubic-bezier(.4, 0, .2, 1)
}

.resource-text h5 {
    font-weight: 500;
    font-size: 20px;
    line-height: 1.3;
    text-transform: capitalize;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.resoure-links {
    width: auto;
    font-family: Urbanist, sans-serif;
    font-weight: 600;
    font-size: 18px;
    align-items: center;
    gap: 7px
}

.resource-box {
    width: 100%;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #d9d9d9
}

.re-img {
    width: 100%;
    height: 300px
}

.events-main-box .category-style-1,
.resource-tag {
    position: absolute;
    top: 20px;
    left: 20px
}

.c-tag,
.company-m-logo-both {
    left: 50%;
    transform: translate(-50%)
}

.resource-box .share-wrap {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #fff;
    background: 0 0;
    backdrop-filter: none;
    border-color: rgba(255, 255, 255, .4)
}

.resource-box:hover .resource-img img {
    transform: scale(1.05) rotate(3deg)
}

.resource-box:hover {
    border-color: #c6c6c6
}

.btn-style-1:hover,
.footer-social-icons li a:hover {
    background: rgba(255, 255, 255, var(--opacity-20));
    border-color: rgba(255, 255, 255, var(--opacity-40))
}

.date-1.resource-date {
    color: var(--gray-1300)
}

.member-company-boxes:hover span,
.resource-date .svg-icon,
.resoure-links:hover {
    color: var(--primary-300)
}

.sticky .container {
    background: rgba(10, 10, 26, 0.8);
    border-radius: 60px;
    padding: 16px 28px 16px 16px;
    backdrop-filter: blur(80px);
}

.sticky .logo img {
    width: 72px;
    height: auto
}

.btn,
.clickable,
[role=button],
a,
button,
input[type=button],
input[type=submit] {
    cursor: pointer !important
}

.btn-style-1,
.btn-style-2,
.btn-style-3,
.btn-style-4 {
    transition: .4s cubic-bezier(.4, 0, .2, 1);
    position: relative;
    overflow: hidden
}

.btn-style-1:hover {
    transform: translateY(-2px)
}

.btn-style-1:active,
.btn-style-3:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(107, 109, 196, var(--opacity-20))
}

.btn-style-2:hover {
    background: linear-gradient(45deg, var(--secondary-500), var(--secondary-500));
    transform: translateY(-2px)
}

.btn-style-2:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(255, 190, 77, var(--opacity-30))
}

.btn-style-3:hover {
    background: var(--primary-300);
    color: var(--gray-50);
    border-color: var(--primary-400);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(107, 109, 196, var(--opacity-30))
}

.btn-style-4:hover {
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, var(--primary-300) 0, var(--primary-300) 100%);
    border-color: rgba(107, 109, 196, var(--opacity-50));
    color: white;
}

.btn-style-4:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(107, 109, 196, var(--opacity-30))
}

a {
    color: inherit;
    transition: .4s;
    position: relative
}

.resoure-links:hover {
    transform: translateX(5px)
}

.resoure-links:hover i {
    transform: translateX(3px)
}

.event-lits-a {
    transition: .3s
}

.footer-links-row ul li a {
    transition: .3s;
    display: inline-block;
    font-size: 18px
}

.footer-links-row ul li a:hover {
    color: var(--secondary-300);
    transform: translateX(3px)
}

.events-main-home,
.footer-news-letter form button.btn,
.missio-box,
.resource-box,
.testimonial-card {
    transition: .4s cubic-bezier(.4, 0, .2, 1)
}

.resource-box:hover {
    box-shadow: 0 12px 30px rgb(0 0 0 / 4%)
}

.resource-box:hover .resource-text {
    background: linear-gradient(129.5deg, rgb(138 140 228 / 6%) 67.58%, rgb(138 140 228 / 1%) 95.31%), rgba(255, 255, 255, .95)
}

.testimonial-card:hover {
    background: rgba(55, 56, 127, var(--opacity-40));
    box-shadow: 0 10px 25px rgba(55, 56, 127, var(--opacity-30))
}

.member-card {
    transition: .4s
}

.arrow-secondary,
.btn-play-primary,
.hero-event {
    transition: .4s cubic-bezier(.4, 0, .2, 1);
    cursor: pointer
}

.member-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(255, 190, 77, var(--opacity-30))
}

.missio-box:hover {
    background: #37387f42;
    border-color: rgba(255, 255, 255, var(--opacity-30));
    transform: scale(1.02);
    box-shadow: 0 8px 20px rgba(0, 0, 0, var(--opacity-20))
}

.c-share-1 a:hover,
.c-share-1 a:hover svg {
    transform: scale(1.1)
}

.btn-play-primary:hover {
    background-color: var(--primary-300);
    transform: scale(1.1);
    box-shadow: 0 8px 20px rgba(107, 109, 196, var(--opacity-40))
}

.btn-play-primary:active,
.logo:hover,
.member-company-boxes:hover .company-m-img img {
    transform: scale(1.05)
}

.arrow-secondary:hover {
    background: var(--secondary-500);
    transform: rotate(-45deg) scale(1.1);
    box-shadow: 0 6px 15px rgba(255, 190, 77, var(--opacity-30))
}

.c-share-1 a:hover {
    background: rgba(107, 109, 196, var(--opacity-10));
    border-color: var(--primary-300)
}

.footer-social-icons li a:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(255, 255, 255, var(--opacity-20))
}

.menus li {
    transition: .3s;
    position: relative;
    padding: 15px 22px
}

ul.menus li:hover a {
    color: var(--primary-100)
}

ul.menus li:hover .clk_btn {
    color: var(--primary-100);
    transform: rotate(180deg)
}

ul.menus li .clk_btn {
    transition: .3s;
    display: inline-block;
    position: absolute;
    font-size: 16px;
    right: 1px;
    top: 18px;
    cursor: pointer
}

.home-resource-tabs {
    display: flex;
    justify-content: end;
    align-items: center
}

.home-resource-tabs .nav-tabs {
    border: none;
    justify-content: start
}

.home-resource-tabs .nav-tabs .nav-link {
    border: none;
    background: 0 0;
    color: var(--primary-500);
    font-weight: 600;
    position: relative;
    font-size: 18px;
    padding: 0 0 5px;
    margin: 0 15px;
    /* letter-spacing: .5px; */
    opacity: .7;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.home-resource-tabs .nav-tabs .nav-link::after {
    content: '';
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translate(-50%);
    width: 14px;
    height: 14px;
    background: var(--primary-900);
    transition: width .3s;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2313263B' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5l6.5 6 6.5-6' stroke='%2313263B' stroke-width='2' fill='none'/%3E%3C/svg%3E") center no-repeat;
    background-size: contain;
    opacity: 0
}

.home-resource-tabs .nav-tabs .nav-link:hover::after {
    width: 100%
}

.home-resource-tabs .nav-tabs .nav-link.active {
    /* color: var(--primary-900); */
    background: 0 0;
    border-bottom: 2px solid var(--primary-900);
    opacity: 1;
}

.home-resource-tabs .nav-tabs .nav-link.active::after {
    opacity: 100%
}

.home-resource-tabs .nav-tabs .nav-link:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 16px;
    background: rgba(230, 230, 230, 1);
    right: -15px;
}

.home-resource-tabs .nav-tabs li:last-child .nav-link:before {
    display: none;
}

/* Tolerate long translated labels (e.g. German "Aktualisierungen der
   regulatorischen Bestimmungen"): keep each tab's icon + label together on one
   line so the icon can't overlap the text, and let the tab row wrap on desktop.
   The mobile breakpoint still switches these tabs to horizontal scroll. */
.home-resource-tabs .nav-tabs {
    flex-wrap: wrap;
    row-gap: 14px;
}

.home-resource-tabs .nav-tabs .nav-link {
    white-space: nowrap;
}

.acc-outer .accordion-button:not(.collapsed) SPAN {
    background: #51529e;
    color: #fff
}

.acc-outer .accordion-diff-collapse {
    border-left: 1px solid var(--secondary-400) !important;
}

.acc-outer .accordion-body {
    padding: 20px !important;
    margin-top: 12px
}

.acc-outer .accordion-button h6 {
    margin: 0;
    font-size: 20px;
    color: var(--gray-1600);
}

.acc-outer .accordion-body p {
    margin: 0 !important;
    color: var(--gray-1400);
    font-weight: 500;
}

.acc-outer .accordion-button {
    padding: 0 !important;
    background: 0 0;
    box-shadow: none
}

.acc-outer .accordion-item {
    margin-bottom: 0;
    background: 0 0;
    border: 0;
    /* border-bottom: 1px solid; */
    padding: 20px 0;
    font-size: 20px;
    position: relative;
}

.acc-outer .accordion-item:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    bottom: 0;
    background: linear-gradient(90deg, rgba(138, 140, 228, 0.5) 0%, rgba(138, 140, 228, 0) 50%, rgba(138, 140, 228, 0.5) 100%);
}



.filter-search input,
.quest-search input {
    padding-left: 45px
}

.input-box.quest-search {
    min-width: 300px;
}

.acc-outer .accordion-button:not(.collapsed) h6 {
    color: var(--primary-500);
    padding-bottom: 10px
}

.footer-news-letter form button.btn:hover {
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, var(--secondary-300) 0, var(--secondary-400) 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(255, 190, 77, var(--opacity-40));
    color: #000
}

.footer-news-letter form button.btn:active,
.mfb-drawer.open {
    transform: translateY(0)
}

.footer-news-letter form input[type=email] {
    transition: .3s;
    border: 2px solid transparent
}

.events-main-home:hover,
.hero-event:hover {
    transform: translateY(-5px)
}

.events-main-home:hover .events-main-hm-text {
    background: linear-gradient(129.5deg, rgba(138, 140, 228, var(--opacity-10)) 67.58%, rgba(138, 140, 228, var(--opacity-20)) 95.31%), rgba(255, 255, 255, .95);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15)
}

.hero-event {
    background-size: 100% 100%;
    position: relative;
    width: 100%
}

.hero-event-card-shape {
    width: 100%;
    height: auto;
    display: block;
    color: rgba(81, 82, 158, .05);
    fill: rgb(8 7 23 / 10%)
}

.hero-event-content {
    position: absolute;
    inset: 0;
    padding: 40px;
    color: #fff;
    display: grid;
    place-content: center
}

.hero-event:hover .arrow-secondary {
    transform: rotate(0) scale(1.1);
    background: #fff
}

.hero-event:hover .hero-event-card-shape {
    fill: rgb(8 7 23 / 20%)
}

.logo {
    transition: .3s;
    width: 95px;
    height: auto
}

.category-style-1,
.event-tag-secondary,
.home-logo {
    transition: .3s;
    cursor: pointer
}

.home-logo:hover img {
    /*filter: brightness(1.1)*/
}

.category-style-1:hover {
    background: var(--primary-400);
    transform: scale(1.05)
}

.event-tag-secondary:hover {
    background: var(--secondary-400);
    transform: scale(1.05)
}

.scroll-div .line-1,
.scroll-div .line-2 {
    width: 583px;
    background: linear-gradient(90deg, rgba(255, 228, 179, .5) 0, rgba(217, 217, 217, 0) 61.06%)
}

.accordion-button:not(.collapsed) {
    color: var(--primary-700)
}

.accordion-collapse {
    transition: height .4s cubic-bezier(.4, 0, .2, 1)
}

.hero-event .arrow-secondary {
    position: absolute;
    top: 12px;
    right: 10px
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.2
}

.events-main-hm-text .share-wrap {
    position: absolute;
    top: 20px;
    right: 20px
}

.inner-banner {
    width: 100%;
    height: auto;
    align-items: center;
    padding-top: 10rem;
    padding-bottom: 6rem;
    background-size: cover;
}

.inner-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0;
    gap: 30px;
    z-index: 9;
    position: relative
}

.mfb-top-row,
ul.c-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px
}

.event-content h4,
.fs-12,
ul.c-breadcrumb i {
    font-size: 15px
}

.inner-content p {
    width: 780px;
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    text-align: center;
    color: #fff
}

.inner-heading,
.inner-heading h1,
.inner-heading span,
.inner-heading h1 span , .inner-heading p {
    font-size: 100px;
    letter-spacing: -.02em;
    font-style: normal;
    font-family: Urbanist, sans-serif ;
    width: auto;
}

.inner-heading,
.inner-heading h1 , .inner-heading p {
    font-weight: 600;
    line-height: 1;
    color: var(--secondary-100);
    /* flex: none; */
    /* order: 0; */
    /* flex-grow: 0; */
}

.inner-heading span,
.inner-heading h1 span , .inner-heading p span {
    font-weight: 400;
    line-height: 80%;
    color: var(--secondary-100);
    opacity: .6
}



.scroll-div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    width: 100%;
    position: relative;
    z-index: 99
}

.scroll-div .line-1 {
    height: 1px;
    transform: rotate(-180deg)
}

.scroll-div .line-2 {
    height: 1px
}

.members-filter {
    background: #fff;
    border-radius: 8px
}

.members-filter .accordion-button {
    background: 0 0;
    box-shadow: none;
    font-weight: 600;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--gray-1600)
}

.filter-list,
.member-company-boxes {
    flex-direction: column;
    display: flex
}

.members-filter .accordion-item {
    border: none;
    position: relative;
    background-color: transparent;
}

.filter-search .svg-icon {
    width: 18px;
    height: 18px;
    color: var(--gray-1300);
    position: absolute;
    top: 20px;
    left: 17px
}

.filter-list {
    gap: 6px
}

.filter-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: var(--gray-1300);
    cursor: pointer;
    border-bottom: 1px solid var(--gray-400);
    padding: 8px 0;
    width: 100%
}

.filter-check input {
    width: 19px;
    height: 19px
}

.filter-check span {
    color: inherit
}

.filter-list.scroll {
    max-height: 180px;
    overflow: auto
}

.filter-list .filter-check:last-child {
    border: 0;
    margin: 0;
    padding-bottom: 0
}

#dateModal {
    cursor: pointer;
}

#dateModal input {
    cursor: pointer;
    padding: 13px 20px;
    padding-right: 45px;
}

#dateModal svg.svg-icon {
    left: auto;
    right: 25px;
    width: 12px;
    height: 12px;
}

.acc-outer .accordion-item:last-child,
.events-details-tab a:last-child,
.product-filter .product-item:last-child .filter-check,
.speaker-schedule-flex li:last-child {
    border: 0
}

.sub-products .filter-check:last-child {
    border: 0;
    margin: 0
}

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

.sub-products {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    max-height: 0;
    transition: max-height .35s;
    padding: 0 12px
}

.sub-products.open {
    padding: 8px 14px;
    border: 1px solid var(--gray-300);
    margin: 8px 0
}

.product-item .toggle-btn {
    background: 0 0;
    border: none;
    font-size: 18px;
    color: #777;
    cursor: pointer;
    margin-left: auto
}

.c-spacer__horizontal {
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%);
    margin: 10px 0;
    flex-shrink: 0;
}

.member-company-boxes {
    width: 100%;
    position: relative;
    align-items: center;
    padding: 0;
    border: 1px solid var(--gray-400);
    backdrop-filter: blur(13px);
    border-radius: var(--radius-16);
    overflow: hidden;
    cursor: pointer;
    transition: .3s;
    background: rgba(255, 255, 255, 0.2);
    height: 100%;
}

.member-company-boxes:hover {
    border-color: var(--gray-700);
}

.member-company-boxes:hover .c-tag {
    background: rgb(10 10 10 / 34%)
}

.member-company-boxes .company-m-img img {
    transition: transform .4s;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.member-company-boxes:hover .company-m-img img {
    transform: scale(1.1) rotate(0.98deg);
}

.member-company-boxes .c-tag {
    transition: background .3s
}

.company-m-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 70px 24px 24px;
    gap: 6px;
    width: 100%;
    backdrop-filter: blur(25px);
    border-radius: var(--radius-16);
    text-align: center;
    position: relative;
    margin: -55px auto 0;
    z-index: 1;
    background: linear-gradient(182.56deg, rgba(255, 255, 255, 0.7) 1.75%, rgba(255, 255, 255, 0.9) 97.56%);
}

.c-tag {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px 16px;
    gap: 10px;
    width: max-content;
    height: auto;
    backdrop-filter: blur(13.05px);
    border-radius: 58px;
    flex: none;
    order: 0;
    flex-grow: 0;
    position: absolute;
    top: 20px;
    right: 50%;
    color: #fff;
    font-size: 12px;
    background: rgba(10, 10, 10, 0.3);
}

.company-m-img {
    overflow: hidden;
    width: 100%;
    height: 175px;
    filter: blur(2.5px);
    transition: .4s ease;
}

.member-company-boxes:hover .company-m-img {
    filter: blur(0px) !important
}

.company-m-logo {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    overflow: hidden;
    background: white;
    padding: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Logos sit centred and scale to fill the available circle without distortion
   or clipping (Loco: was right-aligned via flex-end with heavier padding). The
   img keeps width/height:100% + object-fit:contain from its base rule, so it
   fits the box and small logos scale up rather than floating tiny. */
.company-m-logo a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Whole member card is one click target. The card has cursor:pointer everywhere,
   but only the logo + name were anchors, so clicks on the cover photo, tag, slogan
   or padding did nothing (felt like it needed several clicks). This overlay anchor
   fills the card and sits above .company-m-text (z-index:1) so any click opens the
   profile; ctrl/middle-click still open in a new tab. */
.member-company-boxes .card-link-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    border-radius: var(--radius-16);
}

.company-m-country-logo {
    position: absolute;
    bottom: 5px;
    width: 32px;
    height: 32px;
    right: 0;
    overflow: hidden;
    background: white;
    border-radius: 100%;
}

.company-m-name {
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    text-align: center;
    color: var(--primary-700);
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
    margin: 0 0 6px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.company-m-text span {
    font-family: Urbanist, sans-serif;
    font-style: italic;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    color: var(--gray-1300);
    flex: none;
    order: 1;
    flex-grow: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.mem-proflir-title,
.member-profile-content p,
.member-profile-content span,
.point-of-contact-box p {
    font-family: Urbanist, sans-serif;
    font-style: normal
}

.member-company-boxes:hover .company-m-name {
    color: var(--primary-800)
}

.member-company-boxes:hover .company-m-text {
    background: linear-gradient(182.56deg, rgb(255 255 255 / 78%) 1.75%, rgba(255, 255, 255, .9) 97.56%)
}

.company-m-logo-both {
    display: flex;
    align-items: end;
    justify-content: center;
    position: absolute;
    top: -50px;
    right: 50%;
    width: 100px;
    height: 100px;
    margin: auto
}

.member-profile-banner {
    position: relative;
    z-index: 9;
    height: auto;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    backdrop-filter: blur(100px);
}

.point-of-contact-box,
.point-of-contact-box-2,
.point-of-contact-box-3 {
    background: rgba(138, 140, 228, .1);
    padding: 32px;
}

.member-profile-banner:before {
    /* position: absolute; */
    content: "";
    /* width: 100%; */
    /* height: 100%; */
    /* top: 0; */
    /* left: 0; */
    /* z-index: -1; */
    /* background: #0a0a1aeb; */
}

.country-box,
.country-content,
.country-img,
.events-main-box,
.events-main-content,
section,
ul.content-ul li {
    position: relative
}

.member-profile-img img {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 10px;
    width: 100%;
    height: 415px;
    border-radius: 16px;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 1;
    object-fit: cover
}

.mem-proflir-title {
    font-weight: 500;
    font-size: 62px;
    color: var(--secondary-100);
    margin: .5rem 0;
    line-height: normal;
    /*overflow: hidden;*/
    /*display: -webkit-box;*/
    /*-webkit-line-clamp: 1;*/
    /*line-clamp: 2;*/
    /*-webkit-box-orient: vertical;*/
}

.member-profile-content span {
    font-weight: 500;
    font-size: 26px;
    line-height: 125%;
    color: var(--secondary-400);
    margin: 0 0 .5rem;
    display: inline-block
}

.member-profile-content p {
    font-weight: 400;
    font-size: 24px;
    line-height: 130%;
    color: #fff;
    /*overflow: hidden;*/
    /*display: -webkit-box;*/
    /*-webkit-line-clamp: 2;*/
    /*line-clamp: 2;*/
    /*-webkit-box-orient: vertical;*/
}

.m-logos-wrap {
    width: 100px;
    height: 100px;
    margin: 0 0 20px;
   
    
}
.m-logo-brand{
    width: 100px;
    height: 100px;
    padding: 15px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    border-radius: 50%;
    background: white;
}

.m-logo-brand img {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    object-fit: contain;
    background: white;
    
}

.m-logo-flag {
    width: 32px;
    height: 32px;
    position: absolute;
    bottom: 0;
    right: 0;
    background: white;
    border-radius: 100%;
}

.point-of-contact-box {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    height: auto;
    backdrop-filter: blur(26px);
    border-radius: var(--radius-16);
    margin: 0 0 1rem
}

.point-of-contact-box-2,
.point-of-contact-box-3,
ul.content-ul {
    backdrop-filter: blur(13.05px);
    align-self: stretch
}

.point-of-contact-box img {
    width: 105px;
    height: 105px;
    object-fit: cover;
    border-radius: 100%;
    flex-shrink: 0;
   object-position: top;
}

.point-of-contact-box span {
    font-style: italic;
    font-weight: 500;
    font-size: 16px;
    color: #fff
}

.point-of-contact-box p {
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    color: #ffe4b3;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0
}

.member-profile-span,
.point-of-contact-box a {
    font-weight: 500;
    font-family: Urbanist, sans-serif;
    font-style: normal
}

.point-of-contact-box a {
    font-size: 18px;
    line-height: 1.2;
    display: flex;
    align-items: flex-end;
    color: #fff;
    gap: 10px;
    margin: .5rem 0 0
}

.contact-text {
    /* `anywhere` also shrinks the box's min-content width, so the flex parent
       squeezed it and the browser then split addresses mid-TLD ("…barilla.c" /
       "om"). `break-word` keeps the intrinsic width, so long emails only break
       where they sensibly can. */
    overflow-wrap: break-word;
}

.member-profile-span {
    font-size: 22px;
    line-height: 24px;
    color: #ffbe4d;
    margin: 0 0 1rem;
    display: inline-block;
    letter-spacing: .2px
}

.acc-tag,
.share-btn {
    letter-spacing: .5px
}

.point-of-contact-box-2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    isolation: isolate;
    border-radius: 16px;
    flex: none;
    order: 1;
    flex-grow: 0;
    margin: 0 0 1rem
}

.point-of-contact-box-2 span {
    display: flex;
    flex-direction: row;
    align-items: self-start;
    padding: 0;
    gap: 9px;
    font-weight: 600;
    font-size: 18px;
    color: #ffe4b3
}

.point-of-contact-box-2 .map {
    width: 100%;
    height: 200px;
    border-radius: 16px;
    overflow: hidden
}

.point-of-contact-box-2 p {
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 130%;
    letter-spacing: .01em;
    color: #fff;
    flex: none;
    order: 0;
    flex-grow: 1
}

.event-body-inner h4,
ul.content-ul li span {
    color: var(--secondary-200);
    font-family: Urbanist, sans-serif;
    font-style: normal
}

.point-of-contact-box-3 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
    isolation: isolate;
    border-radius: 16px;
    flex: none;
    order: 1;
    flex-grow: 0
}

.content-overview,
.event-header {
    background: rgba(255, 255, 255, .02)
}

hr.poc-line {
    height: 1px;
    background: linear-gradient(90deg, rgba(138, 140, 228, var(--opacity-50)) 0, rgba(138, 140, 228, 0) 61.06%)
}

.social-design-1 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    width: 100%
}

.signup-steps,
.social-popup {
    grid-template-columns: repeat(4, 1fr)
}

.social-design-1 .social-link {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 0;
    background: rgba(30, 32, 60, .6);
    border-radius: 30px;
    text-decoration: none;
    color: var(--gray-50);
    /* font-family: Urbanist, sans-serif; */
    /* font-weight: 500; */
    /* font-size: 15px; */
    transition: .3s;
    /* backdrop-filter: blur(10px); */
    position: relative;
    /* height: 48px; */
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-left: 0;
}

.social-design-1 .social-link i {
    font-size: 18px;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 58px;
    color: var(--gray-50);
    position: relative;
    top: 0;
    left: 1px;
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(26px);
}

.content-overview,
.member-profile-content-img,
ul.content-ul {
    border-radius: var(--radius-16)
}

.social-design-1 .social-link span {
    /* flex: 1; */
    /* white-space: nowrap; */
    /* font-weight: 400; */
    letter-spacing: .3px;
    font-size: 18px;
}

.social-design-1 .social-link:hover {
    background: rgba(40, 42, 70, var(--opacity-80));
    border-color: rgba(138, 140, 228, var(--opacity-40));
    transform: translateY(-2px);
    box-shadow: var(--shadow-md)
}

.social-design-1 .social-link:hover i {
    background: #3c3e5a
}

ul.content-ul {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    padding: 45px 50px;
    gap: 40px;
    background: rgba(255, 255, 255, var(--opacity-10));
    flex: none;
    order: 1;
    flex-grow: 0;
    background: rgba(255, 255, 255, .02)
}

ul.content-ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    gap: 4px;
    margin: 0 auto;
    /* flex: none; */
    /* order: 0; */
    /* flex-grow: 0; */
    position: relative;
    width: 25%;
}

ul.content-ul li:before {
    margin: 0 auto;
    width: 1px;
    height: 100%;
    background: var(--gray-50);
    opacity: var(--opacity-20);
    flex: none;
    /* order: 1; */
    /* align-self: stretch; */
    /* flex-grow: 0; */
    position: absolute;
    content: "";
    right: -25px;
    top: 0;
    bottom: 0;
}

ul.content-ul li span {
    width: auto;
    font-weight: 400;
    font-size: 40px;
    line-height: 110%;
    text-align: center;
    /* flex: none; */
    /* order: 0; */
    /* flex-grow: 0; */
    /* white-space: nowrap; */
}

ul.content-ul li p {
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 130%;
    text-align: center;
    color: var(--gray-50);
    flex: none;
    order: 1;
    flex-grow: 0;
    margin: 0
}

.content-overview {
    padding: 32px;
    height: auto;
    backdrop-filter: blur(13px)
}

.member-profile-content-img {
    width: 100%;
    height: auto;
    overflow: hidden
}

.member-profile-content-img img {
    width: 100%;
    height: 100%;
}

ul.trade-list-1 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    align-content: flex-start;
    padding: 0;
    gap: 8px;
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0;
    width: 100%
}

.event-header img,
ul.trade-list-1 li {
    flex-direction: column;
    order: 0;
    display: flex
}

ul.trade-list-1 li {
    justify-content: center;
    align-items: flex-start;
    padding: 10px 20px;
    gap: 8px;
    background: rgba(81, 82, 158, .05);
    backdrop-filter: blur(40px);
    border-radius: 32px;
    flex: none;
    font-size: 16px;
    font-weight: 400;
    transition: .4s;
    border: 1px solid rgba(255, 255, 255, .3);
    letter-spacing: 0.5px;
    border: 1px solid rgba(255, 255, 255, var(--opacity-30));
    color: var(--gray-50)
}

ul.trade-list-1 li.parent-category {
    border: 1px solid rgba(246, 168, 39, .5);
    color: var(--secondary-300)
}

.event-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 16px;
    gap: 16px;
    backdrop-filter: blur(13.05px);
    border-radius: var(--radius-16)
}

.event-header img {
    justify-content: center;
    align-items: center;
    gap: 5.12px;
    width: 64px;
    height: 64px;
    border-radius: 32px;
    flex: none;
    flex-grow: 0
}

.upcoming-event-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 16px;
    flex: none;
    order: 1;
    align-self: stretch;
    flex-grow: 0
}

.event-body {
    gap: 15px;
    display: flex;
    align-items: unset;
    justify-content: space-between;
    width: 97%;
    margin-left: auto
}

.event-body i.bi-arrow-90deg-right {
    font-size: 21px;
    transform: scaleY(-1);
    height: 40px
}

.event-body-inner {
    display: flex;
    align-items: center;
    padding: 16px;
    gap: 16px;
    width: 100%;
    height: auto;
    border: 1px solid rgba(255, 255, 255, var(--opacity-10));
    border-radius: var(--radius-16);
    justify-content: space-between;
    border: 1px solid rgba(255, 255, 255, .1)
}

.event-body-inner .event-thumbnail img {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 8.24px;
    width: 120px;
    height: 120px;
    border-radius: var(--radius-16);
    flex-shrink: 0
}

.event-body-inner h4 {
    /* width: 532px; */
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0
}

.resource-text p,
ul.list-style-2 .date-1 {
    color: var(--gray-1400)
}

.event-body-inner a.event-arrow {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 24px;
    gap: 10px;
    width: 96px;
    height: 120px;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: var(--radius-16);
    flex: none;
    order: 2;
    align-self: stretch;
    flex-shrink: 0;
    z-index: 0
}

.event-body-inner .event-details {
    max-width: 515px;
    width: 70%
}

a.event-arrow i {
    background: #fff;
    display: grid;
    color: var(--gray-1800);
    border-radius: 100%;
    font-size: 30px;
    transform: rotate(-45deg)
}

.small-icon-desing-1 {
    display: grid;
    place-content: center;
    justify-content: center;
    align-items: center;
    padding: 0;
    gap: 9.06px;
    width: 50px;
    height: 50px;
    background: #6b6dc4;
    backdrop-filter: blur(18.125px);
    border-radius: 43.5px;
    flex: none;
    order: 0;
    flex-grow: 0;
    box-shadow: 0 0 0 8px #8a8CE41A;
    margin: 0 0 20px;
    color: #fff
}

.small-icon-desing-1 img {
    width: 24px;
    height: 24px;
    flex: none;
    order: 0;
    align-self: stretch;
    flex-grow: 0;
    z-index: 0
}

.heading-40 {
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 40px;
    color: #1f1f1f;
    flex: none;
    order: 1;
    flex-grow: 0
}

.events-main-box {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0;
    width: 100%;
    height: auto;
    border-radius: 16px;
    flex: none;
    order: 0;
    flex-grow: 0;
    overflow: hidden;
    margin: 0 0 1.5rem
}

.event-main-img {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    gap: 8.24px;
    width: 272px;
    height: 280px;
    left: 0;
    top: 0;
    flex-grow: 0;
    z-index: 0;
    flex-shrink: 0;
    /* Clip the image to its own box so the hover scale(1.1)+rotate(-4deg) can't poke a
       corner past the card edge (was causing a stray white/light bar on the right on hover). */
    overflow: hidden;
}

/* The content-panel link must grow to fill the rest of the card. Without this it
   only takes its text's intrinsic width, so a card with a short description
   (e.g. the ESMA Convention) rendered narrower than the others and left a white
   strip on the right that showed through on hover. */
.events-main-box > a:has(.events-main-content) {
    flex: 1 1 0;
    min-width: 0;
}

/* Prominent external "Learn More" button on the event-detail hero (opens the
   trade fair's own site). Sits on the dark hero, so it's a light outline button
   distinct from the orange Register button. */
.event-learn-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    border-radius: 40px;
    border: 1.5px solid rgba(255, 255, 255, .55);
    background: rgba(255, 255, 255, .08);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.event-learn-more-btn:hover,
.event-learn-more-btn:focus {
    background: #fff;
    color: var(--primary-500);
    border-color: #fff;
}
.event-learn-more-btn .svg-icon {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.events-main-content {
    display: flex;
    flex-direction: column;
    padding: 32px;
    width: auto;
    height: 280px;
    background: var(--gradient-card);
    border: 1px solid #d9d9d9;
    backdrop-filter: blur(13px);
    border-radius: var(--radius-16);
    /* Overlap the image via negative margin (not `left`) so the frosted panel
       still stretches to the card's right edge — `left` left a ~35px gap on
       the right that read as a white bar (esp. on hover). */
    margin-left: -35px;
    flex-grow: 1;
    justify-content: center;
    gap: 5px;
}


.events-main-content .heading-26 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    flex-shrink: 0;
}




.c-tag-2,
.country-box,
.country-content,
ul.dropdown-menu li a {
    backdrop-filter: blur(13.05px)
}

.heading-26 {
    font-family: Urbanist, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 26px;
    line-height: normal;
    color: var(--primary-400)
}

ul.list-style-2 {
    display: flex;
    justify-content: space-between;
    align-items: self-start;
    flex-grow: 0;
    flex-wrap: wrap;
    padding: 5px 0;
}

ul.list-style-2 li {
    width: auto;
    font-size: 13px
}

/* Event-detail hero: keep the Register Interest button aligned to the left of
   the card rather than pushed hard to the right edge (which looked off,
   especially on trade-fair events that have no speakers). */
.inner-banner-card ul.list-style-2 {
    justify-content: flex-start;
    gap: 20px;
}

.inner-banner-card .c-spacer__vertical {
    width: 1px;
    height: 16px;
    background: var(--gray-400);
    margin: auto;
    opacity: .3
}

/* The separators are emitted before optional meta items (ticket price, speakers),
   so an event that has neither leaves a divider dangling with nothing after it —
   in the hero row and again in the Register Interest modal. Drop a trailing
   separator and any doubled-up pair. */
.inner-banner-card .c-spacer__vertical:last-child,
.inner-banner-card .c-spacer__vertical + .c-spacer__vertical {
    display: none;
}

.list-sepaker-img img {
    width: 30px;
    height: 30px;
    object-fit: cover;
    border-radius: 100%;
    position: relative;
    margin-left: -10px;
    border: 1px solid #fff;
}

.list-sepaker-img img:first-child {
    margin-left: 0 !IMPORTANT;
}

.list-sepaker-img {
    display: flex;
    align-items: center;
    gap: 2px
}

.events-main-content p {
    margin: 0;
    font-size: 16px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
    width: 60%;
}

ul.list-style-2 .date-1 .svg-icon,
.events-main-hm-text .date-1 .svg-icon {
    fill: var(--primary-300);
    color: var(--primary-300)
}

.events-hub-share {
    position: absolute;
    top: 12px;
    right: 47px;
}

.events-main-box:hover .event-main-img img {
    transform: scale(1.1) rotate(-4deg)
}

.events-hub-1-box ul.list-style-2 {
    flex-wrap: wrap
}

.share-btn,
.share-wrapper {
    align-items: center;
    gap: 5px;
}

.events-hub-1-box ul.list-style-2 li {
    width: 47%;
    padding: 0 0 10px;
    margin: 0 0 10px;
    border-bottom: 1px solid #e6e6e66e
}

.events-hub-1-box ul.list-style-2 li:nth-child(4),
.events-hub-1-box ul.list-style-2 li:nth-child(6) {
    border: 0;
    margin: 0;
    padding: 0
}

.resource-text p {
    font-size: 18px;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}

.country-fair-slider,
.events-main-slider,
.more-member-slider {
    width: calc(100% + ((100vw - 1920px)/ 2) + 300px)
}

.events-main-slider .events-hub-1-box {
    width: 95%;
    margin: auto
}

.events-hub-pg-4 {
    background-color: var(--gray-200);
}

.country-box {
    background: rgba(255, 255, 255, .2);
    border: 1px solid #d9d9d9;
    border-radius: 16px;
    /* overflow: hidden; */
}

.country-img {
    width: 100%;
    height: 190px;
    overflow: hidden;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.country-content {
    background: linear-gradient(129.5deg, rgba(138, 140, 228, 0) 67.58%, rgb(138 140 228 / 14%) 95.31%), rgb(255 255 255 / 94%);
    border-radius: 16px;
    padding: 30px 25px 25px;
    margin-top: -15px
}

.country-logo-icon img {
    width: 45px;
    height: 45px;
    border-radius: 100%;
    position: absolute;
    top: -25px;
    z-index: 8;
    background: white;
}

.country-img:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    z-index: 0;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, .9) 0, rgba(55, 56, 127, .9) 100%);
    opacity: .8
}

.country-share {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 10px;
    right: 10px;
    /* background: rgb(255 255 255 / 46%); */
    z-index: 9;
    /* color: rgb(255 255 255 / 46%); */
}

.country-share .c-share-1 a {
    background: rgb(255 255 255 / 21%);
    color: rgb(255 255 255 / 46%);
    border-color: rgb(255 255 255 / 46%);
}



.country-title {
    color: var(--primary-700);
    font-size: 20px;
    margin: 0 0 14px;
    line-height: normal;
       overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 1; 
           line-clamp: 1; 
   -webkit-box-orient: vertical;
}

.country-fair-slider .country-box {
    width: 97%;
    margin: auto
}

.share-wrapper {
    padding: 12px 15px;
    border-radius: 50px;
    display: inline-flex;
    box-shadow: inset 0 0 20px rgba(255, 255, 255, .03);
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 99;
    background: rgba(0, 0, 0, .8)
}

.icon-circle,
.share-btn {
    display: flex;
    transition: .3s
}

.share-btn {
    color: #fff;
    border: none;
    border-radius: 50px;
    padding: 10px 22px;
    font-weight: 500;
    font-size: 13px;
    text-align: left;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, .9) 0, rgba(55, 56, 127, .9) 100%);
    line-height: normal;
}

.inner-heading,
.inner-heading h1,
.social-popup {
    text-align: center
}

button#shareBtn:active,
button#shareBtn:focus {
    outline: 3px solid var(--primary-100);
    outline-offset: 3px
}

.share-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(123, 109, 255, .4)
}

.icon-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    border: 2px solid rgba(255, 255, 255, 0.1);
    cursor: pointer
}

.icon-circle:hover {
    background: #2a2a33;
    color: #fff;
    transform: translateY(-2px)
}

.social-popup {
    position: absolute;
    bottom: calc(100% + 14px);
    left: 0;
    background: #fff;
    border-radius: 18px;
    padding: 14px;
    display: grid;
    gap: 10px;
    box-shadow: 0 8px 40px rgb(0 0 0 / 21%), 0 0 0 1px rgba(255, 255, 255, .07);
    opacity: 0;
    transform: translateY(12px) scale(.95);
    transition: opacity .25s, transform .25s;
    transform-origin: bottom left;
    min-width: 220px
}

.social-popup::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 24px;
    width: 30px;
    height: 16px;
    background: #fff;
    clip-path: polygon(0 0, 100% 0, 50% 100%)
}

.social-popup.open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: all
}

.social-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: grid;
    place-content: center;
    justify-content: center;
    cursor: pointer;
    transition: .4s;
    border: 2px solid rgba(107, 109, 196, .3);
    outline: 0
}

.custom-arrow-purple,
.custom-arrow-yellow {
    width: 40px;
    height: 40px;
    display: inline-grid;
    transition: .4s;
    font-size: 18px;
    place-content: center
}

.social-icon:hover {
    transform: translateY(-2px);
    background: var(--primary-300)
}

.social-icon svg {
    fill: white;
    color: #fff
}

.si-whatsapp {
    background: #1ad65e
}

.si-linkedin {
    background: #2b66aa
}

.si-facebook {
    background: #1179f2
}

.si-pinterest {
    background: #eb0426
}

.si-x {
    background: #02142d
}

.si-instagram {
    background: #d30b9a
}

.si-email {
    background: var(--primary-400)
}

.si-copy {
    background: var(--primary-500)
}

.fixed-share-wrap .events-share-popup {
    bottom: calc(100% + 14px);
    left: 0;
    right: auto;
    top: auto
}

.fixed-share-wrap .events-share-popup::after {
    top: auto;
    bottom: -8px;
    right: auto;
    left: 25px;
    transform: inherit
}

section {
    z-index: 5;
    background: #fff;
    scroll-margin-top: 80px
}

div {
    scroll-margin-top: 80px
}


.custom-arrow-yellow {
    border-radius: 100%;
    background: var(--secondary-400);
    color: #000;
    border: 0
}

.custom-arrow-purple,
.reg-dot.active,
.reg-dots span.active,
ul.slick-dots li.slick-active button {
    background: var(--primary-200)
}

.custom-arrow-yellow:hover,
.reg-next:hover,
.reg-prev:hover {
    opacity: .8
}

.testimonial-slider button.slick-arrow {
    position: absolute;
    top: 43%;
    z-index: 9
}

.testimonial-slider button.slick-prev {
    left: -10px
}

.testimonial-slider button.slick-next {
    right: -10px
}

.custom-arrow-purple {
    border-radius: 100%;
    color: #fff;
    border: 0
}

/* Slick marks a spent arrow .slick-disabled (and the resource sliders set the
   disabled property), but nothing ever styled that state — so an inert control
   looked and hovered exactly like a working one and read as a broken button. */
.custom-arrow-purple.slick-disabled,
.custom-arrow-purple[aria-disabled="true"],
.event-arrow.slick-disabled,
.reg-prev:disabled,
.reg-next:disabled,
.circle-btn:disabled,
.circle-btn.disabled,
.page-btn:disabled,
.page-btn.disabled {
    opacity: .35;
    /* !important because line 1683 forces cursor:pointer on every a/button. */
    cursor: default !important;
    pointer-events: none;
}

.events-list-home-slider .slick-arrow {
    position: absolute;
    top: -60px
}

.events-list-home-slider .event-arrow.next {
    left: 120px
}

ul.slick-dots {
    display: flex;
    align-items: center
}

ul.slick-dots li button {
    font-size: 0;
    background: #cfcfcf;
    border: 0;
    width: 12px;
    height: 12px;
    border-radius: 100px;
    margin: 0 4px;
    padding: 0
}

.events-main-home ul.slick-dots {
    position: absolute;
    bottom: 0;
    right: 0
}

.page-btn {
    font-weight: 600;
    font-size: 15px;
    transition: .3s
}

.circle {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-content: center;
    justify-content: center
}

.page-btn.circle {
    background: #f1f1f1;
    color: #666
}

.page-btn.active,
.page-btn.purple {
    background: var(--primary-200);
    color: #fff
}

.page-btn:not(.disabled):not(:disabled):hover {
    transform: translateY(-2px);
    opacity: .9
}

.page-dots {
    font-weight: 600;
    color: #999;
    padding: 0 6px;
    width: 24px;
    height: 24px;
}

.c-tag-2 {
    padding: 6px 17px;
    gap: 10px;
    border-radius: 65px;
    background: rgba(10, 10, 10, 0.3);
}

.heading-36 {
    font-weight: 500;
    font-size: 36px;
    color: var(--primary-400)
}

.badge,
.cta {
    color: #000;
    background: #ffbf4d
}

.more-member-slider .member-company-boxes {
    width: 93%;
    margin: auto;
}

.more-member-slider .member-company-boxes .company-m-text {
    min-height: 170px;
}

/* .more-member-slider .custom-arrow-purple {
    position: absolute;
    bottom: 63px;
    left: -190px;
    z-index: 9
}

.more-member-slider .slick-prev {
    left: -355px
}

.more-member-slider ul.slick-dots {
    position: absolute;
    bottom: 77px;
    left: -305px;
    justify-content: center;
    min-width: 100px
} */

ul.dropdown-menu li {
    padding: 0
}

.dropdown-menu {
    display: unset
}

ul.menus ul.dropdown-menu li a {
    font-size: 16px;
    color: var(--gray-1500);
    font-weight: 600
}

ul.dropdown-menu li a {
    border-bottom: 1px solid #eee;
    padding: 14px 15px
}

ul.dropdown-menu li:last-child a {
    border-bottom: none
}

ul.dropdown-menu li:hover {
    background: var(--gray-300);
    color: #5e5fa3
}

.dropdown-menu:before {
    position: absolute;
    content: "";
    width: 16px;
    height: 16px;
    background: #fff;
    top: -8px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
}

.report-card:hover .report-text,
ul.menus ul.dropdown-menu li:hover a {
    color: var(--primary-500)
}

ul.menus.desktop-menu li:nth-child(2) .dropdown-menu {
    left: -60px;
}

ul.menus.desktop-menu li:nth-child(3) .dropdown-menu {
    left: -50px;
}

ul.menus.desktop-menu li:nth-child(4) .dropdown-menu {
    left: -80px;
}

ul.menus ul.dropdown-menu li:hover a {
    color: var(--primary-500);
}

ul.menus ul.dropdown-menu li a:before {
    position: absolute;
    content: "";
    width: 0;
    height: 100%;
    background: var(--gray-400);
    transition: .4s ease;
    top: 0;
    left: 0;
    z-index: -1;
}

ul.menus ul.dropdown-menu li:hover a:before {
    width: 100%;
}

ul.menus ul.dropdown-menu li.active a:before {
    background: var(--primary-300);
}

ul.menus ul.dropdown-menu li.active a {
    color: var(--gray-50);
    background: var(--primary-300);
}

/* Dropdown items: a clean full-width hover/active fill that follows the panel's
   10px rounded corners (no white slivers). Replaces the old sliding :before
   fill and the square-cornered li:hover background. */
ul.menus ul.dropdown-menu {
    padding: 0;
}

ul.menus ul.dropdown-menu li {
    background: transparent;
}

ul.menus ul.dropdown-menu li a {
    position: relative;
    overflow: hidden;
    /* Drop the 1px #eee divider — it showed as a white gap between the fill and
       the neighbouring items on hover/active. The fill is the separator now. */
    border-bottom: 0;
    transition: background .2s ease, color .2s ease;
}

/* Kill the old animated sliding fill. */
ul.menus ul.dropdown-menu li a:before {
    display: none;
}

/* Fill lives on the <a> only, so it can be clipped to rounded corners. */
ul.menus ul.dropdown-menu li:hover {
    background: transparent;
}

ul.menus ul.dropdown-menu li:hover a {
    background: var(--gray-300);
    color: var(--primary-500);
}

ul.menus ul.dropdown-menu li.active a {
    background: var(--primary-300);
    color: var(--gray-50);
}

ul.menus ul.dropdown-menu li:first-child a {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

ul.menus ul.dropdown-menu li:last-child a {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


@media (min-width:992px) {
    .menus li {
        position: relative
    }

    .menus li:hover>.dropdown-menu {
        opacity: 1;
        transform: scale(1);
        visibility: visible
    }
}

.badge {
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 14px;
    display: inline-block;
    margin-bottom: 20px
}

.cta {
    border: none;
    padding: 14px 26px;
    border-radius: 999px;
    font-weight: 600;
    cursor: pointer
}

.circle-btn {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #ffbf4d;
    border: none;
    font-size: 22px;
    cursor: pointer
}

.footer-overlay,
.footer-overlay:before {
    position: absolute;
    width: 100%;
    height: 100%
}

.footer-bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: 0;
    opacity: .9;
}

.footer-overlay {
    top: 0;
    left: 0;
    z-index: 1;
    background: #0a0a1a;
    opacity: .9;
}

.footer-overlay:before {
    content: "";
    left: 0;
    top: 0;
    background: rgba(10, 10, 26, .9)
}

/* Docked to the right-hand utility column rather than bottom-left: on the left it
   sat straight over the member-directory filter sidebar and the footer links, and
   reached ~179px into the listing pages' content column. bottom:110px stacks it
   clear above the share cluster (right:20px; bottom:20px; 74px tall). */
.event-wrapper {
    position: fixed;
    bottom: 110px;
    right: 30px;
    left: auto;
    width: 380px;
    z-index: 9;
    transition: .4s
}

/* On phones the fixed 380px box overflowed the viewport (so the date/location
   ran off-screen). Fit it to the viewport; the .collapsed width:0 still wins by
   specificity, so the collapse behaviour is unchanged. */
@media (max-width: 767px) {
    .event-wrapper {
        right: 16px;
        width: calc(100vw - 32px);
        max-width: 380px;
    }
}

.event-toggle,
.event-wrapper .event-arrow {
    position: absolute;
    bottom: 100%;
    transform: translateY(20px);
    width: 40px;
    height: 40px;
    transition: .4s;
    /* box-shadow: 0 5px 15px rgba(0, 0, 0, .2); */
    color: #000;
    cursor: pointer
}

.event-toggle {
    left: -10px;
    /* border: 1px solid #ffbe4d; */
    /* background: #fff; */
    /* border-radius: 50%; */
    display: flex;
    align-items: center;
    justify-content: center;
    /* Above .event-fixed-cover (z-index:3), which is a full-bleed link overlay on
       the expanded card and was covering the bottom half of this toggle. */
    z-index: 5;
}

.toggle-text {
    display: none;
    margin-left: 8px;
    font-size: 13px;
    background: var(--secondary-300);
    padding: 4px 8px;
    border-radius: 30px;
    font-weight: 500;
}

.event-fixed {
    position: relative;
    background: #000000d4;
    border-radius: 20px;
    padding: 9px;
    display: flex;
    gap: 15px;
    align-items: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .3);
    transition: .4s
}

/* Full-card link overlay — makes the entire featured-event box tappable
   (the arrow alone was hover-only, so on mobile the event couldn't be opened). */
.event-fixed-cover {
    position: absolute;
    inset: 0;
    z-index: 3;
    border-radius: 20px;
}

.event-badge,
.event-wrapper.collapsed .toggle-text {
    display: inline-block
}

.event-fixed:hover {
    background: linear-gradient(135deg, #2b2e4a, #1e213ad6)
}

.event-img img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 15px
}

.event-content p {
    font-size: 12px;
    font-style: italic;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    line-height: 1.45;
    margin-bottom: 0;
}

/* Keep the calendar icon on its own column so a wrapped date/location line
   ("…Hong Kong, China") no longer collides with the icon above it. */
.event-content p .svg-icon {
    flex-shrink: 0;
    margin-top: 1px;
}

.event-badge {
    background: var(--secondary-300);
    color: #000;
    font-size: 11px;
    padding: 5px 10px;
    border-radius: 20px;
    margin-bottom: 10px;
    font-weight: 600;
    line-height: 1;
}

.event-wrapper .event-arrow {
    right: -10px;
    /* border: 1px solid #ffbe4d; */
    background: var(--secondary-300);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transform: rotate(-45deg);
    top: -13px;
}

.button-row,
.side-header {
    justify-content: space-between
}

.event-fixed:hover .event-arrow,
.side-modal.active .side-overlay {
    opacity: 1
}

.event-wrapper.collapsed {
    height: 45px;
    width: 0
}

.event-wrapper.collapsed .event-fixed {
    transform: translateY(120%);
    opacity: 0
}

/* Collapsed, this was a 179x40 "Upcoming Events" pill reaching into the page's
   content column. Keep it to the 40x40 icon and pin it to the wrapper's right
   edge; the label stays in the accessibility tree and returns on hover. */
.event-wrapper.collapsed .event-toggle {
    bottom: 0;
    transform: translateY(0);
    border-radius: 25px;
    left: auto;
    right: -10px;
    width: 40px;
    padding: 0
}

.event-wrapper.collapsed .toggle-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

.event-wrapper.collapsed .event-toggle:hover,
.event-wrapper.collapsed .event-toggle:focus-within {
    width: auto;
    padding: 0 15px;
}

.event-wrapper.collapsed .event-toggle:hover .toggle-text,
.event-wrapper.collapsed .event-toggle:focus-within .toggle-text {
    position: static;
    width: auto;
    height: auto;
    padding: 4px 8px;
    overflow: visible;
    clip-path: none;
}

.event-wrapper.collapsed .arrow-icon {
    transform: rotate(180deg)
}

.event-wrapper .arrow-icon {
    width: 25px;
    height: 25px;
    background: white;
    border: 3px solid var(--secondary-300);
    border-radius: 100%;
    display: grid;
    place-content: center;
}

.event-wrapper .arrow-icon svg.svg-icon {
    width: 11px;
    height: 11px;
}

.toggle-text {
    color: #000
}

.side-modal {
    position: fixed;
    inset: 0;
    z-index: 9999
}

.side-modal.active {
    pointer-events: auto
}

.side-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .6);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: .3s
}

.side-panel {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 70%;
    max-width: 1050px;
    background: #fff;
    padding: 50px;
    overflow-y: auto;
    transform: translateX(100%);
    transition: .4s;
    margin: 0;
    z-index: 999
}

.side-modal.active .side-panel {
    transform: translateX(0)
}

.side-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.side-panel .close-btn {
    font-size: 18px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    display: grid;
    place-content: center;
    background: rgba(217, 217, 217, 0.7);
    border-radius: 100%;
    opacity: 1;
    border: 2px solid rgba(128, 128, 128, 0.3);
    color: var(--gray-1500);
    position: absolute;
    top: -20px;
    right: -20px;
}

.side-body p {
    margin-bottom: 15px;
    color: var(--gray-1500)
}

.border-light {
    border-color: rgba(230, 230, 230, 1) ! IMPORTANT;
}

.signup-steps {
    display: grid;
    gap: 20px;
    margin: 20px 0
}

.signup-steps .step {
    display: flex;
    gap: 10px;
    flex-direction: column;
    color: var(--gray-1400);
    font-size: 17px;
    height: 100%
}

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

.form-group.full,
.social-popup hr,
.social-popup span {
    grid-column: 1/-1
}

input,
select,
textarea {
    width: 100%;
    padding: 13px 20px;
    border-radius: 30px;
    border: 1px solid var(--gray-500);
    outline: 0;
    color: var(--gray-1200);
    font-size: 16px;
    font-family: Urbanist;
    background: #fff;
    transition: all .25s ease;
}

textarea {
    border-radius: 15px;
    min-height: 120px
}

input::placeholder,
select,
textarea::placeholder {
    color: var(--gray-1100);
}


.form-control:focus,
input:focus,
select:focus,
textarea:focus {
    background-color: var(--gray-200);
    box-shadow: none;
    border-color: var(--gray-700);
    color: var(--gray-1400);
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
    -webkit-text-fill-color: var(--gray-1400) !important;
    border: 1px solid var(--gray-600) !important;
}

input.is-invalid,
select.is-invalid {
    border: 1px solid #ED6F6F !important;
    color: var(--gray-1400) !important;
}

.text-danger {
    color: var(--error-dark) !important;
}

input.is-valid,
select.is-valid {
    border: 1px solid #28a745 !important;
}

input:disabled,
select:disabled,
textarea:disabled {
    background: #f3f3f3;
    color: #999;
    cursor: not-allowed;
    opacity: .8;
}






.submit-area {
    margin-top: 30px
}

@media (max-width:992px) {
    .side-panel {
        width: 100%
    }

    .form-grid,
    .steps {
        grid-template-columns: 1fr
    }
}

.login-page {
    position: relative;
    min-height: 910px;
    width: 100%;
}

.split-container {
    display: flex;
    height: 100%;
    width: 100%;
    /* position: relative; */
    justify-content: center;
    background: #0a0a1a;
    z-index: 8;
    min-height: 910px;
}

.split-container:before {
    position: absolute;
    content: "";
    width: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, rgba(10, 10, 26, .6) 99.99%);
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 48.31%);
}

.split-container:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    /* background: linear-gradient(180deg, rgba(0, 0, 0, .4) 0, rgba(0, 0, 0, 0) 48.31%); */
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, rgba(10, 10, 26, 0.6) 99.99%);
    opacity: .6;
}

.report-card .icon-box,
.testimonial-slider ul.slick-dots li.slick-active button {
    background: var(--secondary-300)
}

.left-side {
    position: relative;
    width: 50%;
    overflow: hidden;
    /* border-bottom-left-radius: 50px; */
}

.left-side video {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .5;
}

.left-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(135deg, #000c59e6, #000000d9); */
    /* opacity: .95; */
    top: 0;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, 0.6) 0%, rgba(55, 56, 127, 0.6) 100%)
        /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */
    ;
}

.left-content {
    position: relative;
    z-index: 2;
    color: #fff
}

.left-content h1 {
    font-size: 60px;
    font-weight: 500;
    margin-bottom: 25px
}

.left-content .login-para {
    font-size: 23px
}

.right-side {
    width: 50%;
    background: url('../images/esma-bg-login.jpg') right/cover no-repeat;
    position: relative;
    /* border-bottom-right-radius: 50px; */
}

.mid-card {
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 9
}

.login-card {
    position: relative;
    background: rgba(38, 39, 97, .65);
    border-radius: 24px;
    width: 92%;
    margin: auto
}

.login-card-inner {
    background: rgba(255, 255, 255, .95);
    backdrop-filter: blur(40px);
    border-radius: 24px;
    padding: 50px;
    min-height: 400px;
}

.form-group {
    margin-bottom: 25px;
    position: relative
}

.input-wrapper span {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: #999;
    cursor: pointer
}

.login-card .input-wrapper svg {
    position: absolute;
    top: 18px;
    right: 20px;
    color: var(--gray-1300);
    cursor: pointer
}

.button-row {
    display: flex;
    align-items: center;
    margin-top: 10px;
    flex-wrap: wrap;
}

/* Register Interest section form: align the submit button to the left (next to
   the captcha) instead of pushing it to the far right of the row. */
.events-de-register .button-row {
    justify-content: flex-start;
    gap: 16px 24px;
}

.bottom-bar {
    left: 0;
    padding: 22px 30px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    display: flex;
    justify-content: space-between;
    color: #fff;
    font-size: 17px;
    backdrop-filter: blur(20px)
}

.bottom-bar a {
    color: #f5d37c
}

input[type=checkbox],
input[type=radio] {
    width: 20px;
    height: 20px;
    border: 1px solid var(--gray-500);
    flex-shrink: 0;
}

.custom-dropdown .search-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    padding-bottom: 0
}

.custom-dropdown .search-actions a {
    width: auto;
    height: auto;
    padding: 0 !important
}

.language-dropdown li {
    padding: 0 0 12px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    font-size: 17px;
    color: var(--gray-1400);
    position: relative;
    font-weight: 600;
    cursor: pointer;
}

.language-dropdown li span.lang-code {
    margin-left: auto;
    color: #919191;
    font-size: 14px
}

.language-dropdown li img {
    width: 20px;
    height: 20px;
    border-radius: 100px
}

.language-dropdown li:before {
    position: absolute;
    content: "";
    width: 100%;
    background: linear-gradient(90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%);
    left: 0;
    bottom: 0;
    z-index: 9;
    height: 1px
}

.custom-dropdown.profile-dropdown li {
    padding: 0;
    margin: 0;
    font-weight: 600;
    color: var(--gray-1400);
}

.custom-dropdown.profile-dropdown li a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 12px 20px;
}

.custom-dropdown.profile-dropdown li:hover {
    background: var(--gray-200);
    color: var(--primary-500);
}



.active-lang-mark {
    position: relative;
    padding-left: 16px;
}

.active-lang-mark::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);

    width: 10px;
    height: 10px;

    background-image: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.72218 2.97304L4.32335 8.37182C3.95135 8.74382 3.35042 8.74382 2.97842 8.37182L0.279003 5.67243C-0.093001 5.30043 -0.093001 4.6995 0.279003 4.3275C0.651007 3.9555 1.25194 3.9555 1.62394 4.3275L3.64611 6.34966L8.3677 1.62812C8.73971 1.25612 9.34064 1.25612 9.71264 1.62812C10.0942 2.00012 10.0942 2.60105 9.72218 2.97304Z' fill='%238A8CE4'/%3E%3C/svg%3E");

    background-size: contain;
    background-repeat: no-repeat;
}

ul.custom-dropdown.language-dropdown {
    width: 240px;
    left: -85px;
    padding: 20px 24px
}

.login-btns a.dropdown-toggle-btn:hover {
    border: 1px solid #dddddd3d
}

.dropdown-item-wrapper.active .dropdown-toggle-btn {
    color: #000;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, #ffbe4d 0, #f5a623 100%);
    border-color: rgba(255, 190, 77, .3)
}



svg.svg-icon {
    width: 20px;
    height: 20px;
    visibility: visible;
    display: inline-flex;
    flex-shrink: 0
}

.svg-icon.arrow-svg {
    width: 15px;
    height: 15px;
}

.acc-tag {
    position: absolute;
    right: 5%;
    padding: 10px 20px;
    font-size: 13px;
    border-radius: 50px;
    font-weight: 600;
    display: inline-block;
    text-transform: capitalize;
    background: rgba(255, 255, 255, 1);
    backdrop-filter: blur(26px);
    color: var(--gray-1600);
    font-weight: 700;
}

.report-card,
.report-card .icon-box,
.report-card .meta-info,
.report-left,
.report-meta {
    display: flex;
    display: flex
}

.scroll-box {
    cursor: pointer;
    opacity: .9;
}

.help-center-sec {
    background-image: url(../images/abpage-bg.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

.bg-primary-900 {
    background-color: var(--primary-900);
}

.help-center-pg {
    border-top-left-radius: 48px;
    border-top-right-radius: 48px;
}

.help-center-tabs .nav-tabs .nav-link {
    margin: 0 25px 0 0;
}



.reports-section {
    background: #f5f6fb;
    padding: 60px 0
}

.report-card {
    justify-content: space-between;
    align-items: center;
    border-radius: var(--radius-16);
    padding: 0;
    margin-bottom: 20px;
    border: 1px solid #e6e6e6;
    background: #fff;
    transition: .4s;
    overflow: hidden
}

.report-left {
    align-items: center;
    gap: 20px
}

.report-card .icon-box {
    width: 80px;
    height: 80px;
    border-radius: 14px 0 0 14px;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    color: var(--primary-600);
    flex-shrink: 0;
    transition: .4s
}

.report-meta {
    align-items: center;
    gap: 30px;
    padding-right: 20px
}

.report-card .meta-info {
    align-items: center;
    gap: 10px;
    color: var(--gray-1200);
    font-size: 14px;
    padding: 0 30px;
    border: 1px solid #cccccc4f;
    align-items: center;
    height: 100%;
    width: auto;
    border-top: 0;
    border-bottom: 0;
    /* justify-content: space-between !important; */
}

.size {
    margin-left: 10px
}

.circle .svg-icon,
.circle-btn .svg-icon,
.reg-next .svg-icon,
.reg-prev .svg-icon,
.report-card .meta-info .svg-icon {
    width: 16px;
    height: 16px
}

.report-card .download-btn,
.report-card .report-text {
    width: auto;
    height: 100%;
    padding: 0 20px;
    min-height: 80px;
    display: flex
}

.pdf-pill {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    background: var(--gray-400);
    backdrop-filter: blur(13.05px);
    color: #000;
    font-weight: 600
}

.report-card .download-btn {
    color: var(--primary-500);
    align-items: center;
    gap: 8px;
    font-size: 18px;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgb(81 82 158 / 0%) 0, rgb(55 56 127 / 0%) 100%);
    transition: .3s;
    font-weight: 500
}

.reports-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 40px;
    gap: 20px
}

.report-card .report-text {
    flex: 1;
    background: var(--gray-200);
    color: var(--gray-1400);
    align-items: center;
    font-size: 19px
}

.active-year,
.reports-bottom .circle-btn {
    background: var(--primary-200);
    color: #fff
}

.report-card:hover .icon-box {
    background: var(--secondary-500)
}

.report-card:hover .download-btn,
a.events-share:hover {
    background: var(--gradient-primary);
    color: #fff
}

.outer-side svg.svg-icon,
.report-card .icon-box svg {
    width: 30px;
    height: 30px
}


.signup-steps svg.svg-icon {
    width: 32px;
    height: 32px
}



.year-pagination {
    display: flex;
    align-items: center;
    gap: 15px
}

.reports-bottom .circle-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    position: revert;
    font-size: 15px;
    display: grid;
    place-content: center
}

.active-year {
    padding: 6px 15px;
    border-radius: 20px
}

.see-all-btn {
    border: 2px solid #5b5bb5;
    padding: 10px 20px;
    border-radius: 30px;
    color: #5b5bb5;
    font-weight: 500
}

.reg-swiper-track {
    display: flex;
    transition: transform .5s
}

.reg-slide {
    min-width: 33.33%;
    padding: 0 15px;
}

.reg-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
    gap: 20px
}

.reg-next,
.reg-prev,
ul.share-news-icons li a {
    display: inline-grid;
    color: #fff;
    place-content: center
}

.reg-next,
.reg-prev {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    background: var(--primary-200);
    font-size: 18px;
    transition: .3s
}

.reg-dot,
.reg-dots span {
    background: #ccc;
    border-radius: 50%;
    cursor: pointer
}

.lead,
.share-news {
    font-size: 24px
}

.reg-dots {
    display: flex;
    gap: 8px
}

.reg-dot {
    width: 8px;
    height: 8px
}

.border-radius-sec {
    border-radius: 48px 48px 0 0;
    margin-top: -40px;
}

.resource-slider-wrapper .row {
    display: flex;
    flex-wrap: nowrap;
    transition: transform .5s
}

.resource-slider-wrapper .col-lg-4 {
    flex: 0 0 33.3333%;
    max-width: 33.3333%
}

.resource-slider-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 35px
}

.reg-dots span {
    width: 10px;
    height: 10px;
    transition: .3s
}

.menu-toggle {
    display: none;
    flex-direction: column;
    cursor: pointer;
    gap: 5px
}

.menu-toggle span {
    width: 25px;
    height: 3px;
    background: #fff;
    transition: .3s
}

.menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 998
}

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

body.menu-open {
    overflow: hidden;
    height: 100vh
}

.dropdown-menu {
    position: absolute;
    top: 60px;
    left: 0;
    background: #fff;
    min-width: 250px;
    border-radius: 10px;
    box-shadow: 0 30px 150px 0 #26276133;
    border: 0;
    opacity: 0;
    transition: .4s ease-in-out;
    transform: scale(.9);
    visibility: hidden;
    padding: 8px 0;
    overflow-x: clip
}

.events-share-popup.show-label .share-divider,
.events-share-popup.show-label .share-label,
.menus li:hover .dropdown-menu,
.mfb-results-text.show {
    display: block
}

.contact-map .map-wrapper {
    position: absolute;
    left: 0;
    width: 50%;
    height: 100%;
}

.map-wrapper iframe {
    width: 100%;
    height: 100%;
    filter: grayscale(1);
    border-top-left-radius: 48px;
    border-bottom-left-radius: 48px;
}

.map-wrapper svg {
    width: 45px;
    height: 45px;
    position: absolute;
    top: 48.5%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.videoModal .modal-dialog {
    max-width: 100%
}

.reports-accordion,
.videoModal .modal-content {
    border: 0;
    background: 0 0
}

.videoModal iframe,
.videoModal img,
.videoModal video {
    width: 100%;
    height: 450px;
    object-fit: cover
}

.videoModal .btn-close {
    color: #fff;
    background: rgb(255 255 255 / 19%);
    border: 2px solid rgba(255, 255, 255, .2);
    backdrop-filter: blur(26px);
    width: 45px;
    height: 45px;
    border-radius: 100%;
    position: fixed;
    right: 50px;
    top: 50px;
    z-index: 9;
    opacity: 1;
    padding: 0;
}

.btn-style-5,
.btn-style-5:hover,
.mem-profile-share a,
.news-newsletter-form,
ul.share-news-icons li a {
    backdrop-filter: blur(13.05px)
}

.videoModal .modal-body {
    width: 1000px;
    margin: auto;
    padding: 0;
}

.testimonial-slider ul.slick-dots {
    justify-content: center;
    margin: 15px 0 0
}

.events-share-popup {
    opacity: 0;
    transform: scale(.9) translateY(8px);
    transition: opacity .25s, transform .25s;
    bottom: auto;
    right: -20px;
    left: auto;
    top: 61px;
}

.events-share-popup.is-open {
    opacity: 1;
    pointer-events: all;
    transform: scale(1) translateY(0)
}

.events-share-popup .social-icon {
    opacity: 0;
    transform: scale(.7);
    transition: opacity .2s, transform .2s
}

.events-share-popup .social-icon.icon-visible {
    opacity: 1;
    transform: scale(1)
}

.si-copy.copied {
    background-color: #22c55e
}

.events-share-popup::after {
    top: -9px;
    bottom: auto;
    right: 25px;
    left: auto;
    transform: rotate(180deg)
}

.home-logos-header::after,
.home-logos-header::before {
    content: "";
    position: absolute;
    top: -48px;
    width: 48px;
    height: 48px;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none
}

.social-popup hr {
    background: linear-gradient(to top, rgb(96 97 165) 0, rgba(96, 97, 165, .363) 30%, rgba(255, 228, 179, 0) 100%)
}

.event-year-nav {
    display: flex;
    align-items: center;
    margin: 0 0 1.5rem;
    gap: 1.5rem
}

.long-info p:last-child,
.membership-box p,
.missio-box p,
.step-flow:last-child,
p.event-year,
ul.share-news-icons li {
    margin: 0
}

.home-logos-header::before {
    left: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L0 48L48 48C19.1186 46.7797 0.813559 25.2203 0 0Z' fill='%23fff'/%3E%3C/svg%3E");
    fill: #ffffff !important;
}

.home-logos-header::after {
    right: 0;
    left: auto;
    background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 48L48 48L48 0C46.7797 28.8814 25.2203 47.1864 0 48Z' fill='%23fff'/%3E%3C/svg%3E");
    fill: white !important
}

.inner-hero-overlay,
.inner-hero-overlay:before {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    content: ""
}

.inner-hero-overlay {
    background: rgb(2 2 34);
    left: 0;
    opacity: .8;
    z-index: -1
}

.inner-hero-overlay:before {
    background: linear-gradient(180deg, rgb(0 3 36) 0, rgb(0 0 0 / 0%) 48.31%);
    z-index: 2
}

.inner-hero-overlay:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 40%;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, rgb(2 2 30 / 60%) 99.99%)
}

svg.svg-three-arrow {
    width: 15px;
    height: 13px
}

.form-group label span,
label span {
    color: var(--error);
    font-size: 17px
}

.btn-style-5 {
    border: 2px solid var(--gray-1200);
    padding: 14px 28px;
    border-radius: 58px;
    background: 0 0;
    color: var(--gray-1400);
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.btn-style-5:hover {
    background: var(--gray-1200);
    color: white;
}

.info-row .arrow-svg {
    fill: var(--primary-300);
    color: var(--primary-300);
}

.members-filter .accordion-button::after {
    width: 17px;
    height: 17px;
    filter: grayscale(1);
    background-size: contain
}

.members-filter .accordion-item:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%)
}

.members-filter .accordion-item:last-child:after {
    background: 0;
    display: none;
}

.members-filter .accordion-body {
    padding: 0 0 1rem
}

.members-filter .accordion-button {
    padding: 1.2rem 0
}

.scroll {
    overflow-y: auto
}

.scroll::-webkit-scrollbar {
    width: 8px
}

.scroll::-webkit-scrollbar-track {
    background: var(--gray-500);
    border-radius: 10px
}

.scroll::-webkit-scrollbar-thumb {
    background: var(--primary-300);
    border-radius: 10px
}

.scroll::-webkit-scrollbar-thumb:hover {
    background: var(--primary-400)
}

.scroll::-webkit-scrollbar-button {
    display: none;
    height: 0;
    width: 0
}

input[type=checkbox] {
    accent-color: var(--secondary-400)
}

.member-profile-banner:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgb(10 10 26), transparent);
    bottom: -2px;
    left: 0;
    z-index: -1
}

.member-profile-main-pg {
    color: #fff;
    background: rgb(10 10 26)
}

.more-member-slider-wrap {
    overflow: visible
}

.mem-profile-share a {
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: white;
}

span.label-text {
    color: var(--gray-1300) !important;
    font-size: 16px;
}

.accordion-button:focus,
button {
    box-shadow: none
}

select option {
    padding: 7px 10px;
    background: #f8f8f8;
    border-bottom: 1px solid
}


.calender-box .flatpickr-calendar {
    width: 100%;
    background: #fff;
    box-shadow: 0 30px 150px rgba(38, 39, 97, .2);
    border-radius: 16px;
    padding: 25px
}

.calender-box .flatpickr-calendar .flatpickr-months {
    display: flex;
    align-items: center;
    margin: 0 0 20px
}

.calender-box .flatpickr-months .flatpickr-next-month,
.calender-box .flatpickr-months .flatpickr-prev-month {
    position: revert;
    width: 35px;
    height: 34px;
    flex-shrink: 0;
    background: var(--primary-200);
    color: #fff;
    fill: white;
    display: grid;
    border-radius: 100%
}

.calender-box .flatpickr-current-month {
    width: auto;
    position: revert
}

.calender-box .flatpickr-month {
    width: auto !important;
    height: auto;
    line-height: 3
}

.calender-box .flatpickr-current-month select,
.calender-box .numInputWrapper {
    border: 1px solid var(--gray-500);
    padding: 4px 8px;
    border-radius: 30px;
    margin: 0 3px
}

.flatpickr-day.selected {
    border: 2px solid var(--secondary-300);
    background: 0 0;
    color: #000
}

/* Events Calendar ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â today (grey) vs days with events (yellow); events win over today */
.calender-box .flatpickr-day {
    position: relative;
}

.calender-box .flatpickr-day.today:not(.has-events),
.calender-box .flatpickr-day.is-today {
    border: 2px solid var(--gray-500, #9ca3af) !important;
    border-radius: 50%;
    background: transparent !important;
    color: inherit;
}

.calender-box .flatpickr-day.has-events,
.calender-box .flatpickr-day.today.has-events {
    border: 2px solid var(--secondary-300, #f5c518) !important;
    border-radius: 50%;
    background: rgba(245, 197, 24, 0.15) !important;
    color: inherit;
}

.calender-box .flatpickr-day.has-event-count {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    height: 39px;
}

.calender-box .flatpickr-day .flatpickr-day-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    pointer-events: none;
}

.calender-box .flatpickr-day .flatpickr-event-count {
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    color: var(--secondary-300, #f5c518);
}

.calender-box .flatpickr-day .flatpickr-day-num {
    font-size: inherit;
    line-height: 1.1;
}

.calender-box .flatpickr-day.has-events.selected,
.calender-box .flatpickr-day.is-today.selected {
    background: var(--secondary-300, #f5c518);
    color: #000;
    border-color: var(--secondary-300, #f5c518);
}

.flatpickr-months .flatpickr-next-month:hover svg,
.flatpickr-months .flatpickr-prev-month:hover svg {
    fill: white
}

.bg-grey {
    background-color: var(--gray-200)
}


.rounded-corners-sec:before {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 48px;
    height: 48px;
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L0 48H48C19.1186 46.7797 0.81356 25.2203 0 0Z' fill='%230A0A1A'/%3E%3C/svg%3E") center/contain no-repeat;
    z-index: 7;
}


.rounded-corners-sec:after {
    content: "";
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 48px;
    height: 48px;
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 0V48H0C28.8814 46.7797 47.1864 25.2203 48 0Z' fill='%230A0A1A'/%3E%3C/svg%3E") center/contain no-repeat;
    z-index: 7;
}

.corner-sec-2::before {
    bottom: inherit;
    top: -1px;
    transform: rotate(90deg);
    z-index: 7;
}

.corner-sec-2::after {
    bottom: inherit;
    top: -1px;
    transform: rotate(-90deg);
    z-index: 7;
}

/* .about-pg-corners::before {
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L0 48H48C19.1186 46.7797 0.81356 25.2203 0 0Z' fill='%230a0a1a'/%3E%3C/svg%3E") center/contain no-repeat
}

.about-pg-corners::after {
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 0V48H0C28.8814 46.7797 47.1864 25.2203 48 0Z' fill='%230a0a1a'/%3E%3C/svg%3E") center/contain no-repeat
} */

.news-tags li a {
    color: var(--gray-1400);
    display: inline-block;
    width: 100%;
    padding: 0 10px 10px;
    margin: 0 0 10px;
    border-bottom: 1px solid var(--gray-400)
}

.news-tags li:last-child a {
    border: 0;
    padding-bottom: 0;
    margin: 0
}

.news-upcoming .events-list-hm {
    width: 100%;
    border-color: var(--gray-300);
    box-shadow: none
}

.news-newsletter-form {
    background: var(--gray-200);
    border: 1px solid var(--primary-100);
    border-radius: 16px;
    padding: 20px
}

.news-p {
    color: var(--gray-1600);
    font-weight: 500
}

.reports-accordion .accordion-item {
    border: 0;
    background: 0 0;
    position: relative
}

.reports-accordion .accordion-button {
    background: 0 0;
    border: 0;
    box-shadow: none;
    padding: 1.2rem 1rem
}

.reports-accordion .accordion-item:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    left: 0;
    bottom: 0;
    background: linear-gradient(90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%);
    z-index: 9
}

.accordion-button::after {
    width: 1rem;
    height: 1rem;
    background-size: contain
}

.years-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.years-grid .year-btn {
    padding: 8px 13px;
    background: var(--gray-300);
    border-radius: 10px;
    color: var(--gray-1300);
    font-size: 16px;
    font-weight: 500
}

.reports-accordion .accordion-button h6 {
    margin: 0;
    color: var(--gray-1600);
    font-size: 17px;
    font-weight: 500
}

.detail-img img {
    border-radius: 16px !important;
    height: auto;
    width: 100%
}

.events-detail-content,
.news-detail-content {
    color: var(--gray-1500)
}

.news-detail-content ul,
.news-detail-content ol {
    margin: 0 0 1.5rem;
}

.news-detail-content li {
    color: var(--gray-1500);
    font-size: 18px;
    font-weight: 400;
    list-style: inside;
}

.news-detail-content li::marker {
    font-size: 12px;
}


.news-detail-content h2 {
    font-size: 64px
}

.news-detail-content h4 {
    font-size: 36px
}

.news-detail-content h5,
.search-accordian-main .accordion-button .heading-26 {
    font-size: 26px
}

.news-detail-content h6 {
    font-size: 16px;
    font-weight: 700
}

.news-recent .date-1,
.news-recent .resoure-links {
    font-size: 14px
}

.news-recent svg.svg-icon {
    width: 15px;
    height: 15px;
}


.custom-grid-gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px 8px;
    margin: 2rem 0
}

.news-detail-share,
.post-meta {
    display: flex;
    align-items: center
}

.custom-grid-gallery .gal-img {
    width: 24%;
    height: 220px;
    object-fit: cover;
    border-radius: 16px;
    overflow: hidden;
}

.gal-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

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

.news-detail-share {
    background-size: cover;
    background-position: top;
    position: relative;
    z-index: 9;
    padding: 48px;
    border-radius: 16px;
    overflow: hidden;
    justify-content: space-between
}

.share-overlay {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(138, 140, 228, .05);
    backdrop-filter: blur(40px);
    z-index: -1
}

.share-news svg.svg-icon {
    width: 25px;
    height: 25px
}

ul.share-news-icons {
    margin: 0;
}

ul.share-news-icons li a {
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, .1);
    border: 2px solid rgba(255, 255, 255, .2);
    border-radius: 100%;
    line-height: 1;
    font-size: 20px
}

ul.share-news-icons li a:hover {
    backdrop-filter: brightness(0.8) blur(50px)
}

.post-meta {
    gap: 5px;
    color: var(--gray-1200);
    border-bottom: 1px solid var(--gray-400);
    padding: 0 0 10px;
    margin: 0 0 10px
}

.post-meta:last-child {
    border: 0;
    padding: 0;
    margin: 0;
}

.bottom-video-text,
.inner-banner-card {
    padding: 30px;
    backdrop-filter: blur(13.05px)
}

.news-detail-content p,
.reports-detail-content p {
    margin: 0 0 1.5rem;
    color: var(--gray-1500);
}

p a {
    color: var(--primary-200);
    text-decoration: none !important
}

.terms-content {
    display: grid;
    gap: 10px;
    color: var(--gray-1500);
    width: 100%;
    max-width: 985px;
    margin: auto
}

.lead {
    font-weight: 400
}

.search-accordian-main {
    width: 96%;
    margin-left: auto;
    position: relative
}

.search-accordian-main:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 100%;
    background: var(--gray-400);
    left: -28px
}

.search-accordian-main .accordion-body {
    padding: 0 !important
}

.search-accordian-main .accordion-item {
    padding: 24px 15px
}

.inner-banner-img {
    height: 575px;
    object-fit: cover;
    border-radius: 20px;
    width: 100%;
    background: white;
}

.inner-banner-card {
    position: absolute;
    left: -10%;
    top: 7%;
    background: rgb(81 82 158 / 30%);
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 16px;
    color: #fff;
    display: grid;
    place-content: center;
    width: 99%;
    min-height: 480px;
}

.inner-banner-card .date-1 {
    color: rgba(255, 255, 255, .8);
    fill: rgba(255, 255, 255, 0.8)
}

.inner-banner-card .share-wrap {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #fff
}

.inner-banner-card a.events-share {
    border: 2px solid #FFFFFF33;
    color: white;
    width: 48px;
    height: 48px;
}

.inner-banner-card h1 {
    font-size: 48px;
    width: 90%
}

.inner-banner-card .list-sepaker-img img {
    border-radius: 100%;
    width: 45px;
    height: 45px;
    border: 1px solid #fff;
    margin-right: 10px;
    /*position: relative;*/
    margin-left: -12px;
    border: 2px solid #F2F2F233;
    object-fit: cover;
}

.inner-banner-card .list-sepaker-img {
    font-size: 16px;
    color: rgba(255, 255, 255, .8)
}

.share-2 {
    text-align: end;
    position: absolute;
    right: 3%
}

.endorsment-info,
.join-heading,
.mfb-clear-btn,
.speaker-box,
.ticket-arrow,
.type-box {
    text-align: center
}

.events-detail-hero .category-style-1 {
    position: absolute;
    top: 15px;
    left: 25px;
}

.bottom-video-text {
    left: 16px;
    bottom: 16px;
    position: absolute;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 24px;
    background: rgba(55, 56, 127, .3);
    color: #fff;
    width: 100%;
    max-width: 520px;
}

.bottom-video-text span {
    font-size: 26px;
    color: var(--secondary-300);
    font-weight: 500;
    margin: 0 0 5px;
    display: inline-block;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.bottom-video-text p {
    margin: 0;
    line-height: 1.5;
    letter-spacing: 1px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.events-detail-content .heading-36,
.join-heading .section-tag {
    color: var(--primary-400)
}

.side-border {
    border-left: 2px solid var(--secondary-200);
    padding-left: 25px;
    margin: 25px 0 0
}

.ticket-head,
.ticket-row {
    display: grid;
    grid-template-columns: 1fr 40px 2fr 40px 1.6fr;
    align-items: center;
    column-gap: 10px
}

.ticket-head {
    font-weight: 600;
    border-bottom: 1px solid #ddd;
    padding: 0 0 15px
}

.ticket-row {
    border-bottom: 1px solid var(--gray-400);
    padding: 15px 0
}

.ticket-type {
    font-weight: 600;
    color: var(--gray-1600);
    font-size: 18px
}

.ticket-info p {
    margin: 0 0 3px;
    font-size: 15px;
    color: var(--gray-1400);
    font-weight: 500
}

.speaker h6,
.type-box {
    color: var(--primary-500)
}

.type-box {
    background: var(--gray-300);
    padding: 18px;
    border: 1px solid var(--gray-500);
    border-radius: 16px;
    font-weight: 500;
    font-size: 16px
}

.schedule-day,
.schedule-item {
    border-bottom: 1px solid #e6e6e6;
    padding: 20px
}


.day-toggle {
    display: none;
}

.ticket-arrow {
    color: var(--primary-200)
}

.arrow-rotate {
    transform: rotate(-45deg)
}

.ticket-row:last-child {
    border: 0;
    padding-bottom: 0
}

.schedule-wrapper {
    display: grid;
    grid-template-columns: repeat(3, 1fr)
}

.schedule-item.lunch:last-child {
    border-bottom: 0
}

.schedule-col {
    border-right: 1px solid var(--gray-400);
}

.schedule-col:last-child {
    border-right: none
}

.schedule-day {
    font-weight: 600;
    color: var(--gray-1600)
}

.schedule-item .time {
    font-size: 16px;
    color: var(--gray-1500);
    margin: 0 0 15px
}

.events-detail-sidebar ul .date-1 .svg-icon,
.meta-block .text-blue .svg-icon,
.venu-date .svg-icon {
    color: var(--primary-300);
    fill: var(--primary-300)
}

.speaker {
    display: flex;
    gap: 10px;
    align-items: flex-start
}

.speaker img {
    width: 50px;
    height: 50px;
    border-radius: 50%
}

.speaker h6 {
    margin: 0;
    font-weight: 600
}

.speaker p {
    margin: 5px 0 0;
    font-size: 16px;
    color: var(--gray-1600);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.lunch-text {
    font-weight: 600;
    color: var(--gray-1200);
    font-size: 16px
}

.map-side-img {
    border-radius: 20px
}

.venue-flex {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.venu-date {
    font-style: normal;
    font-size: 18px;
    color: var(--gray-1500)
}

.venu-date .svg-icon {
    width: 24px;
    height: 24px
}

.venu-map-box iframe {
    width: 100%;
    height: 100%;
    border: 2px solid var(--gray-500) !important
}

.expo-item {
    background: linear-gradient(0deg, rgba(255, 255, 255, .8), rgba(255, 255, 255, .8)), linear-gradient(129.5deg, rgba(138, 140, 228, 0) 67.58%, rgba(138, 140, 228, .115) 95.31%);
    padding: 30px;
    border-radius: 16px;
    border: 1px solid var(--gray-500);
    margin: 0 0 25px
}

.new-bottom-nav .btn-style-3 {
    padding: 14px 24px
}

.expo-title {
    margin: 0 0 15px;
    color: var(--primary-700);
    font-weight: 400;
    font-size: 26px
}

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

.expo-meta,
.expo-meta-row {
    align-items: center;
    display: flex
}

.expo-gallery img {
    width: 33%;
    height: 250px;
    object-fit: cover;
    border-radius: 16px
}

.expo-meta {
    gap: 40px
}

.expo-meta span {
    display: block;
    color: var(--gray-1600);
    font-weight: 600
}

.expo-meta-row {
    justify-content: space-between
}

.meta-block .text-blue {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    font-style: italic;
    margin: 6px 0 0
}

.gradient-form-bg {
    background: linear-gradient(180deg, rgba(107, 109, 196, .2) 0, rgba(232, 232, 232, 0) 100%);
    padding: 46px;
    border-radius: 16px 16px 0 0
}

.speaker-box {
    height: auto;
    display: grid;
    place-content: center;
    background: 0 0;
    border: 2px solid var(--gray-500);
    border-radius: 16px;
    width: 98%;
    margin: auto;
    padding: 15px
}

.events-details-tab a:hover,
.sidebar-box-1,
.speaker-schedule-flex li.speaker-lunch {
    background: var(--gray-300)
}

.speaker-box img {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    margin: 0 auto 10px;
    object-fit: cover;
}

.speaker-content p {
    margin: 0;
    color: var(--primary-500);
    font-weight: 600;
    font-size: 17px
}

.speaker-content span {
    font-size: 15px;
    color: var(--gray-1300)
}

.speaker-box.active {
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, .9) 0, rgba(55, 56, 127, .9) 100%);
    color: #fff;
    border-color: var(--primary-500)
}


.event-detail-herobg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.4;
    filter: blur(50px);
}

.event-detail-herobg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-detail-herobg:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 40%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 48.31%);
    top: 0;
    left: 0;
    z-index: 9;
}

.event-detail-herobg:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 60%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, rgba(10, 10, 26, 0.6) 99.99%);
    bottom: 0;
    left: 0;
    z-index: 9;
}

.event-detail-video {
    /* position: absolute; */
    /* opacity: 10; */
}

.events-detail-sidebar ul,
.events-details-tab a,
.sidebar-box-1 {
    border-bottom: 1px solid var(--gray-500)
}

.events-detail-sidebar {
    filter: drop-shadow(0px 30px 150px rgba(38, 39, 97, .2));
    border-radius: 16px;
    overflow: hidden;
    width: 90%;
    position: sticky;
    top: 140px
}

.sidebar-box-1 img {
    width: 100%;
    height: 215px;
    object-fit: cover;
    border-radius: 16px
}

.sidebar-box-1 p {
    padding: 20px;
    margin: 0;
    font-weight: 600;
    color: var(--primary-500);
    line-height: 1.5
}

.events-detail-sidebar ul {
    padding: 20px;
    background: var(--gray-200)
}

.events-detail-sidebar ul .date-1 {
    margin: 0 0 8px;
    color: var(--gray-1400);
    font-weight: 500
}

.events-details-tab {
    background: var(--gray-100)
}

.events-details-tab a {
    display: block;
    padding: 10px 20px;
    color: var(--gray-1400);
    font-weight: 600;
    font-size: 16px
}

.events-de-hero-img img {
    width: 100%;
    height: 590px;
    border-radius: 16px;
    object-fit: cover;
        display: inline-block;
}

.events-detail-content .drag-sec {
    scroll-margin-top: 200px
}

.speaker-bio {
    background: linear-gradient(0deg, rgba(222, 222, 222, .06) 0, rgba(107, 109, 196, .06) 100%);
    border-top: 2px solid var(--primary-200);
    border-radius: 16px;
    padding: 32px 32px 0;
    display: none;
    position: relative;
}

.bio-close {
    position: absolute;
    background: transparent;
    top: 10px;
    right: 10px;
    border: 0;
    color: var(--gray-1300);
}

.speaker-bio .lead {
    font-size: 24px;
    margin: 0 0 5px
}

.sepaker-socials a {
    width: 44px;
    height: 44px;
    border: 2px solid rgba(128, 128, 128, .3);
    backdrop-filter: blur(13.05px);
    border-radius: 58px;
    display: inline-grid;
    place-content: center;
    color: var(--gray-1400)
}

#RegisterInterest .btn-close,
.membership-box,
.membership-box-2 {
    display: grid;
    /* place-content: center; */
}

.speaker-schedule-flex li {
    padding: 20px 10px;
    border-bottom: 1px solid var(--gray-400)
}

.schedule-date {
    color: var(--gray-1600);
    font-size: 16px;
    position: relative;
    padding-right: 30px
}

.schedule-lunch,
.stages-name {
    font-size: 18px;
    font-weight: 600
}

.schedule-date:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    background: var(--gray-400);
    right: 0;
    top: 0
}

.schedule-lunch {
    color: var(--gray-1200)
}

.schedule-stages-accordion .accordion-button {
    background: 0 0;
    border: 0 !important;
    box-shadow: none;
    font-weight: 600;
    font-size: 16px;
    color: var(--gray-1600)
}

.schedule-stages-accordion .accordion-item {
    border: 0;
    background: 0 0;
    border-bottom: 1px solid var(--gray-400)
}

.stages-name {
    color: var(--primary-500);
    margin: 25px 0
}

.schedule-stages-accordion .accordion-button:focus {
    box-shadow: none !important;
    background: 0 0
}

.schedule-stages-accordion .accordion-button:not(.collapsed) {
    border-bottom: 1px solid var(--gray-400) !important;
    background: 0 0;
    box-shadow: none
}

.modal-backdrop.show,
.offcanvas-backdrop.show {
    opacity: 1;
    /*background-color: #37387f;*/
    background: linear-gradient(171.27deg, rgba(55, 56, 127, .75) -5.98%, rgba(25, 25, 64, .9) 108.74%);
    backdrop-filter: blur(26px);
}

.about-inner-banner {
    background-size: cover;
    text-align: center;
    min-height: 100vh;
    display: flex;
    align-items: end;
}

.about-inner-banner:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(180deg, rgb(0 0 0 / 45%) .65%, #0a0a1a 89.96%);
    z-index: -1
}

.about-inner-banner .inner-content {
    height: 100%;
}

.about-inner-subtitle,
.dark-bg .about-title,
.membership-flex .heading-26 {
    color: var(--secondary-300)
}

.membership-container,
.membership-join-container {
    width: 100%;
    max-width: 1344px;
    margin: auto
}

.heading-48 {
    font-weight: 500;
    font-size: 48px;
    line-height: 110%
}

.membership-box {
    width: 100%;
    height: 100%;
    border: 1px solid rgba(255, 255, 255, .1);
    backdrop-filter: blur(13.05px);
    border-radius: 24px;
    padding: 32px;
    background: rgba(55, 56, 127, .3)
}

.arrow-h svg.svg-icon {
    transform: rotate(90deg)
}

.outer-side.outer-label {
    width: auto;
    max-width: 97px;
    align-items: end;
}

span.side-label {
    font-size: 12px;
    text-align: right;
    color: var(--gray-100)
}

.arrow-l svg.svg-icon {
    transform: rotate(-180deg)
}

.membership-box-2 {
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .15);
    backdrop-filter: blur(80px);
    border-radius: 24px;
    padding: 32px
}

.endorsment-info,
.join-card {
    backdrop-filter: blur(13.05px)
}

.membership-flex,
.membership-flex-2 {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 0 20px
}

.membership-flex img,
.membership-flex-2 img {
    width: 48px;
    height: 48px;
    display: grid;
    place-content: center;
    background: var(--secondary-300);
    border-radius: 14px;
    padding: 7px 4px;
    object-fit: contain
}

.membership-flex-2 img {
    background: #fff;
}

.membership-box-2 li {
    list-style: disc;
    margin-left: 25px
}

.step-flow {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    align-items: self-start;
    margin: 0 0 52px
}

.steps-count {
    width: 200px;
    flex-shrink: 0;
    display: flex;
    height: auto;
    gap: 7px;
    align-items: center
}

.steps-count>div {
    width: 150px
}

.steps-count span {
    font-size: 18px;
    color: var(--primary-300);
    font-weight: 700;
    display: inline-block;
    margin: 0 0 5px;
}

.steps-count svg.svg-icon {
    fill: var(--primary-200);
    color: var(--primary-200);
    width: 32px;
    height: 32px
}

.steps-count p {
    font-weight: 500;
    color: var(--gray-1600);
    line-height: normal;
}

.join-card {
    background: linear-gradient(.2deg, rgba(234, 234, 234, 0) 1.64%, rgba(234, 234, 234, .3) 99.83%);
    border: 1px solid rgba(227, 227, 227, .5);
    border-radius: 16px;
    padding: 32px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 11px
}

.join-icon {
    width: 50px;
    height: 50px;
    display: inline-grid;
    place-content: center;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, .9) 0, rgba(55, 56, 127, .9) 100%);
    border-radius: 16px;
    flex-shrink: 0;
}

.join-title {
    font-size: 26px;
    color: var(--primary-500);
    line-height: 1.25;
}

.join-card p {
    margin: 0;
    color: var(--gray-1400);
    line-height: 1.3;
}

.join-card.card-two {
    background: linear-gradient(.2deg, rgba(194, 194, 194, 0) 1.64%, rgba(194, 194, 194, .2) 99.83%);
    border: 1px solid rgba(194, 194, 194, .1)
}

.join-card.card-three {
    background: linear-gradient(.2deg, rgba(148, 148, 148, 0) 1.64%, rgba(148, 148, 148, .27) 99.83%);
    border: 1px solid rgba(55, 56, 127, .05)
}

.steps-content {
    width: 100%;
}

.steps-content .col-lg-4,
.steps-content .col-lg-3,
.steps-content .col-lg-6 {
    padding-left: 8px;
    padding-right: 8px;
}

.steps-content .row {
    margin-left: -8px;
    margin-right: -8px;
}



.join-form {
    background: linear-gradient(180deg, rgba(107, 109, 196, .2) 0, rgba(232, 232, 232, 0) 100%);
    border-radius: 24px;
    padding: 48px 48px 0
}

.join-heading {
    max-width: 920px;
    margin: auto;
    width: 100%
}

.card-three .line {
    width: 85px;
    height: 1px;
    background: linear-gradient(-90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%)
}

.membership-corner::before {
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 0V48H0C28.8814 46.7797 47.1864 25.2203 48 0Z' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat;
    transform: rotate(180deg)
}

.membership-corner::after {
    background: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 0V48H0C28.8814 46.7797 47.1864 25.2203 48 0Z' fill='%23fff' /%3E%3C/svg%3E") center/contain no-repeat
}

.membership-inner-banner {
    padding-bottom: 0
}

.membership-inner-banner:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 36.64%, #0a0a1a 99.99%);
    z-index: 1
}

.benefit-row {
    display: flex;
    align-items: stretch;
    gap: 32px;
    margin-bottom: 64px
}

.outer-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 32px;
    flex-shrink: 0;
    gap: 10px;
    color: #fff;
    fill: white
}

.col-card,
.mfb-search-wrap {
    flex: 1
}

.full-row-card {
    background: linear-gradient(135deg, #1a0f3a 0, #120a28 100%);
    border: 1px solid var(--border-glow);
    border-radius: 14px;
    padding: 28px 32px;
    margin-bottom: 28px;
    position: relative
}

.full-row-card .card-title {
    font-size: 1.15rem
}

.section-about-page {
    background-color: var(--primary-900);
}

.about-pg {
    background-image: url(../images/abpage-bg.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    /* Removed 48px rounded top corners: the square parent (.section-about-page,
       navy) showed through the rounded cut-outs as odd dark corners. */
    min-height: 100vh;
}

/*.scroll-progress {*/
/*    position: fixed;*/
/*    top: 0;*/
/*    left: 0;*/
/*    height: 3px;*/
/*    width: 0%;*/
/*    background: linear-gradient(90deg, var(--accent), var(--accent-dark));*/
/*    z-index: 999;*/
/*    transition: width 50ms linear*/
/*}*/

/*.h-track {*/
/*    display: flex;*/
/*    align-items: stretch;*/
/*    will-change: transform;*/
/*    transition: transform .7s cubic-bezier(.25, .46, .45, .94);*/
    /*padding: 90px 80px 90px 288px;*/
/*     padding: clamp(40px, 8vh, 90px) clamp(40px, 4vw, 80px) clamp(40px, 8vh, 90px) clamp(140px, 15vw, 288px);*/
/*    gap: clamp(40px, 5vw, 95px);*/
/*    min-height: 100vh;*/
/*}*/

/*.h-viewport {*/
/*    cursor: grab;*/
/*    user-select: none;*/
/*    -webkit-user-select: none*/
/*}*/

/*.h-viewport:active {*/
/*    cursor: grabbing*/
/*}*/

/*.ab-col {*/
/*    flex: 0 0 auto;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    width: 100%*/
/*}*/

/*.ab-col-content {*/
/*    width: var(--col-w);*/
/*    padding: 0 60px*/
/*}*/

/*.ab-col-img {*/
/*    width: var(--col-img)*/
/*}*/

/*.ab-col-grid {*/
/*    width: 500px*/
/*}*/

/*.scrollbar-wrap {*/
/*    gap: 20px*/
/*}*/

/*.scrollbar-track {*/
/*    flex: 1;*/
/*    height: 8px;*/
/*    background: rgba(180, 170, 200, .35);*/
/*    position: relative;*/
/*    cursor: pointer;*/
/*    border-radius: 8px*/
/*}*/

/*.scrollbar-thumb {*/
/*    position: absolute;*/
/*    left: 0;*/
/*    top: 0;*/
/*    height: 8px;*/
/*    background: #e89c2f;*/
/*    width: 0%;*/
/*    border-radius: 8px;*/
/*    pointer-events: none;*/
/*    transition: width 80ms linear, left 80ms linear*/
/*}*/

/*.scroll-label {*/
/*    font-size: 11px;*/
/*    letter-spacing: .12em;*/
/*    text-transform: uppercase;*/
/*    color: #9b8ebb;*/
/*    font-weight: 400*/
/*}*/

/*.scroll-hint {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    gap: 8px;*/
/*    padding: 0 80px;*/
/*    margin-top: 8px;*/
/*    font-size: 12px;*/
/*    color: var(--text-muted);*/
/*    opacity: 1;*/
/*    transition: opacity .5s*/
/*}*/

/*.scroll-hint.hidden {*/
/*    opacity: 0*/
/*}*/

/*.hint-arrow {*/
/*    display: inline-flex;*/
/*    align-items: center;*/
/*    animation: 1.6s ease-in-out infinite nudge*/
/*}*/

/*@keyframes nudge {*/

/*    0%,*/
/*    100% {*/
/*        transform: translateX(0)*/
/*    }*/

/*    50% {*/
/*        transform: translateX(8px)*/
/*    }*/
/*}*/



/*.ab-col-1 {*/
/*    max-width: 780px;*/
/*    width: 100%*/
/*}*/

/*.ab-col-2 {*/
/*    max-width: 640px*/
/*}*/

/*.ab-col-11,*/
/*.ab-col-3,*/
/*.ab-col-5,*/
/*.ab-col-9 {*/
/*    max-width: 780px*/
/*}*/

/*.ab-col-10,*/
/*.ab-col-4,*/
/*.ab-col-6,*/
/*.ab-col-8 {*/
/*    max-width: 740px*/
/*}*/

/*.ab-col-7 {*/
/*    max-width: 1440px*/
/*}*/

/*.ab-col-12 {*/
/*    max-width: 1168px*/
/*}*/


/*.ab-col-1 {*/
/*    max-width: clamp(480px, 40vw, 780px);*/
/*    width: 100%;*/
/*}*/

/*.ab-col-2 {*/
/*    max-width: clamp(400px, 33vw, 640px);*/
/*}*/

/*.ab-col-3,*/
/*.ab-col-5,*/
/*.ab-col-9,*/
/*.ab-col-11 {*/
/*    max-width: clamp(480px, 40vw, 780px);*/
/*}*/

/*.ab-col-4,*/
/*.ab-col-6,*/
/*.ab-col-8,*/
/*.ab-col-10 {*/
/*    max-width: clamp(460px, 38vw, 740px);*/
/*}*/

/*.ab-col-7 {*/
/*    max-width: clamp(800px, 50vw, 1440px);*/
/*}*/

/*.ab-col-12 {*/
/*    max-width: clamp(700px, 60vw, 1168px);*/
    
/*}*/

/*.ab-col-7 .about-img {*/
/*    height: clamp(400px, 75vh, 810px);*/
/*    width: 100%;*/
/*    overflow: hidden;*/
/*}*/


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

.ab-col-margin {
    margin-bottom: 125px;
}

.ab-col-margin:last-child {
    margin-bottom: 0;
}

.ab-col img {
    object-fit: cover;
    box-shadow: 0 24.71px 123.53px 0 rgba(38, 39, 97, .2)
}

.ab-col img,
.endorsment-info {
    width: 100%;
    height: 100%;
    border-radius: 16px
}

.about-title {
    font-size: 48px;
    color: var(--primary-400);
    line-height: 1.3;
    font-weight: 500;
    margin: 0 0 10px
}


.accent-year {
    font-size: 24px;
    color: var(--gray-1500)
}

.accent-year {
    font-weight: 700;
    margin: 0 0 14px;
    display: inline-block
}

.about-content p {
    margin: 0 0 1.3rem
}

.img-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: center
}

.img-grid .grid-box {
    width: 49%;
    position: relative
}

.endorsment-info {
    position: absolute;
    background: rgba(61, 61, 156, .6);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* padding: 64px; */
    padding: clamp(20px, 4vh, 64px);
    gap: 8px;
    top: 0
}

.endorsment-box:first-child .endorsment-info {
    background: rgba(25, 25, 64, .6)
}

.endorsment-info span {
    color: var(--secondary-200);
    font-size: 44px;
}

.about-content .about-subtitle {
    font-size: 16px;
    margin: 0 0 10px;
    font-weight: 600
}

.dark-bg {
    display: flex;
    align-items: center;
    width: auto;
    gap: clamp(40px, 5vw, 95px);
    flex-wrap: nowrap;
    flex-shrink: 0;
    position: relative;
    color: #fff
}

.dark-bg:before {
    position: absolute;
    content: "";
    width: 76%;
    height: calc(100% + 280px);
    left: 12%;
    top: -90px;
    bottom: -90px;
    background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, #191940 0, #0a0a1a 100%);
    z-index: -1
}

.btn-secondary-outline {
    border: 2px solid var(--secondary-400);
    color: var(--secondary-400)
}

.btn-secondary-outline:hover {
    background: var(--secondary-500);
    color: #000;
    border-color: var(--secondary-500)
}

.large-play-btn {
    width: 90px;
    height: 90px;
    border: 20px solid rgba(138, 140, 228, .1);
    backdrop-filter: blur(36.25px)
}

.board-mission .missio-box {
    border: 1px solid rgba(255, 255, 255, .15);
    background: rgba(55, 56, 127, .3);
    backdrop-filter: blur(80px);
    position: absolute;
    top: 20px;
    left: 20px
}

.board-mission .vision-box {
    bottom: 20px;
    top: auto;
    right: 20px;
    left: auto
}

.board-members-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
}

.board-member-box {
    width: 324px;
    height: auto;
    position: relative;
    z-index: 9;
    cursor: pointer;
}

.board-member-info {
    position: absolute;
    width: 100%;
    height: auto;
    left: 0;
    bottom: 0;
    /*padding: 15px;*/
    display: grid;
    gap: 4px;
    padding: clamp(12px, 2vh, 24px);
}

img.flag {
    width: 32px;
    height: 32px;
    border-radius: 100%
}

.board-member-info p {
    color: #fff;
    margin: 0
}

.board-member-info span {
    font-size: 14px;
    color: var(--gray-100)
}

.board-member-box:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(186.19deg, rgba(55, 56, 127, 0) 41.34%, rgba(38, 39, 97, .76) 89.42%);
    bottom: 0;
    left: 0;
    border-radius: 16px
}

.board-member-panel {
    max-width: 600px;
    padding: 50px
}

.line {
    width: 100%;
    height: 1px;
    background: var(--gray-400)
}

.board-heading img {
    width: 100%;
    border-radius: 16px;
    height: 100%;
    margin: 0 0 15px
}

a.mail-info {
    display: flex;
    align-items: center;
    margin: 0 0 15px;
    color: var(--primary-500);
    font-weight: 600
}

.board-member-panel .close-btn {
    position: absolute;
    top: -30px;
    right: -30px
}

.custome-mobile-canvas .dropdown-item-wrapper {
    position: static
}

.mobile-menu-icons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    /* gap: 4px; */
    position: relative;
    max-width: 265px;
    margin-left: auto
}

.custome-mobile-canvas {
    width: 100% !important;
    background: linear-gradient(171.27deg, rgba(55, 56, 127, .75) -5.98%, rgba(25, 25, 64, .9) 108.74%);
    backdrop-filter: blur(26px);
}

.custome-mobile-canvas .btn-close,
.dropdown-toggle-btn,
.mobile-toggle {
    width: 48px;
    height: 48px;
    border-radius: 58px;
    display: inline-grid;
    place-content: center;
    color: #fff;
    margin: 0;
    padding: 0;
    fill: white;
    opacity: 1;
    background: 0 0
}

.custome-mobile-canvas .search-dropdown {
    width: 300px;
    padding: 24px;
    left: auto !important;
    right: 0 !important;
}

.custome-mobile-canvas .custom-dropdown.profile-dropdown,
.custome-mobile-canvas ul.custom-dropdown.language-dropdown {
    width: 265px;
    left: auto;
    right: 0
}

.mobile-dropdown {
    width: 265px;
    padding: 0;
    background: rgba(10, 10, 26, .35);
    backdrop-filter: blur(80px);
    right: 0;
    position: relative;
    border-radius: 16px;
    margin-left: auto;
}


.mobile-menu-box {
    background: var(--gray-50);
    border-radius: 16px;
    padding: 24px;
    position: relative;
    margin-bottom: 0 !important;
}

ul.mobile-menus {
    flex-direction: column;
    align-items: self-start
}

.mobile-top-info {
    padding: 24px;
    border: 0
}

.mobile-top-info a {
    color: #fff;
    align-items: center;
}


ul.menus.mobile-menus a {
    color: var(--primary-300);
    font-size: 14px;
    display: flex;
    align-items: center;
    width: 100%;
    font-weight: 600;
    padding: 0 0 8px;
    position: relative;
    margin: 0 0 8px
}

ul.menus.mobile-menus li {
    margin: 0;
    padding: 0;
    border: 0;
    width: 100%
}


.custome-mobile-canvas .dropdown-item-wrapper.active .dropdown-toggle-btn {
    background: rgba(255, 255, 255, .1);
    border: 2px solid rgba(255, 255, 255, .2);
    backdrop-filter: blur(13.05px);
    color: #fff;
    fill: white
}

.custome-mobile-canvas .custom-dropdown::before {
    left: 125px !IMPORTANT;
}

.custome-mobile-canvas .custom-dropdown.language-dropdown::before {
    left: 140px !IMPORTANT;
    right: 0;
}

.custome-mobile-canvas .custom-dropdown.profile-dropdown::before {
    left: 137px;
}

/*.custome-mobile-canvas .mobile-dropdown::before {*/
/*    left: 185px !important;*/
/*}*/




@media (max-width:991.98px) {
    .mobile-filter-bar {
        display: block;
        margin-bottom: 20px
    }
}

.mfb-icon-btn {
    position: relative;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    background: #fff;
    border: 1.5px solid #e4e4e4;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .2s;
    padding: 0
}

.mfb-icon-btn .svg-icon {
    width: 20px;
    height: 20px;
    color: #444
}

.mfb-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background: var(--secondary-500);
    color: #000;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    border-radius: 8px;
    width: 25px;
    height: 17px;
    display: none;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    font-family: inherit
}

.mfb-badge.show,
.mfb-tags-row.show {
    display: flex
}

.mfb-search-wrap:focus-within {
    border-color: #bbb
}

.mfb-search-wrap .svg-icon {
    color: var(--gray-1300);
    top: 13px;
}

.mfb-search-input:focus {
    color: #333;
    font-style: normal
}

.mfb-search-input::placeholder {
    color: #bbb;
    font-style: italic
}

.mfb-tags-row {
    display: none;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    overflow: hidden;
    border: 1px solid var(--gray-400);
    border-right: 0;
    border-left: 0;
    padding: 11px 0;
    margin: 15px 0;
}

.mfb-arrow {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s;
    padding: 0
}

.mfb-arrow:hover,
.mfb-drawer-close:hover {
    background: #e8e8e8
}

.mfb-arrow svg {
    width: 12px;
    height: 12px;
    color: #666
}

.mfb-tags-scroll {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    flex: 1;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.mfb-tags-scroll::-webkit-scrollbar {
    display: none
}

.mfb-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 28px;
    padding: 0 10px 0 8px;
    border-radius: 14px;
    /* border: 1.5px solid #e4e4e4; */
    background: #f8f8f8;
    font-size: 12.5px;
    color: #444;
    flex-shrink: 0;
    cursor: default;
    transition: border-color .15s, background .15s
}

.mfb-tag-checkbox {
    appearance: none;
    -webkit-appearance: none;
    width: 16px !IMPORTANT;
    height: 16px !IMPORTANT;
    border-radius: 3px;
    border: 1.5px solid #ccc;
    background: #fff;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: background .15s, border-color .15s;
    padding: 0;
}

.mfb-tag-checkbox:checked {
    background: #e8a020;
    border-color: #e8a020;
}

.mfb-tag-checkbox:checked::after {
    content: '';
    position: absolute;
    width: 9px;
    height: 5px;
    border-left: 2px solid #000000;
    border-bottom: 2px solid #000000;
    transform: rotate(-45deg);
    top: 4px;
    left: 3px;
}

.mfb-clear-btn {
    flex-shrink: 0;
    background: 0 0;
    border: none;
    font-size: 10px;
    font-weight: 600;
    color: var(--gray-1300);
    cursor: pointer;
    padding: 0 2px;
    line-height: 1.3;
    transition: opacity .15s
}

.mfb-clear-btn:hover {
    opacity: .75
}

.mfb-results-text {
    display: none;
    font-size: 13px;
    color: #888;
    margin-top: 8px;
    padding: 0 2px
}

.mfb-results-text strong {
    color: #222;
    font-weight: 700
}

.mfb-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgb(0 0 0 / 56%);
    z-index: 999;
    opacity: 0;
    transition: opacity .25s;
    background-color: #37387f;
    backdrop-filter: blur(26px);
}

.mfb-overlay.show {
    display: block;
    opacity: .98;
}

.mfb-drawer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    transform: translateY(100%);
    transition: transform .32s cubic-bezier(.32, .72, 0, 1);
    height: 100vh;
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0;
    justify-content: end
}

.mfb-drawer-handle {
    width: 100px;
    height: 4px;
    background: var(--gray-400);
    border-radius: 40px;
    margin: 25px auto;
    flex-shrink: 0
}

.mfb-drawer-title {
    font-size: 16px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0
}

.mfb-drawer-close {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    color: #555;
    transition: background .15s;
    position: absolute;
    top: 20px;
    right: 20px;
    width: 44px;
    height: 44px;
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(13.05px);
    border-radius: 58px;
    transform: rotate(-180deg);
    fill: white;
    color: white;
}

.mfb-drawer-close svg {
    width: 16px;
    height: 16px;
}

.mfb-drawer-body {
    overflow-y: auto;
    flex: 1;
    padding: 0 20px;
    background: #fff;
    border-radius: 20px 20px 0 0;
    max-height: 70vh
}

.mfb-drawer-footer {
    padding: 15px 20px;
    border-top: 1px solid #f0f0f0;
    flex-shrink: 0;
    background: #fff
}

.mfb-drawer-body .members-accordion .accordion-button {
    font-size: 14px
}

.mfb-drawer-body .members-accordion .accordion-item {
    border: none;
    border-bottom: 1px solid #f3f3f3
}

.events-hub-pg-2 {
    background-color: var(--gray-200);
}

.mfb-tag span {
    color: var(--gray-1500);
    font-size: 12px;
}













.mobile-cat-tabs {
    display: none;
}

.accord-count-badge {
    display: none;
}


.search-accordian-main .accordion-item:before {
    background: var(--gray-400);
}

.accordion-body .company-m-name,
.accordion-body .company-m-name {
    color: var(--primary-700);
}

.search-help-accordian .accordion-body {
    padding: 20px !important;
}

.acc-outer .accordion-item:last-child:before {
    display: none;
}

.submit-btn-style {
    min-width: 280px;
    justify-content: center;
}

/* Sticky sidebar */
.events-detail-sidebar {
    position: sticky;
    top: 140px;
    max-height: calc(100vh - 40px);
    overflow: hidden;
}

/* Hide image first - small/medium laptops */
@media (max-height: 900px) {
    .sidebar-box-1 img {
        display: none;
    }
}

/* Hide title second */
@media (max-height: 800px) {

    .sidebar-box-1 p,
    .sidebar-box-1 {
        display: none;
    }
}

/* Hide date/location/cost third */
@media (max-height: 700px) {
    .events-detail-list {
        display: none;
    }

    .sidebar-box-1 {
        display: none;
    }
}



.cal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15, 18, 30, 0.80);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    /* background: #0907074D; */
    backdrop-filter: blur(80px);
}

.cal-overlay.active {
    display: flex;
}

.cal-modal {
    background: #fff;
    border-radius: 12px;
    padding: 32px;
    width: 680px;
    max-width: 95vw;
    position: relative;
}

.cal-close {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #e0e0e0;
    background: #f5f5f5;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #555;
}

.cal-close:hover {
    background: #e8e8e8;
}

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

.cal-month-labels {
    display: flex;
    gap: 60px;
    font-size: 13px;
    font-weight: 600;
    color: #1a1a2e;
}

.cal-nav {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #534AB7;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.cal-nav:hover {
    background: #3C3489;
}

.cal-grids {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    gap: 0 8px;
}

.cal-divider {
    background: #e8e8e8;
}

.cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    padding: 16px;
    border: 1px solid #D9D9D9;
    border-radius: 16px;
}

.cal-day-label {
    font-size: 11px;
    color: #999;
    text-align: center;
    padding: 4px 0 6px;
    text-transform: uppercase;
}

.cal-day {
    font-size: 12px;
    color: #1a1a2e;
    text-align: center;
    padding: 6px 2px;
    border-radius: 4px;
    cursor: pointer;
    line-height: 1;
}

.cal-day:hover {
    background: #f0f0f0;
}

.cal-day.empty {
    cursor: default;
}

.cal-day.empty:hover {
    background: none;
}

.cal-day.selected {
    background: #534AB7;
    color: #fff;
    font-weight: 600;
}

.cal-day.in-range {
    background: #EEEDFE;
    color: #3C3489;
}

.cal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #eee;
    display: none;
}

.cal-btn-clear {
    background: none;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 8px 18px;
    font-size: 13px;
    color: #666;
    cursor: pointer;
}

.cal-btn-clear:hover {
    background: #f5f5f5;
}

.cal-btn-apply {
    background: #534AB7;
    border: none;
    border-radius: 8px;
    padding: 8px 20px;
    font-size: 13px;
    color: #fff;
    cursor: pointer;
}

.cal-btn-apply:hover {
    background: #3C3489;
}


p:empty,
h1:empty {
    display: none;
}

/*.scroll-svg {*/
/*    width: 23px;*/
/*    height: 23px;*/
/*    object-fit: contain;*/
/*}*/

/*.scroll-arrow {*/
/*    opacity: 0.45;*/
/*    transition: opacity 0.35s ease;*/
/*}*/

/*.scroll-ring {*/
/*    opacity: 0.45;*/
/*    stroke-dasharray: 72;*/
/*    stroke-dashoffset: 0;*/
/*    transition:*/
/*        stroke-dashoffset 0.55s ease,*/
/*        opacity 0.35s ease;*/
/*}*/

/*.scroll-box:hover .scroll-ring {*/
/*    stroke-dashoffset: 0;*/
/*    opacity: 1;*/
/*}*/

/*.scroll-ring {*/
/*    opacity: 0.45;*/
/*    stroke-dasharray: 72;*/
/*    stroke-dashoffset: 0;*/
/*    transition:*/
/*        stroke-dashoffset 0.55s ease,*/
/*        opacity 0.35s ease;*/
/*}*/

/*.scroll-box:hover .scroll-ring {*/
/*    opacity: 1;*/
/*    animation: drawRing 0.6s ease forwards;*/
/*}*/

/*.scroll-box:not(:hover) .scroll-ring {*/
/*    animation: none;*/
/*    stroke-dashoffset: 0;*/
/*}*/

/*@keyframes drawRing {*/
/*    from {*/
/*        stroke-dashoffset: 72;*/
/*    }*/
/*    to {*/
/*        stroke-dashoffset: 0;*/
/*    }*/

/*}*/

/*.scroll-svg {*/
/*    width: 16px;*/
/*    height: 24px;*/
/*    object-fit: contain;*/
/*    transform-origin: center bottom;*/
/*}*/

/*.scroll-box:hover .scroll-svg {*/
/*    animation: scrollBounce 1.2s ease infinite;*/
/*}*/

/*.scroll-box:not(:hover) .scroll-svg {*/
/*    animation: none;*/
/*}*/

/*@keyframes scrollBounce {*/
/*    0% {*/
/*        transform: translateY(0);*/
/*    }*/

/*    40% {*/
/*        transform: translateY(5px);*/
/*    }*/

/*    70% {*/
/*        transform: translateY(2px);*/
/*    }*/

/*    100% {*/
/*        transform: translateY(0);*/
/*    }*/
/*}*/

.scroll-box:hover .scroll-arrow {
    animation: arrowMove 1.2s ease forwards infinite;
}

@keyframes arrowMove {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    45% {
        transform: translateY(8px);
        opacity: 0;
    }

    46% {
        transform: translateY(-4px);
        opacity: 0;
    }

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

svg.scroll-svg {
    width: 24px;
    height: 24px;
}

.scroll-box span {
    font-size: 16px;
    color: white;
    letter-spacing: -0.5%;
}




.news-newsletter-form .login-loader {
    width: 60px;
    height: 60px;
}


.text-success {
    font-size: 1.2rem;
}

.mobile-toggle {
    display: none;
}

.forget-para {
    line-height: 1.4;
    letter-spacing: .5px;
    color: var(--gray-1300);
}



.desktop-tags-row {
    display: none;
    /* hidden by default */
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: nowrap;
    overflow: hidden;
}

.desktop-tags-row.show {
    display: flex !important;
}

/* Reuses all existing .mfb-tag, .mfb-tags-scroll, .mfb-arrow, .mfb-clear-btn styles */
.desktop-clear-btn {
    /* Same as .mfb-clear-btn ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Â ÃƒÂ¢Ã¢â€šÂ¬Ã¢â€žÂ¢ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬ÃƒÂ¢Ã¢â‚¬Å¾Ã‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Â ÃƒÂ¢Ã¢â€šÂ¬Ã¢â€žÂ¢ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¡ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Â ÃƒÂ¢Ã¢â€šÂ¬Ã¢â€žÂ¢ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã¢â‚¬Â¦Ãƒâ€šÃ‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â copy those styles or add the class */
    composes: mfb-clear-btn;
    /* if using CSS modules, otherwise duplicate */
    flex-shrink: 0;
    white-space: nowrap;
    font-size: 11px;
    text-align: center;
    cursor: pointer;
    border: none;
    background: transparent;
    color: #e74c3c;
    line-height: 1.3;
}

.newssuccessMessage {
    font-size: 24px;
    line-height: 1.3;
    margin: 0;
    font-weight: 400;
}



#accessToggle {
    position: relative;
}

.access-icon {
    transition: opacity 0.3s ease;
}

.mini-loader {
    width: 20px;
    height: 20px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;

    position: absolute;
    inset: 0;
    margin: auto;

    opacity: 0;
    visibility: hidden;

    transition: all 0.3s ease;
}

#accessToggle.loading .mini-loader {
    opacity: 1;
    visibility: visible;
}

#accessToggle.loading .access-icon {
    opacity: 0;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.loading .svg-icon {
    opacity: 0;
}

.registerd-speaker img {
    width: 100px;
    height: auto;
}

/* Neither the news-detail content nor its sidebar should be position:sticky —
   sticky on BOTH columns made the page scroll janky ("can't scroll the post
   without scrolling the sidebar"). Let them flow normally. */
.news-hub-sidebar.news-detail-sidebar {
    position: static;
}

.news-detail-content {
    position: static;
}

/* The news / reports / regulatory listing sidebars (search + newsletter) used to be
   hidden below 992px; now that they stack under the listing they need a gap. */
@media (max-width: 991.98px) {
    .news-hub-sidebar {
        margin-top: 32px;
    }
}

.login-loader {
    animation: login-spin 1s linear infinite;
    transform-origin: center center;
    display: block;
    margin: 0 auto;
    width: 120px;
    height: 120px;
}

@keyframes login-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


.news-newsletter-form p {
    margin-bottom: 0;
}


.Mobile-nav-right {
    display: none;
}



#mobileOffcanvas .offcanvas-body {
    overflow: hidden;
    padding: 25px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.mob-oc-icon-bar {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
    /* padding: 0 0 24px; */
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.07); */
    flex-shrink: 0;
    position: relative;
}

.mob-oc-icon-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: transparent;
    border: 2px solid transparent;
    cursor: pointer;
    color: white;
    transition: background 0.18s, color 0.18s, border-color 0.18s, box-shadow 0.18s;
    flex-shrink: 0;
}

.mob-oc-icon-btn .svg-icon {
    width: 18px;
    height: 18px;
}

.mob-oc-icon-btn:hover:not(.mob-oc-active) {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.mob-oc-icon-btn.mob-oc-active {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    background: rgba(255, 255, 255, 0.1);
    border: 2px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(13.05px);
    border-radius: 58px;
}

.mob-oc-lang-badge {
    position: absolute;
    top: -3px;
    right: -3px;
    background: var(--secondary-500);
    color: var(--gray-1700);
    font-size: 12px;
    font-weight: 900;
    border-radius: 8px;
    padding: 2px 4px;
    letter-spacing: 0.3px;
    line-height: 1;
    pointer-events: none;
    z-index: 9;
}

.mob-oc-close-btn {
    background: transparent;
    border-color: transparent;
    color: white;
}

.mob-oc-close-btn:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #fff !important;
}

.mob-oc-panels {
    flex: 1;
    position: relative;
    overflow: hidden;
}

.mob-oc-panel {
    position: absolute;
    inset: 0;
    overflow-y: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateX(16px);
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.mob-oc-panel::-webkit-scrollbar {
    width: 3px;
}

.mob-oc-panel::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 2px;
}

.mob-oc-panel.mob-oc-panel-active {
    opacity: 1;
    pointer-events: all;
    transform: translateX(0);
}

.mob-oc-panel-inner {
    padding: 20px 0 0;
    position: relative;
}

.mob-lang-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mob-lang-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    cursor: pointer;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9rem;
    transition: color 0.15s;
}

.mob-lang-list li:last-child {
    border-bottom: none;
}

.mob-lang-list li:hover {
    color: #fff;
}

.mob-lang-list .lang-code {
    margin-left: auto;
    font-size: 0.7rem;
    font-weight: 700;
    opacity: 0.4;
    letter-spacing: 0.5px;
}

.mob-lang-list .active-lang-mark {
    display: none;
}


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

.mob-panel-trigger {
    width: 48px;
    height: 48px;
    border-radius: 58px;
    border: 2px solid transparent;
    display: inline-grid;
    place-content: center;
}



.mob-search-dropdown {
    width: 300px;
    height: auto;
    backdrop-filter: blur(40px);
    background: #FFFFFF;
    border-radius: 16px;
    padding: 24px;
    /* position: absolute; */
    /* right: 0; */
    margin-left: auto;
}

.mob-search-dropdown .search-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mob-search-dropdown [type=search] {
    padding-left: 35px;
}

.mob-language-dropdown {
    padding: 16px 24px;
    width: 265px;
    height: auto;
    background: #FFFFFF;
    border-radius: 16px;
    position: relative;
    right: 0;
    margin-left: auto;
}

.mob-language-dropdown li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 15px 0;
    border-bottom: 1px solid var(--gray-400);
    color: var(--gray-1400);
    font-size: 14px;
    font-weight: 600;
}

.mob-language-dropdown li img {
    height: 20px;
    width: 20px;
    object-fit: cover;
    border-radius: 100%;
}

.mob-language-dropdown li .lang-code {
    margin-left: auto;
    font-size: 10px;
    color: var(--gray-1200);
}

.mob-language-dropdown li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.mob-profile-dropdown {
    width: 265px;
    height: auto;
    background: #FFFFFF;
    border-radius: 16px;
    position: relative;
    right: 0;
    margin-left: auto;
}

.mob-profile-dropdown .profile-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 20px;
    gap: 8px;
}

.mob-profile-dropdown li a {
    padding: 14px 20px;
    border-top: 1px solid var(--gray-400);
    display: inline-block;
    width: 100%;
}


.mob-search-dropdown,
.mob-language-dropdown,
.mob-profile-dropdown,
.mob-mobile-dropdown {
    position: relative;
}

.search-before,
.language-before,
.profile-before,
.mobile-before {
    position: absolute;
    width: 16px;
    height: 16px;
    top: -8px;
    background: #FFFFFF;
    transform: translateX(17px) rotate(-45deg);
    z-index: 999;
}

svg.mob-menu-arrow {
    position: absolute;
    right: 0;
    top: 5px;
}

.mobile-nav-btns .btn-style-1 {
    padding: 0 !important;
    border-radius: 0;
}





/* RESPONSIVE STYLES  */

@media (max-width:1700px) {

    .custom-dropdown.profile-dropdown {
        left: auto;
    }

    .custom-dropdown.profile-dropdown:before {
        right: 17px;
    }
    
    .board-member-box {
        /*width: 220px;*/
        width: clamp(190px, 14vw, 280px);
    }

.about-title {
    font-size: 34px;
}

.about-content p, .accent-year {
    /* font-size: clamp(17px, 2vh, 24px); */
}

img.flag {
    width: 24px;
    height: 24px;
}

.board-member-info span {
    font-size: 12px;
}

.board-member-info p {
    font-size: 14px;
    margin: 4px 0 0;
}

.missio-box {
    padding: 20px;
}

.mission-felx img {
    width: 35px;
    height: 35px;
    border-radius: 6px;
}

.mission-felx span {
    font-size: 20px;
}



}

@media (max-width:1500px) {

    .custom-dropdown.search-dropdown {
        width: 430px;
        left: -300px;
    }

    .custom-dropdown.search-dropdown:before {
        left: 325px;
    }

    ul.custom-dropdown.language-dropdown {
        left: -170px;
    }

    ul.custom-dropdown.language-dropdown::before {
        right: 15%;
    }

    .logo {
        width: 80px;
        flex-shrink: 0;
    }

    .sticky .logo {
        width: 65px;
    }

    ul.menus li a {
        font-size: 16px;
    }

    .btn-style-1,
    .btn-style-2,
    .btn-style-3,
    .btn-style-4,
    .btn-style-5,
    .btn-style-6 {
        font-size: 15px;
    }

    .hero-heading {
        font-size: 100px;
    }

    .hero-heading span {
        font-size: 90px;
    }


    .missio-box {
        left: 0;
    }

    .vision-box {
        left: auto;
        right: 0;
    }

    .section-title,
    .members-left-home .section-title,
    .news-detail-content h3 {
        font-size: 46px;
    }

    .home-resource-tabs .nav-tabs .nav-link {
        font-size: 16px;
    }

    a.logo-footer {
        width: 100px;
        height: auto;
    }

    p,
    li,
    a,
    .footer-links-row ul li a,
    .resoure-links,
    .resource-text p {
        font-size: 16px;
    }

    .side-panel {
        width: 75%;
        padding: 35px;
    }

    .inner-heading,
    .inner-heading h1, .inner-heading p,
    .inner-heading span,
    .inner-heading h1 span {
        font-size: 75px;
    }

    .inner-banner-card h1 {
        font-size: 40px;
    }

    .date-1 {
        font-size: 12px;
    }

.side-panel .close-btn {
    width: 30px;
    height: 30px;
    padding: 4px;
}

.board-member-panel .close-btn {
    top: -10px;
    right: -10px;
}

    


}



@media (max-width:1200px) {
    .hero-event-content {
        padding: 25px;
    }

    .hero-event .arrow-secondary {
        right: 8px;
        top: 8px;
    }

    .hero-event h2 {
        font-size: 26px;
    }

    .heading-48 {
        font-size: 36px;
    }

    .country-fair-slider,
    .events-main-slider,
    .more-member-slider {
        width: calc(100% + ((100vw - 1920px) / 2) + 500px);
    }

.ab-col-margin {
    margin-bottom: 90px;
}




}


@media (max-width:1140px) {
    
    .hero-heading {
        font-size: 80px;
    }
    
    .hero-heading span {
        font-size: 65px;
    }
    
        .logo {
        width: 65px;
        flex-shrink: 0;
    }
    
.footer-social-icons li a, .login-btns a.dropdown-toggle-btn, a.event-arrow i {
    width: 40px;
    height: 40px;
    place-content: center;
    font-size: 16px;
}
    

    .menus li {
        padding: 15px 14px;
    }

    svg.svg-icon {
        width: 16px;
        height: 16px;
    }

    .hero-heading span {
        position: static;
    }

    .btn-style-1,
    .btn-style-2,
    .btn-style-3,
    .btn-style-4,
    .btn-style-5,
    .btn-style-6 {
        padding: 11px 22px ;
    }

    .arrow-secondary {
        width: 50px;
        height: 50px;
    }

    .svg-icon.arrow-svg {
        width: 12px;
        height: 12px;
    }
    
     .hero-count-box p {
         font-size: 14px; 
    }

    .hero-video-1 .web-img img {
        width: 110px;
        height: auto;
    }

    .hero-video-1 {
        width: 100%;
    }

    .section-para {
        font-size: 20px;
    }

    .hero-content .col-lg-6.px-lg-5 {
        padding: 1rem ! IMPORTANT;
    }

    .c-share-1 a {
        width: 35px;
        height: 35px;
    }

    .events-list-hm img {
        width: 50px;
        height: 50px;
    }

    .c-share-1 a {
        width: 35px;
        height: 35px;
    }

    .events-list-hm {
        gap: 1px;
    }

    .speakers {
        padding: 15px 20px;
    }

    ul.menus li .clk_btn {
        font-size: 13px;
        right: 0;
    }

    .events-main-hm-text {
        width: 65%;
    }

    .events-main-hm-text h4 {
        width: 95%;
    }

    .member-card {
        width: 90%;
    }

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

    .point-of-contact-box {
        flex-wrap: wrap;
    }

    .home-resource-tabs .nav-tabs .nav-link {
        font-size: 13px;
    }


}



@media (max-width:1024px) {

    .hero-event h2 {
        font-size: 24px;
        -webkit-line-clamp: 1;
        line-clamp: 1;
    }

    .hero-count-box {
        width: 50%;
    }

    ul.desktop-menu,
    ul.menus ul.dropdown-menu li a:before {
        display: none
    }

    .mobile-toggle {
        display: inline-grid;
    }

    .nav-btns {
        display: none ! IMPORTANT;
    }

    .menus li:hover .dropdown-menu {
        display: none;
    }

    ul.menus li .clk_btn {
        right: -10px;
        top: -10px;
        font-size: 12px;
        color: var(--primary-600);
        font-weight: 600;
        fill: var(--primary-600);
        padding: 10px 10px;
    }

    ul.menus.mobile-menus a:before {
        position: absolute;
        content: "";
        width: 100%;
        height: 1px;
        bottom: 0;
        background: linear-gradient(90deg, rgba(138, 140, 228, .5) 0, rgba(138, 140, 228, 0) 61.06%)
    }

    ul.dropdown-menu {
        display: none;
        position: revert;
        opacity: 1;
        visibility: visible;
        transition: none;
        transform: none;
        width: 100%;
        min-width: 100%;
        margin: 10px 0;
        box-shadow: none;
        border: 1px solid var(--gray-400)
    }

    ul.menus ul.dropdown-menu li a {
        font-size: 14px;
        padding: 9px 15px;
        margin: 0;
        border-color: var(--gray-400)
    }

    .mobile-top-info li {
        padding: 0;
        border: 0;
        margin: 0
    }


    .logo-footer {
        margin: auto;
    }

    .footer-social-icons li a {
        width: 48px;
        height: 48px;
    }

    .custom-dropdown.search-dropdown {
        width: 300px;
        padding: 24px;
        left: -230px;
    }

    .custom-dropdown.search-dropdown:before {
        left: 250px;
    }



    ul.custom-dropdown.language-dropdown {
        width: 240px;
        left: -103px;
    }


    ul.custom-dropdown.language-dropdown::before {
        right: 43%;
    }

    .custom-dropdown.profile-dropdown {
        width: 265px;
        left: -178px;
    }

    .custom-dropdown::before {
        right: 43%;
    }

    .custom-dropdown.profile-dropdown::before {
        right: 19%;
    }

    .desktop-nav-right {
        display: none ! IMPORTANT;
    }

    .Mobile-nav-right {
        display: flex;
    }


.img-grid {
    gap: 7px;
}





}


@media (max-width:991px) {

    .dark-bg:before,
    .dropdown-menu:before,
    .events-de-para p,
    .events-main-content .c-spacer__horizontal,
    .members-box.last:before,
    .report-card .desk,
    span#resourceTabLabel,
    ul.content-ul li:nth-child(2):before {
        display: none
    }

    .events-main-content p,
    .hero-count-box p,
    .home-resource-tabs .nav-tabs .nav-link,
    .point-of-contact-box a,
    .point-of-contact-box p,
    a,
    p,
    ul.content-ul li p {
        font-size: 14px
    }

    .hero-heading {
        text-align: center;
        font-size: 60px;
        margin: 0 0 1rem;
        line-height: 1.1
    }

    .hero-heading span {
        position: static;
        font-size: inherit
    }

    .hero-paragraph {
        text-align: center;
        font-size: 18px
    }

    .btn-style-1,
    .btn-style-2,
    .btn-style-3,
    .btn-style-4,
    .btn-style-5,
    .btn-style-6 {
        padding: 12px 20px !important;
        font-size: 14px !important;
        width: fit-content;
        justify-content: center;
        font-weight: 600;
        gap: 7px;
    }

    svg.svg-icon {
        width: 16px;
        height: 16px
    }

    .svg-icon.arrow-svg {
        width: 11px;
        height: 11px;
    }

    .mobile-hero-events {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        padding: 16px;
        border-radius: 16px;
        gap: 16px;
        text-align: left;
        background: rgba(138, 140, 228, .1);
        backdrop-filter: blur(16px);
        line-height: normal;
        position: relative;
        fill: white
    }

    .mobile-hero-events img {
        width: 120px;
        height: 120px;
        object-fit: cover;
        border-radius: 16px
    }

    .event-tag-secondary {
        font-size: 10px;
        padding: 3px 8px;
        font-weight: 700;
        margin: 0 0 6px;
    }

    .arrow-mob {
        width: 36px;
        height: 36px;
        display: grid;
        place-content: center;
        background: #fff;
        border-radius: 100%;
        position: absolute;
        top: 0;
        right: 0;
        transform: rotate(-180deg);
        fill: #000;
        transition: .4s ease;
    }


    .mobile-hero-events:hover .arrow-mob {
        background: var(--secondary-200);
        transform: rotate(270deg);
    }

    .mobile-hero-events:hover .event-tag-secondary {
        background: white;
    }

    .mobile-hero-events:hover p {
        color: var(--secondary-300);
    }

    .mobile-hero-events:hover img {
        transform: scale(1.01);
    }



    .member-card,
    .missio-box {
        border: 1px solid rgba(255, 255, 255, .15)
    }

    .company-m-text span,
    .date-1,
    .point-of-contact-box span {
        font-size: 14px;
    }

    .mobile-hero-events {
        color: #fff;
        fill: white
    }

    .hero-counter {
        width: 100%;
        text-align: center
    }

    .hero-count-box,
    ul.content-ul li {
        width: 45%
    }

    .heading-36,
    .heading-40,
    .hero-count-box span {
        font-size: 24px
    }

    .inner-heading,
    .inner-heading h1, .inner-heading p,
    .inner-heading span,
    .inner-heading h1 span .mem-proflir-title,
    .section-title {
        font-size: 36px
    }

    .event-body-inner h4,
    .events-main-content .heading-26,
    .member-profile-content p,
    .member-profile-span,
    .section-para {
        font-size: 18px
    }

    .about-section-1 {
        margin-top: -5px
    }

    .about-img-box {
        width: 100%;
        height: auto;
        margin: 0 0 10px;
        border-radius: var(--radius-16);
    }

    .missio-box {
        position: static;
        width: 100%;
        backdrop-filter: blur(13.05px);
        padding: 20px;
        margin: 0 0 10px;
        border-radius: var(--radius-16);
    }

    .py-100 {
        padding: 70px 0 !important
    }

    .pb-100 {
        padding-bottom: 70px
    }

    .pt-100 {
        padding-top: 70px
    }

    .mission-felx img {
        width: 40px
    }

    .member-profile-content span,
    .members-flex p,
    .mission-felx span,
    .testimonials-heading .section-para {
        font-size: 20px
    }

    .section-tag {
        font-size: 13px
    }

    .members-img {
        height: 100%;
        width: 100%
    }

    .member-card {
        margin: -45px 0 30px;
        width: 100%;
        background: radial-gradient(166.91% 125.83% at 99.92% 103.83%, rgba(255, 190, 77, .1) 0, rgba(255, 190, 77, .3) 100%);
        backdrop-filter: blur(80px);
        text-align: center
    }

    .members-box {
        text-align: center;
        margin: 0 0 1.4rem;
        padding: 0 0 1.4rem;
    }

    .members-box:before {
        top: auto;
        bottom: 0;
        background: linear-gradient(90deg, rgba(255, 228, 179, 0) 0, rgba(255, 228, 179, .5) 50%, rgba(255, 228, 179, 0) 100%);
        width: 100%;
        left: 0;
        height: 1px
    }

    .members-flex {
        justify-content: center;
        flex-direction: column;
        gap: 12px;
        margin-bottom: 10px;
    }

    .members-flex img {
        width: 40px;
        height: auto
    }

    .members-box.last {
        margin: 0;
        padding: 0
    }

    .test-flex img {
        width: 48px;
        height: 48px
    }

    .mob-date span,
    .mob-date svg.svg-icon {
        color: var(--primary-300);
        fill: var(--primary-300);
        font-weight: 700;
        font-size: 12px
    }

    .mob-date {
        color: var(--gray-1400);
        font-size: 11px;
        font-style: italic
    }

    .mobile-upcomingslider .resource-box {
        width: 97%;
        margin: auto
    }

    .mobile-upcomingslider ul.slick-dots {
        justify-content: center;
        margin: 10px 0 0
    }

    .home-resource-tabs,
    .resource-slider-controls,
    ul.c-breadcrumb {
        justify-content: center
    }

    .resource-slider-wrapper .col-lg-4 {
        max-width: 50%;
        flex: 0 0 50%;
        padding-right: calc(var(--bs-gutter-x) * .5);
        padding-left: calc(var(--bs-gutter-x) * .5);
    }

    .report-card {
        flex-direction: column;
        width: 100%;
        border: 1px solid #e6e6e6
    }

    .mob-reportcard-icon {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 15px;
        /* justify-content: center; */
        background: var(--gray-200);
        border-bottom: 1px solid var(--gray-400)
    }

    .mob-reportcard-icon svg.svg-icon {
        color: var(--primary-600);
        fill: var(--primary-600);
        width: 22px;
        height: 22px;
    }

    .report-text-mob {
        color: var(--gray-1500);
        font-size: 14px;
        font-weight: 600
    }

    .mob-reportcard-info {
        padding: 15px;
        text-align: center
    }

    .mob-reportcard-info .meta-info {
        padding: 0;
        border: 0;
        justify-content: space-between ! IMPORTANT;
    }

    .download-btn.mob {
        min-height: auto;
        font-size: 14px;
        font-weight: 700;
        padding: 0;
    }

    .report-card:hover .download-btn {
        background: 0 0;
        color: var(--primary-500)
    }

    .mob-reportcard:hover .mob-reportcard-icon {
        background: var(--secondary-100)
    }

    .mob-reportcard:hover .report-text-mob,
    .mob-reportcard:hover svg.svg-icon {
        color: var(--primary-400);
        fill: var(--primary-400)
    }

    .footer-top-info {
        text-align: center;
        margin: auto;
        display: grid;
        place-content: center;
        gap: 20px;
        align-items: center !important;
        justify-content: center !important
    }

    .footer-news-letter {
        width: 100%;
        border: 1px solid rgba(255, 209, 128, .31);
        background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0, rgba(255, 190, 77, .05) 100%);
        text-align: center;
        padding: 32px;
    }

    .footer-news-flex {
        flex-direction: column;
        align-items: center !important
    }

    .footer-news-letter form {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    ul.c-breadcrumb a,
    ul.c-breadcrumb li {
        font-size: 10px
    }

    ul.c-breadcrumb svg.svg-icon {
        width: 10px;
        height: 10px
    }

    .inner-content p {
        width: 100%;
        font-size: 18px;
        height: auto
    }

    .inner-content {
        gap: 10px;
        width: 100%;
    }

    .inner-banner {
        padding-bottom: 4rem;
        padding-top: 7rem
    }

    .logo {
        width: 64px
    }

    .sticky .logo {
        width: 48px
    }

    .company-m-logo {
        height: 64px;
        width: 64px
    }

    .company-m-country-logo {
        width: 24px;
        height: 24px
    }

    .company-m-logo-both {
        width: 64px;
        height: 64px;
        top: -28px;
    }

    .company-m-img {
        height: 135px;
    }

    .company-m-text {
        padding: 45px 20px 20px;
        margin: -45px auto 0;
    }

    .company-m-name {
        font-size: 14px;
        line-height: normal;
        margin: 0 0 3px
    }

    .member-profile-img {
        position: relative
    }

    .member-profile-img:before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 53.09%, rgba(18, 18, 48, .75) 100%)
    }

    .member-profile-img img {
        height: 375px;
        width: 100%
    }

    .member-profile-content {
        text-align: center;
        margin: -65px 0 0;
        position: relative
    }

    .m-logos-wrap {
        margin: 0 auto 20px;
    }

    .mb-5,
    .my-5 {
        margin-bottom: 1.4rem !important
    }

    .m-logo img {
        width: 100px;
        height: 100px
    }

    .my-5 {
        margin-top: 2rem !important
    }

    .events-de-para,
    ul.content-ul {
        flex-wrap: wrap
    }

    .about-title,
    ul.content-ul li span {
        font-size: 30px
    }

    ul.trade-list-1 {
        gap: 5px;
    }

    ul.trade-list-1 li {
        padding: 8px 16px;
        font-size: 14px
    }

    .event-body-inner {
        flex-wrap: wrap;
        width: 90%;
        gap: 10px
    }

    .event-body-inner .event-thumbnail img {
        width: 100%;
        height: 100%
    }

    .country-fair-slider,
    .event-thumbnail,
    .events-main-slider,
    .img-grid .grid-box,
    .more-member-slider,
    ul.list-style-2 {
        width: 100%
    }

    .event-body-inner .event-details {
        width: 100%;
        max-width: 100%
    }

    .point-of-contact-box img {
        width: 64px;
        height: 64px
    }

    .point-of-contact-box-2 p {
        font-size: 16px
    }

    ul.slick-dots li button {
        width: 8px !important;
        height: 8px !important;
        padding: 0
    }

    .social-design-1 .social-link i {
        width: 35px;
        height: 35px;
        font-size: 15px
    }

    .ab-col.ab-col-1,
    .ab-col.ab-col-9,
    .col-lg-9.more-member-slider-wrap {
        padding: 0
    }

    .small-icon-desing-1 {
        margin: 0 auto 20px;
    }

    .events-main-box {
        display: inherit;
        width: 100%;
        background: linear-gradient(0deg, rgba(255, 255, 255, .8), rgba(255, 255, 255, .8)), linear-gradient(129.5deg, rgba(138, 140, 228, 0) 67.58%, rgba(138, 140, 228, .115) 95.31%);
        backdrop-filter: blur(26px);
        padding: 24px;
        box-shadow: rgb(99 99 99 / 11%) 0 2px 8px 0;
        overflow: visible;
    }

    .event-main-img {
        width: 120px;
        height: 120px;
        border-radius: 16px;
        overflow: hidden;
        float: left;
        display: inline;
        margin-right: 15px;
        margin-bottom: 15px
    }

    .events-main-content {
        position: static;
        width: 100%;
        padding: 0;
        border: 0;
        height: auto;
        gap: 6px;
        display: inherit;
        backdrop-filter: none;
        background: 0 0;
        margin-left: 0
    }

    ul.list-style-2 li {
        width: 50%
    }

    .events-main-box .category-style-1 {
        top: 35px;
        left: 35px
    }

    .category-style-1 {
        font-size: 10px;
        padding: 5px 12px
    }

    .events-main-box .events-hub-share {
        bottom: 20px;
        top: auto;
        right: 20px;
    }
    
    .events-main-content .heading-26 {
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.mob-p  p {
    width: 100%;
    display: initial;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    margin: 10px 0 0;
}

    .events-de-para .btn-style-4 {
        padding: 0 !important;
        background: 0 0;
        border: 0;
        color: var(--primary-500) !important
    }

    .c-share-1 a {
        width: 35px;
        height: 35px;
    }

    .filterd .event-main-img {
        width: 100%;
        height: 220px;
        margin: 0 0 15px
    }

    .filterd .events-hub-share {
       top: 15px;
        bottom: auto;
        right: 15px;
    }

    /*#hTrack,*/
    /*.dark-bg {*/
    /*    display: block*/
    /*}*/

    /*#hViewport {*/
    /*    overflow: visible*/
    /*}*/

    /*#hTrack {*/
    /*    transform: none !important;*/
    /*    padding: 0*/
    /*}*/

    .about-pg .ab-col {
        /* width: 100%; */
        /* display: block; */
        padding: 0 20px;
        /* max-width: 720px; */
        margin: 0 auto 50px;
    }
    
    .ab-col-margin {
    margin: 0;
}

.ab-col.ab-col-12 {
    margin-bottom: 0;
}

    .img-grid .grid-box img {
        height: auto;
    }

    .about-content p,
    .accent-year {
        font-size: 18px;
        margin: 0 0 1rem
    }

    .dark-bg .about-title {
        color: var(--primary-400)
    }

    .dark-bg p {
        color: var(--gray-1500) !important
    }

    .board-mission .missio-box {
        width: 93%;
        left: 50%;
        transform: translate(-50%, -50%);
        top: 13%;
        bottom: auto;
        margin: 0;
    }

    .endorsment-info p {
        color: #fff !important
    }

    .videoModal .modal-body {
        width: 100%;
        height: auto;
    }

    .videoModal iframe,
    .videoModal img,
    .videoModal video {
        height: 200px;
    }

    .share-btn {
        font-size: 11px;
        gap: 5px;
        width: 30px;
        height: 30px;
        padding: 0;
        display: grid;
        place-content: center;
    }

    .icon-circle {
        width: 30px;
        height: 30px;
    }

    .share-wrapper {
        gap: 4px;
        padding: 7px;
    }

    .share-btn span {
        display: none;
    }

    button#shareBtn:active,
    button#shareBtn:focus {
        outline: none;
    }

    .social-icon {
        width: 32px;
        height: 32px;
        margin: auto;
    }

    .social-popup {
        gap: 5px;
        min-width: auto;
    }

    .fixed-share-wrap .events-share-popup {
        left: -21px;
    }

    input,
    select,
    textarea {
        font-size: 14px;
        padding: 10px 18px;
    }

    .input-box .svg-icon,
    .input-box i {
        width: 16px;
        height: 16px;
    }

    .custom-dropdown input {
        padding-left: 35px;
    }

    .form-group {
        margin-bottom: 10px;
    }

    .custom-dropdown ul li,
    .custom-dropdown>div {
        padding: 0 0 12px;
    }

    .form-group label {
        font-size: 12px;
        margin-bottom: 5px;
    }

    .select-box select {
        padding-right: 20px;
    }

    .select-arrow {
        width: 16px;
        height: 16px;
        right: 13px;
    }

    .language-dropdown li {
        font-size: 13px;
        padding: 0 0 8px;
    }

    .clk_btn.navactives {
        transform: rotate(180deg) !IMPORTANT;
    }

    ul.menus li:hover .clk_btn {
        transform: inherit;
    }



    .side-panel {
        width: 100%;
        height: 80%;
        bottom: 0;
        top: auto;
        padding: 20px;
        overflow: auto;
        border-top-right-radius: 16px;
        border-top-left-radius: 16px;
    }

    .side-panel .close-btn {
        position: fixed;
        top: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
        background: rgba(255, 255, 255, 0.1);
        color: white;
        border: 2px solid rgba(255, 255, 255, 0.2);
        padding: 0;
    }

    #joinModal .close-btn .svg-icon {
        width: 16px;
        height: 16px;
    }

    .info-row hr,
    .info-row svg {
        display: none;
    }

    .info-row {
        flex-wrap: wrap;
        gap: 8px;
    }


    .about-pg {
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
        margin-bottom: -2px;
        background: var(--gray-200);
        padding-top: 0 !important;
    }

    .about-pg .ab-col-1 {
        padding: 0;
    }

    .about-pg .ab-col-1 img {
        border-radius: 0;
    }
    
    .about-pg .container {
    max-width: 100%;
    padding: 0;
}

    .endorsment-info span {
        font-size: 30px;
    }

    .endorsment-info p {
        font-size: 16px;
    }

    .img-grid .endorsment-box img {
        height: auto;
    }

    .about-content .about-subtitle {
        font-size: 12px;
    }

    .about-content .btn-secondary-outline {
        border-color: var(--primary-300);
        color: var(--primary-300);
    }

    .about-content .btn-secondary-outline:hover {
        background: var(--primary-300);
        color: white;
    }

    .about-pg .ab-col-7,
    .about-pg .ab-col-9 {
        padding: 0;
    }

    .about-pg .ab-col-7 img,
    .about-pg .ab-col-9 img {
        border-radius: 0;
        min-height: auto;
    }

    .board-mission,
    .board-mission-img {
        min-height: auto;
    }

    .board-mission .vision-box {
        top: auto;
        bottom: -6%;
    }
    
    .board-heading {
    margin-top: 20px;
}


    .rounded-corners-sec:after {
        width: 16px;
        height: 16px;
    }


    .rounded-corners-sec:before {
        width: 16px;
        height: 16px;
    }

    .home-logos-header::after,
    .home-logos-header::before {
        width: 16px;
        height: 16px;
        top: -15px;
    }

    .board-member-box {
        margin: 0 10px 0;
    }

    .board-member-box img {
        box-shadow: none;
    }

    .board-members-flex ul.slick-dots {
        justify-content: center;
        width: 100%;
    }

    .videoModal .btn-close {
        right: 20px;
        top: 20px;
        width: 36px;
        height: 36px;
    }

    .prev-member,
    .next-member {
        display: none;
    }

    .member-dots ul.slick-dots {
        position: absolute;
        bottom: 40px;
        right: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        justify-content: center;
    }

    .footer-contact-info {
        flex-wrap: wrap;
    }

    .terms-content p.lead {
        font-size: 18px;
    }

    .terms-content p {
        font-size: 16px;
    }

    .terms-content h2 {
        font-size: 24px;
    }

    .heading-48 {
        font-size: 30px;
    }

    .benefit-row {
        flex-direction: column;
        gap: 16px;
        margin: 0 0 16px;
    }

    .outer-side.outer-label {
        width: 100%;
        max-width: 100px;
        margin: auto;
        align-items: center;
    }

    span.side-label {
        text-align: center;
    }

    .about-section-1 {
        border-radius: 0 0 16px 16px;
    }

    .lead {
        font-size: 18px;
    }

    .step-flow {
        flex-direction: column;
    }

    .steps-count {
        width: 100%;
        text-align: center;
        display: block;
    }

    .steps-count>div {
        width: 100%;
    }

    .steps-count p {
        font-size: 18px;
        color: #000;
    }

    .steps-count svg.svg-icon {
        display: none;
    }

    p {
        font-size: 16px;
    }

    .steps-content {
        width: 100%;
    }

    .join-card {
        gap: 7px;
    }

    .join-icon {
        width: 45px;
        height: 45px;
        padding: 7px;
    }

    .join-title {
        font-size: 20px;
    }

    .mobilejoinSlider ul.slick-dots {
        justify-content: center;
    }

    .w-75 {
        width: 100% !important;
    }

    .mobilejoinSlider .slick-list {
        padding-right: 60px;
    }

    .mobilejoinSlider .slick-slide {
        padding-right: 12px;
    }

    .membership-page::before {
        display: none;
    }

    .membership-box,
    .membership-box-2 {
        padding: 20px;
    }

    .heading-26 {
        font-size: 20px;
    }

    .membership-flex img,
    .membership-flex-2 img {
        width: 40px;
        height: 40px;
    }

    .membership-flex,
    .membership-flex-2 {
        margin: 0 0 13px;
    }

    .membership-box-2 li,
    .membership-box p {
        font-size: 14px;
    }

    .step-out-arrow {
        width: 50px;
        height: 50px;
        display: block;
        margin: 20px auto;
        color: var(--primary-400);
        transform: rotate(90deg);
    }


    .help-center-pg {
        padding-top: 0 !IMPORTANT;
    }

    .help-center-tabs {
        width: 100%;
        justify-content: center;
        position: absolute;
        top: 0;
        left: 0;
        padding: 0;
        overflow: auto;
    }

    .help-center-tabs .nav-tabs {
        width: 100%;
        gap: 0 !important;
        flex-wrap: nowrap !important;
        overflow-x: visible;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        justify-content: center;
    }

    .help-center-tabs .nav-tabs .nav-link.active {
        border: 0;
        margin: 0;
        background: var(--primary-300);
        color: white;
    }

    .help-center-tabs .nav-tabs .nav-link {
        box-shadow: 0px 30px 150px 0px rgba(38, 39, 97, 0.2);
        background: white;
        min-width: 160px;
        min-height: 42px;
        font-size: 14px;
        color: var(--gray-1400);
        font-weight: 600;
        border-radius: 0;
        margin: 0 !important;
        border-right: 1px solid var(--gray-400);
        padding: 0;
        justify-content: center;
        opacity: 1;
    }

    .help-filter-text {
        color: var(--gray-1300);
        font-size: 12px;
        /* font-weight: 700; */
        /* letter-spacing: .4px; */
    }

    .circle,
    .reg-next,
    .reg-prev {
        width: 24px;
        height: 24px;
        font-size: 12px;
    }

    .circle .svg-icon,
    .circle-btn .svg-icon,
    .reg-next .svg-icon,
    .reg-prev .svg-icon {
        width: 11px;
        height: 11px;
    }

    .acc-tag {
        padding: 4px 10px;
        font-size: 10px;
        font-weight: 700;
    }

    .acc-outer .accordion-button h6 {
        font-size: 16px;
    }

    .help-center-accordion .accordion-button h6 {
        width: 72%;
    }

    .help-center-pg {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

    .help-center-accordion {
        padding-top: 6rem ! IMPORTANT;
    }

    .resourse-hub-1 {
        background-position: top !important;
    }

    .inner-heading span, 
    .inner-heading h1 span {
        /* display: block; */
        margin-top: 8px;
    }

    .mobile-cat-tabs {
        display: flex;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        /* padding: 12px 16px; */
        background: var(--white);
        /* or your bg var */
        /* border-bottom: 1px solid rgba(0, 0, 0, 0.08); */
        margin-bottom: 16px;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        /*justify-content: center;*/
    }

    .mobile-cat-tabs::-webkit-scrollbar {
        display: none;
    }

    .mobile-cat-tab {
        flex-shrink: 0;
        padding: 14px 20px;
        border-radius: 0;
        border: none;
        background: white;
        color: var(--gray-1400);
        font-size: 14px;
        cursor: pointer;
        transition: background 0.2s, color 0.2s;
        font-weight: 600;
        border-right: 1px solid var(--gray-400);
    }

    .mobile-cat-tab.active {
        background: var(--primary-300);
        color: #fff;
    }

    .filterd-content {
        margin-top: 3rem;
    }

    blockquote {
        padding: 24px;
        font-size: 18px;
    }

    .news-detail-content h2 {
        font-size: 36px;
    }

    .news-detail-content h3 {
        font-size: 30px;
    }

    .news-detail-content h4 {
        font-size: 24px;
    }


    .custom-grid-gallery .gal-img {
        width: 49%;
        height: 200px;
    }

    .news-detail-content h5 {
        font-size: 20px;
    }

    .news-detail-content h4 {
        font-size: 24px;
    }

    .news-detail-content h6 {
        font-size: 18px;
        font-weight: 500;
    }

    .recent-news-slider .slick-list {
        padding-right: 60px;
    }

    .recent-news-slider .slick-slide {
        padding-right: 12px;
    }

    .recent-news-slider ul.slick-dots {
        justify-content: center;
    }

    .accord-count-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 32px;
        /* height: 20px; */
        padding: 3px 10px 2px 10px;
        border-radius: 999px;
        background: var(--secondary-300);
        color: var(--gray-1600);
        font-size: 10px;
        font-weight: 600;
        margin-left: auto;
        margin-right: 15px;
        flex-shrink: 0;
        line-height: 1;
    }

    .reports-accordion .accordion-button {
        display: flex;
        align-items: center;
    }

    .reports-accordion .accordion-button h6 {
        margin: 0;
        flex: 1;
        /* pushes badge to the right */
        font-size: 13px;
    }

    .accordion-button:not(.collapsed) .accord-count-badge {
        background: var(--primary-300);
        color: white;
    }

    .reports-filter-text {
        display: none;
        color: var(--gray-1300);
        font-size: 12px;
    }

    .reports-filter-text.active {
        display: block;
    }

    .reports-detail-card .mob-reportcard-icon {
        background: var(--secondary-300);
    }

    .inner-heading,
    .inner-heading h1 , .inner-heading p {
        font-size: 36px;
        font-weight: 500;
        margin: .8rem 0 !important;
    }

    .about-inner-banner .inner-heading {
        font-size: 56px;
    }

    .contact-map .map-wrapper {
        position: relative;
        width: 100%;
        margin-top: 90px;
        border-top: 2px solid var(--gray-600);
    }

    .map-wrapper iframe {
        width: 100%;
        min-height: 640px;
        border-radius: 0;
    }

    .pg-contact {
        background: url(../images/abpage-bg.webp);
        background-size: cover;
        background-position: top;
    }

    .contact-pg-info li {
        width: 240px;
        text-align: justify;
        justify-content: center;
        display: flex;
        border: 2px solid rgba(255, 255, 255, 0.2);
        padding: 12px 20px;
        border-radius: 30px;
    }

    .contact-pg-info li.divider-contact {
        display: none;
    }

    .contact-pg-info {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px 0 !important;
        margin: 15px 0;
    }

    .contact-pg-info li a {
        font-size: 14px;
    }

    .contact-pg-info li:before {
        display: none;
    }

    .left-content {
        text-align: center;
    }

    .left-side {
        width: 100%;
    }

    .right-side {
        display: none;
    }

    .left-content h1 {
        font-size: 36px;
        margin: 0 0 15px;
    }

    .left-content .login-para {
        font-size: 18px;
    }

    .left-content p {
        font-size: 16px;
    }

    .login-card-inner {
        padding: 32px;
        min-height: 288px;
    }

    .bottom-bar {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
        font-size: 12px;
        padding: 20px 18px;
    }

    .bottom-bar a {
        font-size: 12px;
    }

    .login-page,
    .split-container {
        min-height: 900px;
    }

    .mid-card {
        top: 55%;
    }

    .events-detail-hero .category-style-1 {
        top: 15px;
        left: 50%;
        transform: translate(-50%);
    }

    .inner-banner-card {
        position: static;
        text-align: center;
        background: transparent;
        border: 0;
        padding: 25px 0 0;
        width: 100%;
        display: block;
        min-height: auto;
    }

    .inner-banner-card h1 {
        font-size: 30px;
        width: 100%;
    }

    .inner-banner-card .list-sepaker-img {
        display: none;
    }

    .inner-banner-card ul.list-style-2 li {
        width: 100%;
    }

    .inner-banner-card .events-share {
        display: none;
    }

    .sidebar-box-1 {
        display: none;
    }

    ul.events-detail-list {
        display: none;
    }

    .events-detail-sidebar {
        position: absolute;
        top: 0;
        width: 100%;
        left: 0;
    }

    .events-details-tab {
        display: flex;
        display: flex;
        align-items: center;
        flex-wrap: nowrap !important;
        overflow-x: visible;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    .events-details-tab a {
        border: 0;
        border-left: 1px solid var(--gray-400);
    }

    .events-detail-content {
        /*padding-top: 3rem;*/
    }

    .bottom-video-text {
        position: static;
        padding: 32px 20px;
        text-align: center;
        background: radial-gradient(81.73% 163.15% at 15.58% 27.08%, rgba(81, 82, 158, 0.9) 0%, rgba(55, 56, 127, 0.9) 100%);
        margin-top: 10px;
        width: 100%;
        max-width: 100%;
    }

    .bottom-video-text span {
        font-size: 20px;
        margin: 0 0 5px;
    }

    .side-border {
        padding: 0;
        border: 0;
    }

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



    .mob-col-1 {
        order: 2;
    }

    .mob-col-2 {
        order: 1;
    }

    .mob-col-3 {
        order: 3;
    }

    .mob-col-4 {
        order: 2;
    }

    .mob-col-5 {
        order: 1;
    }

    .mob-col-6 {
        order: 3;
    }

    /*.mob-no-corner:before,*/
    /*.mob-no-corner:after {*/
    /*    display: none;*/
    /*}*/

    .events-de-hero-img img {
        height: 100%;
        min-height: 210px;
        object-fit: cover;
    }

    .ticket-row,
    .ticket-row:last-child {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: self-start;
        border: 1px solid var(--gray-500);
        padding: 16px;
        margin: 0 0 10px;
        border-radius: 16px;
        gap: 8px;
    }

    .ticket-head {
        display: none;
    }

    .type-box {
        padding: 0;
        background: transparent;
        border: 0;
        font-size: 14px;
        font-weight: 600;
    }

    .ticket-arrow {
        display: none;
    }

    .ticket-info {
        border: 1px solid var(--gray-400);
        width: 100%;
        border-left: 0;
        border-right: 0;
        padding: 12px 0;
    }

    .ticket-buy .btn-style-4 {
        width: 100%;
    }

    .ticket-buy {
        width: 100%;
    }

    .speaker-controls {
        position: absolute;
        bottom: 0;
        z-index: 9;
        left: 50%;
        transform: translate(-50%);
    }

    .speaker-section {
        position: relative;
        padding-bottom: 5rem;
    }

    .speaker-box img {
        width: 64px;
        height: 64px;
    }

    .speaker-box {
        padding: 24px;
    }

    .new-bottom-nav {
        flex-wrap: wrap;
        width: 100%;
    }

    .expo-item {
        padding: 24px;
        background: linear-gradient(0deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8)),
            linear-gradient(129.5deg, rgba(138, 140, 228, 0) 67.58%, rgba(138, 140, 228, 0.115) 95.31%);
        border: 0;
        backdrop-filter: blur(26px);
    }

    .expo-title {
        font-size: 18px;
    }

    .expo-gallery img {
        height: 95px;
        border-radius: 8px;
    }

    .expo-meta-row .btn-style-4 {
        display: none;
        flex-wrap: wrap;
    }

    .expo-meta.desk {
        display: none;
    }

    .events-de-register .gradient-form-bg {
        background: transparent;
        padding: 0;
        border-radius: 0;
    }

    .events-de-info li {
        width: 100%;
    }

    .inner-banner-card .c-spacer__vertical {
        display: none;
    }

    .events-de-info {
        align-items: center;
    }

    .inner-banner-card .date-1 {
        justify-content: center;
    }

    .inner-banner-card hr {
        background: linear-gradient(90deg, rgba(138, 140, 228, 0) 0%, rgba(138, 140, 228, 0.5) 50%, rgba(138, 140, 228, 0) 100%);
    }


    /* stack cols vertically */
    .schedule-wrapper {
        grid-template-columns: 1fr;
    }

    /* make the day header clickable */
    .schedule-day {
        /* display: flex; */
        /* align-items: center; */
        /* justify-content: space-between; */
        /* cursor: pointer; */
        padding: 20px 0;
        border: 0;
        color: var(--primary-500);
        font-size: 14px;
    }

    /* show the arrow (hidden on desktop) */
    .day-toggle {
        display: flex;
        color: var(--gray-1600);
        fill: var(--gray-1600);
        /* padding-left: 14px; */
    }

    /* rotate arrow when open */
    .schedule-col.open .day-toggle {
        transform: rotate(180deg);
    }

    .col-body {
        max-height: 0;
        overflow: hidden;
        /* padding: 0 20px; */
    }

    .schedule-day-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .schedule-col {
        border-right: 0;
        border-bottom: 1px solid var(--gray-400);
    }

    .schedule-item {
        padding: 20px 10px;
        border-bottom: 1px solid var(--gray-400);
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .schedule-item .time {
        color: var(--gray-1600);
        font-size: 16px;
        position: relative;
        padding-right: 20px;
        margin: 0;
        border-right: 1px solid var(--gray-400);
    }

    .schedule-item.lunch {
        background: var(--gray-300);
    }





    .venue-img {
        display: flex;
        flex-direction: row-reverse;
        justify-content: start;
        align-items: center;
        gap: 20px;
        margin: 0 0 12px;
    }

    .venue-img img {
        width: 170px !important;
        height: 170px;
        border-radius: 16px;
    }

    .venu-map-box iframe {
        width: 100%;
        height: 372px;
    }

    .new-bottom-nav .btn-style-3 {
        padding: 12px 20px !important;
        font-size: 12px !important;
    }

    .custom-arrow-purple,
    .custom-arrow-yellow {
        width: 24px;
        height: 24px;
        font-size: 13px;
    }

    .schedule-stages-accordion .accordion-button {
        font-size: 12px;
        padding: 12px 0;
    }

    .schedule-stages-accordion .accordion-item:last-child {
        border-bottom: 0 !important;
    }

    .stages-name {
        margin: 10px 0;
        font-size: 14px;
    }


    .schedule-item .time {
        font-size: 12px;
    }

    .speaker img {
        width: 45px;
        height: 45px;
    }

    .speaker h6 {
        font-size: 14px;
    }

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

    .schedule-date {
        font-size: 14px;
    }


    .inner-banner-img {
        height: 372px;
    }

    .speaker-bio .lead {
        font-size: 18px;
    }

    .share-label {
        font-size: 14px;
    }

    .share-wrap.past-share {
        position: relative;
    }

    .events-hub-pg-1 .slider-controls {
        position: absolute;
        bottom: 25px;
        left: 50%;
        transform: translate(-50%);
    }

    .events-hub-pg-1 .custom-arrow-purple {
        display: none;
    }


    .events-main-box.filterd {
        width: 95%;
        margin: 0 auto 1.5rem;
        padding: 0;
        background: content-box;
        box-shadow: none;
        background: rgba(255, 255, 255, 0.2);
        border: 1px solid rgba(217, 217, 217, 1);
        position: relative;
    }

    p.calender-p {
        font-size: 13px;
        text-align: center;
    }

    .country-controls {
        position: absolute;
        bottom: 25px;
        left: 50%;
        transform: translate(-50%);
    }

    .country-controls button.custom-arrow-purple {
        display: none;
    }

    .country-img {
        height: 180px;
    }

    .country-content {
        padding: 20px;
        padding-top: 30px;
    }

    .country-title {
        font-size: 17px;
    }

    .county-list-info hr.my-3 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important;
    }


    .search-accordian-main {
        width: 100%;
        margin: 1rem 0 0;
    }

    .search-apply-btn {
        min-width: 274px;
    }

    .search-accordian-main:before {
        display: none;
    }

    .search-accordian-main .accordion-button .heading-26 {
        font-size: 16px;
    }

    .search-accordian-main .accordion-item {
        padding: 16px 0;
    }

    .search-accordian-main a.btn-style-3 {
        padding: 0 !important;
        background: transparent;
        border: 0;
        font-size: 13px !important;
        border-radius: 0;
    }

    .custom-pagination {
        gap: 4px !IMPORTANT;
    }

    .search-accordian-main a.btn-style-3 svg.svg-icon {
        display: none;
    }

    hr.w-25 {
        width: 30px !important;
    }

    .search-help-accordian .accordion-button h6 {
        width: 70%;
    }

    .search-accordian-main .accordion-body.p-0 {
        padding: 8px 0 !important;
    }


    .events-main-box.filterd .events-main-content {
        padding: 20px;
        border-radius: 16px;
        margin-top: -35px;
        background: linear-gradient(0deg, rgb(255 255 255 / 59%), rgb(255 255 255 / 89%)), linear-gradient(129.5deg, rgb(138 140 228 / 6%) 67.58%, rgb(138 140 228 / 0%) 95.31%);
        backdrop-filter: blur(30px);
        display: inline-block;
        position: revert;
    }


    .events-main-box.filterd .category-style-1 {
        top: 20px;
        left: 15px;
    }

    .events-hub-pg-1 .container , .events-hub-pg-4 .container {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .events-main-slider {
        margin: 0;
        width: 100%;
    }

    .country-fair-slider {
        margin: 0;
    }


    .mob-padding-0 {
        padding-right: 0;
        padding-left: 0;
    }

    .events-filter-slider {
        width: 100%;
    }

    .events-filter-slider .slick-slide {
        width: calc(100vw - 40px) !important;

    }


    .events-filter-slider .slick-list {
        padding: 0 !important;
        overflow: visible;
    }

    .events-filterd {
        overflow: hidden;
    }

    ul.slick-dots {
        justify-content: center;
    }

    .calender-box .flatpickr-current-month select,
    .calender-box .numInputWrapper {
        font-size: 14px;
    }

    /* The year input inherits the global input width:100%, which squeezed it to
       its 32px wrapper while "2026" needs ~35px — so the last digit was clipped.
       Element selector + class beats the global rule without !important. */
    .calender-box .flatpickr-current-month .numInputWrapper {
        width: 5.5ch;
    }

    .calender-box .flatpickr-months .flatpickr-next-month,
    .calender-box .flatpickr-months .flatpickr-prev-month {
        width: 24px;
        height: 24px;
        display: grid;
        place-content: center;
    }

    .flatpickr-months .flatpickr-prev-month svg,
    .flatpickr-months .flatpickr-next-month svg {
        width: 10px;
        height: 10px;
    }

    .filterd .events-hub-share a.events-share {
        background: rgba(255, 255, 255, 0.1);
        border: 1.33px solid rgba(217, 217, 217, 1);
        backdrop-filter: blur(17px);
        color: white;
    }

    .filter-search .svg-icon {
        top: 13px;
        width: 16px;
        height: 16px;
    }

    .mt-5 {
        margin-top: 1.6rem !important;
    }

    .footer-links-row .col-lg-3 {
        width: 100%;
        /* padding: 0; */
    }

    .footer-mobile-links h4 {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20px 20px;
        margin: 0;
        cursor: pointer;
        /* color: #c9a84c; */
        font-size: 16px;
        font-weight: 500;
        border-bottom: 0.5px solid #ffffff14;
        user-select: none;
        letter-spacing: .2px;
    }

    .footer-mobile-links>h4::after {
        content: '';
        display: inline-block;
        width: 8px;
        height: 8px;
        border-right: 2px solid var(--secondary-300);
        border-bottom: 2px solid var(--secondary-300);
        transform: rotate(45deg);
        transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        margin-top: -4px;
        border-radius: 1px;
    }

    .footer-mobile-links>h4.open::after {
        transform: rotate(-135deg);
        margin-top: 4px;
    }

    .footer-mobile-links>ul {
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        /* padding: 0 20px; */
        transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.35s ease,
            padding 0.35s ease;
    }

    .footer-mobile-links>ul.open {
        opacity: 1;
        /* padding: 4px 20px 14px; */
        margin-top: 12px;
        padding: 0 20px;
    }

    .footer-mobile-links>ul li {
        /* padding: 7px 0; */
        /* border-bottom: 0.5px solid #2a2a2a; */
        list-style: none;
    }

    .footer-mobile-links>ul li:last-child {
        border-bottom: none;
    }

    .footer-mobile-links>ul li a {
        /* color: #ccc; */
        font-size: 14px;
        text-decoration: none;
    }

    .col-lg-3:last-child .footer-mobile-links>h4 {
        border: 0;
        padding-bottom: 0;
    }


    .members-box:nth-child(4) {
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .members-box:nth-child(4):before {
        display: none;
    }

    .submit-btn {
        width: 100%;
    }

    .side-header:before {
        position: absolute;
        content: "";
        width: 100px;
        height: 4px;
        top: 0;
        background: rgba(230, 230, 230, 1);
        border-radius: 40px;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .steps.signup-steps {
        display: none;
    }

    .modal-header.side-header {
        position: revert !important;
        margin: 0;
        border: 0;
        padding-bottom: 0;
    }

    .side-panel form#registerForm {
        background: linear-gradient(180deg, rgba(107, 109, 196, 0.2) 0%, rgba(232, 232, 232, 0) 100%);
        padding: 32px;
        border-radius: var(--radius-16);
    }

    .resource-slider-wrapper .row {
        display: flex;
        flex-wrap: nowrap;
        transition: transform 0.4s ease;
        touch-action: pan-y;
    }

    .resource-slider-wrapper .col-lg-4,
    .resource-slider-wrapper .reg-slide {
        flex-shrink: 0;
    }

    .more-member-slider .member-company-boxes .company-m-text {
        min-height: 130px;
    }

    .border-radius-sec {
        border-radius: 16px 16px 0 0;
    }

    ul.c-breadcrumb {
        flex-wrap: wrap;
    }


    .container.member-slider-container {
        max-width: 100%;
        padding-right: 0;
    }


    .join-heading {
        padding: 0 var(--container-padding-xs);
    }

    .steps-count {
        padding: 0 var(--container-padding-xs);
    }


    .mem-proflir-title {
        font-size: 32px;
        overflow: auto;
        display: flex;
        justify-content: center;
    }


    .social-design-1 {
        grid-template-columns: repeat(2, 1fr);
    }
    
.venu-date .svg-icon {
    width: 16px;
    height: 16px;
}
    
.mobile-recent-slider .container {
    padding-right: 0;
}    



}



@media (max-width: 767px) {
    .resource-slider-wrapper .col-lg-4 {
        max-width: 88%;
        flex: 0 0 88%;
    }

    ul.content-ul li {
        width: 43%;
    }

    .resource-text {
     min-height: auto;
    }




}



@media (max-width:575px) {
    .container {
        max-width: var(--container-xs);
        padding-right: var(--container-padding-xs);
        padding-left: var(--container-padding-xs);
    }

    .login-btns,
    .nav-right {
        gap: 0 !important;
    }

    .header .container {
        padding: var(--container-padding-xs);
    }

    .sticky .container {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .sticky .logo img {
        width: 55px;
    }

    .mobile-hero-events p {
        font-size: 18px;
        margin: 0 0 5px;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
    }


    .scroll-div {
        font-size: 12px;
    }

    .btn-play-primary a {
        width: 48px;
        height: 48px;
    }

    .large-play-btn {
        width: 75px;
        height: 75px;
    }

    .btn-play-primary svg.svg-icon {
        width: 18px;
        height: 18px;
    }

    .member-card p.m-0 {
        font-size: 20px !important;
    }

    .member-card {
        padding: 32px 20px;
    }

    .member-card img {
        margin: 0 0 7px;
    }

    .member-card .btn-style-1,
    .member-card .btn-style-2 {
        width: 100%;
        max-width: 235px;
        margin: auto;
    }


    .about-section-1:before {
        background: linear-gradient(to top, rgb(10 10 26 / 0%) 0%, #040416 31.26%);
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: -1;
    }

    .home-logos-header::after,
    .home-logos-header::before {
        width: 16px;
        height: 16px;
        top: -15px;
    }

    .about-section-1 {
        border-radius: 0 0 16px 16px;
    }

    .home-logo img {
        width: 90px;
        height: 60px;
        height: 60px;
    }

    .re-img {
        height: 220px;
    }

    .resource-text {
        padding: 20px;
        gap: 5px;
    }

    .resource-text h5 {
        font-size: 18px;
    }

    .resource-text p {
        font-size: 14px;
    }

    .mob-date .list-sepaker-img img {
        width: 70px;
        height: 20px;
        object-fit: contain;
    }

    .footer-links-row ul li a,
    .resoure-links,
    .resource-text p {
        font-size: 14px;
    }

    .events-section-home {
        background-position: top;
    }

    .events-section-home .container {
        padding-right: 0;
        padding-left: 0;
    }

    .home-resource-tabs .nav-tabs {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        gap: 10px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        min-height: 40px;
        justify-content: flex-start;
    }

    .home-resource-tabs .nav-tabs::-webkit-scrollbar {
        display: none;
        /* Chrome/Safari */
    }

    .home-resource-tabs .nav-tabs .nav-link {
        font-size: 14px;
        margin: 0px 12px;
    }

    .resource-slider-wrapper .col-lg-4 {
        max-width: 88%;
        flex: 0 0 88%;
    }

    .resource-home-sec .btn-style-4,
    .resource-home-sec .btn-style-3 {
        width: 220px;
    }

    .reports-bottom {
        flex-wrap: wrap;
        margin: 20px auto 0;
        justify-content: center;
        gap: 10px;
    }

    .logo-footer {
        margin: auto;
    }

    .footer-contact-info {
        flex-direction: column;
        gap: 28px;
    }

    /*.footer-contact-info li:before {*/
    /*    width: 100%;*/
    /*    height: 1px;*/
    /*    top: auto;*/
    /*    bottom: -14px;*/
    /*    right: 0;*/
    /*    opacity: .2;*/
    /*}*/

    .divider-contact {
        width: 220px;
        height: 1px;
    }

    .footer-contact-info {
        flex-direction: column;
        gap: 16px;
    }

    .footer-contact-info li a {
        width: 221px;
        text-align: center;
        margin: auto;
        justify-content: center;
        font-size: 18px;
    }

    .list-inline-item:not(:last-child) {
        margin-right: .2rem;
    }


    .footer-links-row {
        flex-direction: column;
    }



    .footer-news-letter form button.btn {
        width: 100%;
    }

    .footer-news-letter form input[type=email] {
        width: 100%;
        padding: 10px 15px;
    }

    .footer-copyright small,
    .footer-copyright a,
    .footer-copyright p {
        font-size: 12px;
        letter-spacing: .2px;
        color: white;
        opacity: .8;
    }

    .footer-copyright p span {
        display: block;
        font-size: 14px;
        margin: 9px 0 0;
    }

    .event-toggle {
        display: none;
    }

    .share-wrapper {
        right: 10px;
        bottom: 10px;
    }

    .testimonial-card {
        padding: 20px;
    }

    span.test-name {
        font-size: 17px;
    }

    .test-flex {
        gap: 10px;
    }

    .test-flex p {
        font-size: 11px;
    }

    .test-flex img {
        width: 45px;
        height: 45px;
    }

    .member-profile-img img {
        height: 372px;
    }

    .member-profile-banner {
        /* was `background: 100% 100%` - a broken shorthand that reset
           background-size/repeat and left the cover photo tiling at natural
           size (the "dark border above the breadcrumbs" glitch on phones) */
        background-size: cover;
        background-position: center top;
        background-repeat: no-repeat;
        background-attachment: scroll;
    }

    ul.content-ul {
        padding: 24px;
        gap: 0;
        justify-content: space-between;
    }

    ul.content-ul li {
        width: 50%;
        margin: 0 0 20px;
    }

    ul.content-ul li:before {
        right: 0;
    }

    ul.content-ul li:after {
        margin: 0 auto;
        width: 100%;
        height: 1px;
        background: var(--gray-50);
        opacity: var(--opacity-20);
        position: absolute;
        content: "";
        right: 0;
        bottom: -25px;
    }

    ul.content-ul li:nth-child(3):after,
    ul.content-ul li:nth-child(4):after {
        display: none;
    }

    ul.content-ul li:nth-child(3),
    ul.content-ul li:nth-child(4) {
        margin: 20px 0 0;
    }


    .content-overview p {
        font-size: 16px;
    }

    .member-profile-content-img img {
        width: 100%;
        min-height: auto;
        object-fit: cover;
    }

    .event-company-logo {
        flex-shrink: 0;
    }

    .event-body-inner .event-thumbnail img {
        height: 160px;
        object-fit: cover;
    }

    .point-of-contact-box,
    .point-of-contact-box-2,
    .point-of-contact-box-3 {
        padding: 24px;
    }

    .social-design-1 .social-link span {
        font-size: 14px;
    }

    .more-member-sec {
        background-position: top;
    }

    .more-member-slider .member-company-boxes {
        width: 97%;
    }

    .inner-banner {
        padding-bottom: 4rem;
        padding-top: 10rem;
    }

    .membership-page {
        padding-top: 30px ! IMPORTANT;
    }

    .join-form {
        padding: 28px 28px 0;
        margin: 0 -20px;
        border-radius: 16px;
    }

    .join-form input {
        border: 2px solid rgba(217, 217, 217, 1);
    }

    .form-group label span,
    label span,
    span.label-text {
        font-size: 14px;
    }

    input[type=checkbox],
    input[type=radio] {
        width: 17px;
        height: 17px;
    }

    .button-row {
        flex-wrap: wrap;
        gap: 10px 0;
    }

    .acc-outer .accordion-body {
        padding: 8px 16px !important;
    }

    .card-three .line {
        margin-left: auto;
        margin-right: 10px;
        width: 100px;
    }

    .steps-count span {
        font-size: 12px;
    }

    .join-card.card-three {
        min-height: 194px;
    }

    .detail-img img {
        width: 100%;
        /* was height:372px + cover, which cropped ~a third off landscape art
           and beheaded people in group photos on mobile */
        height: auto;
        max-height: 340px;
        object-fit: contain;
        background: #f4f5fa;
    }

    .news-detail-content li {
        color: var(--gray-1500);
        font-size: 15px;
        margin: 0 0 6px;
    }

    .custom-grid-gallery .gal-img {
        width: 48%;
        height: 182px;
    }

    .post-meta {
        font-size: 12px;
    }

    .contact-container {
        padding-right: 0;
        padding-left: 0;
    }

    .contact-row {
        margin-right: 0;
        margin-left: 0;
    }

    .contact-map {
        padding: 0;
    }

    .contact-form-outer {
        padding: 0 20px;
    }

    .footer-news-flex p {
        text-align: center;
        margin: 0;
    }


    .submit-btn-style {
        min-width: 180px;
    }

    .board-mission .missio-box {
        top: 23%;
        bottom: auto;
    }

    .board-mission .vision-box {
        top: auto;
        bottom: -15%;
    }

    .ab-col-3 .grid-box:first-child {
        order: 3;
    }

    .ab-col-3 .grid-box:nth-child(2) {
        order: 2;
    }

    .ab-col-3 .grid-box:nth-child(3) {
        order: 4;
    }

    .inner-heading br,
    .inner-heading h1 {
        /* display: none; */
    }

    .search-apply-btn {
        min-width: auto;
    }




    footer::before,
    footer::after {
        width: 16px !important;
        height: 16px !important;
    }

    .filter-check {
        gap: 5px;
    }


    .board-mission,
    .board-mission-img {
        min-height: 500px;
    }

    .ab-col.ab-col-12 .board-members-flex {
        margin: 0 -20px;
    }









}


@media (max-width:400px) {

    .hero-heading {
        font-size: 50px;
    }

    .mobile-hero-events img {
        width: 95px;
        height: 95px;
    }


    .mobile-hero-events p {
        font-size: 13px;
    }


    .company-m-text span,
    .date-1,
    .point-of-contact-box span,
    .resoure-links {
        font-size: 11px;
    }

    .hero-heading {
        font-size: 50px;
    }

    .hero-counter {
        gap: 10px;
    }

    .hero-count-box p {
        font-size: 12px;
    }

    .home-resource-tabs .nav-tabs .nav-link {
        font-size: 14px;
    }

    .social-design-1 {
        gap: 8px 5px;
    }

    .social-design-1 .social-link {
        gap: 10px;
    }

    .social-design-1 .social-link span {
        font-size: 12px;
    }


    .resource-text .d-flex {
        flex-wrap: wrap;
        gap: 8px;
    }

    .modal-content.border-0 {
        height: auto;
    }

    span.label-text {
        color: var(--gray-1300) !important;
        font-size: 14px;
    }

    .form-group label span,
    label span {
        color: var(--error);
        font-size: 14px;
    }




}


@media (max-width: 375px) {

    .btn-style-1,
    .btn-style-2,
    .btn-style-3,
    .btn-style-4,
    .btn-style-5,
    .btn-style-6 {
        padding: 10px 15px !important;
        font-size: 13px !important;
    }

    .mfb-drawer-close {
        top: 5px;
        right: 5px;
        width: 40px;
        height: 40px;
    }


    .mob-search-dropdown {
        width: 100%;
    }

/* German code only: Google Translate turns "DE" into "Delaware" in Spanish */
.lang-code-de {
    font-size: 0;
}

.lang-code-de::before {
    content: "\0044\0045";
    font-size: 14px;
}

.mob-language-dropdown li .lang-code-de::before {
    font-size: 10px;
}

.locale-code {
    font-size: 0;
    line-height: 1;
}

.locale-code::before {
    font-weight: inherit;
}

.language-dropdown li .locale-code::before {
    font-size: 14px;
}

.mob-language-dropdown li .locale-code::before {
    font-size: 10px;
}

.toggle-btn-active-language.locale-code::before,
.mob-oc-lang-badge.locale-code::before {
    font-size: 10px;
    font-weight: 600;
}

.locale-code[data-locale="en"]::before { content: "\0045\004E"; }
.locale-code[data-locale="es"]::before { content: "\0045\0053"; }
.locale-code[data-locale="de"]::before { content: "\0044\0045"; }
.locale-code[data-locale="it"]::before { content: "\0049\0054"; }
.locale-code[data-locale="pt"]::before { content: "\0050\0054"; }
.locale-code[data-locale="fr"]::before { content: "\0046\0052"; }




}


















/* ============================================================
   Loco remediation — content-card imagery + hover polish.
   Event-banner photos (the events listing + trade-fair cards)
   FILL their frame (cover) instead of letterboxing (contain).
   .hover-img is deliberately left as contain because it is also
   used for company LOGOS (e.g. the "new member" news cards),
   which must show in full and not be cropped. Hover everywhere
   is a clean contained zoom (no rotate) + a subtle card lift.
   ============================================================ */
.country-img img,
.event-main-img img,
.events-hub-1-box .re-img img {
    object-fit: cover;
}

.country-img img,
.event-main-img img,
.hover-img img {
    transition: transform .55s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.country-img,
.event-main-img,
.hover-img {
    overflow: hidden;
}

.events-main-box:hover .event-main-img img,
.country-box:hover .country-img img,
.hover-img:hover img {
    transform: scale(1.06);
}

.events-main-box,
.country-box {
    transition: transform .35s ease, box-shadow .35s ease;
}

.events-main-box:hover,
.country-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 42px rgba(14, 28, 40, .14);
}

/* ============================================================
   Public-header notification bell (logged-in members) — Phase 3
   ============================================================ */
.esma-navbell .dropdown-toggle-btn {
    position: relative;
}

.esma-navbell-badge {
    position: absolute;
    top: -6px;
    right: -8px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #e3a53c;
    color: #13205c;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
    box-shadow: 0 0 0 2px #fff;
}

.esma-navbell-panel {
    width: 360px;
    max-width: 92vw;
    padding: 0 !important;
    border-radius: 14px;
    overflow: hidden;
    /* Anchor to the bell's right edge so the panel opens leftward and never
       runs off the right of the screen (the base .custom-dropdown left:-150px
       pushed it off-screen). */
    left: auto;
    right: 0;
}

/* The generic `.custom-dropdown > div` rule adds a stray bottom padding to
   direct children; neutralise it for this panel (higher specificity via the
   panel class) so the header/list sit flush and there's no white gap. */
.esma-navbell-panel > .esma-navbell-head,
.esma-navbell-panel > .esma-navbell-list {
    padding: 0;
}

.esma-navbell-panel > .esma-navbell-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 18px;
    border-bottom: 1px solid #eef0f4;
    font-size: 15px;
    font-weight: 700;
    color: #13205c;
}

.esma-navbell-head a {
    font-size: 12px;
    font-weight: 600;
    color: var(--primary-500, #6b6dc4);
    text-decoration: none;
}

.esma-navbell-head a:hover {
    text-decoration: underline;
}

.esma-navbell-panel > .esma-navbell-list {
    max-height: 380px;
    overflow-y: auto;
}

.esma-navbell-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border-bottom: 1px solid #f3f4f7;
    cursor: pointer;
    transition: background .15s ease;
}

.esma-navbell-item:last-child {
    border-bottom: 0;
}

.esma-navbell-item:hover {
    background: #f7f8fc;
}

/* Unread = a subtle warm tint; the coloured dot + bolder text carry the state. */
.esma-navbell-item.is-unread {
    background: #fdf8f1;
}

.esma-navbell-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #e3a53c;
    flex-shrink: 0;
    margin-top: 5px;
}

.esma-navbell-item.is-read .esma-navbell-dot {
    background: #d7dae1;
}

.esma-navbell-msg {
    font-size: 13.5px;
    color: #2a2a33;
    line-height: 1.45;
}

.esma-navbell-item.is-unread .esma-navbell-msg {
    font-weight: 600;
}

.esma-navbell-time {
    font-size: 11.5px;
    color: #9aa0ab;
    margin-top: 4px;
}

.esma-navbell-empty {
    padding: 30px 18px;
    text-align: center;
    color: #9aa0ab;
    font-size: 13px;
}


/* ============================================================
   Accessibility enhancements (launch audit 2026-07)
   ============================================================ */

/* Visible keyboard focus. Base styles set outline:0 on inputs and strip focus
   rings; restore a clear focus-visible ring for keyboard users only. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.accordion-button:focus-visible,
.dropdown-toggle-btn:focus-visible,
.share-btn:focus-visible,
.icon-circle:focus-visible {
    outline: 2px solid var(--primary-300, #51529e);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Keyboard-operable primary nav dropdowns: mirror the :hover reveal with
   :focus-within so submenus open when the parent link/toggle is focused. */
.menus li:focus-within > .dropdown-menu {
    display: block;
    opacity: 1;
    transform: scale(1);
    visibility: visible;
}

/* Input & placeholder text contrast (>= 4.5:1 on white). The defaults used
   --gray-1200 (#808080, 3.5:1) and --gray-1100 (#8c8c8c, 2.85:1). */
input:not([type=checkbox]):not([type=radio]),
select,
textarea {
    color: var(--gray-1300, #666);
}
input::placeholder,
textarea::placeholder {
    color: var(--gray-1300, #666);
    opacity: 1;
}

/* Skip-to-content link (rendered as the first focusable element in the header). */
.skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 100000;
    background: var(--primary-600, #1f1f50);
    color: #fff;
    padding: 10px 18px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    transform: translateY(-200%);
    transition: transform .15s ease;
}
.skip-link:focus,
.skip-link:focus-visible {
    transform: translateY(0);
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* Respect users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* Password show/hide toggle rebuilt as a real <button> (keyboard + a11y);
   position the button where the icon used to sit and reset the inner svg. */
.login-card .input-wrapper .password-toggle-btn {
    position: absolute;
    top: 14px;
    right: 16px;
    background: transparent;
    border: 0;
    padding: 4px;
    line-height: 0;
    cursor: pointer;
    color: var(--gray-1300, #666);
}
.login-card .input-wrapper .password-toggle-btn svg {
    position: static;
    top: auto;
    right: auto;
}

/* ============================================================
   Responsive fixes (launch audit 2026-07)
   ============================================================ */

/* NOTE: an attempted min-height:auto override for .login-page/.split-container on
   mobile was reverted — the login card is absolutely positioned and relies on that
   height, so collapsing it overlapped the form with the logo/captcha. The ~910px
   min-height is intentional; the minor dead-zone is left as-is. */

/* ============================================================
   News detail + content-card imagery (launch audit 2026-07)
   ============================================================ */

/* Cap the news-detail main banner: small imported images (e.g. 600x450) were
   upscaled to ~730px tall via width:100%/height:auto. Cap the height and fill
   the frame so it reads as a banner, not a giant letterboxed block. */
.news-detail-content .detail-img img {
    max-height: 460px;
    /* NEVER crop the article's own photo: object-fit:cover with a centred
       position sliced the top and bottom off group shots, cutting people's
       heads off. contain letterboxes instead, which is always safe whatever
       the source aspect ratio. */
    object-fit: contain;
    object-position: center;
    background: #f4f5fa;
}

/* News / resource cards (listing, sidebar, resources hub) filled the 300px .re-img
   frame with object-fit:contain, leaving white bars on either side. The imported
   "new member" banners are photos (not bare logos), so cover them to fill. */
.resource-box .re-img img {
    object-fit: cover;
}

/* Imported CMS body content: sensible paragraph rhythm + drop empty paragraphs
   (the WordPress export left blank <p>/<p>&nbsp;</p> nodes). */
.news-body-content p { margin-bottom: 1rem; }
.news-body-content p:last-child { margin-bottom: 0; }
.news-body-content p:empty { display: none; }
.news-body-content img { max-width: 100%; height: auto; border-radius: 12px; }
.news-body-content ul, .news-body-content ol { margin-bottom: 1rem; }

/* Trade fairs Next/Past pill toggle (Event Hub). */
.tradefair-toggle {
    display: inline-flex;
    gap: 4px;
    background: rgba(129, 130, 158, .12);
    padding: 5px;
    border-radius: 40px;
}
.tf-toggle-btn {
    border: 0;
    background: transparent;
    color: var(--primary-600, #1f1f50);
    font-weight: 600;
    font-size: 14px;
    line-height: 1;
    padding: 9px 22px;
    border-radius: 40px;
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
}
.tf-toggle-btn:hover { color: var(--primary-300, #51529e); }
.tf-toggle-btn.active {
    background: var(--primary-300, #51529e);
    color: #fff;
}

/* Resources Hub dropdown: news-category quick links, indented under the main
   "News & Announcements" item. */
.menus .dropdown-menu li.resources-subcat > a {
    padding-left: 28px;
    font-size: 13px;
    opacity: .9;
    position: relative;
}
.menus .dropdown-menu li.resources-subcat > a::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-300, #51529e);
    transform: translateY(-50%);
    opacity: .5;
}
.menus .dropdown-menu li.resources-subcat.active > a,
.menus .dropdown-menu li.resources-subcat > a:hover { opacity: 1; }

/* Homepage News tab: category quick-filter pills. */
/* Single-line, horizontally scrollable chip row (never wraps into a wall of
   pills — was far too busy on mobile). Chips that overflow scroll sideways,
   same affordance as the tab strip above it. */
.home-news-cats {
    margin-top: -8px;
    display: flex;
    gap: 8px;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.home-news-cats::-webkit-scrollbar { display: none; }
.home-news-cat {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
    padding: 7px 16px;
    border-radius: 40px;
    border: 1px solid rgba(129, 130, 158, .35);
    color: var(--primary-600, #1f1f50);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.home-news-cat:hover {
    background: var(--primary-300, #51529e);
    border-color: var(--primary-300, #51529e);
    color: #fff;
}

/* Clean branded placeholder for news cards without a real image (was a tiny
   184x52 default stretched to 300px = blurry). Never blurs — gradient + icon. */
.news-img-placeholder {
    background: linear-gradient(135deg, #262761 0%, #51529e 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.news-img-placeholder .news-ph-icon {
    width: 46px;
    height: 46px;
    color: rgba(255, 255, 255, .85);
    transition: transform .55s cubic-bezier(.22, .61, .36, 1);
}
.news-img-placeholder:hover .news-ph-icon { transform: scale(1.08); }

/* ============================================================
   Resources Hub nested sub-dropdown (News & Announcements -> categories)
   ============================================================ */
.menus .dropdown-menu .has-subdropdown > .subdropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.subdropdown-caret {
    display: inline-flex;
    align-items: center;
    transition: transform .25s ease;
    flex-shrink: 0;
}
.subdropdown-caret .svg-icon { width: 12px; height: 12px; }
.menus .dropdown-menu .dropdown-submenu {
    list-style: none;
    padding: 4px 0;
    margin: 0;
    background: #f6f6fb;                       /* subtle group tint under News & Announcements */
}
/* Render as a smooth, flat, indented list. These <a>s are descendants of
   .dropdown-menu, so they inherit the flat-list "chip" styling (rounded
   first/last corners, per-item hover fill, dividers, sliding :before) — reset
   all of it so the sub-list reads as one continuous group, not choppy chips. */
.menus .dropdown-menu .dropdown-submenu > li > a {
    border-radius: 0 !important;
    background: transparent !important;
    border-bottom: 0 !important;
    padding: 9px 16px 9px 34px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--gray-1500) !important;
    position: relative;
    overflow: visible !important;
}
/* Keep the inherited sliding-fill :before disabled (re-enabling it let the
   li:hover width:100% rule stretch it into a line across each row). No bullet —
   the indent + tint carry the hierarchy. */
.menus .dropdown-menu .dropdown-submenu > li > a::before {
    display: none !important;
}
.menus .dropdown-menu .dropdown-submenu > li:hover > a {
    background: rgba(81, 82, 158, .10) !important;
    color: var(--primary-500) !important;
}
.menus .dropdown-menu .dropdown-submenu > li.active > a {
    background: var(--primary-300, #51529e) !important;
    color: #fff !important;
}

/* Desktop: the sub-list is a SIDE FLYOUT. It must not expand in-flow — the
   old inline expansion shifted the menu's height, so leaving the sub-list
   made the menu shrink out from under the cursor and snap shut before the
   items below (Articles & Reports, ...) could be reached. */
@media (min-width: 992px) {
    /* The flyout must escape the dropdown's overflow-x clip. */
    .menus .dropdown-menu.has-flyout { overflow-x: visible; }
    .menus .dropdown-menu .has-subdropdown { position: relative; }
    .menus .dropdown-menu .dropdown-submenu {
        display: none;
        position: absolute;
        left: calc(100% + 6px);
        top: -6px;
        min-width: 240px;
        background: #fff;
        border-radius: 12px;
        box-shadow: 0 16px 44px rgba(20, 20, 60, .18);
        padding: 6px 0;
        z-index: 30;
    }
    /* Invisible bridge over the 6px gap so a diagonal mouse path can't drop hover. */
    .menus .dropdown-menu .dropdown-submenu::before {
        content: '';
        position: absolute;
        left: -10px;
        top: 0;
        bottom: 0;
        width: 10px;
    }
    .menus .dropdown-menu .dropdown-submenu > li > a {
        padding: 9px 18px !important;   /* flyout needs no indent */
    }
    .menus .dropdown-menu .has-subdropdown:hover > .dropdown-submenu,
    .menus .dropdown-menu .has-subdropdown:focus-within > .dropdown-submenu { display: block; }
    .menus .dropdown-menu .has-subdropdown:hover > .subdropdown-toggle .subdropdown-caret,
    .menus .dropdown-menu .has-subdropdown:focus-within > .subdropdown-toggle .subdropdown-caret { transform: rotate(-90deg); }
}

/* Mobile: tap the row to accordion the sub-list (JS toggles .open). */
@media (max-width: 991px) {
    .menus .dropdown-menu .dropdown-submenu { display: none; }
    .menus .dropdown-menu .has-subdropdown.open > .dropdown-submenu { display: block; }
    .menus .dropdown-menu .has-subdropdown.open > .subdropdown-toggle .subdropdown-caret { transform: rotate(180deg); }
}

/* ============ Member notifications centre page (/my-notifications) ============ */
.notif-page-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.notif-page-filter {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 18px; border-radius: 40px;
    border: 1px solid rgba(129, 130, 158, .35);
    color: var(--primary-600, #1f1f50);
    font-size: 13px; font-weight: 600; text-decoration: none;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.notif-page-filter:hover { border-color: var(--primary-300, #51529e); color: var(--primary-300, #51529e); }
.notif-page-filter.active { background: var(--primary-300, #51529e); border-color: var(--primary-300, #51529e); color: #fff; }
.notif-page-count {
    background: var(--secondary-400, #e8a33d); color: #1f1f50;
    border-radius: 20px; font-size: 11px; font-weight: 700; padding: 1px 7px; line-height: 1.5;
}
.notif-page-item {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 16px 4px; border-bottom: 1px solid #ececf4;
}
.notif-page-item:last-child { border-bottom: 0; }
.notif-page-dot {
    flex-shrink: 0; width: 9px; height: 9px; border-radius: 50%;
    margin-top: 7px; background: transparent; border: 1px solid #d6d6e4;
}
.notif-page-item.is-unread .notif-page-dot { background: var(--secondary-400, #e8a33d); border-color: var(--secondary-400, #e8a33d); }
.notif-page-body { flex: 1 1 auto; min-width: 0; }
.notif-page-body p { font-size: 14px; color: #2a2a4a; }
.notif-page-item.is-unread .notif-page-body p { font-weight: 600; color: var(--primary-600, #1f1f50); }
.notif-page-body small { color: #8a8aa3; font-size: 12px; }
.notif-page-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.notif-page-actions .btn-style-3 { font-size: 12px; padding: 7px 14px; }
.notif-page-markread {
    background: none; border: 0; padding: 0; cursor: pointer;
    font-size: 12px; font-weight: 600; color: var(--primary-300, #51529e);
    text-decoration: underline; text-underline-offset: 3px;
}
.notif-page-markread:hover { color: var(--primary-600, #1f1f50); }
@media (max-width: 575px) {
    .notif-page-item { flex-wrap: wrap; }
    .notif-page-actions { width: 100%; justify-content: flex-start; padding-left: 21px; }
}

/* Mobile header bell — plain link (NOT .mob-panel-trigger, whose JS opens the
   offcanvas), but styled identically to the other header icons. */
.Mobile-nav-right .mob-bell {
    position: relative;
    width: 48px;
    height: 48px;
    border-radius: 58px;
    border: 2px solid transparent;
    display: inline-grid;
    place-content: center;
}
.Mobile-nav-right .mob-bell .esma-navbell-badge { display: inline-flex; }

/* Convention form: option text lives in <label><span> pairs, which the theme's
   required-asterisk rule (.dashboard-content-inner label span) paints red.
   Restore normal text colour for activity options + golf fields. */
.dashboard-content-inner .conv-slot label span,
.dashboard-content-inner .conv-golf-details label span,
.dashboard-content-inner .colleague-block label span:not(.text-danger) {
    color: var(--gray-1600, #2a2a4a);
}

/* ============================================================
   Members-only visibility badges (event cards + detail hero)
   and Members chips/pills (news / reports / regulatory cards)
   ============================================================ */
.event-visibility-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: var(--radius-58, 58px);
    background: rgba(31, 31, 80, .78);
    border: 1px solid rgba(255, 255, 255, .35);
    backdrop-filter: blur(13px);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
    white-space: nowrap;
    width: fit-content;
}

.event-visibility-badge svg.svg-icon,
.event-visibility-badge .svg-icon {
    width: 12px;
    height: 12px;
    fill: currentColor;
}

/* Event Hub list rows + calendar cards: the category chip is pinned at
   top-left of the image, so the badge stacks just below it. */
.events-main-box .event-visibility-badge {
    position: absolute;
    top: 61px;
    left: 20px;
    z-index: 9;
}

/* Homepage hero event slider (chip is pinned inside .events-main-hm-img). */
.events-main-hm .events-main-hm-img .event-visibility-badge {
    position: absolute;
    top: 61px;
    left: 20px;
    z-index: 99;
}

/* Trade-fair country cards have no category chip: float the badge over the image. */
.country-box .event-visibility-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 9;
}

/* Inside a .resource-tag chip row the badge sits inline next to the chip. */
.resource-tag .event-visibility-badge {
    position: static;
}

/* Event detail hero: stack below the pinned category chip. */
.events-detail-hero .event-visibility-badge {
    position: absolute;
    top: 56px;
    left: 25px;
    z-index: 9;
}

@media (max-width:991px) {
    .events-detail-hero .event-visibility-badge {
        top: 56px;
        left: 50%;
        transform: translate(-50%);
    }

    /* Mobile: chips shrink and shift to 35/35 — keep the badge stacked below. */
    .events-main-box .event-visibility-badge {
        top: 66px;
        left: 35px;
        font-size: 10px;
        padding: 4px 10px;
    }
}

/* News / regulatory cards: "Members" chip alongside the category chips. */
.category-style-1.members-chip {
    background: var(--primary-600, #1f1f50);
}

/* Report rows: "Members" pill next to the .pdf-pill file-type pill. */
.pdf-pill.members-pill {
    background: var(--primary-300, #51529e);
    color: #fff;
}

/* ------------------------------------------------------------------
   Card thumbnail fit, chosen per image by card_fit_class() (helpers.php).
   Photos (close to the 1.55:1 frame) fill it; wide logo lockups would be
   sliced mid-word by cover, so they are shown whole on a white field.
   ------------------------------------------------------------------ */
.resource-box .re-img img.fit-cover { object-fit: cover; }
.resource-box .re-img img.fit-contain {
    object-fit: contain;
    background: #fff;
    padding: 14px;
}

/* Body galleries: with only two thumbnails, space-between flung them to the
   far edges of the column leaving a large void in the middle. */
.news-body-content .gallery,
.news-body-content .wp-block-gallery,
.custom-grid-gallery {
    justify-content: flex-start !important;
    gap: 16px;
}
.custom-grid-gallery > * { margin-right: 0 !important; }

/* Regulatory/report hero on small screens: the source art is landscape, so a
   tall portrait box cropped the report title off both sides. */
@media (max-width: 767.98px) {
    /* The real markup is .detail-img img, which custom.css pins to a 372px tall
       box with object-fit:cover - that cropped ~a third off a landscape report
       cover, slicing the title. Show the whole cover instead. */
    .detail-img img,
    .inner-detail-img img,
    .report-detail-img img,
    .regulatory-detail-img img {
        object-fit: contain !important;
        background: #fff;
        height: auto !important;
        max-height: 340px;
    }
}

/* The fixed share / accessibility / back-to-top bar and the bottom-left
   "Upcoming Events" pill sit over page content. They only *look* like they
   overlap, but they also swallowed clicks meant for the sidebar search and the
   "Related Reports" heading beneath them. Let pointer events through the empty
   wrapper area while the controls themselves stay clickable. */
.fixed-share-wrap,
.share-wrapper.fixed-share-wrap,
.event-wrapper {
    pointer-events: none;
}
.fixed-share-wrap > *,
.share-wrapper.fixed-share-wrap > *,
.event-wrapper > * {
    pointer-events: auto;
}

/* ...but NOT the closed share popup. It is a direct child of the wrapper and is
   only hidden with opacity:0, so re-enabling pointer events on it turned a
   225x121 invisible rectangle into a click-eater sitting over whatever is
   beneath the fixed widget - on the homepage that was the hero's "Read More"
   CTA. Keep it inert until it is actually opened. */
.social-popup,
.events-share-popup {
    visibility: hidden;
    pointer-events: none !important;
}
.social-popup.is-open,
.events-share-popup.is-open {
    visibility: visible;
    pointer-events: auto !important;
}


/* Carousel tracks were unclipped, so the 4th card sliced at the screen edge and
   only html/body overflow-x:clip stopped the page scrolling sideways. */
.resource-slider-wrapper { overflow: hidden; }

/* The per-card share control is a white glyph on a transparent disc, invisible
   on light/logo cards. Give it a translucent dark disc so it reads on both. */
.resource-box .events-share,
.resource-img .events-share {
    background: rgba(20, 20, 45, 0.55);
    border-color: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(2px);
}

/* Mobile category strip sat flush to the screen edge while all other content
   sits in a gutter, squaring off the section's rounded corner. */
@media (max-width: 767.98px) {
    .mobile-cat-tabs { padding-left: 20px; padding-right: 20px; }
}

/* ------------------------------------------------------------------
   Article gallery thumbnails (.gal-img) were 550x312 photos forced into a
   fixed 220px-tall, near-square box with object-fit:cover — which sliced the
   top off group shots and cut people's heads off. Keep the tidy grid but let
   each photo show in full.
   ------------------------------------------------------------------ */
.custom-grid-gallery .gal-img {
    height: auto;
    aspect-ratio: 16 / 10;
    background: #f4f5fa;
}
.gal-img img {
    object-fit: contain;
}

/* ------------------------------------------------------------------
   Floating utility rails (share / accessibility / cookies / back-to-top, and
   the "Upcoming Events" tab). They are fixed, so they used to sit permanently
   over body copy, CTAs and sidebar results. footer.blade.php tucks them away
   while the reader scrolls down and restores them on any upward scroll, when
   scrolling stops, near the top, or at the foot of the page.
   ------------------------------------------------------------------ */
.share-wrapper.fixed-share-wrap,
.event-wrapper {
    transition: transform .28s ease, opacity .28s ease;
}
.share-wrapper.fixed-share-wrap.rail-tucked {
    transform: translateY(150%);
    opacity: 0;
}
.event-wrapper.rail-tucked {
    transform: translateY(150%);
    opacity: 0;
}
/* Keyboard users must always be able to reach them. */
.share-wrapper.fixed-share-wrap:focus-within,
.event-wrapper:focus-within {
    transform: none !important;
    opacity: 1 !important;
}
@media (prefers-reduced-motion: reduce) {
    .share-wrapper.fixed-share-wrap,
    .event-wrapper { transition: none; }
}

/* ------------------------------------------------------------------
   Consent checkboxes: Bootstrap's .is-invalid paints a red border and an icon
   on the native input, which on these custom checkboxes rendered as a stray
   red box wedged between the tick and its label. Mark the visible tick instead.
   ------------------------------------------------------------------ */
.filter-checkbox input[type="checkbox"].is-invalid {
    border: 0;
    background-image: none;
    box-shadow: none;
}
.filter-checkbox input[type="checkbox"].is-invalid ~ .checkmark {
    outline: 2px solid #dc3545;
    outline-offset: 2px;
}
.infos > .error:empty {
    display: none;
}

/* ------------------------------------------------------------------
   reCAPTCHA v2 renders a fixed 304px-wide iframe, which overflowed the login
   and sign-up cards on a 390px phone once card padding was taken off. Scale it
   to fit rather than letting it push the card sideways.
   ------------------------------------------------------------------ */
.captcha-wrapper {
    max-width: 100%;
    overflow: hidden;
}

/* NOT overflow:hidden, and NOT max-width, on .g-recaptcha itself. A transform does
   not change layout, so the 304px iframe is still laid out at 304px inside this
   box - clipping here cuts the widget in LAYOUT space (chopping the logo and
   truncating "reCAPTCHA" to "reCA") and only then scales the already-cut result.
   Let it overflow here; the scale below brings it inside the wrapper, which clips. */
.g-recaptcha {
    overflow: visible;
}
/* reCAPTCHA's iframe is a fixed 304x78. Scaling has to leave it NARROWER than the
   wrapper, because the wrapper clips (overflow:hidden above). At 390px the wrapper
   is 258px, and 0.86 gave 261px - 3px over, which sliced the logo off. Heights are
   78px x the scale so the button below does not jump. */
@media (max-width: 420px) {
    .g-recaptcha {
        transform: scale(0.82);   /* 304 -> 249px, inside a 258px wrapper */
        transform-origin: 0 0;
        height: 64px;
    }
}

@media (max-width: 360px) {
    .g-recaptcha {
        transform: scale(0.74);   /* 304 -> 225px, for 320-360px phones */
        height: 58px;
    }
}

/* ------------------------------------------------------------------
   "More Members" carousel. It shares the deliberate bleed-right width with the
   trade-fair and events sliders (calc(100% + …)), but on a profile page it has
   no full-bleed section behind it, so the track ran past the viewport edge and
   the last card's text was sliced mid-word. Keep this one inside its column.
   Declared here rather than beside the shared rule so it also beats the wider
   bleed set for <=1200px.
   ------------------------------------------------------------------ */
.more-member-slider {
    width: 100%;
}

/* ------------------------------------------------------------------
   Member profile hero on phones: the fixed share/accessibility cluster
   (146x44, bottom right) lands on the last lines of the company description and
   on "Read More" - the only control that expands it - before the visitor has
   scrolled at all. Reserve the cluster's height plus a gap.
   ------------------------------------------------------------------ */
/* ------------------------------------------------------------------
   Long-form legal pages (privacy policy, terms, account deletion). They share
   .terms-pg > .container > .terms-content, so scope to that pair - .terms-content
   on its own is reused by other templates.

   1. The fixed utility rail sits bottom-right over the reading column. Pull the
      column clear of it on desktop; the margin only grows as far as it must, so
      on wide screens the column barely moves. On phones there is nowhere to move
      to, so just keep the end of the document out from under the cluster.
   2. Lists rendered with no bullets and no indent (the global `li{list-style:none}`
      is for the site's nav/menu lists), so "What data is deleted" read as
      run-on lines. `list-style: inherit` on the li is the load-bearing part.
   3. Links in this prose were the same colour as the body text, so the "By email"
      address did not look clickable. Colour only - custom.css sets
      `text-decoration: none !important` on `p a`, and fighting that with another
      !important would leave paragraph links and list links looking different.
   ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
}

.terms-pg .terms-content ul,
.terms-pg .terms-content ol {
    padding-left: 1.25rem;
}

.terms-pg .terms-content ul {
    list-style: disc;
}

.terms-pg .terms-content ol {
    list-style: decimal;
}

.terms-pg .terms-content li {
    list-style: inherit;
    margin-bottom: .35rem;
}

.terms-pg .terms-content a {
    color: var(--primary-200);
}

/* ------------------------------------------------------------------
   Trade Fairs scope toggle (All / Upcoming / Past). btn-style-3 has no active
   state of its own, so without this the current scope is indistinguishable.
   ------------------------------------------------------------------ */
.tf-scope .btn-style-3.is-active {
    background: var(--secondary-300);
    color: var(--primary-900);
    font-weight: 600;
}

/* ------------------------------------------------------------------
   Consent validation messages. errorPlacement collects each checkbox's message
   into the one .error span at the foot of the consent block, so two failures
   rendered as inline siblings and read as a single run-on sentence
   ("...application rulesPlease accept the terms..."). Give each its own line.
   ------------------------------------------------------------------ */
.infos > span.error > span,
.infos > span.error > label {
    display: block;
}
.infos > span.error > span + span,
.infos > span.error > label + label {
    margin-top: 2px;
}

/* ------------------------------------------------------------------
   Floating utility rail — position rework.

   Pinned bottom-right, it competed with everything the site puts in that same
   corner: the col-lg-3 sidebar search on Help Centre / News / Reports /
   Regulatory Updates (the search box and its autocomplete were unclickable at
   1536x864 and 1600x900), the category nav on article pages, the footer's
   Privacy Policy / Delete Your Account links, and the Resources Hub tab strip on
   mobile. The wrapper is pointer-events:none, but its four children are not, so
   they blanketed roughly 300x74px of whatever sat beneath them.

   Desktop: move it to a slim, vertically-centred strip on the right EDGE. That
   band holds no interactive content at any scroll position, so the conflict goes
   away rather than being negotiated.
   ------------------------------------------------------------------ */
@media (min-width: 992px) {
    .share-wrapper.fixed-share-wrap {
        top: 50%;
        bottom: auto;
        right: 10px;
        transform: translateY(-50%);
        flex-direction: column;
        padding: 8px;
        gap: 6px;
        border-radius: 32px;
    }

    /* The "Share this page" label is what made the rail ~300px wide. The icon
       carries the meaning; keep the words for assistive tech only. */
    .share-wrapper.fixed-share-wrap .share-btn span {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
        border: 0;
    }

    .share-wrapper.fixed-share-wrap .share-btn {
        justify-content: center;
    }

    /* Tuck sideways now that it lives on the edge, not the bottom. */
    .share-wrapper.fixed-share-wrap.rail-tucked {
        transform: translate(150%, -50%);
        opacity: 0;
    }

    .share-wrapper.fixed-share-wrap:focus-within {
        transform: translateY(-50%) !important;
        opacity: 1 !important;
    }

    /* The share popup opens from a vertical rail now, so anchor it to the left
       of the strip instead of above it. */
    .fixed-share-wrap .events-share-popup {
        bottom: auto;
        top: 50%;
        left: auto;
        right: calc(100% + 12px);
        transform: translateY(-50%);
    }
    .fixed-share-wrap .events-share-popup::after {
        display: none;
    }
}

/* section{z-index:5} creates a stacking context, which trapped the sidebar
   search autocomplete (z-index:1055) underneath the body-level rail (z-index:99)
   — the single result was painted over and unclickable. The dropdown's own
   z-index cannot escape its ancestor, so lift the ancestor while it is open. */
section:has(.search-results:not(:empty)) {
    z-index: 100;
}
