/**************************************
                General
**************************************/
:root {
    --animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --animation-duration: 1s;
}

*,
*::before,
*::after {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

html {
    font-size: 100%;
    box-sizing: inherit;
    scroll-behavior: smooth;
    height: -webkit-fill-available;
}

html.lenis,
html.lenis body {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-smooth iframe {
    pointer-events: unset;
}

html::-webkit-scrollbar {
    width: 6px;
    background-color: #1f86c270;
}

html::-webkit-scrollbar-thumb {
    background-color: #80BE7C;
    border-radius: 50rem;
}

a,
button {
    cursor: pointer;
    border: none;
    outline: none;
    user-select: none;
    background: none;
    box-shadow: none;
}

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

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

}

body {
    font-size: 16px;
    font-family: 'Oakes Grotesk Regular';
    font-weight: 400;
    color: #2C2C2C;
    line-height: 165%;
}

a,
a:hover,
a:focus {
    color: #80BE7C;
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    transition: all .4s;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
}
h1,h2{
    font-family: 'Helvetica Bold';
    font-style: normal;
    font-weight: 700;
}
p {
    margin-top: 0;
    margin-bottom: 1rem;
}

main {
    overflow: clip;
}

img {
    max-width: 100%;
    height: auto;
    transition: all .5s;
}

.w-100 {
    width: 100% !important;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

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

.container-fluid {
    padding: 0 70px;
}
.thm-color{
    color: #109910;
}
.small-text{
    color: #109910;
font-size: 14px;
line-height: 30px;
}

/* Popup */
.popup {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.64);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
    z-index: 999999;
    opacity: 0;
    transform: translateY(10px);
    z-index: -1;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
}

.popup.show {
    opacity: 1;
    transform: translateY(0px);
    z-index: 999999;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    -webkit-transition: opacity 0.5s ease, transform 0.5s ease;
    -moz-transition: opacity 0.5s ease, transform 0.5s ease;
    -ms-transition: opacity 0.5s ease, transform 0.5s ease;
    -o-transition: opacity 0.5s ease, transform 0.5s ease;
}

.popup .popup__content {
    width: 61%;
    color: black;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
    border-radius: 30px;
    z-index: 99999;
    background: linear-gradient(270deg, #103C14 0%, #2BA236 100%);
    overflow: hidden;
    .title{
        color: #FFF;
    }
    .small-line{
        background-color: #fff;
    }
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .form-area {
        padding: 40px 30px;
    }
    form {
        margin-top: 20px;
    }
}
textarea{
    font-family: 'Oakes Grotesk Regular';
    font-weight: 500;
}
.popup .popup__content .close {
    position: absolute;
    right: 8px;
    top: 8px;
    width: 40px;
    height: 40px;
    opacity: 1;
    color: #ffffff;
    font-size: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    border-radius: 50% 0 50% 50%;
    flex-direction: column;
    gap: 5px;
    background-color: #2BA236;
    transition: all .5s;
    z-index: 9;
}

.popup .popup__content .close:hover {
    background-color: #ffffff;
}

.popup .popup__content .close:hover span {
    background-color: #15222B;
}

.popup .popup__content .close span {
    cursor: pointer;
    position: fixed;
    width: 20px;
    height: 3px;
    background: #ffffff;
}

.popup .popup__content .close span:nth-child(1) {
    transform: rotate(45deg);
}

.popup .popup__content .close span:nth-child(2) {
    transform: rotate(135deg);
}


/**************************************
            Helper Class
**************************************/

.sec-gap {
    padding: 50px 0;
}
.pb-50 {
    padding-bottom: 50px;
}
.mb-20 {
    margin-bottom: 20px;
}
.mb-30 {
    margin-bottom: 30px;
}
.mb-40 {
    margin-bottom: 40px;
}

p {
    color: #2C2C2C;
    font-family: 'Oakes Grotesk Regular';
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 165%;
}

.title {
    color: #121212;
    font-family: 'Helvetica Bold';
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 98.214%;
}
.section-title {
    color: #1A1A1A;
    font-family: 'Helvetica Bold';
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 100.653%;
}
.card-title{
    color: #0E0E0E;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 43px;
}


.primary-btn {
    color: #000;
    font-family: 'Oakes Grotesk Bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    padding: 24px 42px;
    border-radius: 60px;
    background: #F6BE3B;
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.primary-btn:before,
.primary-btn:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: -100%;
    left: 0;
    background: linear-gradient(180deg, #109910 0%, #08C708 100%);
    z-index: -1;
    transition: all .35s;
}

.primary-btn:before {
    opacity: .5;
}

.primary-btn:after {
    transition-delay: .2s;
}

.primary-btn:hover:before,
.primary-btn:hover:after {
    top: 0;
}

.primary-btn:hover {
    color: #ffffff;
}
.secondary-btn{
    padding-inline: 20px 74px;
    border-radius: 60px;
    background: #F6BE3B;
    transition: all.5s;
    &::after, &::before{
        background-color: #109910;
    }
}

.primary-btn .arrow-right {
    margin-left: 10px;
}

.link-btn {
    color: #09122C;
    font-family: 'Mulish Bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.link-btn .arrow-right {
    border-top: 1px solid;
    border-left: 1px solid;
}

.link-btn:hover {
    color: #80BE7C;
    text-decoration: underline;
}

.link-btn:hover .arrow-right {
    border-top: 1px solid;
    border-left: 1px solid;
}

.arrow-right {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-top: 1px solid;
    border-left: 1px solid;
    transform: rotate(135deg);
}

.form-control {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    align-items: center;
    color: #000000;
    padding: 12px 15px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border: 1px solid #C1C1C1;
    width: 100%;
    border-radius: 4px;
    outline: none;
}

.form-control:focus {
    border-color: #80BE7C;
}

form .btn-group {
    justify-content: center;
}

form .primary-btn {
    padding: 24px 42px;
    cursor: pointer;
    display: inline-block;
    border: 0;
}

form .primary-btn:hover {
    background: #80BE7C;
    color: #ffffff;
}

.form-group {
    margin-bottom: 10px;
}

input,
input:focus {
    outline: none;
    box-shadow: none !important;
}

.form-control::placeholder {
    color: rgba(46, 49, 58, 0.5);
}

.form-group {
    position: relative;
}

.italic {
    font-style: italic;
}

.small-line{
    width: 103px;
    height: 3px;
    background: #109910;
    display: inline-block;
}
/**************************************
         Animation
**************************************/
/* Keyframes */
@keyframes slideInUp {
    0% {
        opacity: 0;
        transform: translateY(25%);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInDown {
    0% {
        opacity: 0;
        transform: translateY(-25%);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInLeft {
    0% {
        opacity: 0;
        transform: translateX(25%);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(-25%);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.75);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes zoomReverseIn {
    0% {
        opacity: 0;
        transform: scale(1.25);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes flipInY {
    0% {
        opacity: 0;
        transform: perspective(90vw) rotateY(67.50deg);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

/* Animations */
[data-animation] {
    opacity: 0;
    animation-timing-function: var(--animation-timing-function);
    animation-fill-mode: both;
    animation-duration: var(--animation-duration);
    will-change: transform, opacity;
}

/* Disable animation of the children */
.animations-disabled,
.animations-disabled [data-animation] {
    animation: none !important;
    opacity: 1 !important;
}

/* Slide Animations */
.slideInUp {
    animation-name: slideInUp;
}

.slideInDown {
    animation-name: slideInDown;
}

.slideInLeft {
    animation-name: slideInLeft;
}

.slideInRight {
    animation-name: slideInRight;
}

/* Fade Animations */
.fadeIn {
    animation-name: fadeIn;
}

/* Zoom Animations */
.zoomIn {
    animation-name: zoomIn;
}

.zoomReverseIn {
    animation-name: zoomReverseIn;
}

/* Flip Animations */
.flipInY {
    animation-name: flipInY;
}

.flipOutY {
    animation-name: flipInY;
    animation-direction: reverse;
}

/*******************************
	Menu
*******************************/

.call-email {
    position: relative;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 20px;
    p{
        margin: 0;
        display: flex;
        align-items: center;
        gap: 3px;
        a{
            color: #000;
            font-size: 20px;
            font-style: normal;
            font-weight: 500;
            line-height: normal;
            &:hover{
                color: #80BE7C;
            }
        }
        
    }
}
.logo {
    position: relative;
}
.header-area {
    background-color: rgba(255, 255, 255, 0);
    box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.07);
    position: fixed;
    z-index: 999;
    right: 0;
    left: 0;
}
.flex-box {
    display: flex;
    align-items: center;
    gap: 15px;
}
.header-area.sticky {
    background: #108211;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    animation: slideDown 0.35s ease-out;
    .top-bar{
        display: none;
    }
}
.landing-menu{
    background-color: rgba(255, 255, 255, 0);
    position: fixed;
    z-index: 999;
    right: 0;
    left: 0;
    box-shadow: unset;
    #menu {
        justify-content: space-between;
    }
}
.landing-menu.sticky {
    background: rgb(255, 255, 255);
    box-shadow: 0px 10px 26px 0px rgba(0, 0, 0, 0.07);
}
@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }

    to {
        transform: translateY(0);
    }
}

.serch-box {
    position: relative;
    margin-left: 40px;
}

.serch-box span {
    position: absolute;
    left: 0;
    top: 0;
    height: 62px;
    width: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.serch-box input {
    width: 287px;
    height: 62px;
    padding: 14px;
    border-radius: 60px;
    border: 1px solid #393939;
    background: rgba(217, 217, 217, 0.10);
    backdrop-filter: blur(20px);
    color: #A8A8A8;
    font-size: 22px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-left: 52px;
}

.serch-box input::placeholder {
    color: #C0C0C0;
}

.main-menu {
    display: flex;
    align-items: center;
    justify-content: end;
}

header {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    z-index: 999;
    transition: ease-in-out .4s;
    background: #c9161600;
    padding-inline: 27px;
}

.main-menu {
    position: relative;
    width: 100%;
}

.desk_search {
    display: block;
}

.mob_search {
    display: none;
}

.search {
    position: relative;
}

.search .search-form {
    position: absolute;
    width: 512px;
    background: #fff;
    right: 0;
    top: 65px;
    scale: 1 1;
    transition: transform .3s ease-in-out;
    transform-origin: right;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    .form-control{
        padding-block: 18px;
    }
}

.search .search-form.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.search-icon {
    padding: 20px;
    cursor: pointer;
    background: #ffffff00;
    transition: all .4s;
    &:hover {
        background: #e2e2e225;
    }
}

.close {
    position: absolute;
    color: #ffffff;
    right: 0;
    top: 0;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 98%;
    background: linear-gradient(90deg, #103C14 0%, #2BA236 100%);
    font-size: 34px;
    cursor: pointer;
}

nav {
    position: relative;
    margin: 0 auto
}

#menu,
#menu .main-menu ul,
#menu .main-menu ul li,
#menu .main-menu ul li a,
#menu #head-mobile {
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

#menu {
    position: relative;
    display: flex;
    align-items: center;

}

#menu>.main-menu>ul>li {
    float: left;
    padding-inline: 0px;
    display: inline;
    &:first-child{
        a{
            padding-left: 0;
        }
    }
}

#menu>.main-menu>ul>li>a {
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all .4s;
    padding: 16px 14px;
    display: inline-block;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    
}

/* #menu>.main-menu>ul>li>a::after,
#menu .main-menu ul li.current-menu-item a::after {
    content: '';
    position: absolute;
    bottom: 9px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ffffff;
    transition: all .3s ease;
    scale: 0 1;
} */

#menu .main-menu ul li:first-child:after {
    width: 0;
}

#menu>.main-menu>ul>li:hover>a,
#menu .main-menu ul li.current-menu-item a {
    color: #ffffff;
    &::after{
        scale: 1 1;
    }
}

#menu>.main-menu>ul>li.has-sub>a::before {}

#menu>.main-menu>ul>li:hover,
#menu .main-menu ul li.current-menu-item:hover,
#menu .main-menu ul li.current-menu-item,
#menu .main-menu ul li.has-sub.current-menu-item:hover {
    -webkit-transition: background .3s ease;
    -ms-transition: background .3s ease;
    transition: background .3s ease
}

#menu>.main-menu>ul>li.has-sub>a {}

#menu>.main-menu>ul>li.has-sub>a::before {
    top: 5px;
    right: 0px;
    margin-left: 5px;
    margin-right: 3px;
    transition: all .4s;
    content: "";
    position: relative;
    float: right;
    z-index: 11;
    display: block;
    width: 8px;
    height: 8px;
    border-top: 1px solid;
    border-left: 1px solid;
    transform: rotate(225deg);
}

#menu>.main-menu>ul>li.has-sub:hover>a::before,
#menu>.main-menu>ul>li.has-sub.current-menu-item>a::before {
    border-top-color: rgb(255, 255, 255);
    border-left-color: rgb(255, 255, 255);
}

/* #menu>.main-menu>ul>li.has-sub:hover>a::before {
    transform: rotate(-316deg);
    top: 36px;
} */

#menu .main-menu ul ul {
    position: absolute;
    left: -9999px;
    box-shadow: 0px 12px 10px 0px #0000004f;
    width: auto;
    -webkit-transition: all .25s ease;
    -ms-transition: all .25s ease;
    background: rgb(255, 255, 255);
    transition: all .25s ease;
    transform: translateY(10px);
}

#menu .main-menu ul ul li {
    height: auto;
}

#menu ul ul li:hover {}

#menu li:hover>ul {
    left: auto;
    transform: translateY(0);
}

#menu li:hover>ul>li {
    height: auto;
    display: block;
    align-items: center;
}

#menu ul ul ul {
    margin-left: 100%;
    top: 0
}

#menu ul ul li a {
    padding: 14px 25px;
    width: auto;
    line-height: 19px;
    text-decoration: none;
    color: #000000;
    font-weight: normal;
    white-space: normal;
}

#menu .main-menu ul ul li:last-child>a,
#menu .main-menu ul ul li.last-item>a {
    border-bottom: 0
}

#menu .main-menu ul ul li:hover a,
#menu .main-menu ul ul li:hover {
    color: #000000;
}

#menu .main-menu ul ul li.has-sub>a:after {
    position: absolute;
    top: 13px;
    right: 11px;
    width: 8px;
    height: 8px;
    display: block;
    content: '';
    border-bottom: 1px solid;
    border-right: 1px solid;
    transform: rotate(-45deg);
    transition: all .4s;
}


#menu .main-menu ul ul li.has-sub:hover,
#menu .main-menu ul ul li:hover,
#menu .main-menu ul li.has-sub ul li.has-sub ul li:hover {
    background: #F6BE3B;
}

#menu ul ul ul li.active a {
    border-left: 1px solid #333
}

#menu>.main-menu>ul>li.has-sub>ul>li.active>a,
#menu .main-menu>ul ul>li.has-sub>ul>li.active>a {
    border-top: 1px solid #333
}

#menu .main-menu ul li.current-menu-item ul li a {
    color: #000;
}

