@font-face {
    font-family: "InterBold";
    src: url("../Font/Inter-Bold.ttf") format("truetype");
    font-weight: bold;
  }
  
  @font-face {
    font-family: "InterMedium";
    src: url("../Font/Inter-Medium.ttf") format("truetype");
    font-weight: medium;
  }
  
  @font-face {
    font-family: "InterRegular";
    src: url("../Font/Inter-Regular.ttf") format("truetype");
    font-weight: regular;
  }
  
  @font-face {
    font-family: "InterSemiBold";
    src: url("../Font/Inter-SemiBold.ttf") format("truetype");
    font-weight: semibold;
  }
  
  
  .smoothPopup {
  
    animation-name: smoothPopup;
    animation-duration: 3s;
    animation-iteration-count: infinite;
  
    /* animation-timing-function: cubic-bezier(0.8, 0.05, 1, 0.5); */
    animation-timing-function: linear;
  }
  
  @keyframes smoothPopup {
  
    0%,
    100% {
      transform: translateY(0);
    }
  
    50% {
      transform: translateY(-20px);
    }
  }
  
  .request-popup-active-btn {
    position: fixed;
    right: 20px;
    bottom: 35px;
    z-index: 999;
  }
  
  .request-popup-active-btn .btn-primary {
    border-radius: 40px;
    display: flex;
    justify-content: left;
    align-items: center;
    padding: 8px;
    /* background: linear-gradient(45deg, #4285f4, #0d0793); */
    /*background-color: #3076D6;*/
    background-color: #FAAD24;
    border: none !important;
    width: 200px;
    font-size: 18px !important;
  }
  .request-popup-active-btn .btn-primary:hover {
      background-color: #FAAD24; 
  }
  .btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    background-color: #FAAD24 !important; 
}
  
  .request-popup-active-btn .btn-primary .telephoneBox {
    width: 36px;
    height: 36px;
    background: #fff;
    border-radius: 100%;
    color: #4285f4;
    font-size: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
  }
  
  .request-popup-active-btn .btn-primary {
    box-shadow: 0 4px 9px -4px #4285f4;
    border: 1px solid #fff !important;
  
  }
  
  .request-popup-active-btn .btn.active.focus,
  .btn.active:focus,
  .btn.focus,
  .btn:active.focus,
  .btn:active:focus,
  .btn:focus {
    outline: 0 !important;
  }
  
  
  .form-sidenav {
    /* position: fixed;
    top: 0;
    right: -35%;
    width: 35%;
    height: 100vh; */
  
    position: fixed;
    top: 0;
    right: -100%;
    height: 100%;
    width: 35%;
    background: #FFFFFF;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.25);
    padding: 8px 26px 30px;
    transition: right 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 10001;
    color: #37383C !important;
  }
  
  #formInfo{
    margin-top: 30px !important;
  }
  
  /* .form-sidenav {
    position: fixed;
    top: 0;
    right: -100%;
    height: 100%;
    width: 35%;
    background: #fff;
    transition: right 0.35s ease;
    z-index: 1001;
  } */
  
  .form-sidenav .footer-cta .o-wrapper {
    background-color: #fff !important;
  }
  
  .form-sidenav .u-6\/12\@desktop {
    width: 100% !important;
  }
  
  .form-sidenav .footer-cta .o-wrapper {
    padding: 0 !important;
  }
  
  .form-sidenav .form_info {
    padding: 0 0;
  }
  
  .form-sidenav .floating-input,
  .floating-select {
    font-size: 12px;
    font-family: "InterRegular";
    padding: 4px 12px;
    display: block;
    width: 100%;
    height: 40px !important;
    background-color: transparent;
    border: none;
    color: #000 !important;
    border: 1px solid #d5d5d5;
    border-radius: 4px;
  }
  
  .form-sidenav .floating-input,
  .floating-select::placeholder {
    color: #6B7C93;
    font-size: 12px;
    font-family: "InterRegular";
  }
  
  .form-sidenav h2 {
    font-size: 24px;
    color: #37383C !important;
    font-family: "InterBold";
    margin: 0;
  }
  
  .form-sidenav .footer-cta .o-wrapper,
  .footer-cta .o-wrapper ._form ._form-title,
  ._form .footer-cta .o-wrapper ._form-title,
  .footer-cta .o-wrapper .TopPara {
    color: #6B7C93 !important;
    font-size: 12px;
    font-family: "InterRegular";
    margin-top: 8px;
  }
  
  .form-sidenav .LabelContentHead,
  .containerTalk.txt {
    color: #37383C !important;
    font-size: 14px !important;
  }
  
  .CallTimeTxtBox {
    display: flex;
    gap: 6px;
    padding-bottom: 10px;
  }
  
  .CallTimeTxt {
    color: #37383C;
    font-size: 12px;
    font-family: "InterSemiBold";
  }
  
  .ProductBox label {
    margin-bottom: 10px !important;
  }
  
  .captchaBox {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  
  }
  
  .form-sidenav .floating-input:focus,
  .floating-select:focus {
    outline: none;
    border-bottom: 1px solid #d5d5d5;
  }
  
  .form-sidenav .floating-input:focus~label,
  .floating-input:not(:placeholder-shown)~label {
    top: 8px;
    left: 12px;
    font-size: 14px;
    color: #fff;
  }
  
  .form-sidenav .FloatingSelectLabel {
    color: #999;
    font-size: 14px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 12px;
    top: 9px;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
  }
  
  .form-sidenav .containerPreffredTime input:checked~.checkmarkPreffredTime {
    background-color: #3076D6;
    color: #fff !important;
  }
  
  .form-sidenav .containerPreffredTime input:checked~.checkmarkPreffredTime:after {
    display: inline-block;
    color: #fff;
  }
  
  .form-sidenav .mt25 {
    margin-top: 8px !important;
    display: flex;
    gap: 16px;
  }
  
  .form-sidenav .checkmarkPreffredTime {
    position: absolute;
    top: 0;
    left: 0;
    height: 39px;
    width: 100%;
    background-color: #fff;
    text-align: center;
    font-family: l;
  }
  
  .form-sidenav .containerPreffredTime {
    display: inline-block;
    position: relative;
    cursor: pointer;
    font-size: 22px;
    height: 40px;
    width: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #d5d5d5;
    margin-bottom: 0px;
  }
  
  .form-sidenav .checkmarkBox {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    margin-bottom: 20px;
    border-bottom: 1px solid #d5d5d5;
  }
  
  .form-sidenav .containerPreffredTime .checkmarkPreffredTime.one:after {
    font-family: 'InterMedium';
    position: absoulte;
    top: 10px;
    left: 40px;
    font-size: 12px;
    color: #6B7C93;
  }
  
  .form-sidenav .containerPreffredTime .checkmarkPreffredTime.two:after {
    content: '12 - 2';
    color: #fff;
    font-size: 12px;
    font-family: 'InterMedium';
    position: absoulte;
    top: 10px;
    left: 40px;
    color: #6B7C93;
  }
  
  .form-sidenav .containerPreffredTime .checkmarkPreffredTime.four:after {
    content: '4 - 6';
    color: #fff;
    font-size: 12px;
    font-family: 'InterMedium';
    position: absoulte;
    top: 10px;
    left: 42px;
    color: #6B7C93;
  }
  
  .form-sidenav .containerPreffredTime .checkmarkPreffredTime.three:after {
    content: '2 - 4';
    color: #fff;
    font-size: 12px;
    font-family: 'InterMedium';
    position: absoulte;
    top: 10px;
    left: 44px;
    color: #6B7C93;
  }
  
  .form-sidenav .o-layout {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-left: 0px;
    margin-left: 0;
    font-size: 0;
  }
  
  
  
  .close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 22px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: #fff;
    height: 24px;
    z-index: 9999;
  }
  
  
  .overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
  
    backdrop-filter: blur(0px);
    background: rgba(0, 0, 0, 0);
  
    opacity: 0;
    visibility: hidden;
  
    /* Smooth fade + smooth blur */
    transition:
      opacity 0.4s ease,
      background 0.4s ease,
      backdrop-filter 0.4s ease;
  
    z-index: 10000;
  }
  
  .formSidenavContainer {
    color: #6B7C93;
  }
  
  .FlexBox {
    display: flex;
    justify-content: space-between;
  }
  
  .checkmarkBox {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  
  .RdioBtnBox {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    place-items: start;
  }
  
  .ProductBox {
    display: flex;
    gap: 10px;
    padding-top: 10px;
  }
  
  .FormHeader {
    color: #37383C;
    font-size: 24px;
    font-family: 'Larsseit', -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding-bottom: 20px;
  }
  
  .RdoBtnBox {
    padding-top: 10px;
  }
  
  .GridBox {
    display: grid;
    /* grid-template-columns: repeat(2, 1fr);  */
    grid-template-rows: repeat(3, auto);
    gap: 20px;
  }
  
  .GridBox,
  .Box,
  .floating-label {
    margin-bottom: 0px !important;
  }
  
  .SubmitBtn {
    margin-top: 20px;
  }
  .clsError{
    border-radius: 4px;
  }
  
  .callSpanValue {
    color: #3076D6 !important;
    font-size: 12px !important;
    font-family: "InterSemiBold";
  }
  
  .SideNavCaptchaInput {
    border: 1px solid #D5D5D5;
    border-radius: 4px;
    outline: 0;
    height: 40px;
    width: 100%;
  }
  .SideNavCaptchaInput1 {
    border: 1px solid #D5D5D5;
    border-radius: 4px;
    outline: 0;
    height: 40px;
    width: 100%;
    padding: 0 0 0 10px !important;
  
    /* background-image: url('../Images/Refresh.png');
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: right; */
  }
  .RefreshCapcha img{
    position: absolute;
    left: 440px;
    bottom: 2px;
    cursor: pointer;
    padding: 10px;
    z-index: 1111;
  }
  
  
  .form-sidenav .checkmarkBox> :first-child {
    border-radius: 4px 0 0 4px;
  }
  
  .form-sidenav .checkmarkBox> :last-child {
    border-radius: 0 4px 4px 0;
  }
  
  .form-sidenav .checkmarkBox .one {
    border-radius: 4px 0 0 4px;
  }
  
  .form-sidenav .checkmarkBox .four {
    border-radius: 0 4px 4px 0;
  }
  
  .SideNavCaptchaInput::placeholder {
    color: #6B7C93;
    font-size: 12px;
    font-family: "InterRegular";
    padding: 12px;
  }
  .SideNavCaptchaInput1::placeholder {
    color: #6B7C93;
    font-size: 12px;
    font-family: "InterRegular";
    padding: 0px !important;
  }
  
  .SideNavSubmitBtn {
    color: #FFFFFF !important;
    width: 100%;
    border: none !important;
    background: #3076D6 !important;
    font-size: 14px !important;
    border-radius: 4px;
    font-family: "InterBold" !important;
    height: 40px;
    cursor: pointer;
  }
  
  .SideNavSubmitBtn button {
    padding: 10px 0 !important;
    color: #FFFFFF !important;
  
  }
  
  .SideNavFloatingInput.floating-input::placeholder {
    color: #6B7C93 !important;
  }
  
  .city.floating-input::placeholder {
    color: #6B7C93 !important;
  }
  
  .SideNavSubmitBtn button,
  input,
  optgroup,
  select,
  textarea {
    font-size: 12px !important;
    color: #6B7C93 !important;
    padding: 0 10px;
  }
  
  
  .select2-dropdown {
    z-index: 9999999 !important;
  }
  
  .input-wrapper .select2-container--default .select2-selection--single {
    background-color: #fff !important;
    border-radius: 4px !important;
    border: 1px solid #D5D5D5 !important;
  }
  
  .input-wrapper .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #6B7C93 !important;
    font-size: 12px !important;
    line-height: 3.5;
  }
  
  
  .input-wrapper .select2-selection__arrow b {
    display: none !important;
  }
  
  
  .input-wrapper .input-wrapper .select2-selection__arrow {
    position: relative;
  }
  
  .input-wrapper .select2-selection__arrow::after {
    content: "";
    position: absolute;
    top: 18px;
    right: 10px;
    left: 0;
    width: 6px;
    height: 6px;
    border-right: 1px solid #6B7C93;
    border-bottom: 1px solid #6B7C93;
    transform: translate(-50%, -50%) rotate(45deg);
    /* down */
    transition: transform 0.3s ease;
  }
  
  .input-wrapper .select2-container--open .select2-selection__arrow::after {
    transform: translate(-10%, -10%) rotate(-135deg);
    /* up */
  }
  
  body.state-select-open
  .select2-container--default .select2-dropdown {
  background-color: #fff;
  border: 1px solid #6B7C93;
  }
  body.state-select-open
  .select2-container--default .select2-results__options li {
    color: #000 !important;
    font-family: "InterRegular" !important;
  }
  body.state-select-open
  .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #ddd !important;
  }
  body.state-select-open
  .select2-container--default .select2-results__option--highlighted[aria-selected='true'] {
    background-color: #ddd !important;
  }
  body.state-select-open
  .select2-container--default .select2-results__option{
    background-color: #fff !important;
  }
  body.state-select-open
  .select2-container--default .select2-search--dropdown .select2-search__field {
    border-bottom: 1px solid #6B7C93 !important;
  }
  body.state-select-open
  .select2-container--default .select2-search--dropdown .select2-search__field input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea {
    border-radius: 0px !important;
}
  
