.text-highlight {
    --duration: 10s;
    --bg-color-highlight: #b49a4a;
    --color-text: #b49a4a;
    --color-text-highlight: rgba(255,255,255);
    --ease: cubic-bezier(0.25, 1, 0.5, 1);

    all: unset;
    background-repeat: no-repeat;
    background-size: 0% 100%;
    transition: color calc(var(--duration) / 4) var(--ease),
    background-color calc(var(--duration) / 4) var(--ease),
    background-size var(--duration) var(--ease);

    &.active {
        color: var(--color-text-highlight);
        background-size: 100% 100%;
    }

    [data-highlight="background"] & {
        background-image: linear-gradient(
                var(--bg-color-highlight),
                var(--bg-color-highlight)
        );
    }

    [data-highlight="half"] & {
        --line-size: 0.5em;
        background-image: linear-gradient(
                transparent calc(100% - var(--line-size)),
                var(--bg-color-highlight) var(--line-size)
        );
    }

    [data-highlight="underline"] & {
        --line-size: 0.15em;
        /*font-weight: bold;*/
        background-image: linear-gradient(
                transparent calc(100% - var(--line-size)),
                var(--color-text) var(--line-size)
        );
    }

    &::before,
    &::after {
        position: absolute;
        clip-path: inset(100%);
        clip: rect(1px, 1px, 1px, 1px);
        width: 1px;
        height: 1px;
        overflow: hidden;
        white-space: nowrap;
        user-select: none;
    }

    &::before {
        content: " [highlight start] ";
    }

    &::after {
        content: " [highlight end] ";
    }
}

/* 11 */

.custom-btn {
    width: 100%;
    height: 40px;
    color: #fff;
    border-radius: 5px;
    padding: 10px 25px;
    font-family: 'Lato', sans-serif;
    font-weight: 500;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    display: inline-block;
    box-shadow:inset 2px 2px 2px 0 rgba(255,255,255,.5),
    7px 7px 20px 0 rgba(0,0,0,.1),
    4px 4px 5px 0 rgba(0,0,0,.1);
    outline: none;
}

.btn-11 {
    border: none;
    background: #b49a4a;
    background: linear-gradient(0deg, #b49a4a 0%, #f8f5ed 100%);
    color: #fff;
    overflow: hidden;
}
.btn-11:hover {
    text-decoration: none;
    color: #fff;
}
.btn-11:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shiny-btn1 3s ease-in-out infinite;
}
.btn-11:hover{
    opacity: .7;
}
.btn-11:active{
    box-shadow:  4px 4px 6px 0 rgba(255,255,255,.3),
    -4px -4px 6px 0 rgba(116, 125, 136, .2),
    inset -4px -4px 6px 0 rgba(255,255,255,.2),
    inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
}


@-webkit-keyframes shiny-btn1 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

.button-pulse {
    animation: pulse 2s infinite 3s cubic-bezier(0.25, 0, 0, 1);
    box-shadow: 0 0 0 0 #b49a4a;
}

/*linear-gradient(0deg, #b49a4a 0%, #f8f5ed 100%)*/

@keyframes pulse {
    to {
        box-shadow: 0 0 0 18px rgba(255, 255, 255, 0);
    }
}

.btn-hover-txt-switch:hover {
    color: #fff;
    background-color: #b49a4a;
}

.objfit-top{object-position:top}

.justify-text {
    text-align: justify;
    text-justify: inter-word;
}

@media (max-width: 575px) {
    .mobile-pt-15 {
        padding-top: 15px!important;
    }
}

@media (min-width: 576px) {
    .height-500 {
        height: 500px;
    }
}

/* ***** Section Flow ***** */
.section-flow {
    min-height: 655px;
}

.section-flow .lqd-section-flow-panel-end {
    padding: 13% 6%;
}

.section-flow .lqd-section-flow-panel-end .lqd-section-flow-item {
    padding-top: 20%;
    padding-bottom: 20%;
}

@media (max-width: 767px) {
    .section-flow .lqd-section-flow-panel-end .lqd-section-flow-item {
        padding-top: 45px;
        padding-bottom: 45px;
    }
}