#menu .main-menu ul li.current-menu-item ul li a:hover {
    color: #ffffff;
}
.call-btn{
    img{
        filter: brightness(0) saturate(100%)
    }
    &:hover{
        color: #fff;
        img{
            filter: brightness(0) saturate(100%) invert(92%) sepia(93%) saturate(0%) hue-rotate(202deg) brightness(106%) contrast(106%);
        }
    }
}
@media screen and (max-width:992px) {
    header {
        position: relative;
        width: 100%;
        height: 0px;
    }

    header::before {
        display: none;
    }

    .logo {}

    #menu .main-menu ul li.current-menu-item ul li a {
        color: #ffffff;
    }

    nav {
        width: 100%
    }

    #menu {
        width: 100%
    }

    #menu ul {
        width: 100%;
        display: none;
    }

    #menu .main-menu {
        width: 100%;
        position: fixed;
        height: 100% !important;
        background-color: #002569;
        transform: translateX(-100%);
        transition: all .4s;
        top: 90px;
        left: 0;
    }

    #menu .main-menu.open {
        transform: translateX(0%);
        /* height: 500px !important;
        overflow-x: scroll; */
    }

    #menu .main-menu ul li {
        width: 100%;
        border-top: 1px solid #4444442e;
    }

    #menu .main-menu ul li:hover {
        background: #ffffff05
    }

    #menu .main-menu ul li::after {
        display: none;
    }

    #menu .main-menu ul ul li,
    #menu li:hover>ul>li {
        height: auto
    }

    #menu .main-menu ul li a,
    #menu .main-menu ul ul li a {
        width: 100%;
        border-bottom: 0;
        color: #ffffff;
    }

    #menu>.main-menu>ul>li {
        float: none
    }

    #menu ul ul li a {
        padding-left: 25px
    }

    #menu ul ul li {
        background: #1b268600 !important
    }
    #menu ul ul ul li a {
        padding-left: 35px
    }

    #menu ul ul li a {
        color: #ddd;
        background: none
    }

    #menu ul ul li:hover>a,
    #menu ul ul li.active>a {
        color: #fff
    }

    #menu .main-menu ul ul {
        box-shadow: none;
    }

    #menu .main-menu ul ul,
    #menu .main-menu ul ul ul {
        position: relative;
        left: 0;
        width: 100%;
        margin: 0;
        text-align: left;
        top: 0;
        transform: unset;
        height: auto;
    }

    #menu .main-menu ul ul.open {
        transform: unset;
    }

    #menu>ul>li.has-sub>a:after,
    #menu>ul>li.has-sub>a:before,
    #menu ul ul>li.has-sub>a:after,
    #menu ul ul>li.has-sub>a:before {
        display: none
    }

    #menu #head-mobile {
        display: block;
        padding: 23px;
        color: #ddd;
        font-size: 12px;
        font-weight: 700
    }

    /* .hamburger {
        width: 55px;
        height: 48px;
        position: absolute;
        right: 0;
        top: 12px;
        cursor: pointer;
        z-index: 12399994;
    } */

    .hamburger:after {
        position: absolute;
        top: 24px;
        right: 10px;
        display: block;
        height: 14px;
        width: 35px;
        border-top: 2px solid #ffffff;
        border-bottom: 2px solid #ffffff;
        content: '';
    }

    .hamburger:before {
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        position: absolute;
        top: 12px;
        right: 10px;
        display: block;
        height: 2px;
        width: 35px;
        background: #ffffff;
        content: '';
    }

    .hamburger.menu-opened:after {
        -webkit-transition: all .3s ease;
        -ms-transition: all .3s ease;
        transition: all .3s ease;
        top: 23px;
        border: 0;
        height: 2px;
        width: 35px;
        background: #ffffff;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg)
    }

    .hamburger.menu-opened:before {
        top: 23px;
        background: #ffffff;
        width: 35px;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

    #menu .submenu-button {
        position: absolute;
        z-index: 99;
        right: 0;
        top: 0;
        display: block;
        border-left: 0;
        height: 50px;
        width: 60px;
        cursor: pointer
    }

    /* #menu .submenu-button.submenu-opened {
      background:#1b268600;
  } */

    #menu ul ul .submenu-button {
        height: 34px;
        width: 40px
    }

    #menu .submenu-button:after {
        position: absolute;
        top: 9px;
        right: 22px;
        width: 10px;
        height: 10px;
        display: block;
        content: '';
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
        transform: rotate(45deg);
        transition: all .4s;
    }

    #menu ul ul .submenu-button:after {
        top: 11px;
        right: 19px;
    }

    #menu ul ul .submenu-button.submenu-opened:after {
        top: 16px;
    }

    #menu .submenu-button.submenu-opened:after {
        transform: rotate(-135deg);
        top: 15px;
    }


    #menu ul ul .submenu-button:before {
        top: 12px;
        right: 16px
    }

    #menu .submenu-button.submenu-opened:before {
        display: none
    }

    #menu ul ul ul li.active a {
        border-left: none
    }

    #menu>ul>li.has-sub>ul>li.active>a,
    #menu>ul ul>li.has-sub>ul>li.active>a {
        border-top: none
    }
}

.menu-white {
    position: relative;
    background: #FFF;
    box-shadow: 0px 7px 11px 0px rgba(0, 0, 0, 0.06);
}

.menu-white.header-area.sticky {
    background-color: #fff;
    box-shadow: 5px 0px 17px 0px #00000030;
}

.menu-white #menu>.main-menu>ul>li>a {
    color: #1E1E1E;
}

.menu-white #menu>.main-menu>ul>li:hover>a,
.menu-white #menu .main-menu ul li.current-menu-item a {
    color: #95C12B;
}

.menu-white #menu>.main-menu>ul>li.has-sub>a::before {
    border-top: 1px solid #1E1E1E;
    border-left: 1px solid #1E1E1E;
}

.menu-white #menu>.main-menu>ul>li.has-sub:hover>a::before,
.menu-white #menu>.main-menu>ul>li.has-sub.current-menu-item>a::before {
    border-top-color: #95C12B;
    border-left-color: #95C12B;
}

.menu-white .primary-btn {
    color: #1E1E1E;
}

.menu-white .serch-box input {
    border: 1px solid #D6D6D6;
    background: rgba(217, 217, 217, 0.10);
    backdrop-filter: blur(7.5px);
}