/* Chrome, Edge, Safari */
body.state-select-open
::-webkit-scrollbar {
  width: 3px;      
}

body.state-select-open
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 10px;
}
  
  
  
  
  
  
  @media (min-width: 61.25em) {
    .u-5\/12\@desktop.contentBig {
      width: 60.66667% !important;
    }
  
  }
  
  img.injectable {
    visibility: hidden;
  }
  
  img[data-lazy-src].lazyloaded {
    transition: opacity .5s linear 0.2s;
    opacity: 1;
  }
  
  @media (min-width: 72.25em) {
    .header__nav .header__nav__container>li>a {
      padding: 0 .1rem !important;
      margin: 0 20px !important;
      margin: 1.0rem !important;
    }
  }
  
  @media (min-width: 46.25em) {
    header.header .header__buttons>:nth-child(2) {
      margin: 0;
      margin-left: 1rem;
    }
  }
  
  .c-btn--accent,
  .remodal[data-remodal-id=education-modal] .selects>*,
  .remodal[data-remodal-id=retail-modal] .selects>*,
  .c-btn--blue {
    border: none !important;
    background: linear-gradient(169deg, #4285f4 0%, #4285f4 100%) !important;
  }
  
  .footer-cta .o-wrapper {
    background-color: #3072d6 !important;
  }
  
  .c-btn.C-btn-inactive {
    border: 2px solid #4285f4 !important;
    color: #4285f4 !important;
    box-shadow: 0 0.3125rem 0.9375rem 0 rgba(0, 6, 68, 0.15);
    border-radius: 4px;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    padding: 8px !important;
  }
  
  @media (min-width: 72.25em) {
    .header__nav .header__nav__container {
      padding-left: 4rem !important;
    }
  }
  
  .modal {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 99999;
    /* Sit on top */
    padding-top: 100px;
    /* Location of the box */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
    /* Black w/ opacity */
  }
  
  /* Modal Content */
  .modal-content {
    background-color: #000;
    margin: -45px auto;
    padding: 0px;
    border: 1px solid #888;
    width: 70%;
  
  }
  
  /* The Close Button */
  .close,
  .MyClose {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    padding: 0px 20px;
  }
  
  .close:hover,
  .close:focus,
  .MyClose:hover,
  .MyClose:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
  }
  
  .videoClass {
    width: 100%;
    height: 50%;
  }
  
  @media (min-width: 46.25em) {
    .tbletHalf.u-1\/3\@tablet {
      width: 48.33333% !important;
    }
  }
  
  .logo-strip .o-layout__item img {
    max-height: 60px !important;
  }
  
  .statistics li span {
    color: #4285f4 !important;
  }
  
  .ed-tag {
    background: linear-gradient(90deg, #4285f4 0%, #4285f4 100%) !important;
    margin-left: 0px !important;
    border-radius: 7px !important;
    padding: 0.4375rem 0.9375rem 0.4375rem 1.8625rem !important;
  }
  
  .ed-tag:before {
    background-image: unset !important;
  }
  
  .ed-tag::after {
    left: 0.7125rem !important;
  }
  
  .cl--blue,
  .c--accent,
  .two-column-content__list li i {
    color: #4285f4 !important;
  }
  
  .mini-testimonial__photo img {
  
    width: 3rem !important;
    height: 3rem !important;
  }
  
  .o-wrapper.O-Wrapper-WidthFix {
    width: 1000px !important;
  }
  
  .footer-copyright__socials ul li a {
    color: #4285f4 !important;
  }
  
  .carousel-control.left,
  .carousel-control.right {
    background-image: unset !important;
  
  
  }
  
  .carousel-control {
    color: #789ddb !important;
  }
  
  blockquote {
    border-left: none !important;
  }
  
  @media (min-width: 61.25em) {
    .u-5\/12\@desktop.AddExtra5\12 {
      width: 40.66667% !important;
    }
  
  }
  
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next,
  .carousel-control .icon-prev {
    width: 10px !important;
  }
  
  .index-quote-text {
    min-height: 300px;
    height: 300px;
  }
  
  .vid--cont div {
    top: 65% !important;
    left: 15% !important;
  }
  
  .c-btn--accent.btnSubmitcaptcha {
    color: #4285f4 !important;
    width: 100%;
    border: none !important;
    font-family: 'Larsseit';
    background: linear-gradient(169deg, #fff 0%, #fff 100%) !important;
  }
  
  .soms-report-ebook__chapter-name {
    font-size: 15px;
    color: #4285f4;
    padding: 12px 20px 12px 15px;
  }
  
  
  .join_us .tabs_menu__img-bg .bg-wrap {
    position: absolute;
    bottom: 0;
    right: -40px;
    top: 85px;
    left: auto;
    height: calc(24% - -161px);
    width: calc(100% - 48px);
    box-shadow: 2px 11px 24px 6px rgba(0, 0, 0, 0.13);
  }
  
  .career_bg {
    height: 450px;
    margin-top: 30px;
  }
  
  .career_bg .after {
    background: #0CA2D0;
    position: absolute;
    top: calc(50% - 1px);
    height: 20%;
    width: 100%;
    left: 0;
    /* z-index: 0;*/
    transition: height 2.5s ease-in-out;
  }
  
  .career_bg .after.active {
    height: 65%;
  }
  
  .join_us .tabs_menu__img-bg .bg-wrap {
    position: absolute;
    bottom: 0;
    right: -40px;
    top: 85px;
    left: auto;
    height: calc(24% - -161px);
    width: calc(100% - 48px);
    box-shadow: 2px 11px 24px 6px rgba(0, 0, 0, 0.13);
  }
  
  .tabs_menu__img-bg {
    margin-right: 40px;
  }
  
  .tabs_menu__img-bg .before {
    background: #063371;
    position: absolute;
    bottom: 50%;
    height: 20%;
    width: 100%;
    left: 0;
    /* z-index: 0;*/
    transition: height 2.5s ease-in-out;
  }
  
  .tabs_menu__img-bg .before.active {
    height: 50%;
  }
  
  .tabs_menu__img-bg .after {
    position: absolute;
    top: calc(1% - 1px);
    height: 20%;
    width: 100%;
    left: 0;
    /* z-index: 0; */
    transition: height 2.5s ease-in-out;
    background-image: linear-gradient(119deg, #0099f5 0, #0199f5 52%, #1e3f75 90%) !important;
    padding: 135px;
  }
  
  .tabs_menu__img-bg .after.active {
    height: 50%;
  }
  
  .tabs_menu__img-bg .w-img,
  .tabs_menu__img-bg .img-container,
  .tabs_menu__img-bg .video_container,
  .tabs_menu__img-bg .text-container {
    position: relative;
    overflow: hidden;
    /* z-index:1;*/
    margin: 0 auto;
  }
  
  .tabs_menu__img-bg .w-img,
  .tabs_menu__img-bg .img-container,
  .tabs_menu__img-bg .video_container {
    box-shadow: -20px 20px 50px rgba(0, 0, 0, 0.5);
  }
  
  @media (max-width: 991px) {
  
    .tabs_menu__img-bg .w-img,
    .tabs_menu__img-bg .img-container,
    .tabs_menu__img-bg .video_container {
      height: 300px;
    }
  }
  
  @media (max-width: 767px) {
  
    .tabs_menu__img-bg .w-img,
    .tabs_menu__img-bg .img-container,
    .tabs_menu__img-bg .video_container {
      height: 210px;
      width: 265px;
    }
  
    .subscribe_page .productLbl {
      font-size: 20px !important;
      line-height: 30px !important;
      color: #4285f4 !important;
    }
  
    a.c-btn--accent {
      color: #fff !important;
    }
  }
  
  
  
  
  
  /* Tablet */
  @media (max-width: 1024px) {
    .form-sidenav {
        width: 50%;
    }
  }
  
  /* Mobile */
  @media (max-width: 768px) {
    .captchaBox {
      gap: 16px;
    }
    
    .RefreshCapcha img{
      left: 299px;
  }
    .SideNavCaptchaInput {
      width: 160px;
  }
    .SideNavCaptchaInput1 {
      width: 160px;
  }
    .ProductBox {
      padding-top: 15px;
  }
    .GridBox {
      gap: 12px;
  }
    #formInfo{
      margin-top: 20px !important;
    }
    .form-sidenav {
        width: 100%;
        padding: 20px 16px;
    }
    .form-sidenav .containerPreffredTime .checkmarkPreffredTime.one:after {
      left: 20px;
  }
    .form-sidenav .containerPreffredTime .checkmarkPreffredTime.two:after {
      left: 20px;
  }
    .form-sidenav .containerPreffredTime .checkmarkPreffredTime.three:after {
      left: 20px;
  }
    .form-sidenav .containerPreffredTime .checkmarkPreffredTime.four:after {
      left: 20px;
  }
  
  .form-sidenav .checkmarkBox {
    margin-bottom: 15px;
  }
  /* .SubmitBtn {
    margin-top: 20px;
  } */
  }
  
  .form-sidenav.open {
    right: 0;
  }
  
  /* Overlay */
  #overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0);
    backdrop-filter: blur(0);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 1000;
  }
  
  #overlay.show {
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(6px);
    opacity: 1;
    visibility: visible;
  }
  