/* ***** Digital Experience ***** */
.digital-experience .module-img-1 {
    right: 4vw;
}

.digital-experience .module-img-2 {
    right: 55px;
}

.digital-experience .module-img-3 {
    left: -19%;
}

@media (max-width: 1199px) {
    .digital-experience {
        padding: 50px 30px;
    }

    .digital-experience .module-img-2 {
        width: 192px;
        max-width: 192px;
        top: 6.5%;
        right: 5%;
    }

    .digital-experience .module-img-3 {
        width: 272px;
        max-width: 272px;
        top: 0%;
        left: 15px;
    }

    .digital-experience .module-img-4 {
        width: 319px;
        max-width: 319px;
    }
}

@media (max-width: 767px) {
    .digital-experience {
        padding: 0 10px 30px 10px;
    }

    .digital-experience .btn {
        margin-bottom: 15px;
    }
}


.ld-fancy-heading .lqd-highlight-inner {
    bottom: 0.15em;
    left: 0;
}

@media (min-width: 768px) {
    .desktop-hidden {
        display: none;
    }
}

@media (min-width: 2000px) {
    :root {
        --lqd-container-width: 1370px; /* Adjust this value as needed */
    }
    .min-h-100vh{
        min-height:60vh
    }
}

@media (max-width: 768px) {
    .min-h-100vh{
        min-height:unset;
    }
    .mobile-br-5 {
        border-radius: 5px!important;
    }
    .text-justify-mobile {
        text-align: justify !important;
        hyphens: auto !important;
        word-wrap: break-word !important;
        -webkit-hyphens: auto !important;
        -moz-hyphens: auto !important;
        -ms-hyphens: auto !important;
    }
    .mobile-mt-15 {
        margin-top: 15px!important;
    }
    .mobile-mr-15 {
        margin-right: 15px!important;
    }
    .mobile-pt-10 {
        padding-top: 10px!important;
    }
    .text-24 {
        font-size: 16px!important;
    }
    .mobile-text-16 {
        font-size: 16px!important;
    }
    .mobile-pf-20 {
        padding-left: 20px!important;
    }
    .mobile-pb-15 {
        padding-bottom: 0!important;
    }
    .text-42 {
        font-size: 26px!important;
    }
    .mobile-text-26 {
        font-size: 26px!important;
    }
    .ld-gradient-heading {
        font-size: 26px!important;;
    }
    .mobile-pb-0 {
        padding-bottom: 0!important;
    }
    .leading-40 {
        line-height: 20px!important;;
    }
    .gap-30 {
        gap: 15px!important;;
    }
    .mobile-mb-20 {
        margin-bottom: 20px!important;
    }
    .mobile-mb-10 {
        margin-bottom: 10px!important;
    }
    .mobile-mb-0 {
        margin-bottom: 0!important;
    }
    .mobile-pt-0 {
        padding-top: 0!important;
    }
    .leading-0\/9em {
        line-height: 25px!important;
    }
    .mobile-center-text {
        text-align: center!important;
    }
    .mobile-left-text {
        text-align: left!important;
    }
    .mobile-right-text {
        text-align: right!important;
    }
    .mobile-pl-0 {
        padding-left: 0!important;
    }
    .mobile-pl-40 {
        padding-left: 40px!important;
    }
    .mobile-pr-40 {
        padding-right: 40px!important;
    }
    .mobile-lh-25 {
        line-height: 25px!important;
    }
    .lity-iframe-container {
        padding-top: 186%!important;
    }
    .mobile-pl-5percent {
        padding-left: 5%!important;
    }

}

/* Hide mobile image on larger screens */
.desktop-image {
    display: block!important; /* Show by default */
}

.mobile-image {
    display: none!important; /* Hide by default */
}

/* When the screen width is 768px or less, hide the desktop image and show the mobile image */
@media (max-width: 768px) {
    .desktop-image {
        display: none!important;
    }
    .mobile-image {
        display: block!important;
    }
}

li.dot {
    color: lightgrey!important;
    background-color: lightgrey!important;
}

li.is-selected {
    color: #b49a4a!important;
    background-color: #b49a4a!important;;
}