.fixed-btn {
    position: fixed;
    bottom: 5%;
    right: 10px;
    z-index: 8;
    width: 40px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.fc:hover,
.fw:hover,
.call:hover {
    transform: scale(1.2);
}

.mobile{
display: none;
}
@media(prefers-reduced-motion: no-preference){
    @view-transition{
        navigation: auto;
    }
}
::view-transition-group(*){
    animation-duration: 2s;
}

/************************************* Home Page **************************************/

.banner {
    overflow: hidden;
    position: relative;
    padding-block: 125px;
    padding-top: 200px;
    z-index: 1;
    &::after{
        position: absolute;
        top: 0;
        width: 746px;
        right: 0;
        bottom: 0;
        background: linear-gradient(180deg, #109910 0%, #053305 100%);
        content: '';
        z-index: -2;
        clip-path: polygon( 32.172% 0%,100% 0%,100% 100%,0% 100%,32.172% 0% );
    }
    h1{
        color: #1A1A1A;
        font-size: 122px;
        font-style: normal;
        font-weight: 700;
        line-height: 130px;
        padding-right: 30px;
        span{
            background: #F6BE3B;
            font-size: 182px;
            box-shadow: -90vmax 0px 0 60vmax #F6BE3B;
            clip-path: inset(0vmax -60vmax);
            display: block;
            line-height: 95%;
            margin-bottom: 32px;
        }
    }
    h2{
        color: #104E14;
        font-family: 'Oakes Grotesk Bold';
        font-size: 37px;
        font-style: normal;
        font-weight: 700;
        line-height: 34px;
        margin-bottom: 20px;
        span{
            color: #000;
            font-size: 43px;
            display: block;
            margin-top: 23px;
        }
    }
    .banner-img{
        position: absolute;
            bottom: -12px;
            right: 3%;
            z-index: -1;
            width: 43%;
        .banner-img {
            position: absolute;
            bottom: -12px;
            right: 3%;
            z-index: -1;
            width: 43%;
        }
        .circle{
            position: absolute;
            bottom: 90px;
            right: -80px;
            z-index: -1;
            transform: scale(1.1);
        }
     
    }
   
}
.hero-banner{
    padding-top: 250px;
    padding-bottom: 240px;
    background-size: cover;
    background-repeat: no-repeat;
    &::after{
    	background: linear-gradient(161deg, rgba(16, 153, 16, 0.85) 46.22%, rgba(16, 60, 20, 0.28) 70.95%);
        right: auto;
        clip-path: polygon(39.481% 0%, -28.386% 0%, 32.133% 100%, 100% 100%, 39.481% 0%);
        width: 891px;
        z-index: -1;
    }
    &::before{
        background: linear-gradient(270deg, rgba(10, 10, 10, 0.04) 0%, rgba(0, 0, 0, 0.56) 100%);
        z-index: -1;
        content: '';
        position: absolute;
        inset: 0;
    }
    .hero-content{
        width: 55%;
    }
    h1{
        color: #FFF;
        font-family: 'Helvetica';
        font-size: 67px;
        font-style: normal;
        font-weight: 400;
        line-height: 91px;
        span{
            color: #FFF;
            font-family: 'Helvetica Bold';
            font-size: 110px;
            font-style: normal;
            font-weight: 700;
            line-height: 114px;
            padding: 0;
            background: none;
            box-shadow: none;
        }
    }
}
.btn-group {
    display: flex;
    gap: 25px;
}

.slick-arrow{
    width: 42px;
height: 42px;
background: rgba(217, 217, 217, 0.31);
border-radius: 50%;
z-index: 1;
transition: all .5s;
}

.slick-arrow::before {
    content: '';
    width: 12px;
    height: 12px;
    border-top: 1px solid;
    border-left: 1px solid;
    display: inline-block;
    transform: rotate(135deg);
    margin-right: 5px;
    opacity: 1;
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    color: #fff;
}

.slick-arrow.slick-prev::before {
    transform: rotate(316deg);
    margin-left: 8px;
}

.slick-arrow:hover,
.slick-arrow:focus {
    background-color: #2C9A15;
    border-color: #2C9A15;
}
.banner-slider{
    margin-bottom: 0;
    .slick-arrow{
        left: 80px;
    }
    .slick-arrow.slick-next{
        right: 80px;
        left: auto;
    }
}
.slick-dotted.slick-slider {
    margin-bottom: 0px;
}
/*********** Category ***********/
/* Category Section */
.category {
    position: relative;
    z-index: 1;
    .row .col-lg-3:nth-child(2n){
       .category-box{
        background: linear-gradient(0deg, #103C14 0%, #109910 100%);
      }
    }
}

.category-box {
    background: linear-gradient(180deg, #103C14 0%, #109910 100%);
    text-align: center;
    padding: 30px 20px;
    transition: all 0.3s ease;
    height: 100%;
    position: relative;
    z-index: 1;
    &:hover {
        transform: translateY(-10px);
        img{
            transform: rotateY(180deg);
        }
    }
}


.category-box .icon {
    margin-bottom: 20px;
}

.category-box .icon img {
    max-width: 60px;
    height: auto;
}

.category-box h3 {
    color: #F6BE3B;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 34px;
    font-style: normal;
    font-weight: 600;
    line-height: 33px;
    margin-bottom: 20px;
}

.category-box p {
    color: #FFF;
text-align: center;
font-family: 'Oakes Grotesk Regular';
font-size: 25px;
font-style: normal;
font-weight: 700;
line-height: 32px; /* 128% */
}
.mb-50{
    margin-bottom: 50px;
}
.who-small{
    border-radius: 25px;
}
.who-big{
    border-radius: 35px;
    overflow: hidden;
    height: 100%;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
/* ***** Service ***** */
.service-slider{
    padding-left: 14%;
    padding-bottom: 80px;
    .slick-arrow{
    right: 40%;
    top: 95%;
    width: 83px;
    height: 83px;
    border-radius: 50%;
    background: #109910;
    &::before{
        color: #ffffff;
    }
    &.slick-prev{
        right: 47%;
        left: auto;
    }
    &:hover{
        background: #D3D3D3;
        &:before{
            color: #000000;
        }
    }
}
    .slick-list{
        margin: 0 -30px;
    }
    .slick-slide{
        margin: 0 30px;
    }
}
.service-item{
    filter: drop-shadow(0px 24px 15px rgba(0, 0, 0, 0.15));
    background-image: url(../img/service-item-shape.svg);
    padding: 15px 25px;
    background-size: 100%;
    background-repeat: no-repeat;
    height: 530px;
    margin-block: 50px;
    border-radius: 0 0 26px 26px;
    &:hover{
        img{
            transform: rotateY(180deg);
        }
    }
    .title {
        font-size: 45px;
    }
    img{
        margin-bottom: 10px;
        height: 133px;
        width: auto;
    }
    .title{
        margin-bottom: 20px;
    }
    ul{
        li{
            color: #343434;
            font-family: 'Oakes Grotesk SemiBold';
            font-size: 18px;
            font-style: normal;
            font-weight: 500;
            line-height: 111.111%;
            position: relative;
            padding-left: 34px;
            margin-bottom: 14px;
            &::before{
                content: '';
                background-image: url(../img/check-icon.webp);
                width: 25px;
                height: 25px;
                background-repeat: no-repeat;
                display: block;
                position: absolute;
                left: 0;
                background-size: 20px;
            }
        }
    }
}

.roi {
    position: relative;
    background: url('../img/bg.webp') no-repeat center;
    background-size: cover;
    overflow: hidden;
    .btn-group {
        justify-content: center;
    }
    .container{
        position: relative;
    } 
    .roi-img {
        position: absolute;
        right: 0;
        bottom: -10px;
        width: 49%;
    }   
}
.roi-logo{
    background: linear-gradient(180deg, #109910 0%, #08C708 100%);
    text-align: center;
}
.roi-content{
    background: linear-gradient(180deg, #109910 0%, #08C708 100%);
    text-align: center;
    padding-bottom: 100px;
    padding-top: 40px;
}

.roi h2 {
    color: #FFF;
    margin-bottom: 12px;
    font-size: 64px;
    font-style: normal;
    font-weight: 400;
    line-height: 64px;
    text-transform: uppercase;
span{
    font-weight: 700;
    font-family: 'Helvetica Bold';
}
}
.roi h3 {
    background: linear-gradient(180deg, #F6BE3B 0%, #CC9B2A 100%);
    color: #FFF;
    font-family: 'Oakes Grotesk Bold';
    font-size: 37px;
    font-style: normal;
    font-weight: 700;
    line-height: 60px;
    margin-bottom: 20px;
    padding: 12px;
    width: 96%;
    margin-inline: auto;
}
.roi h3 span {
    font-size: 43px;
    line-height: 110.07%;
    display: block;
}
.roi p {
    color: #FFF;
    font-family: 'Oakes Grotesk Bold';
font-size: 37px;
font-style: normal;
font-weight: 700;
line-height: 34px;
margin-bottom: 20px;
}

.process{
    background-image: url(../img/process-bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    .row{
        position: relative;
        margin-top: 50px;
    }
    p{
        line-height: 133.333%;
        font-size: 16px;
    }
    .card-title{
        line-height:  125%;
        margin-bottom: 13px;
        /* min-height: 60px; */
    }
    .connecttor-line {
        position: absolute;
        z-index: -1;
        top: -20px;
    }
}

.process-box{
    text-align: center;
    padding-inline: 5%;
    .icon{
        width: 142px;
        height: 142px;
        background: #FFF;
        filter: drop-shadow(0px 7px 14px rgba(0, 0, 0, 0.15));
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
        margin-bottom: 20px;
        box-shadow: 0 0 0 10px #00000000;
        outline: 1px solid #EAEAEA;
        outline-offset: 10px;
        transition: all .5s;
    }
    .number{
        color: #109910;
        font-family: 'Oakes Grotesk Bold';
        font-size: 22px;
        font-style: normal;
        font-weight: 700;
        line-height: 34px;
        transition: all.5s;
    }
    &:hover{
        .icon{
            background: #F6BE3B;
            box-shadow: 0 0 0 10px #f6be3b44;
            img{
                transform: rotateY(360deg);
            }
        }
        .number{
            transform: scale(2);
            display: block;
        }
        .card-title{
            color: #109910;
        }
    }
}

.webiner{
    background: linear-gradient(90deg, #103C14 0%, #2BA236 100%);
    position: relative;
    .content{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-block: 65px;
        padding-left: 23%;
        h2{
            color: #FFF;
            font-family: 'Oakes Grotesk Bold';
            font-size: 40px;
            font-style: normal;
            font-weight: 700;
            line-height: 54px;
            span{
                font-size: 43px;
            }
        }
    }
    .left-img {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
}

.invest{
    .item{
        width: 744px;
        height: 744px;
        border-radius: 744px;
        border: 1px solid #F6BE3B;
        padding: 16%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        transition: all.5s;
        &:hover{
            background: #F6BE3B;
            border: 1px solid #F6BE3B;
            box-shadow: 0 0 10px rgba(54, 54, 54, 0.308);
        }
    }
    .small-line{
        background: #103C14;
        width: 72px;
        height: 4px;
        margin-top: 12px;
        margin-bottom: 24px;
    }
    .gride{
        display: flex;
    }
    p {
        font-size: 22px;
        line-height: 154%;
    }
}
.project{
    background-color: #F9F9F9;
    h3{
        color: #104E14;
        font-family: 'Oakes Grotesk Bold';
        font-size: 67px;
        font-style: normal;
        font-weight: 700;
        line-height: 64px;
        margin-bottom: 35px;
        margin-top: 42px;
    }
    h4{
        color: #000;
        font-family: 'Oakes Grotesk Bold';
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: 140%;
        margin-bottom: 22px;
        span{
            font-size: 43px;
        }
    }
   
    .timeline {
        position: relative;
        padding: 40px 0;
    }
    
    .timeline::before {
        content: '';
        position: absolute;
        left: 49px;
        top: 53px;
        bottom: 53px;
        width: 2px;
        border-left: 1px dashed #000000;
    }
    
    .timeline-item {
        position: relative;
        margin-bottom: 88px;
        padding-left: 50px;
        &:hover{
            .timeline-icon{
                box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.644);
                img{
                    transform: rotateY(360deg);
                }
            }
            
            .timeline-content{
                background: #109910;
                h4{
                    color: #fff;
                }
                p{
                    color: #eeeeee;
                }
            }
        }
    }
    
    .timeline-item:last-child {
        margin-bottom: 0;
    }
    
    .timeline-icon {
        position: absolute;
        left: 0;
        width: 98px;
        height: 98px;
        background: #109910;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
        filter: drop-shadow(0px 5px 11px rgba(0, 0, 0, 0.15));
        box-shadow: 0 0 0 7px rgb(16 153 16 / 20%);
        transition: all 0.5s;
    }
    
    .timeline-content {
        position: relative;
        border-radius: 5px;
        background: #FFF;
        box-shadow: 0px 14px 54px 0px rgba(0, 0, 0, 0.05);
        padding-top: 20px;
        padding-bottom: 14px;
        padding-left: 75px;
        transition: all.5s;
    }
    
    .timeline-content h4 {
        color: #109910;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 34px;
        font-style: normal;
        font-weight: 600;
        line-height: 33px;
        margin-bottom: 8px;
    }
    
    .timeline-content p {
        color: #0E0E0E;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: inherit;
        margin: 0;
    }
    
    
    .arrow {
        position: absolute;
        left: 40px;
        top: -45%;
    }
    .btn-group{
        position: relative;
    }
    .angel-arrow{
        position: absolute;
        top: -145%;
        left: 33%;
    }

}
.operation-areas {

.location-card {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0,0,0,0.1);
    border: 1px solid #F2F2F2;
    filter: drop-shadow(0px 10px 6px rgba(0, 0, 0, 0.15));
    position: relative;
    padding-bottom: 30px;
    height: 100%;
    padding-left: 10px;
    &::after{
        content: '';
        position: absolute;
        bottom: 0;
        height: 1px;
        left: 20%;
        right: 20%;
        background: linear-gradient(90deg, #109910 0%, #053305 100%);
    }
}

.location-card .flag {
    width: 77px;
    height: 77px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
    position: absolute;
    right: 8px;
    top: 4px;
}

.location-card .flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.location-card h3 {
    color: #0E0E0E;
font-family: 'Oakes Grotesk SemiBold';
font-size: 22px;
font-style: normal;
font-weight: 600;
line-height: 28px;
margin-bottom: 20px;
width: 75%;
}

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

.location-card ul li {
    display: flex;
    align-items: start;
    gap: 10px;
    margin-bottom: 25px;
    color: #222;
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    a{
        color: #222;
        &:hover{
            color: #109910;	
        }
    }
}

.location-card ul li:last-child {
    margin-bottom: 0;
}
}
@media (max-width: 991px) {
    .uk-map {
        margin-bottom: 30px;
    }
}

.webiner.right-img {
    background: linear-gradient(266deg, #103C14 0%, #2BA236 100%);
    .left-img{
        right: 0;
    }
    .content {
        padding-left: 0;
        padding-right: 22%;
    }
}
.video-container {
    border-radius: 35px;
    overflow: hidden;
    position: relative;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    a{
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #00000045;
        img{
            width: auto;
            height: auto;
        }
    }
}

/* *** Review *** */
.review{
    background: #F9F9F9;
    background-repeat: no-repeat;
    background-position: bottom;
    position: relative;
    z-index: 1;
    
}
.single-review {
    border-radius: 24px;
    background: #FFF;
    box-shadow: 0px 14px 24px 0px rgba(0, 0, 0, 0.12);
    padding: 10px;
    position: relative;
    transition: all .5s;
    text-align: center;
    margin-bottom: 40px;
    img{
        margin-inline: auto;
        margin-bottom: 16px;
    }
}

.user-info {
    img{
        width: 76px;
        height: 76px;
        object-fit: cover;
        margin-inline: auto;
        border-radius: 50%;
    }
}
.user-info h4 {
    color: #1D1D1D;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 31px;
    font-family: 'Oakes Grotesk SemiBold';
}
.user-info h5{
    color: #80BE7C;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}
.review-slider .slick-slide {
    margin: 0 10px;
}
.review-slider .slick-list {
    margin: 0 -10px;
}
.review-slider{
    .slick-dots li button {
        width: 12px;
        height: 12px;
        padding: 5px;
        cursor: pointer;
        color: #103C14;
        background: #103C14;
        outline: 1px solid #103c1400;
        border-radius: 50%;
        outline-offset: 4px;
    }
    .slick-dots li.slick-active button {
        outline: 1px solid #103c14;
    }
    .slick-dots li button:before{
        display: none;
    }
}
.mt-40 {
    margin-top: 40px;
}
.milestones {

.milestone-card {
    background: #fff;
    border-radius: 0px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    height: 100%;
    transition: all 0.3s ease;
    position: relative;
    &:hover{
        .milestone-content{
            scale: 1;
        }
    }
}

.milestone-card:hover {
    transform: translateY(-5px);
}

.milestone-img {
    overflow: hidden;
    position: relative;
    height: 100%;
    .year {
        background: rgb(16 153 16 / 80%);
        color: #fff;
        padding: 5px 15px;
        display: inline-block;
        margin-bottom: 10px;
        position: absolute;
        bottom: 0;
        left: 15px;
        right: 15px;
        text-align: center;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 28px;
        font-family: 'Oakes Grotesk SemiBold';
    }
}

.milestone-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.milestone-content {
    padding: 20px;
    opacity: 1;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    background: #109910;
    scale: 0;
    transition: all .5s;
}

.milestone-content h3 {
    color: #0E0E0E;
    text-align: center;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: 26px;
    margin-bottom: 13px;
}

.milestone-content p {
    color: #ffffff;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin: 0;
}
}


.faq-section {
    padding: 4rem 2rem;
    background: linear-gradient(90deg, #103C14 0%, #2BA236 100%);
    .section-title{
        color: #FFF;
    }
    .small-line{
        background: #fff;
    }
}
  
  .faq-content {
    max-width: 1300px;
    margin: 0 auto;
    text-align: center;
  }
  
  
  .faq-content > p {
    max-width: 600px;
    margin: 0 auto 3rem;
    color: #666;
  }
  
  .faq-list {
    max-width: 80%;
    margin: 0 auto;
  }
  
  .faq-item {
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #109910;
    background: #FFF;
    box-shadow: 0px 14px 14px 0px rgba(0, 0, 0, 0.10);
  }
  
  .faq-question {
    width: 100%;
    padding: 18px 24px;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    color: #0E0E0E;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
    position: relative;
  }
  
  .faq-question .arrow {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 18px;
    top: 10px;
  }
  
  .faq-question .arrow::before {
    content: '+';
    position: absolute;
    right: 5px;
    top: 50%;
    width: 10px;
    height: 10px;
    transition: transform 0.3s ease;
    color: #000000;
  }
  
  .faq-item.active .arrow::before {
    content: '-';
  }
  
  .faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0 1.5rem;
    p{
        color: #2D2D2D;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 27px;
        text-align: left;
    }
    ol{
        padding-left: 20px;
        margin-bottom: 15px;
        li{
        color: #2D2D2D;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 27px;
        text-align: left;
        }
    }
  }
  
  .faq-item.active .faq-answer {
    max-height: 300px; /* Adjust this value based on your content */
    padding: 0 1.5rem 1.5rem;
  }
  
  .faq-question .arrow::before {
    transition: transform 0.3s ease;
  }
  
  @media (max-width: 768px) {
    .faq-question {
        font-size: 1rem;
        padding: 1.25rem;
    }
  }
/* Blog */
.blog {
    background: #F5FBFE;

.single-blog {
    border-radius: 26px;
    position: relative;
    overflow: hidden;
    height: 100%;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 2s;
    }
    .blog-content{
        position: absolute;
        inset: 0;
        padding: 15px;
        border-radius: 26px;
        background: linear-gradient(180deg, rgba(16, 60, 20, 0.00) 0%, rgba(44, 90, 49, 0.72) 100%);
        display: flex;
        flex-direction: column;
        justify-content: end;
    }
    &:hover{
        img{
            transform: scale(1.1);
        }
    }
    .date {
        background: rgb(16 153 16 / 80%);
        color: #FFF;
        text-align: center;
        font-size: 44px;
        font-style: normal;
        font-weight: 600;
        display: inline-block;
        line-height: .7;
        width: 104px;
        text-transform: uppercase;
        padding-top: 18px;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-family: 'Oakes Grotesk SemiBold';
        span{
            font-size: 30px;
        }
    }
}
}


.blog-content {
    h3{
        color: #FFF;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 34px;
        font-style: normal;
        font-weight: 600;
        line-height: 30px;
        margin-bottom: 15px;
    }
    p{
        color: #FFF;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 27px;
    }
}
.list-blog{
    border-radius: 26px;
    border: 1px solid #E6E6E6;
    background: #FFF;
    box-shadow: 0px 14px 16px 0px rgba(0, 0, 0, 0.15);
    padding: 8px;
    margin-bottom: 35px;
    &:last-child{
        margin-bottom: 0;
    }
    &:hover{
        img{
            transform: scale(1.05);
        }
        h3{
            color: #109910;
        }
    }
    .date{
        color: #FFF;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 28px;
        background: rgb(16 153 16 / 80%);
        padding: 4px 4px 0px 4px;
        width: auto;
        display: inline-block;
        margin-bottom: 14px;
    }
    h3{
        color: #0E0E0E;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 30px;
    }
    .blog-content {
        padding: 15px 0;
        display: block;
    }
    p{
        color: #2D2D2D;
        margin-bottom: 0;
    }
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 26px;
    }
}

.get-in-touch{
    background: #F9F9F9;
    position: relative;
    .img{
        position: absolute;
        left: 0;
        height: 100%;
        width: 50%;
        object-fit: cover;
    }
}

.contact-box {
    .col-lg-5{
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 6px;
        }
    }
    .form-control{
        padding: 22px 15px;
        border-radius: 4px;
        border: 1px solid #7B7B7B;
        &::placeholder{
            color: #000;
        }
    }

}
.form-area{
    padding: 64px 15px;
}

/******************************/

footer {
    background: #23212C;
    width: 100%;
    padding-top: 55px;

}

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

footer p,footer p a {
    color: #B6B6B6;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 30px; /* 166.667% */
}

.footer-title {
    color: #FFF;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;
}


.footer-title:after {
    content: '';
    width: 44px;
    height: 2px;
    background-color: #80BE7C;
    display: inherit;
    margin-top: 5px;
    margin-bottom: 14px;
}
footer ul{
    padding-left: 0px;
}
footer ul li{
    list-style: none;
    color: #fff;
}
footer ul li a {
    color: #B6B6B6;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
}

footer ul li a:hover,
.contact-info a {
    color: #80BE7C;
}
.footer-social {
    display: flex;
    gap: 6px;
    margin-top: 30px;
}
.footer-social a {
    width: 46px;
    height: 46px;
    stroke-width: 1px;
    border: 1px solid #ECECEC;
    display: flex;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

.footer-social a:hover {
    transform: scale(1.1);
    background: #80BE7C;
    border-color: #80BE7C;
}

.copyright {
    color: #fff;
    padding: 20px 0;
    text-align: center;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-top: 1px solid #ffffff;
    margin-top: 40px;
}
.copyright a {
    color: #F5990F;
    text-decoration: underline;
}

/*******************************
  Inner Page
********************************/
.inner-banner{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 230px 0;
    text-align: center;
    z-index: 1;
    &:before{
        content: '';
        position: absolute;
        inset: 0;	
        /* background: linear-gradient(270deg, rgba(0, 0, 0, 0.65) 0%, rgba(13, 13, 13, 0.00) 100%); */
        background: linear-gradient(0deg, rgba(14, 14, 14, 0.13) 0%, rgba(0, 0, 0, 0.44) 100%);
        z-index: -1;
    }
    .banner-img{
        position: absolute;
        bottom: -10px;
        left: 0;
    }
    .badge{
        border-radius: 90px;
        background: #109910;
        color: #FFF;
        color: #FFF;
        text-align: center;
        font-family: 'Helvetica';
        font-size: 28px;
        font-style: normal;
        font-weight: 400;
        line-height: 30px;
        text-transform: uppercase;
        padding: 8px 29px;
        display: inline-block;
        margin-bottom: 4px;
    }
    h1{
        color: #FFF;
        font-family: 'Helvetica';
        font-size: 52px;
        font-style: normal;
        font-weight: 400;
        line-height: 62px;
        text-transform: uppercase;
        span{
            color: #F6BE3B;
            font-family: 'Helvetica Bold';
            font-size: 134px;
            font-style: normal;
            font-weight: 700;
            line-height: 94%;
            text-transform: uppercase;
        }
    }
    h2{
        color: #FFF;
        font-family: 'Oakes Grotesk Bold';
        font-size: 37px;
        font-style: normal;
        font-weight: 700;
        line-height: 180%;
        span{
            font-size: 43px;
        }
    }
    .btn-group{
        position: relative;
        justify-content: center;
        img{
            position: absolute;
            right: 25px;
            bottom: -30px;
        }
    }
}
.webiner-timer {

    padding: 35px 0;
    .section-title{
        color: #fff;
        margin-bottom: 40px;
    }
    .btn-group{
        position: relative;
        display: inline-block;
        margin-bottom: -30px;
        transform: translateY(24px);
        margin-top: -24px;
        img{
            position: absolute;
            right: -115px;
            width: 130px;
            top: -49px;
        }
    }
}

.timer-wrapper {
    text-align: center;
    background-image: url(../img/timer-bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 1;
    padding: 10px 50px;
    &::after{
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgb(14 14 14 / 86%) 0%, rgb(28 54 30 / 90%) 100%);
        z-index: -1;
    }
    h3{
        color: #FFF;
        text-align: center;
        font-family: 'Helvetica Bold';
        font-size: 28px;
        font-style: normal;
        font-weight: 700;
        line-height: 30px;
        text-transform: uppercase;
    }
}

.webinar-info {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px double #109910;
}

.info-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    color: #FFF;
    font-family: 'Oakes Grotesk Bold';
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
}

.countdown-timer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 30px 0;
}

.timer-block {
    min-width: 100px;
}

.time {
    display: flex;
    justify-content: center;
    gap: 13px;
}

.digit {
    background: #fff;
    padding: 10px;
    border-radius: 6px;
    width: 89px;
    height: 96px;
    color: #0F0F0F;
    font-family: 'Oakes Grotesk Bold';
    font-size: 50px;
    font-style: normal;
    font-weight: 700;
    line-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.timer-separator {
    font-size: 48px;
    font-weight: 700;
    color: #ffffff;
    margin-top: -38px;
}

.label {
    display: block;
    margin-top: 14px;
    color: #FFF;
    text-align: center;
    font-family: 'Helvetica';
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    text-transform: uppercase;
}

.register-btn {
    margin-top: 40px;
}
.feedback {
    background: #F3F3F3;
    padding: 16px;
    position: relative;
    padding-bottom: 60px;
}
.testimonial-item {
  margin-bottom: 15px;
  .user-info {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.user-img {
    width: 74px;
    height: 74px;
    border-radius: 50%;
    overflow: hidden;
}

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


.user-details h4 {
    font-size: 18px;
    margin-bottom: 5px;
    color: #333;
}

.rating {
    img{
        width: auto;
        height: auto;
        margin-left: 0;
    }
}

.review-text {
    font-size: 16px;
    line-height: 1.6;
    color: #666;
    margin: 0;
}

.slider-nav {
    position: absolute;
    width: 100%;
    bottom: 15px;
    display: flex;
    gap: 20px;
    justify-content: center;
    left: 0;
}

.slider-nav button {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #fff;
    border: none;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    cursor: pointer;
    transition: all 0.3s ease;
    &::before{
        color: #000;
    }
    &.prev-btn{
        transform: rotate(180deg);
    }
}

.slider-nav button:hover,.slider-nav button:focus {
    background: #80BE7C;
    color: #fff;
    &::before{
        color: #fff;
    }
}
.webiner-need-help {
    background: linear-gradient(180deg, #109910 0%, #053305 100%);
    position: relative;
    color: #fff;
    text-align: center;
    padding: 35px;
    margin-bottom: 24px;
    h3{
        color: #FFF;
text-align: center;
font-family: 'Helvetica Bold';
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: 30px; /* 107.143% */
text-transform: uppercase;
margin-bottom: 20px;
    }
    p{
        color: #fff;
    }
    .need-help{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}
.webiner-bg-content{
    background-image: url(../img/webiner-bg1.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 80px 0;
}
.webiner-bg-content-box {
    border-radius: 11px;
    background: #FFF;
    padding: 24px 17px;
    text-align: center;
    padding-bottom: 70px;
    position: relative;
    &::after{
        content: '';
        position: absolute;
        bottom: 1px;
        border-radius: 40px;
        background: #109910;
        height: 5px;
        width: 90%;
        left: 50%;
        transform: translateX(-50%);
    }
    .section-title{
        margin-bottom: 10px;
    }
    p{
        color: #2C2C2C;
        text-align: center;
        font-size: 24px;
        font-style: normal;
        font-weight: 400;
        line-height: 39px;
    }
}
.webinar-registration {
    background: #fff;
    .container{
        border-radius: 32px;
        background: #FFF;
        box-shadow: 0px 14px 34px 0px rgba(0, 0, 0, 0.15);
        padding: 38px;
    }
    .form-control{
        border-radius: 4px;
        border: 1px solid #DEDEDE;
        background: #FFF;
        color: #000000;
        font-size: 18px;
        line-height: 37px;
        height: 69px;
        &::placeholder{
            color: #8B8B8B;
        }
    }
    .btn-group {
        margin-top: 64px;
        position: relative;
    }
    .rarrow {
        position: absolute;
        top: -75px;
        margin-left: 28%;
        width: 170px;
    }
}

.registration-img {
    border-radius: 10px;
    overflow: hidden;
}

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

.registration-form {
    padding: 30px;
    background: #fff;
    border-radius: 10px;
    label{
        color: #000;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 22px;
        font-style: normal;
        font-weight: 600;
        line-height: 37px;
        display: block;
    }
    h4{
        color: #000;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 26px;
        font-style: normal;
        font-weight: 600;
        line-height: 37px;
        margin-bottom: 0px;
    }
    
.form-group {
    margin-bottom: 20px;
}
.btn-group {
    display: flex;
    gap: 15px;
    margin-top: 10px;
    .primary-btn:first-child{
        background: #109910;
        border: none;
        color: #fff;
    }
}
}

.attendee-count {
    margin-bottom: 20px;
}

.counter-input {
    display: inline-block;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #DEDEDE;
    background: #FFF;
    height: 69px;
    button,input{
        color: #000;
        font-family: 'Oakes Grotesk Bold';
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        text-transform: uppercase;
    }
}

.counter-input button {
    width: 45px;
    height: 100%;
    background: #fff;
    border-radius: 5px;
    cursor: pointer;
}

.counter-input input {
    width: 60px;
    height: 40px;
    text-align: center;
    border: 0;
}

.radio-group {
    display: flex;
    flex-direction: column;
    gap: 2px;
    label{
        color: #000;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 40px; 
        font-family: 'Oakes Grotesk Regular';
    }
}

.radio-item {
    display: flex;
    align-items: center;
    gap: 10px;
}
.feature-videos{
    text-align: center;
    background-image: url(../img/feature-video-bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    .video-container {
        border-radius: 15px;
        margin-bottom: 12px;
    }
}
.webiner-faq{
    background: #fff;
    .section-title{
        color: #1A1A1A;
    }
    .small-line {
        background: #109910;
    }
    .faq-answer {
        ul{
            padding-left: 20px;
        }
        li{
            list-style-type: disc;
            text-align: left;
            color: #2D2D2D;
            font-size: 18px;
            font-style: normal;
            font-weight: 400;
            line-height: 27px;
        }
    }
}
.newsletter {
    background: #F2F2F2 url(../img/subscribe-bg.webp);
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
    padding: 60px 0;
    position: relative;
    overflow: hidden;
}

.newsletter-content {
    padding-right: 50px;
}

.newsletter-content .section-title {
    margin-bottom: 30px;
}

.newsletter-form .form-group {
    margin-bottom: 25px;
    position: relative;
    img{
        position: absolute;
        left: 18px;
        top: 21px;
        filter: brightness(0) saturate(100%) invert(95%) sepia(0%) saturate(1106%) hue-rotate(173deg) brightness(75%) contrast(82%);
    }
}

.newsletter-form label {
    display: block;
    margin-bottom: 10px;
    color: #333;
}

.newsletter-form .form-control {
    height: 60px;
    padding: 0 20px;
    background: #fff;
    border-radius: 60px;
    border: 1px solid rgba(161, 161, 161, 0.70);
    padding-left: 42px;
    &::placeholder{
       color: #ADADAD;
    }
}

.newsletter-form .btn-group {
    display: flex;
    gap: 15px;
}

.newsletter-form .btn-group {
    justify-content: center;
    .primary-btn{
        padding-inline: 55px;
        border: 0;
        &:hover{
            background: #109910;
        }
    }
}

.dark-btn {
    background: #1a1a1a;
    color: #fff;
}


@media (max-width: 991px) {
    .newsletter-content {
        padding-right: 0;
        margin-bottom: 30px;
    }
}
.faq-banner{
    position: relative;
    padding: 0;
    .banner-faq{
        width: 100%;
        position: relative;
        margin-bottom: -6px;
        left: unset;
        z-index: -2;
    }
    .banner-heading{
        position: absolute;
        inset: 0;
        display: flex;
        align-items: end;
        padding-bottom: 124px;
    }
    h1{
        background: linear-gradient(90deg, rgba(16, 153, 16, 0.60) 0%, rgba(5, 51, 5, 0.00) 100%);
        color: #FFF;
        font-family: 'Helvetica Bold';
        font-size: 60px;
        font-style: normal;
        font-weight: 700;
        line-height: 110%;
        padding: 20px 134px 20px 300px;
        width: 60%;
        text-align: left;
    }
}
.video-box{
    position: relative;
    border-radius: 9px;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 9px;
    }
    a{
        position: absolute;
        inset: 0;
    };
}

.webinar-card {
    padding-top: 35px;
    padding-inline: 8px;
    background: rgba(244, 244, 244, 0.95) url(../img/faq-add-banner-bg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin-bottom: 30px;
}
.webinar-content{
    .btn-group{
        margin-bottom: 20px;
        position: relative;
        justify-content: center;
        img{
            position: absolute;
            bottom: 30px;
            right: 44px;
        }
   }
}
.webinar-content h2 {
    font-size: 48px;
    line-height: 1.2;
    margin-bottom: 13px;
    color: #161616;
    font-weight: 700;
    text-align: center;
    line-height: 115.217%;
}

.webinar-content .highlight {
    color: #109910;
    font-size: 70px;
    line-height: 100%;
    display: block;
}

.webinar-details {
    margin-bottom: 16px;
    padding-left: 43px;
}

.detail-item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 8px;
    color: #103C14;
    font-family: 'Oakes Grotesk Bold';
    font-size: 22px;
    font-style: normal;
    font-weight: 700;
    line-height: 42px;
    img{
        filter: brightness(0) saturate(100%) invert(16%) sepia(17%) saturate(2086%) hue-rotate(75deg) brightness(98%) contrast(94%);
    }
}

.detail-item img {
    width: 24px;
    height: 24px;
}

.contact-info {
    margin-top: 30px;
    display: flex;
    justify-content: space-between;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-direction: column;
}

.contact-item span {
    width: 27px;
    height: 27px;
    background-color: #103C14;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    
}

.contact-item a {
    color: #0F0F0F;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 17px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.contact-item a:hover {
    color: #27ae60;
}
.add-img{
    position: relative;
    text-align: center;
    overflow: hidden;
    z-index: 1;
    &:after{
        content: '';
        position: absolute;
        border-radius: 303px;
        background: #103C14;
        width: 303px;
        height: 303px;
        bottom: -40px;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
    }
    img{
        margin-bottom: -9px;
    }
}
@media (max-width: 768px) {
    .webinar-content h2 {
        font-size: 36px;
    }
    
    .webinar-content .highlight {
        font-size: 42px;
    }
}
.tab-faq {
    margin-top: 40px;
}

.tab-nav {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.tab-btn {
    padding: 24px 45px;
    background: #fff;
    cursor: pointer;
    transition: all 0.5s ease;
    border-radius: 50px;
    border: 1px solid #DDD;
    color: #0F0F0F;
    font-family: 'Oakes Grotesk SemiBold';
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 23px;
    text-align: center;
    &:hover{
        background: #dddddd6c;
    }
}

.tab-btn.active {
    color: #109910;
    border-color: #109910;
}

.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
    animation: fadeIn 0.5s ease;
}
.faq-rc{
    padding-top: 0;
    .btn-group {
        margin-top: 20px;
    }
}
.testimonials-review{
    padding-bottom: 130px;
    .user-info {
        border-top: 1px dotted #8B8B8B;
        padding-top: 10px;
    }
    .highlight{
        border-radius: 4px;
        background: #109910;
        padding: 6px 22px;
        color: #FFF;
        text-align: center;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 20px;
        font-style: normal;
        font-weight: 600;
        line-height: 27px;
        display: inline-block;
        margin-bottom: 15px;
    }
}
.review-btn {
    padding-top: 0;
    margin-top: -35px;
}
.video-testimonials{
    .video-container {
        border-radius: 19px;
        a {
            background-color: #00000000;
        }
    }
}
.timeline-container {
    margin-top: 50px;
    position: relative;
}

.timeline-years {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 40px;
    flex-wrap: wrap;
    padding-right: 120px;
}

.year-tab {
    color: #A4A4A4;
    font-size: 18px;
    font-style: normal;
    line-height: inherit;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    position: relative;
    &::after{
        content: '';
        position: absolute;
        width: 68%;
        height: 1px;
        background: #8B8B8B;
        bottom: -10px;
        visibility: hidden;
        scale: 0 0;
        transition: all 0.5s ease;
        transform-origin: left;
    }
    .big-date{
        color: #B8B8B8;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 88px;
        font-style: normal;
        font-weight: 600;
        line-height: 60px;
        visibility: hidden;
        position: absolute;
        right: 0;

    }
}

.year-tab.active {
    color: #000;
    .big-date{
        visibility: visible;
        animation: zoomIn 1s linear;
    }
   &::after{
        visibility: visible;
        scale: 1 1;
    }	
}

.milestone-areas {
    position: relative;
    min-height: 300px;
    .milestone-content {
        display: none;
        opacity: 0;
        transition: opacity 0.3s ease;
    }
    
    .milestone-content.active {
        display: block;
        opacity: 1;
    }
}

.milestone-box {
position: relative;
text-align: left;
}

.milestone-text {
    flex: 1;
}

.milestone-text h3 {
    color: #000000;
    margin-bottom: 15px;
    font-size: 22px;
}

.milestone-image {
    position: relative;
}

.milestone-image img {
    width: 100%;
    height: auto;
    border-radius: 13px;
    margin-bottom: 10px;
}
.years{
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #109910;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    box-shadow: 0px 0px 0px 5px rgba(16, 153, 16, 0.219);
    position: absolute;
    z-index: 1;
    left: -20px;
    top: -20px;
}
.title-md{
    color: #1A1A1A;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 42px;
}
.img-box{
    border-radius: 33px;
    overflow: hidden;
    height: 100%;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 33px;
    }
}
.sidebar-menu {
    background: #FFF;
    box-shadow: 0px 7px 14px 0px rgba(0, 0, 0, 0.15);
    margin-bottom: 30px;
    padding: 30px 20px;
    ul{
        li{
            border-bottom: 1px solid rgba(204, 204, 204, 0.29);
            padding-inline: 10px;
            transition: all 0.5s ease;
            &:last-child{
                border-bottom: 0;
            }
            a{
                color: #0F0F0F;
                font-family: 'Oakes Grotesk SemiBold';
                font-size: 24px;
                font-style: normal;
                font-weight: 500;
                line-height: 79px;
                display: flex;
                align-items: center;
                gap: 10px;
                position: relative;
                &::after{
                    content: '';
                    width: 11px;
                    height: 11px;
                    border-top: 1px solid;
                    border-left: 1px solid;
                    display: inline-block;
                    transform: rotate(135deg);
                    color: #383838;
                    position: absolute;
                    right: 0;
                }
            }
            &.active,&:hover{
                background: #F6BE3B;
            }
        }
    }
}
.why-choose-us {
    background: #F2F9F2;
}

.feature-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    transition: all 0.3s ease;
    height: 100%;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.feature-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.feature-card .icon {
    height: 62px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}


.feature-card:hover .icon img {
    transform: rotateY(180deg);
}

.feature-card h3 {
    color: #1A1A1A;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 14px;  
    margin-bottom: 10px;
    transition: all 0.3s ease;
}

.feature-card:hover h3 {
    color: #27ae60;
}

.feature-card p {
    color: #666;
    margin: 0;
    line-height: 1.6;
}

.services-video {
    background: #ffffff;
    .video-container {
        margin-bottom: 90px;
        width: 90%;
        margin-inline: auto;
        &:hover{
            a{
                img{
                    transform: scale(1.1);
                }
            }
        }
        a {
            background: transparent;
        }
    }
}
.contact-form-wrapper {
    border-radius: 26px;
    border: 1px solid #DEDEDE;
    background: #FFF;
    box-shadow: 0px 14px 14px 0px rgba(0, 0, 0, 0.11);
    padding: 30px;
    transition: all 0.5s linear;
    .title-md{
        margin-bottom: 40px;
    }
    h4{
        color: #0E0E0E;
        font-family: 'Oakes Grotesk SemiBold';
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px; 
    margin-bottom: 10px;
    }
    label{
    font-size: 18px;
    line-height: 38px;
    }
    .form-control{
        border-radius: 4px;
        border: 1px solid #DEDEDE;
        background: #FFF;
        height: 69px;
        &:focus{
            border-color: #109910;
        }
    }
}
.not-yet {
    opacity: 0;
    margin-top: 15px;
    max-height: 0;
    transition: all 0.5s linear;
    h4{
        font-style: italic;
    }
}

.not-yet.show {
    opacity: 1;
    max-height: 200px;
}

.card{
    border-radius: 19px;
border: 1px solid #E4E4E4;
background: #F9F9F9;
padding: 20px;
margin-bottom: 40px;
}
.property-sourcing {
    background-image: url(../img/sourcing-bg.webp);
    background-size: cover;
    background-position: center;
    padding: 145px 0;
}

.sourcing-content {
    padding-right: 50px;
}

.check-list {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.check-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    color: #0F0F0F;
    font-size: 18px;
    line-height: 1.5;
}

.check-list li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    width: 18px;
    height: 18px;
    background: url('../img/check-icon.webp') no-repeat center;
    background-size: contain;
}

.sourcing-image {
    border-radius: 20px;
    overflow: hidden;
}

.sourcing-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

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

.mortgage-section {
    background: #ffffff;
    position: relative;
    overflow: hidden;
}

.mortgage-slider {
    position: relative;
    height: 650px;
    overflow: hidden;
    margin-top: 60px;
}

.mortgage-slide {
    opacity: 1;
    transition: scale 0.5s linear;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    scale: 0.9;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 20px;
    }
    .mortgage-content{
        position: absolute;
        inset: 0;
        background: #00000075;
        bottom: 0;
        padding-left: 34px;
        padding-bottom: 70px;
        display: flex;
        flex-direction: column;
        gap: 9px;
        justify-content: end;
        padding-right: 20%;
        h2,p{
            color: #FFF;
        }
        .small-line{
            background: #FFF;
        }
    }
}

.mortgage-slide.active {
    position: relative;
    scale: 1;
}

.slider-controls {
    position: absolute;
    bottom: 30px;
    right: 30px;
    display: flex;
    gap: 15px;
}

.slider-controls button {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: #fff;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-controls button:hover {
    background: #F6BE3B;
}

.slider-controls button img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}
.purches-video{
    position: relative;
    z-index: 1;
    &::after{
        content: '';
        position: absolute;
        width: 100%;
        background-color: #EBEBEB;
        height: 45%;
        top: 0;
        z-index: -1;
    }
}
.mb-60{
    margin-bottom: 60px;
}
.refurb-content{
    position: relative;
    z-index: 1;
    padding-left: 60px;
    &::after{
        content: '';
        position: absolute;
        background-color: #F4F4F4;
        inset: 0;
        right: 16%;
        z-index: -1;
    }
}
.renovation-gallery {
    background: #FFF1F1;
}

.renovation-gallery-slider {
    margin: 0 -6px;
}

.gallery-item {
    margin: 0 6px;
}

.gallery-img {
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

.gallery-img img {
    width: 100%;
    height: 400px;
    object-fit: cover;
}

.gallery-img .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(16, 130, 18, 0.363);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.3s ease;
}

.gallery-img .overlay span {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    transform: translateY(20px);
    transition: all 0.3s ease;
}

.gallery-item:hover .gallery-img {
    transform: translateY(-10px);
}

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

.gallery-item:hover .overlay span {
    transform: translateY(0);
}
.marketing-features {
    margin-top: 30px;
}

.marketing-feature-card {
    border-radius: 10px;
    border: 1px solid #CDCDCD;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
    height: 100%;
}
.relative{
    position: relative;
}
.marketing-feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

.marketing-feature-card .icon {
    min-width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.marketing-feature-card p {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 0;
}
.marketing-img{
    position: absolute;
    top: 0;
    bottom: 0;
    width: 59%;
    border-radius: 0 33px 33px 0;
    left: -35%;
}
.marketing-content{
    padding-block: 70px;
}
.lpm-card{
    background: #F5F5F5;
    padding: 20px 30px;
    position: relative;
    margin-top: 80px;
    .lpm-img{
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: 40%;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center left;
        }
    }
}
.mt-70{
    margin-top: 70px;
}
.letting-features {
    background: #ffffff;
    padding-top: 10px;
    padding-bottom: 80px;
}

.letting-feature-card {
    background: #FFF;
    box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.15);
    padding: 22px 18px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 20px;
    transition: all 0.3s ease;
    height: 100%;
}

.letting-feature-card:hover {
    background-color: #109910;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    .icon{
        background: #F6BE3B;
        outline: 1px dashed #F6BE3B;
        outline-offset: 6px;
        img{
            filter: brightness(0) saturate(100%)
        }
    }
    h4{
        color: #fff;
    }
}

.letting-feature-card .icon {
    width: 91px;
    height: 91px;
    min-width: 91px;
    outline: 1px dashed #EAEAEA;
    outline-offset: 6px;
    background: #109910;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    transition: all .5s;
}


.letting-feature-card h4 {
    color: #0E0E0E;
    font-family: 'Oakes Grotesk SemiBold';
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 30px;
}
.gf{
    margin-top: 60px;
    margin-bottom: 70px;
    padding: 12px;
    border-radius: 22px;
    p{
        font-size: 17px;
    }
    .img-box,.img-box img{
        height: 100%;
        border-radius: 22px;
    }
}
.help-img{
    border-radius: 17px;
    overflow: hidden;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 17px;
    }
}
.fc-content{
    padding-block: 20px;
    .img-box{
        border-radius: 17px;
        overflow: hidden;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 17px;
        }
    }
}
.bookkeeping{
    position: relative;
    img{
        width: 100%;
        margin-bottom: -10px;
    }
    .container{
        position: absolute;
        inset: 0;
        z-index: 1;
        display: flex;
        align-items: center;
    }
}
.return-investment{
    position: relative;
    img{
        width: 50%;
        height: 100%;
        object-fit: cover; 
        margin-bottom: -7px;
    }
    .container{
        position: absolute;
        inset: 0;
        z-index: 1;
        display: flex;
        align-items: center;
    }
    .col-lg-6{
        margin-left: auto;
        padding-left: 4%;
    }
    &.left-content{
        text-align: right;
        img{
            margin-left: auto;
        }
        .col-lg-6{
            text-align: left;
            padding-left: 0;
            padding-right: 4%;
            margin-right: auto;
            margin-left: unset;
        }
    }
}
.roi-formula{
    border-radius: 30px;
    background: linear-gradient(90deg, #109910 0%, #053305 100%);
    box-shadow: 0px 14px 34px 0px rgba(0, 0, 0, 0.15);
    padding: 26px 65px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    .left{
        color: #FFF;
        font-family: 'Helvetica Bold';
        font-size: 68px;
        font-style: normal;
        font-weight: 700;
        line-height: 59px;
        display: flex;
        align-items: center;
        padding-top: 12px;
    }
    .right{
        text-align: center;
        color: #FFF;
        font-family: 'Helvetica Bold';
        font-size: 38px;
        font-style: normal;
        font-weight: 700;
        line-height: 59px;
        .border-bottom{
            display: block;
            border-bottom: 3px solid #fff;
            padding-bottom: 10px;
            margin-bottom: 10px;
        }
    }
}

.investor-types {
    margin-top: -55px;
    padding-top: 0;
    position: relative;
    z-index: 1;
}

.investor-card {
    padding: 40px 14px 17px 14px;
    text-align: center;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    border-radius: 10px;
    border: 1px solid #EDEDED;
    background: #FFF;
    box-shadow: 0px 14px 21px 0px rgba(0, 0, 0, 0.15);
}

.investor-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 30px rgba(0,0,0,0.1);
}

.investor-card h2 {
    color: #1A1A1A;
    font-size: 32px;
    margin-bottom: 15px;
}

.investor-card p {
    color: #666;
    margin-bottom: 30px;
    line-height: 1.6;
}

.investor-card .investor-img {
    margin-top: 35px;
}

.investor-card .investor-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.investor-card .primary-btn {
    background: #28A745;
    color: #fff;
    padding: 23px 64px;
    display: inline-block;
    transition: all 0.3s ease;
}

.investor-card .primary-btn:hover {
    background: #1e7e34;
}

.investor-card.existing .primary-btn {
    background: #F6BE3B;
}

.investor-card.existing .primary-btn:hover {
    background: #e5ad2a;
}
.contact-queries {
    background: #ffffff;
}

.query-card {
    background: #fff;
    padding: 28px 25px;
    border-radius: 15px;
    transition: all 0.3s ease;
    position: relative;
    border: 1px solid #F2F2F2;
    filter: drop-shadow(0px 14px 14px rgba(0, 0, 0, 0.15));
    display: flex;
    justify-content: space-between;
    gap: 30px;
}

.query-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.query-card h3 {
    color: #1A1A1A;
    font-size: 24px;
    margin-bottom: 20px;
}

.query-card .location {
    display: flex;
    gap: 15px;
    p{
        margin-bottom: 0;
    }
}

.query-card .location img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}
.title-sm{
    color: #1A1A1A;
    font-family: 'Helvetica Bold';
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 29px;
    margin-bottom: 20px;
}
.query-card .contact-info {
    display: flex;
    flex-direction: column;
    gap: 27px;
    margin-bottom: 0px;
}

.query-card .contact-info a {
    display: flex;
    align-items: center;
    gap: 15px;
    color: #222222;
    font-size: 17px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.query-card .contact-info a:hover {
    color: #28A745;
}

.query-card .contact-info img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.social-links {
    display: flex;
    gap: 19px;
    flex-direction: column;
}

.social-links .social-icon {
    width: 48px;
    height: 48px;
    background: #434343;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.social-links .social-icon:hover {
    background: #28A745;
}

.social-links .social-icon img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.queries-faq{
    margin-top: 60px;
    margin-bottom: 80px;
    .tab-nav {
        gap: 0px;
    }
    .tab-btn {
        padding: 10px 18px;
        border: 1px solid #dddddd00;
        color: #666;
        font-family: 'Oakes Grotesk SemiBold';
        font-size: 16px;
    }
    .tab-btn.active{
        border-color: #626262;
        color: #101010;
    }
    .tab-content.active{
        .query-card{
            animation: slideInUp 0.5s ease;
        }
    }
}
.blog-card {
    background: #fff;
    overflow: hidden;
    transition: all 0.3s ease;
    border-radius: 10px;
    .blog-content {
        padding: 20px;
    }
    
    .blog-content h3 {
        font-size: 20px;
        margin-bottom: 15px;
        color: #333;
        line-height: 1.4;
    }
    
    .blog-content p {
        color: #666;
        margin-bottom: 15px;
    }
}

.blog-card:hover {
    box-shadow: 0 19px 40px -15px rgba(0, 0, 0, 0.15);
    a{
        h3{
            color: #28A745;
        }
    }
}

.blog-img {
    position: relative;
    height: 250px;
    border-radius: 10px;
    overflow: hidden;
}

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

.date {
    padding: 5px 15px;
    font-size: 14px;
    color: #333;
    border-radius: 4px;
    border: 1px solid #E6E6E6;
    background: linear-gradient(90deg, #FDFDFD 0%, #F3F3F3 100%);
    display: inline-block;
}
.meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    font-size: 15px;
    color: #171717;
}


.read-more {
    color: #109910;
    text-decoration: none;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
}

.read-more img {
    width: 20px;
    transition: transform 0.3s ease;
}

.read-more:hover img {
    transform: translateX(5px);
}
.recent-posts {
    background: #fff;
    padding: 25px;
    border-radius: 10px;
    margin-bottom: 30px;
}

.recent-posts h3 {
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.post-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #eee;
    text-decoration: none;
    transition: all 0.3s ease;
}

.post-item:last-child {
    border-bottom: none;
}

.post-item:hover {
    transform: translateX(5px);
    h4{
        color: #108211;
    }
}

.post-img {
    flex: 0 0 80px;
    height: 80px;
}

.post-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.post-content h4 {
    font-size: 16px;
    color: #333;
    margin: 0;
    line-height: 1.4;
}

.sidebar-newsletter {
    border-radius: 29px;
    background: #F4F4F4;
    padding: 25px;
    text-align: center;
    margin-bottom: 30px;
}

.newsletter-icon {
    margin-bottom: 15px;
}

.newsletter-icon img {
    width: 60px;
}

.sidebar-newsletter h3 {
    font-size: 22px;
    margin-bottom: 20px;
    font-family: 'Oakes Grotesk SemiBold';
}

.sidebar-newsletter .form-control {
    margin-bottom: 15px;
    border-radius: 60px;
    background: #FFF;
    border: 0;
}

.sidebar-newsletter{
    .primary-btn {
        width: 100%;
        background-color: #109910;
        margin-bottom: 9px;
        font-size: 15px;
        padding-block: 15px;
        color: #ffffff;
        font-family: 'Oakes Grotesk Regular';
        font-weight: 400;
        &:hover {
            background-color: #F6BE3B;
            color: #000000;	
        }
    }
    .outline-btn {
        background: transparent;
        border: 1px solid #109910;
        color: #109910;
    }
}
.blog-webiner{
    border-radius: 29px;
    background: linear-gradient(180deg, #109910 0%, #053305 100%);
    h2,h2 .highlight,.detail-item{
        color: #fff;
    }
    .detail-item{
        img{
            filter: unset;
        }
    }
    .add-img {
        &:after {
            display: none;
        }
    }
}
.right-arrow{
    width: 7px;
    height: 7px;
    border-top: 1px solid;
    border-left: 1px solid;
    transform: rotate(135deg);
    margin-left: 10px;
  &:after{
    content: "";
    display: block;
    width: 1px;
    height: 16px;
    background-color: currentColor;
    transform: rotate(-45deg) translate(5.5px, 3px);
  }
}
.blog-details-nav{
    background: #108211;
    width: 100%;
    height: 65px;
}
.blog-details{
    .section-title{
        margin-bottom: 10px;
    }
    .meta{
        gap: 40px;
        justify-content: start;
        .admin{
            display: flex;
            align-items: center;
            gap: 5px;
        }
    }
    h2{
        margin-bottom: 7px;
    }
}
.blog-details-img {
    border-radius: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
.tags{
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
    border-top: 1px solid #000000;
    padding-top: 10px;
    a{
        color: #000;
        text-decoration: underline;
        &:hover{
            color: #108211;
        }
    }
}
.you-might-also-like{
    .row{
        border-bottom: 1px solid #82828245;
    }
}
.media-coverage-content{
    padding-bottom: 0;
    .card{
        margin-bottom: 0;
    }
}
.media-coverage-item{
    position: relative;
    border-radius: 21px;
    overflow: hidden;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        margin-bottom: -10px;
    }
    &::after{
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.66) 0%, rgba(30, 30, 30, 0.00) 100%);
    }
    .media-coverage-item-content{
        position: absolute;
        z-index: 1;
        position: absolute;
        bottom: 30px;
        left: 30px;
        right: 32%;
    }
    .btn-group{
        position: absolute;
        bottom: 30px;
        right: 30px;
    }
    .date{
        color: #FFF;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        text-transform: uppercase;
        padding: 0;
        background: transparent;
        border: 0;
        margin-bottom: 4px;
    }
    .card-title{
        color: #FFF;
    }
    p{
        color: #FFF;
        margin-bottom: 0;
    }
}
.media-coverage-slider{
    .slick-arrow{
        background: #1E1E1E;
        &:hover{
            background: #108211;
        }
    }
    .slick-slide{
        /* margin: 0 20px; */
        scale: 0.9;
        filter: grayscale(100%);
        transition: all .5s;
        .media-coverage-item-content,.btn-group{
            opacity: 0;
        }
        
    }
   .slick-active.slick-center{
        scale: 1;
        filter: unset;
        transition: all .5s;
       .media-coverage-item-content,.btn-group{
            opacity: 1;
        }	
       }
    }
.rwb{
    text-align: center;
    padding-block: 40px;
    .btn-group {
        position: relative;
        display: inline-block;
        margin-inline: auto;
        .rarrow {
            position: absolute;
            top: -75px;
            right: -37%;
            width: 170px;
        }
    }
}
.media-coverage-details{
    padding-bottom: 0;
    .sidebar-newsletter{
        margin-bottom: 0;
    }
}
.media-coverage-also-like{
    .blog-content {
        padding: 10px;
        p{
            margin-bottom: 5px;
            font-size: 15px;
            color: #171717;
        }
    }
}
.csr {
    position: relative;
    overflow: hidden;
    .circle-img-box {
        width: 600px;
        height: 600px;
        overflow: hidden;
        border-radius: 50%;
        margin-inline: auto;
        box-shadow: 0 20px 0 0 #EDEDED;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    .csr-circle{
        position: absolute;
        right: 0;
        top: -104px;
        width: 28%;
        z-index: -1;
    }
}
.meet-gurukul{
    padding-block: 150px;
    clip-path: polygon( 0% 0%,0% 0%,0.37% 0.24%,1.409% 0.89%,3.014% 1.845%,5.081% 2.999%,7.505% 4.245%,10.184% 5.479%,13.012% 6.595%,15.885% 7.487%,18.701% 8.05%,21.354% 8.178%,21.354% 8.178%,24.136% 7.868%,26.678% 7.274%,29.04% 6.465%,31.282% 5.512%,33.464% 4.485%,35.646% 3.454%,37.888% 2.489%,40.249% 1.661%,42.791% 1.04%,45.573% 0.696%,45.573% 0.696%,48.682% 0.705%,51.533% 1.088%,54.19% 1.763%,56.718% 2.649%,59.181% 3.665%,61.645% 4.732%,64.172% 5.768%,66.828% 6.693%,69.678% 7.426%,72.786% 7.886%,72.786% 7.886%,76.15% 7.902%,79.728% 7.44%,83.386% 6.612%,86.991% 5.531%,90.408% 4.308%,93.505% 3.056%,96.146% 1.887%,98.198% 0.914%,99.527% 0.247%,100% 0%,100% 100%,100% 100%,99.599% 99.711%,98.47% 98.931%,96.727% 97.793%,94.482% 96.43%,91.85% 94.974%,88.942% 93.559%,85.872% 92.315%,82.754% 91.377%,79.7% 90.877%,76.823% 90.946%,76.823% 90.946%,74.126% 91.505%,71.682% 92.313%,69.429% 93.301%,67.303% 94.404%,65.24% 95.553%,63.176% 96.682%,61.049% 97.724%,58.793% 98.612%,56.347% 99.278%,53.646% 99.656%,53.646% 99.656%,50.699% 99.671%,48.014% 99.307%,45.525% 98.639%,43.167% 97.743%,40.876% 96.695%,38.585% 95.57%,36.23% 94.445%,33.745% 93.395%,31.065% 92.495%,28.125% 91.822%,28.125% 91.822%,24.654% 91.588%,20.96% 91.94%,17.18% 92.747%,13.455% 93.876%,9.922% 95.195%,6.72% 96.572%,3.988% 97.873%,1.865% 98.966%,0.489% 99.719%,0% 100%,0% 0% );
    background: #FFFBF0;
    .img-box{
        border-radius: 40px;
        overflow: hidden;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    .primary-btn{
        background: #109910;
        color: #fff;
    }
}
.gurukul-school{
    .img-box{
        border-radius: 40px;
        overflow: hidden;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
}
.school-fasility-box{
    position: relative;
    padding: 66px 98px 86px 25px;
    border-radius: 20px;
    border: 1px solid #109910;
    background: #FFF;
    height: 100%;
    overflow: hidden;
    z-index: 1;
    &::after{
        content: '';
        position: absolute;
        height: 92.301px;
        background: #E4EFE4;
        bottom: 0;
        inset: 0;
        top: auto;
        clip-path: polygon(44.656% 64.013%, 44.656% 64.013%, 39.705% 48.476%, 34.871% 36.202%, 30.15% 27.136%, 25.538% 21.221%, 21.034% 18.404%, 16.633% 18.628%, 12.333% 21.839%, 8.129% 27.981%, 4.019% 36.999%, 0% 48.838%, 0.073% 80.227%, 0.073% 80.227%, 0.195% 84.951%, 0.409% 88.901%, 0.697% 92.14%, 1.043% 94.729%, 1.429% 96.727%, 1.838% 98.196%, 2.252% 99.197%, 2.655% 99.79%, 3.03% 100.038%, 3.358% 100%, 97.518% 100%, 97.518% 100%, 97.98% 99.013%, 98.385% 97.643%, 98.737% 95.969%, 99.037% 94.069%, 99.29% 92.024%, 99.497% 89.911%, 99.662% 87.81%, 99.787% 85.799%, 99.874% 83.958%, 99.927% 82.365%, 100% 4.735%, 100% 4.735%, 98.262% 1.307%, 96.631% 0.94%, 95.089% 3.116%, 93.623% 7.315%, 92.217% 13.022%, 90.855% 19.717%, 89.523% 26.883%, 88.204% 34.001%, 86.884% 40.555%, 85.547% 46.025%, 85.547% 46.025%, 82.239% 58.323%, 78.985% 68.283%, 75.7% 75.908%, 72.298% 81.199%, 68.694% 84.158%, 64.802% 84.785%, 60.538% 83.082%, 55.816% 79.052%, 50.55% 72.695%, 44.656% 64.013%);
        z-index: -1;
        transition: all .5s;
    }
    &::before{
        content: '';
        position: absolute;
        background: #109910;
        width: 190px;
        height: 176px;
        z-index: -1;
        border-radius: 50%;
        right: -48px;
        top: -48px;
        transition: all .5s;
    }
    .card-title,p{
        transition: all .5s;
        transition-delay: .2s;
    }
    &:hover{
        .card-title,p{
            color: #fff;
        }
        &::before{
            transform: scale(10);
            transition: all.5s;
        }
        &::after{
            background: #ffffffc0;
        }
        .icon{
            transform: scale(1.4) translate(0px, 10px);
        }
    }
    .icon{
        position: absolute;
        right: 20px;
        top: 15px;
        transition: all .5s;
    }
    p{
        margin: 0;
    }
}
.gurukul-stats {
    background: #ffffff;
    padding-bottom: 0;

.stats-box {
    background: #109910;
    padding: 40px;
    border-radius: 15px;
    color: #fff;
}

.stats-icon {
    text-align: center;
    padding-left: 100px;
    position: relative;
    text-align: left;
    .arrow{
        transform: rotateY(180deg);
        margin-top: -70px;
        margin-bottom: -74px;
    }
    p{
        color: #fff;
    }
}

.stats-icon .hat {
    width: 80px;
    height: 80px;
    object-fit: contain;
    position: absolute;
    left: 0;
}

.stats-icon h2 {
    font-size: 48px;
    margin: 0;
    font-weight: 700;
    line-height: normal;
}

.stats-icon p {
    margin: 0;
    font-size: 18px;
}

.stats-content {
    padding-left: 30px;
}

.stats-content h3 {
    font-size: 28px;
    margin-bottom: 20px;
    line-height: 1.4;
    font-family: 'Helvetica Bold';
}

.check-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.check-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    font-size: 18px;
    color: #FFEBEB;
}

.check-list li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    width: 18px;
    height: 18px;
    background: url('../img/check-icon.webp') no-repeat center;
    background-size: contain;
    filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(319deg) brightness(102%) contrast(101%);
}
}
.gurukul-gallery {
    background: #ffffff;
}

.gallery-slider {
    margin: 0 -15px;
}

.slide-item {
    padding: 0 15px;
}

.gallery-box {
    position: relative;
    display: block;
    border-radius: 10px;
    overflow: hidden;
}

.gallery-box img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.hover-effect {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(40, 167, 69, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.3s ease;
    color: #fff;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
}

.gallery-box:hover .hover-effect {
    opacity: 1;
}

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

.other-csr{
    .media-coverage-item {
        height: 100%;
    }
    .col-lg-5{
        .card-title{
            font-size: 18px;
            &:hover{
                color: #F6BE3B;
            }
        }
        .media-coverage-item {
            .media-coverage-item-content {
                right: 16%;
            }
        }
    }
}

.mission-vision {
    .img-box{
        position: relative;
        overflow: unset;
    }
    .logo-box{
        width: 143px;
        height: 143px;
        background-color: #109910;
        position: absolute;
        bottom: 0;
        left: -50px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        img{
            width: auto;
            height: auto;
            object-fit: contain;
        }
    }
}

.mission-box {
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.mission-item {
    padding: 30px;
    border-radius: 15px;
    display: flex;
    gap: 20px;
    transition: all 0.3s ease;
}

.mission-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.mission-item .icon {
    width: 80px;
    height: 80px;
    min-width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.mission-item .content h3 {
    color: #1A1A1A;
    font-family: 'Helvetica Bold';
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 10px;
}

.mission-item .content p {
    color: #2C2C2C;
    margin: 0;
}
.about-about {
    position: relative;
    overflow: unset;
}
.about-jurney-video{
    padding-bottom: 0;
    .video-container{
        margin-bottom: 0;
    }
}
.our-founders {
    .container{
        border-radius: 30px;
        background: #FFF9EB;
        padding: 40px 100px;
    }
}

.founder-box {
    border-radius: 30px;
    background: #E2E2E2;
    overflow: hidden;
    transition: all 0.3s ease;
    width: 398px;
    margin-inline: auto;
    position: relative;
}

.founder-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 16px rgb(0 0 0 / 14%);
}

.founder-img {
    position: relative;
    overflow: hidden;
    text-align: center;
}

.founder-img img {
    height: 388px;
    object-fit: contain;
    margin-bottom: -10px;
}

.founder-content {
    padding: 10px 25px;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.founder-content h3 {
    color: #FFF;
    font-family: 'Helvetica Bold';
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 0;
}

.founder-content p {
    color: #ffffff;
    margin: 0;
    font-size: 15px;
}
.founder-story {
    margin-top: 26px;
}
.founder-story p {
    margin-bottom: 15px;
    font-family: 'Oakes Grotesk SemiBold';
}

.founder-story p:last-child {
    margin-bottom: 0;
}
.our-growth{
    .feature-card{
        border-radius: 14px;
        border: 1px solid #E9E9E9;
        background: #FFF;
        box-shadow: 0px 14px 14px 0px rgba(0, 0, 0, 0.11);
        text-align: center;
        h3{
            color: #109910;
            font-family: 'Oakes Grotesk SemiBold';
            font-size: 30px;
            font-style: normal;
            font-weight: 600;
            line-height: 33px;
        }
        p{
            color: #000;
            text-align: center;
            font-family: 'Oakes Grotesk Bold';
            font-size: 25px;
            font-style: normal;
            font-weight: 700;
            line-height: 128%;
        }
    }
    .icon{
        height: 90px;
        img{
            width: auto;
            height: auto;
            object-fit: contain;
        }
    }
}
.why-join{
    border-radius: 30px;
    background: #F4F7FF;
}
.about-our-vision{
    .container {
        align-items: start;
        padding-top: 7%;
    }
}
.about-engaging{
    .container{
        padding: 50px 18px;
    }
}
.engaging-img {
    border-radius: 390px;
    overflow: hidden;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
.locations{
    padding-bottom: 80px;
.uk{
    border-radius: 30px;
    background: #F1FCF1;
    padding: 80px;
    text-align: center;
    img{
        width: 188px;
        height: 188px;
        border-radius: 50%;
        margin-bottom: 30px;
    }
    h3{
        color: #1A1A1A;
        font-family: 'Helvetica Bold';
    font-size: 58px;
    font-style: normal;
    font-weight: 700;
    line-height: 68px;
    }
}
.india{
background: #F4F7FF;
}   
}
/*************************************
    Responsive
*************************************/
@media (max-width: 1920px) {
}

@media (max-width: 1600px),
(max-width: 1536px) {
    .category-box p {
        font-size: 20px;
        line-height: 28px;
    }
    .category-box h3 {
        font-size: 30px;
        margin-bottom: 16px;
    }
    .title {
        font-size: 46px;
    }
    .operation-areas {
        .location-card h3 {
            font-size: 22px;
        }
    }
    .service-slider {
        padding-left: 7%;
    }
    
    .webiner {
        .left-img {
            width: 30%;
        }
        .content {
            padding-block: 45px;
            padding-left: 28%;
        }
    } 
    .webiner.right-img {
        .content {
            padding-right: 28%;
        }
    }
    .webiner {
        & .content {
            h2 {
                font-size: 36px;
            }
        }
    }
    .banner {
        .banner-img {
            bottom: -12px;
            right: 0%;
            z-index: -1;
            width: 45%;
        }
    }
    .inner-banner {
        .banner-img {
            width: 56%;
        }
    }
    .faq-banner {
        h1 {
            font-size: 45px;
            line-height: normal;
        }
    }
    .webinar-registration {
        .rarrow {
            margin-left: 33%;
        }
    }
    .service-item {
        .title {
            font-size: 36px;
        }
        & ul {
            li {
                font-size: 16px;
            }
        }
    }
}

@media (max-width: 1536px) {}

@media (max-width: 1440px) {}

@media (max-width: 1440px),
(max-width: 1366px) {
    
    .banner {
        h1 {
            font-size: 108px;
            line-height: 96px;
            span {
                font-size: 160px;
            }
        }
        h2 {
            font-size: 30px;
            line-height: 26px;
            span {
                font-size: 32px;
            }
        }
        .banner-img {
            width: 46%;
        }
    }
    .category-box p {
        font-size: 18px;
        line-height: 26px;
    }
    .category-box {
        padding: 30px 15px;
    }
    .category-box h3 {
        font-size: 26px;
        margin-bottom: 10px;
    }
    p {
        font-size: 16px;
    }
    .section-title {
        font-size: 46px;
    }
    .title {
        font-size: 36px;
    }
    .service-item {
        & ul {
            li {
                font-size: 15px;
            }
        }
    }
    .roi h2 {
        font-size: 54px;
        line-height: 54px;
    }
    .webiner {
        & .content {
            padding-block: 32px;
            h2 {
                font-size: 30px;
                span {
                    font-size: 36px;
                }
            }
        }
    }
    .primary-btn {
        font-size: 16px;
        padding: 20px 36px;
    }
    .invest {
        .item {
            width: 630px;
            height: 630px;
            p {
                font-size: 20px;
            }
        }
    }
    .project {
        h4 {
            font-size: 32px;
            span {
                font-size: 36px;
            }
        }
        h3 {
            font-size: 56px;
            margin-bottom: 25px;
            margin-top: 25px;
        }
    }
    .operation-areas {
        .location-card h3 {
            font-size: 18px;
            line-height: 22px;
        }
        .location-card .flag {
            width: 64px;
            height: 64px;
        }
        .location-card ul li {
            font-size: 15px;
            margin-bottom: 18px;
        }
        .location-card {
            padding: 12px;
            padding-left: 10px;
        }
    }
    .milestones {
        .milestone-content {
            padding: 10px;
        }
        .milestone-content h3 {
            font-size: 18px;
            line-height: 22px;
        }
        .milestone-content p {
            font-size: 14px;
            line-height: 22px;
        }
    }
    .faq-answer {
        p {
            font-size: 16px;
            line-height: 26px;
        }
        & ol {
            li {
                font-size: 16px;
                line-height: 26px;
            }
        }
    }
    .faq-question {
        width: 100%;
        padding: 18px 25px;
        font-size: 20px;
    }
    .blog-content {
        h3 {
            font-size: 28px;
        }
        p {
            font-size: 14px;
            line-height: 22px;
        }
    }
    .list-blog {
        h3 {
            font-size: 18px;
            line-height: 25px;
            margin-bottom: 6px;
        }
        .date {
            font-size: 16px;
            line-height: 22px;
            padding: 4px 4px 0px 4px;
            margin-bottom: 8px;
        }
    }
    .list-blog {
        .blog-content {
            padding: 4px 0;
            display: block;
        }
    }
    footer p, footer p a {
        font-size: 14px;
        line-height: 24px;
    }
    footer ul li a {
        font-size: 14px;
        line-height: 34px;
    }
    .footer-social a {
        width: 45px;
        height: 45px;
    }
    .popup .popup__content {
        width: 70%;
        .contact-box {
            .form-control {
                padding: 12px 15px;
                font-size: 14px;
            }
        }
    }
    .inner-banner {
        padding: 170px 0;
        h1 {
            font-size: 44px;
            padding: 20px 150px 20px 126px;
            width: 53%;
            span {
                font-size: 115px;
            }
        }
        h2 {
            font-size: 32px;
            line-height: 160%;
            span {
                font-size: 38px;
            }
        }
        & .btn-group {
            img {
                right: 0px;
                bottom: -42px;
            }
        }

    }
    .webiner-bg-content {
        padding: 45px 0;
    }
    .webiner-bg-content-box {
        padding-bottom: 40px;
        .section-title{
            font-size: 44px;
        }
        p {
            font-size: 20px;
            line-height: 30px;
        }
    }
    .webinar-registration {
        .form-control {
            font-size: 16px;
            height: 49px;
        }
    }
    .counter-input {
        height: 49px;
    }
    .registration-form {
        label {
            font-size: 16px;
            line-height: 33px;
        }
        h4 {
            font-size: 21px;
            line-height: 28px;
        }
        .rarrow {
            top: -81px;
            margin-left: 36%;
        }
    }
    .webiner-faq {
        & .faq-answer {
            li {
                font-size: 16px;
                line-height: 27px;
            }
        }
    }
    .faq-banner {
        position: relative;
        padding: 0;
    }
    .tab-btn {
        padding: 18px 40px;
        font-size: 16px;
    }
    .tab-content{
        .faq-question {
            font-size: 16px;
        }
    }
    .detail-item {
        margin-bottom: 8px;
        font-size: 19px;
        line-height: 42px;
    }
    .webinar-content {
        & .btn-group {
            img {
                bottom: 17px;
                right: 25px;
            }
        }
    }
    
    .banner {
        padding-top: 180px;
        h1 {
            font-size: 100px;
            line-height: 95px;
            padding-right: 50px;
            span {
                font-size: 148px;
                margin-bottom: 20px;
            }
        }
        &::after {
            width: 450px;
        }
    }
    .hero-banner {
        padding-top: 220px;
        padding-bottom: 180px;
        h1 {
            font-size: 60px;
            line-height: 60px;
            padding: 0;
            span {
                font-size: 100px;
                line-height: 105px;
            }
        }
    }
    .process {
        .card-title {
            font-size: 18px;
        }
        p {
            font-size: 14px;
        }
    }
    .service-item {
        height: 490px;
        img {
            height: 110px;
        }
    }
    .mb-30 {
        margin-bottom: 5px;
    }
    .letting-feature-card h4 {
        font-size: 20px;
        line-height: 24px;
    }
    .title-md {
        font-size: 32px;
    }
    .contact-form-wrapper {
        label {
            font-size: 16px;
            line-height: 38px;
        }
    }
    .contact-form-wrapper {
        h4 {
            font-size: 18px;
            line-height: 24px;
            margin-bottom: 10px;
        }
    }
    .gf {
        margin-bottom: 30px;
    }
    .roi-formula {
        .right {
            font-size: 30px;
        }
    }
    .webiner-banner{
        h1{
            padding: 0;
            width: 100%;
        }
    }
    .our-growth {
    & .feature-card {
        p {
            font-size: 20px;
        }
        h3 {
            font-size: 25px;
            line-height: 25px;
        }
    }
}
.mission-box {
    gap: 10px;
}
.mission-item {
    padding: 15px;
}
.gurukul-stats {
    .stats-box {
        padding: 30px;
    }
    .stats-content h3 {
        font-size: 24px;
    }
    .check-list li {
        font-size: 16px;
    }
}
.mb-60 {
    margin-bottom: 20px;
}
.blog-card {
    .blog-content h3 {
        font-size: 18px;
        margin-bottom: 10px;
    }
}
.social-links {
    gap: 6px;
}
}

@media (max-width: 1366px) {
    
}

@media (max-width: 1199.98px) {
    .banner {
        padding-top: 150px;
        padding-bottom: 50px;
        h1 {
            font-size: 50px;
            line-height: 50px;
            padding-right: 0;
            span {
                font-size: 84px;
            }
        }
        &::after {
            width: 400px;
        }
    }
    .title {
        font-size: 28px;
    }
    .service-item {
        background: url(../img/service-item-shape.svg) #fff;
        padding: 25px;
    }
    .roi h2 {
        font-size: 45px;
        line-height: 45px;
    }
    .roi h3 {
        font-size: 30px;
        line-height: 50px;
    }
    .roi h3 span {
        font-size: 36px;
    }
    .webiner {
        .left-img {
            width: 28%;
        }
        & .content {
            padding-block: 20px;
            h2 {
                font-size: 22px;
                line-height: 38px;
                span {
                    font-size: 30px;
                }
            }
        }
    }
    .invest {
        .item {
            width: 520px;
            height: 520px;
        }
    }
    .project {
        h3 {
            font-size: 48px;
            margin-bottom: 25px;
            margin-top: 25px;
        }
    }
    .popup .popup__content {
        width: 85%;
    }
    
}

@media (max-width: 991.98px) {
    .mobile{
        display: block;
    }
    .desktop{
        display: none;
    }
    .banner {
        padding-top: 150px;
        padding-bottom: 50px;
        h1 {
            font-size: 60px;
            line-height: 65px;
            padding-right: 50px;
            span {
                font-size: 84px;
            }
        }
        h2 {
            font-size: 25px;
            line-height: 18px;
            span {
                font-size: 26px;
            
        }
    }
}
.popup .popup__content {
    img {
        display: none;
    }
}
.call-email {
    .call-btn.primary-btn {
        width: 50px;
                height: 50px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: linear-gradient(180deg, #103C14 0%, #109910 100%);
                border-radius: 50%;
                padding: 0;
                img{
                    filter: brightness(0) saturate(100%) invert(100%) sepia(91%) saturate(38%) hue-rotate(254deg) brightness(110%) contrast(110%);
                }
            span{
                display: none;
            }
    }
}
.service-slider {
    .slick-arrow {
        width: 63px;
        height: 63px;
        &.slick-prev {
            right: 50%;
            left: auto;
        }
    }
}
    #menu {
        justify-content: space-between;
    }
    
    header{
        height: auto;
    }
    .search-icon {
        padding: 12px;
        margin-right: 100px;
    }
    .call-email {
        justify-content: center;
    }
    .hamburger {
        width: 55px;
        height: 48px;
        position: absolute;
        right: 15px;
        top: 10px;
        cursor: pointer;
        z-index: 12399994;
    }

    .hamburger {
        background: #2b9a1500;
        border-radius: 4px;
    }
    .hamburger:before {
        background: #F6BE3B;
    }
    .hamburger:after {
        border-top: 2px solid #F6BE3B;
        border-bottom: 2px solid #F6BE3B;
    }
    .hamburger.menu-opened:before {
        background: #F6BE3B;
    }
    .hamburger.menu-opened:after {
        background: #F6BE3B;
    }
    #menu .main-menu {
        top: 69px;
        padding-right: 0;
        display: block;
        background: linear-gradient(0deg, #103C14 0%, #109910 100%);
    }

    #menu>.main-menu>ul>li {
        border-bottom: 1px solid #dddddd3d;
        position: relative;
        display: block;
    }
    #menu > .main-menu > ul > li {
        &:first-child {
            a {
                padding-left: 22px;
            }
        }
    }
    #menu>.main-menu>ul>li>a,
    #menu ul ul li a {
        font-size: 16px;
        padding: 20px 22px;
    }
    .counter-box {
        text-align: left;
    }
    header .flex-box {
        margin-top: 20px;
    }

    #menu .submenu-button {
        height: 60px;
        width: 70px;
    }

    #menu .submenu-button:after {
        top: 20px;
        right: 30px;
    }

    #menu>.main-menu>ul>li.has-sub>a::before {
        display: none;
    }

    #menu .submenu-button.submenu-opened:after {
        transform: rotate(-135deg);
        top: 26px;
    }
    #menu .main-menu ul ul {
        background: #15771c;
    }
    .search .search-form {
        top: 59px;
        z-index: 9;
        .form-control{
            border: 0;
        }
        .close {
            top: -1px;
            height: 102%;
        }
    }
    .service-item {
        height: 544px;
    }
    .service-slider {
        padding-left: 5%;
    }
    .roi h2 {
        font-size: 32px;
        line-height: 32px;
    }
    .roi-content {
        padding-bottom: 50px;
        padding-top: 18px;
    }
    .roi h3 {
        font-size: 23px;
        line-height: 36px;
    }
    .roi h3 span {
        font-size: 28px;
    }
    .roi p {
        font-size: 30px;
        line-height: 34px;
    }
    .process {
        .connecttor-line {
            display: none;
        }
    }
    .webiner {
        & .content {
            padding-block: 10px;
            flex-direction: column;
            padding-left: 50%;
        }
        .left-img {
            width: 50%;
        }
    }
    .invest {
        .item {
            width: 359px;
            height: 100%;
            border-radius: 20px;
            padding: 7%;
        }
    }
    .mb-50 {
        margin-bottom: 15px;
    }
    .project {
        .btn-group {
            position: relative;
            margin-bottom: 30px;
        }
    }
    .webiner.right-img {
        .content {
            padding-right: 50%;
        }
    }
    .section-title {
        font-size: 38px;
    }
    .get-in-touch {
        .img {
            position: relative;
            width: 100%;
        }
        .form-area {
            padding: 30px 0px;
        }
    }
    .inner-banner {
        h1 {
            font-size: 32px;
            span {
                font-size: 83px;
            }
        }
        h2 {
            font-size: 24px;
            line-height: 160%;
            span {
                font-size: 28px;
            }
        }
        & .btn-group {
            img {
                right: -30px;
                bottom: -25px;
                width: 150px;
            }
        }
    }
    .timer-wrapper {
        padding: 10px 20px;
    }
    .info-item {
        font-size: 18px;
        line-height: 34px;
    }
    .digit {
        width: 89px;
        height: 70px;
        font-size: 32px;
        line-height: 30px;
    }
    .faq-banner {
        h1 {
            padding: 20px 100px 20px 33px;
            width: 62%;
        }
    }
    .hero-banner {
        padding-top: 150px;
        padding-bottom: 90px;
        h1 {
            font-size: 38px;
            line-height: 50px;
            padding-right: 0;
            span {
                font-size: 62px;
                line-height: 70px;
            }
        }
    }
    .call-btn{
        span{
            display: none;
        }
    }
    .timeline-years {
        padding-right: 0px;
    }
    .refurb-content {
        padding-left: 20px;
        padding-right: 20px;
        &::after {
            right: 0%;
        }
    }
    .services-video {
        .video-container {
            margin-bottom: 0;
        }
    }
    .marketing-content {
        padding-block: 12px;
    }
    .return-investment {
        .container {
            position: relative;
        }
        .col-lg-6 {
            margin-left: auto;
            padding-left: 0;
        }
        img {
            width: 100%;
            margin-bottom: 20px;
        }
    }
    .webiner-bg-content-box {
        .section-title {
            font-size: 36px;
        }
        p {
            font-size: 16px;
            line-height: 26px;
        }
    }
    .property-sourcing {
        padding: 70px 0;
    }
    .purches-video {
        &::after {
            height: 30%;
        }
    }
    .roi-formula {
        padding: 26px 40px;
        .left {
            font-size: 40px;
        }
        .right {
            font-size: 17px;
        }
    }
    .csr {
    .csr-circle {
        width: 18%;
    }
}
.mission-vision {
    .logo-box {
        left: -30px;
    }
}
.our-founders {
    .container {
        padding: 20px 30px;
    }
}
.founder-box {
    width: 100%;
}
.founder-img img {
    height: 340px;
}
.purches-video.about-jurney-video {
    &::after {
        height: 65%;
    }
}
.about-our-vision {
    .container {
        padding-top: 3%;
        position: relative;
    }
}
.mission-vision {
    .logo-box {
        left: -10px;
        width: 110px;
        height: 110px;
        padding: 18px;
    }
}
.mission-item .icon {
    width: 60px;
    height: 60px;
    min-width: 60px;
}
.mission-item {
    gap: 10px;
    padding: 15px 5px;
}
.mission-item .content h3 {
    font-size: 24px;
    line-height: 20px;
    margin-bottom: 6px;
}
.our-growth {
    & .feature-card {
        p {
            font-size: 18px;
        }
        h3 {
            font-size: 22px;
            line-height: 22px;
        }
    }
}
.engaging-img {
    border-radius: 20px;
    overflow: hidden;
}
.locations {
    .uk {
        padding: 30px;
        h3 {
            font-size: 40px;
            line-height: 40px;
        }
    }
}
.media-coverage-slider {
    .slick-slide.slick-active {
        scale: .9;
        filter: unset;
        transition: all .5s;
        .media-coverage-item-content, .btn-group {
            opacity: 1;
        }
    }
}
.media-coverage-item {
    .media-coverage-item-content {
        left: 20px;
        right: 35%;
    }
    .btn-group {
        right: 20px;
    }
}
}


@media (max-width: 575.98px) {
    .service-item {
        .title {
            font-size: 26px;
        }
        img {
            height: 97px;
        }
    }
    .banner {
        padding-block: 90px;
        padding-top: 80px;
        z-index: 1;
        h1 {
            font-size: 40px;
            line-height: 40px;
            padding-right: 94px;
            span {
                font-size: 60px;
                margin-bottom: 15px;
            }
        }
        &::after {
            width: 120px;
        }
        h2 {
            font-size: 19px;
            line-height: 11px;
            span {
                font-size: 20px;
                margin-top: 20px;
            }
        }
        & .banner-img {
            .circle {
                position: absolute;
                bottom: 34px;
                right: -18px;
                z-index: -1;
                transform: scale(1.1);
            }
        }
    }
    .category-box {
        padding: 20px 5px;
    }
    .category-box h3 {
        font-size: 18px;
        margin-bottom: 10px;
        line-height: 18px;
    }
    .category-box p {
        font-size: 14px;
        line-height: 22px;
        font-weight: normal;
        margin-bottom: 0;
    }
    .section-title {
        font-size: 22px;
        line-height: normal;
    }
    p {
        font-size: 14px;
    }
    .sec-gap,
    .sec-pad {
        padding: 30px 0;
    }
    #menu .main-menu {
        top: 53px;
    }
    .primary-btn {
        font-size: 14px;
        padding: 12px 24px;
    }
    .service-slider {
        padding-bottom: 60px;
        .slick-arrow {
            width: 45px;
            height: 45px;
            &.slick-prev {
                right: 55%;
                left: auto;
            }
        }
    }
    .title {
        font-size: 22px;
    }
    .service-item {
        background: url(../img/service-item-shape.svg);
        padding: 15px;
    }
    .service-item {
        height: 550px;
        & ul {
            li {
                padding-left: 24px;
                margin-bottom: 12px;
                &::before {
                    width: 16px;
                    background-size: 15px;
                }
            }
        }
    }
    .roi {
        .roi-img {
            position: absolute;
            right: 35px;
            bottom: -10px;
            width: 77%;
        }
    }
    .roi-content {
        padding-bottom: 260px;
        padding-top: 18px;
    }
    .service-item {
        filter: drop-shadow(0px 10px 15px rgba(0, 0, 0, 0.15));
        margin-block: 30px;
    }
    .service-slider{
        padding-left: 0;
        .slick-list{
            margin: 0;
        }
        .slick-slide{
            margin: 0 20px;
        }
    }
    .card-title {
        font-size: 20px;
    }
    .webiner {
        .left-img {
            width: 100%;
            position: relative;
            top: -4px;
            transform: unset;
        }
        & .content {
            padding-block: 10px;
            flex-direction: column;
            padding-left: 0%;
            text-align: center;
        }
    }
    .invest {
        .small-line {
            margin-bottom: 6px;
        }
        .item {
            width: 100%;
            height: 100%;
            border-radius: 20px;
            padding: 7%;
            p {
                font-size: 16px;
            }
        }
    }
    .project {
        h3 {
            font-size: 26px;
            margin-bottom: 13px;
            margin-top: 20px;
            line-height: normal;
        }
        h4 {
            font-size: 24px;
            span {
                font-size: 28px;
            }
        }
        .angel-arrow {
            top: -293%;
            left: 35%;
        }
    }
    .timeline-item {
        padding-left: 26px;
    }
    .project {
        .timeline-content h4 {
            font-size: 22px;
            line-height: 22px;
        }
        .timeline-content p {
            font-size: 16px;
        }
    }
    .webiner.right-img {
        .content {
            padding-right: 0%;
        }
    }
    .video-container {
        border-radius: 14px;
    }
    .faq-section {
        padding: 2rem 1rem;
    }
    .faq-list {
        max-width: 100%;
        margin: 0 auto;
    }
    .faq-question {
        width: 100%;
        padding: 12px 12px;
        font-size: 16px;
        line-height: 130%;
        padding-right: 30px;
    }
    .faq-item.active .faq-answer {
        max-height: 300px;
        padding: 0 12px;
    }
    .faq-answer {
        p {
            font-size: 14px;
            line-height: 22px;
        }
        & ol {
            li {
                font-size: 14px;
                line-height: 222px;
            }
        }
    }
    .faq-item {
        margin-bottom: 8px;
    }
    .faq-question .arrow {
        right: 6px;
    }
    .blog-content {
        h3 {
            font-size: 20px;
            margin-bottom: 2px;
            line-height: 24px;
        }
    }
    .single-blog {
        .date {
            font-size: 29px;
            width: 50px;
            padding-top: 12px;
            padding-bottom: 5px;
            margin-bottom: 8px;
            span {
                font-size: 20px;
            }
        }
    }
    .contact-box {
        .form-control {
            padding: 13px 10px;
            border-radius: 4px;
            font-size: 14px;
        }
    }
    .call-email {
        gap: 8px;
        .primary-btn {
            font-size: 14px;
            padding: 9px 10px;
            border-radius: 10px;
            width: 90px;
        }
    }
    .logo {
        width: 190px;
    }
    .popup .popup__content {
        .form-area {
            padding: 20px 12px;
        }
    }
    .inner-banner {
        padding: 90px 0;
        .banner-img {
            width: 36%;
        }
        .badge {
            font-size: 14px;
            padding: 1px 16px;
        }
        h1 {
            font-size: 24px;
            line-height: 36px;
            span {
                font-size: 60px;
            }
        }
        h2 {
            font-size: 18px;
            line-height: 160%;
            margin-bottom: 15px;
            span {
                font-size: 22px;
            }
        }
    }
    header {
        padding-inline: 10px;
    }
    .hamburger {
        right: 0px;
        top: 3px;
    }
    .search-icon {
        padding: 12px;
        margin-right: 60px;
    }
    .search .search-form {
        top: 54px;
        z-index: 9;
        width: 350px;
    }
    .webinar-info {
        gap: 8px 18px;
        margin-bottom: 16px;
        padding-bottom: 10px;
        flex-wrap: wrap;
    }
    .timer-block {
        min-width: 60px;
    }
    .time {
        gap: 5px;
    }
    .digit {
        width: 34px;
        height: 40px;
        font-size: 18px;
        line-height: 20px;
    }
    .label {
        margin-top: 2px;
        font-size: 14px;
        line-height: 30px;
    }
    .timer-separator {
        font-size: 28px;
        margin-top: -30px;
    }
    .timer-wrapper {
        h3 {
            font-size: 24px;
        }
    }
    .countdown-timer {
        margin: 15px 0;
    }
    .webiner-timer {
        .section-title {
            margin-bottom: 18px;
        }
        & .btn-group {
            img {
                position: absolute;
                right: -100px;
                width: 110px;
                top: -51px;
            }
        }
    }
    .webiner-bg-content-box {
        .section-title {
            font-size: 24px;
        }
        p {
            font-size: 16px;
            line-height: 26px;
        }
    }
    .webinar-registration {
        .container {
            padding: 10px;
        }
        .form-control {
            font-size: 14px;
            height: 45px;
        }
    }
    .registration-form {
        padding: 10px;
        h4 {
            font-size: 18px;
            line-height: 28px;
        }
        label {
            font-size: 14px;
            line-height: 20px;
        }

    }
    .counter-input {
        height: 45px;
    }
    .webinar-registration {
        .rarrow {
            display: none;
        }
    }
    .newsletter {
        background-position: left;
        background-size: cover;
        padding: 30px 0;
    }
    .inner-banner {
        &:before {
            background: linear-gradient(270deg, rgb(0 0 0 / 83%) 0%, rgb(13 13 13 / 54%) 100%);
        }
    }
    #menu .main-menu ul ul li.has-sub>a:after{
        display: none;
    }
    .tab-btn {
        padding: 12px 32px;
        font-size: 14px;
    }
    .tab-nav {
        gap: 8px;
        justify-content: center;
    }
    .faq-banner {
        position: relative;
        padding: 0;
        height: 180px;
        .banner-faq{
            height: 100%;
            object-fit: cover;
            object-position: center;;
        }
        .banner-heading {
            padding-bottom: 9px;
        }
        h1 {
            font-size: 22px;
            line-height: 26px;
            width: auto;
            padding-right: 40px;
            padding-block: 10px;
        }
    }
    .video-testimonials {
        padding-bottom: 0;
    }
    .hero-banner {
        padding-top: 80px;
        padding-bottom: 30px;
        &::before {
            background: linear-gradient(270deg, rgba(10, 10, 10, 0.04) 0%, rgb(0 0 0) 100%);
        }
        &::after {
            width: 260px;
        }
        .hero-content {
            width: 80%;
        }
        h1 {
            font-size: 28px;
            line-height: 40px;
            padding-right: 0;
            span {
                font-size: 44px;
                line-height: 50px;
            }
        }
    }
    .process {
        .card-title {
            min-height: auto;
        }
    }
    .years {
        left: -5px;
        top: -20px;
    }
    .year-tab{
        .big-date {
            font-size: 44px;
        }
    }
    .milestone-text h3 {
        margin-bottom: 10px;
        font-size: 18px;
    }
    .title-md {
        font-size: 20px;
        line-height: normal;
    }
    .small-line {
        display: inline-block;
        margin-block: 5px;
    }
    .card {
        padding: 10px;
        margin-bottom: 20px;
    }
    .sidebar-menu {
        & ul {
            & li {
                a {
                    font-size: 18px;
                    line-height: 62px;
                }
            }
        }
    }
    .mortgage-slider {
        height: 420px;
        margin-top: 20px;
    }
    .purches-video {
        &::after {
            height: 22%;
        }
    }
    .services-video {
        .video-container {
            margin-bottom: 20px;
            width: 100%;
            margin-inline: auto;
        }
    }
    .contact-form-wrapper {
        padding: 15px;
        h4 {
            font-size: 16px;
            line-height: 20px;
        }
        label {
            font-size: 12px;
            line-height: 30px;
        }
    }
    .contact-form-wrapper {
        .form-control {
            height: 44px;
            font-size: 14px;
        }
        form .primary-btn {
            padding: 14px 42px;
        }
    }
    .check-list li {
        padding-left: 22px;
        margin-bottom: 10px;
        font-size: 14px;
    }
    .check-list li:before {
        width: 14px;
        height: 13px;
    }
.mortgage-slide {
    .mortgage-content {
        bottom: 0;
        padding-left: 16px;
        padding-bottom: 10px;
        padding-right: 4%;
    }
}
.marketing-img {
    position: relative;
    width: 100%;
    left: 0%;
}
.mb-60 {
    margin-bottom: 15px;
}
.mb-30 {
    margin-bottom: 5px;
}
.mt-70 {
    margin-top: 20px;
}
.lpm-card {
    padding: 10px 10px;
    margin-top: 20px;
    .lpm-img {
        position: relative;
        width: 100%;
    }
}
.letting-feature-card h4 {
    font-size: 18px;
    line-height: 24px;
}
.gf {
    p {
        font-size: 14px;
    }
}
.roi-formula {
    padding: 10px 6px;
    border-radius: 12px;
    .left {
        font-size: 16px;
        padding-top: 3px;
        img{
            width: 30px;
        }
    }
    .right {
        font-size: 11px;
        line-height: 32px;
        .border-bottom {
            padding-bottom: 0px;
            margin-bottom: 0px;
        }
    }
}
.bookkeeping {
    .container {
        position: relative;
    }
    img {
        width: 100%;
        margin-bottom: 0px;
    }
}
.feature-card h3 {
    font-size: 18px;
}
.timeline-years {
    gap: 8px;
}
.year-tab {
    &::after {
        bottom: -2px;
    }
}
.media-coverage-slider{
    .slick-prev {
        left: -9px;
    }
   .slick-next {
        right: -9px;
    } 	
   }
   .media-coverage-item {
    .media-coverage-item-content {
        left: 20px;
        right: 20px;
        bottom: 55px;
    }
    .btn-group {
        right: unset;
        left: 20px;
        bottom: 10px;
    }
    .date {
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 0px;
    }
    .card-title {
        font-size: 18px;
        line-height: 24px;
    }
    .ghome-media-coverage{
        padding-bottom: 0;
    }
}
.blog-details {
    .meta {
        gap: 7px;
        justify-content: start;
        flex-wrap: wrap;
    }
}
.blog-details-img {
    border-radius: 10px;
    margin-bottom: 10px;
    overflow: hidden;
}
.rwb {
    & .btn-group {
        .rarrow {
           display: none;
        }
    }
}
.csr {
    .circle-img-box {
        width: 300px;
        height: 300px;
        box-shadow: 0 10px 0 0 #EDEDED;
    }
}
.meet-gurukul {
    padding-block: 90px;
}
.gurukul-stats {
    .stats-content {
        padding-left: 0;
    }
    .stats-content h3 {
        font-size: 18px;
    }
}
.other-csr {
    & .col-lg-5 {
        & .media-coverage-item {
            .media-coverage-item-content {
                right: 16%;
                bottom: 20px;
            }
        }
    }
}
.blog-details {
    h2 {
        margin-bottom: 7px;
        font-size: 20px;
    }
}
.tags {
    font-size: 14px;
}
.post-content h4 {
    font-size: 14px;
}
.query-card {
    padding: 15px 12px;
    gap: 18px;
}
.query-card .location {
    gap: 9px;
}
.query-card .contact-info {
    gap: 15px;
    margin-bottom: 0px;
    margin-top: 15px;
    font-size: 14px;
}
.query-card .contact-info a {
    gap: 9px;
    font-size: 14px;
}
.social-links .social-icon {
    width: 35px;
    height: 35px;
    padding: 8px;
}
.query-card h3 {
    font-size: 18px;
}
.queries-faq {
    .tab-btn {
        padding: 0px 6px;
        font-size: 13px;
        line-height: 19px;
        display: inline-block;
        padding-top: 4px;
        border-radius: 6px;
    }
}
}

.our-gallery{
    .gallery-box{
        overflow: hidden;
        aspect-ratio: 3 / 2.12;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
        }
    }
}
@media (max-width: 991.99px) {
    .container-fluid {
    padding: 0 15px;
}
}

.white-back {
  background: transparent; /* no background */
  padding: 0; /* remove padding */
  border-radius: 0;
  list-style-type: disc; /* keep bullet dots */
  list-style-position: inside; /* bullets inside text area */
  font-size: 16px;
  color: #fff; /* white text for dark background image */
  box-shadow: none; /* no shadow */
  margin: 10px 0;
}

.white-back li {
  margin-bottom: 6px;
}

.white-back li:last-child {
  margin-bottom: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .white-back {
    font-size: 15px;
  }
}

@media (max-width: 480px) {
  .white-back {
    font-size: 14px;
  }
}