@use "sass:math";

:root {
    --theme-color: #BF930F;
    --title-color: #fff;
    --body-color: #D8DBDC;
    --smoke-color: #F8F8F8;
    --smoke-color2: #ECF1FF;
    --black-color: #000000;
    --black-color2: #181A1E;
    --black-color3: #0F1013;
    --gray-color: #D8DBDC;
    --white-color: #ffffff;
    --body-bg: #0B0B0C;
    --light-color: #E1E4E5;
    --light-color2: #123641;
    --light-color3: #184040;
    --tertiary-color: #1C4C5A;
    --yellow-color: #E2B93B;
    --success-color: #27AE60;
    --error-color: #EB5757;
    --th-border-color: #fff;
    --title-font: "Noto Serif Display", serif;
    --body-font: "Plus Jakarta Sans", serif;
    --icon-font: "Font Awesome 6 Pro";
    --main-container: 1680px;
    --container-gutters: 24px;
    --section-space: 120px;
    --section-space-mobile: 80px;
    --section-title-space: 60px;
    --ripple-ani-duration: 5s;
    --transform: all ease 0.4s
}

html,
body {
    scroll-behavior: auto !important
}

body {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased
}

a:focus,
a:active {
    outline: none
}

img:not([draggable]) {
    max-width: 100%;
    height: auto
}

a {
    color: var(--theme-color);
    text-decoration: none;
    outline: 0;
    -webkit-transition: all ease 0.4s;
    transition: all ease 0.4s
}

a:hover {
    color: var(--title-color)
}

a:active,
a:focus,
a:hover,
a:visited {
    text-decoration: none;
    outline: 0
}

img {
    border: none;
    max-width: 100%
}

p {
    margin: 0 0 18px 0;
    color: rgb(204, 204, 204);
    line-height: 1.625
}

/* h3 a {
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    line-height: inherit
} */
/* 
h2,
h3,
h4 {
    text-transform: none;
    font-weight: 700;
    line-height: 1.4;
    margin: 0 0 15px 0
}

h2 {
    font-size: 40px;
    line-height: 1.5
} */

/* h3 {
    font-size: 36px;
    line-height: 1.278
}

h4 {
    font-size: 30px;
    line-height: 1.333
} */

@media (max-width: 1199px) {

    h2 {
        font-size: 36px;
        line-height: 1.3
    }

    h3 {
        font-size: 30px
    }

    h4 {
        font-size: 24px
    }
}

@media (max-width: 767px) {

    h2 {
        font-size: 34px;
        line-height: 1.3
    }

    h3 {
        font-size: 26px
    }

    h4 {
        font-size: 22px
    }
}

@media (max-width: 575px) {

    h2 {
        font-size: 28px
    }
}

@media (max-width: 1399px) {
    :root {
        --main-container: 1250px
    }
}

@media only screen and (min-width: 1300px) {

    .container {
        max-width: calc(var(--main-container) + var(--container-gutters)) !important;
        padding-left: calc(var(--container-gutters) / 2) !important;
        padding-right: calc(var(--container-gutters) / 2) !important;
    }
}

@media (min-width: 1300px) {
    .row {
        --bs-gutter-x: 24px
    }
}

.gx-0 {
    --bs-gutter-x: 0
}

.gy-40 {
    --bs-gutter-y: 40px
}

.swiper-fade .swiper-slide {
    -webkit-transition: 0.6s ease-in-out;
    transition: 0.6s ease-in-out;
}

.swiper-fade .swiper-slide.swiper-slide-active {
    opacity: 1 !important
}

.swiper-fade .swiper-slide-prev {
    opacity: 0
}

.swiper-fade:after {
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--title-color);
    z-index: 3;
    pointer-events: none
}

.swiper-fade.fade-ani:after {
    -webkit-animation: swiperFade 0.8s linear 0.2s forwards;
    animation: swiperFade 0.8s linear 0.2s forwards
}

@-webkit-keyframes swiperFade {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes swiperFade {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.swiper-pagination-bullets {
    position: relative;
    z-index: 3;
    text-align: end;
    line-height: 4px;
    height: 4px;
    margin-right: 30px;
}

@media (max-width: 1199px) {
    .swiper-pagination-bullets {
        margin: 25px 0 22px 0
    }
}

.about-section-page {
    padding-top: 80px;
    padding-bottom: 70px;
}

.swiper-pagination-bullets .swiper-pagination-bullet {
    display: inline-block;
    --swiper-pagination-bullet-size: 50px;
    height: 4px;
    --swiper-pagination-bullet-horizontal-gap: 6px;
    margin: 5px 7px;
    opacity: 1;
    background-color: var(--white-color);
    position: relative;
    border-radius: 0;
    cursor: pointer;
    -webkit-transform: skew(-30deg);
    -ms-transform: skew(-30deg);
    transform: skew(-30deg);
    color: transparent
}

.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--theme-color)
}

.swiper-pagination-bullets.style2 .swiper-pagination-bullet {
    --swiper-pagination-bullet-size: 8px;
    --swiper-pagination-bullet-horizontal-gap: 12px;
    margin-left: 20px;
    height: 8px;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    border-radius: 50%;
    background: var(--theme-color);
    position: relative;
    -webkit-transition: 0.4s;
    transition: 0.4s
}

.swiper-pagination-bullets.style2 .swiper-pagination-bullet:after {
    content: '';
    position: absolute;
    inset: -12px;
    border: 1px solid var(--white-color);
    border-radius: 50%;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}

.swiper-pagination-bullets.style2 .swiper-pagination-bullet.swiper-pagination-bullet-active {
    --swiper-pagination-bullet-size: 12px;
    height: 12px
}

.swiper-pagination-bullets.style2 .swiper-pagination-bullet.swiper-pagination-bullet-active:after {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}

:root {
    --input-height: 56px
}

.nice-select .list:hover .option:not(:hover) {
    background-color: transparent !important
}

.th-btn2 {
    position: relative;
    z-index: 2;
    overflow: hidden;
    vertical-align: middle;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border: none;
    text-transform: uppercase;
    text-align: center;
    background-color: var(--theme-color);
    color: var(--white-color);

    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    padding: 16px 30px;
    border-radius: 48px;
    -webkit-perspective: 320px;
    perspective: 320px;
    -webkit-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1)
}

.th-btn2:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 30px;
    height: 30px;
    background-color: var(--white-color);
    border-radius: 50%;
    opacity: 0;
    -webkit-transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
    z-index: -1
}

.th-btn2.th-icon:after {
    content: '';
    position: relative;
    -webkit-mask-image: url(../img/icon/arrow-right.svg);
    mask-image: url(../img/icon/arrow-right.svg);
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: auto;
    mask-size: auto;
    background-color: var(--white-color);
    width: 24px;
    height: 24px;
    display: block;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    margin-left: 8px
}

.th-btn2:hover {
    color: var(--theme-color)
}

.th-btn2:hover:before {
    width: 220px;
    height: 220px;
    opacity: 1
}

.th-btn2:hover.th-icon:after {
    background-color: var(--theme-color)
}

.play-btn {
    display: inline-block;
    position: relative;
    z-index: 1
}

.play-btn>i {
    display: inline-block;
    width: var(--icon-size, 56px);
    height: var(--icon-size, 56px);
    line-height: var(--icon-size, 56px);
    text-align: center;
    background-color: var(--white-color);
    color: var(--theme-color);
    font-size: var(--icon-font-size, 1.4em);
    border-radius: 50%;
    z-index: 1;
    -webkit-transition: all ease 0.4s;
    transition: all ease 0.4s
}

.play-btn:after,
.play-btn:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.17);
    z-index: -1;
    border-radius: 50%;
    -webkit-transition: all ease 0.4s;
    transition: all ease 0.4s
}

.play-btn:after {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.play-btn:hover:after,
.play-btn:hover::before,
.play-btn:hover i {
    background-color: var(--theme-color);
    color: var(--white-color)
}

.sec-title {
    /* margin-bottom: calc(var(--section-title-space) - 10px); */
    margin-top: -0.18em;
    font-weight: 500
}

.sub-title:has(img) {
    margin-top: 0
}

.sub-title2 {
    position: relative;
    font-family: var(--body-font);
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.2em;
    text-transform: capitalize;
    color: var(--theme-color);
    display: block;
    margin-bottom: 15px
}

.sub-title2.style1 {
    background: transparent;
    padding-left: 65px
}

@media (max-width: 575px) {
    .sub-title2.style1 {
        padding-left: 40px
    }
}

@media (max-width: 450px) {
    .sub-title2.style1 {
        padding-left: 0
    }
}

@media (max-width: 375px) {
    .sub-title2.style1:before {
        display: none
    }
}

.sub-title2.style1:after {
    display: none
}

.sub-title2::before,
.sub-title2:after {
    content: "";
    position: absolute;
    top: 48%;
    height: 1px;
    width: 48px;
    opacity: 1
}

@media (max-width: 575px) {

    .sub-title2::before,
    .sub-title2:after {
        width: 30px
    }
}

@media (max-width: 450px) {

    .sub-title2::before,
    .sub-title2:after {
        display: none
    }
}

.sub-title2::before {
    background-color: var(--theme-color);
    margin-left: -4rem
}

@media (max-width: 575px) {
    .sub-title2::before {
        margin-left: -2rem
    }
}

.sub-title2::after {
    background-color: var(--theme-color);
    margin-left: 10px
}

.box-title {
    font-size: 24px;
    line-height: 1.417;
    font-weight: 600;
    margin-top: -0.24em
}

.box-title a {
    color: var(--theme-color)
}

.sec-text {
    font-size: 18px;
    color: black;
    line-height: 32px
}

.title-area {
    margin-bottom: calc(var(--section-title-space) - 10px);
    position: relative;
    z-index: 1
}

.title-area .sec-title {
    margin-bottom: 8px;
    letter-spacing: 0.02em
}

@media (max-width: 1199px) {

    .title-area,
    .sec-title {
        --section-title-space: 60px
    }

    .title-area.mb-45 {
        margin-bottom: 36px
    }
}

@media (max-width: 991px) {

    .title-area,
    .sec-title {
        --section-title-space: 50px
    }

    .title-area.mb-45 {
        margin-bottom: 35px
    }
}

.multi-social a:has(.fa-facebook-f) {
    --theme-color: #3b5997
}

.multi-social a:has(.fa-twitter) {
    --theme-color: #54abf0
}

.multi-social a:has(.fa-pinterest-p) {
    --theme-color: #c8232c
}

.multi-social a:has(.fa-linkedin-in) {
    --theme-color: #0077b5
}

.multi-social a:has(.fa-vimeo-v) {
    --theme-color: #86c9ef
}

.multi-social a:has(.fa-youtube) {
    --theme-color: #ff0000
}

.multi-social a:has(.fa-instagram) {
    --theme-color: #d63084
}

.box-icon img {
    -webkit-transition: 0.4s ease-in-out;
    transition: 0.4s ease-in-out
}

.box-text {
    margin-bottom: -0.4em
}

.btn-group {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 32px
}

@media (max-width: 767px) {
    .btn-group {
        gap: 20px
    }
}

.play-btn:after,
.play-btn:before {
    -webkit-animation-duration: var(--ripple-ani-duration);
    animation-duration: var(--ripple-ani-duration);
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: ripple;
    animation-name: ripple
}

@-webkit-keyframes ripple {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }

    30% {
        opacity: 0.5
    }

    100% {
        -webkit-transform: scale(1.8);
        transform: scale(1.8);
        opacity: 0
    }
}

@keyframes ripple {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0
    }

    30% {
        opacity: 0.5
    }

    100% {
        -webkit-transform: scale(1.8);
        transform: scale(1.8);
        opacity: 0
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.wp-block-archives a:not(:hover) {
    color: inherit
}

blockquote:not(:has(>cite)) p:last-child,
.wp-block-quote:not(:has(>cite)) p:last-child {
    margin-bottom: -0.3em
}

blockquote p:has(cite),
.wp-block-quote p:has(cite) {
    padding-bottom: 10px
}

.th-comment-form:has(#wp-temp-form-div),
.th-comments-wrap:has(#wp-temp-form-div) {
    padding: 0;
    box-shadow: none;
    display: none
}

ul.comment-list:has(>.th-comment-item ~ .th-comment-item):first-child>.th-post-comment {
    padding-bottom: 30px;
    border-bottom: 1px solid var(--th-border-color)
}

.global-img {
    position: relative;
    min-width: 50%;
    overflow: hidden;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease
}

.global-img:after {
    content: "";
    position: absolute;
    width: 150%;
    height: 0%;
    left: 50%;
    top: 50%;
    background-color: rgba(255, 255, 255, 0.3);
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    -ms-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
    z-index: 1
}

.global-img img {
    width: 100%;
    object-fit: cover;
    -webkit-transition: 1.3s all ease;
    transition: 1.3s all ease
}

@media (max-width: 991px) {
    .global-img {
        margin-bottom: 30px
    }
}

.global-img:hover img {
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3)
}

.global-img:hover:after {
    height: 200%;
    -webkit-transition: all 600ms linear;
    transition: all 600ms linear;
    background-color: transparent
}

.discount-wrapp {
    position: relative;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    z-index: 2
}

.discount-wrapp .play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.discount-wrapp .play-btn:before,
.discount-wrapp .play-btn:after {
    display: none
}

.discount-wrapp .play-btn>i {
    --icon-size: 90px;
    font-size: 30px;
    background: rgba(255, 255, 255, 0.2);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-radius: 48px;
    color: var(--white-color)
}

.discount-wrapp .play-btn:hover>i {
    background-color: var(--theme-color);
    color: var(--white-color)
}

.discount-tag {
    display: inline-block;
    min-height: 190px;
    min-width: 190px;
    border-radius: 50%;
    z-index: 1;
    font-size: 13px;
    font-family: var(--body-font);
    font-weight: 500;
    color: var(--title-color);
    text-align: center;
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
    animation: spin 10s infinite alternate-reverse
}

.discount-tag span {
    --rotate-letter: 7.5deg;
    min-height: 90px;
    position: absolute;
    min-width: 90px;
    left: 25px;
    top: 0px;
    text-transform: uppercase;
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
    -webkit-transform: rotate(var(--rotate-letter));
    -ms-transform: rotate(var(--rotate-letter));
    transform: rotate(var(--rotate-letter))
}

.discount-tag span.char2 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 2));
    -ms-transform: rotate(calc(var(--rotate-letter) * 2));
    transform: rotate(calc(var(--rotate-letter) * 2))
}

.discount-tag span.char3 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 3));
    -ms-transform: rotate(calc(var(--rotate-letter) * 3));
    transform: rotate(calc(var(--rotate-letter) * 3))
}

.discount-tag span.char4 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 4));
    -ms-transform: rotate(calc(var(--rotate-letter) * 4));
    transform: rotate(calc(var(--rotate-letter) * 4))
}

.discount-tag span.char5 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 5));
    -ms-transform: rotate(calc(var(--rotate-letter) * 5));
    transform: rotate(calc(var(--rotate-letter) * 5))
}

.discount-tag span.char6 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 6));
    -ms-transform: rotate(calc(var(--rotate-letter) * 6));
    transform: rotate(calc(var(--rotate-letter) * 6))
}

.discount-tag span.char7 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 7));
    -ms-transform: rotate(calc(var(--rotate-letter) * 7));
    transform: rotate(calc(var(--rotate-letter) * 7))
}

.discount-tag span.char8 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 8));
    -ms-transform: rotate(calc(var(--rotate-letter) * 8));
    transform: rotate(calc(var(--rotate-letter) * 8))
}

.discount-tag span.char9 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 9));
    -ms-transform: rotate(calc(var(--rotate-letter) * 9));
    transform: rotate(calc(var(--rotate-letter) * 9))
}

.discount-tag span.char10 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 10));
    -ms-transform: rotate(calc(var(--rotate-letter) * 10));
    transform: rotate(calc(var(--rotate-letter) * 10))
}

.discount-tag span.char11 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 11));
    -ms-transform: rotate(calc(var(--rotate-letter) * 11));
    transform: rotate(calc(var(--rotate-letter) * 11))
}

.discount-tag span.char12 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 12));
    -ms-transform: rotate(calc(var(--rotate-letter) * 12));
    transform: rotate(calc(var(--rotate-letter) * 12))
}

.discount-tag span.char13 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 13));
    -ms-transform: rotate(calc(var(--rotate-letter) * 13));
    transform: rotate(calc(var(--rotate-letter) * 13))
}

.discount-tag span.char14 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 14));
    -ms-transform: rotate(calc(var(--rotate-letter) * 14));
    transform: rotate(calc(var(--rotate-letter) * 14))
}

.discount-tag span.char15 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 15));
    -ms-transform: rotate(calc(var(--rotate-letter) * 15));
    transform: rotate(calc(var(--rotate-letter) * 15))
}

.discount-tag span.char16 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 16));
    -ms-transform: rotate(calc(var(--rotate-letter) * 16));
    transform: rotate(calc(var(--rotate-letter) * 16))
}

.discount-tag span.char17 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 17));
    -ms-transform: rotate(calc(var(--rotate-letter) * 17));
    transform: rotate(calc(var(--rotate-letter) * 17))
}

.discount-tag span.char18 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 18));
    -ms-transform: rotate(calc(var(--rotate-letter) * 18));
    transform: rotate(calc(var(--rotate-letter) * 18))
}

.discount-tag span.char19 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 19));
    -ms-transform: rotate(calc(var(--rotate-letter) * 19));
    transform: rotate(calc(var(--rotate-letter) * 19))
}

.discount-tag span.char20 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 20));
    -ms-transform: rotate(calc(var(--rotate-letter) * 20));
    transform: rotate(calc(var(--rotate-letter) * 20))
}

.discount-tag span.char21 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 21));
    -ms-transform: rotate(calc(var(--rotate-letter) * 21));
    transform: rotate(calc(var(--rotate-letter) * 21))
}

.discount-tag span.char22 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 22));
    -ms-transform: rotate(calc(var(--rotate-letter) * 22));
    transform: rotate(calc(var(--rotate-letter) * 22))
}

.discount-tag span.char23 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 23));
    -ms-transform: rotate(calc(var(--rotate-letter) * 23));
    transform: rotate(calc(var(--rotate-letter) * 23))
}

.discount-tag span.char24 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 24));
    -ms-transform: rotate(calc(var(--rotate-letter) * 24));
    transform: rotate(calc(var(--rotate-letter) * 24))
}

.discount-tag span.char25 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 25));
    -ms-transform: rotate(calc(var(--rotate-letter) * 25));
    transform: rotate(calc(var(--rotate-letter) * 25))
}

.discount-tag span.char26 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 26));
    -ms-transform: rotate(calc(var(--rotate-letter) * 26));
    transform: rotate(calc(var(--rotate-letter) * 26))
}

.discount-tag span.char27 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 27));
    -ms-transform: rotate(calc(var(--rotate-letter) * 27));
    transform: rotate(calc(var(--rotate-letter) * 27))
}

.discount-tag span.char28 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 28));
    -ms-transform: rotate(calc(var(--rotate-letter) * 28));
    transform: rotate(calc(var(--rotate-letter) * 28))
}

.discount-tag span.char29 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 29));
    -ms-transform: rotate(calc(var(--rotate-letter) * 29));
    transform: rotate(calc(var(--rotate-letter) * 29))
}

.discount-tag span.char30 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 30));
    -ms-transform: rotate(calc(var(--rotate-letter) * 30));
    transform: rotate(calc(var(--rotate-letter) * 30))
}

.discount-tag span.char31 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 31));
    -ms-transform: rotate(calc(var(--rotate-letter) * 31));
    transform: rotate(calc(var(--rotate-letter) * 31))
}

.discount-tag span.char32 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 32));
    -ms-transform: rotate(calc(var(--rotate-letter) * 32));
    transform: rotate(calc(var(--rotate-letter) * 32))
}

.discount-tag span.char33 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 33));
    -ms-transform: rotate(calc(var(--rotate-letter) * 33));
    transform: rotate(calc(var(--rotate-letter) * 33))
}

.discount-tag span.char34 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 34));
    -ms-transform: rotate(calc(var(--rotate-letter) * 34));
    transform: rotate(calc(var(--rotate-letter) * 34))
}

.discount-tag span.char35 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 35));
    -ms-transform: rotate(calc(var(--rotate-letter) * 35));
    transform: rotate(calc(var(--rotate-letter) * 35))
}

.discount-tag span.char36 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 36));
    -ms-transform: rotate(calc(var(--rotate-letter) * 36));
    transform: rotate(calc(var(--rotate-letter) * 36))
}

.discount-tag span.char37 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 37));
    -ms-transform: rotate(calc(var(--rotate-letter) * 37));
    transform: rotate(calc(var(--rotate-letter) * 37))
}

.discount-tag span.char38 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 38));
    -ms-transform: rotate(calc(var(--rotate-letter) * 38));
    transform: rotate(calc(var(--rotate-letter) * 38))
}

.discount-tag span.char39 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 39));
    -ms-transform: rotate(calc(var(--rotate-letter) * 39));
    transform: rotate(calc(var(--rotate-letter) * 39))
}

.discount-tag span.char40 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 40));
    -ms-transform: rotate(calc(var(--rotate-letter) * 40));
    transform: rotate(calc(var(--rotate-letter) * 40))
}

.discount-tag span.char41 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 41));
    -ms-transform: rotate(calc(var(--rotate-letter) * 41));
    transform: rotate(calc(var(--rotate-letter) * 41))
}

.discount-tag span.char42 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 42));
    -ms-transform: rotate(calc(var(--rotate-letter) * 42));
    transform: rotate(calc(var(--rotate-letter) * 42))
}

.discount-tag span.char43 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 43));
    -ms-transform: rotate(calc(var(--rotate-letter) * 43));
    transform: rotate(calc(var(--rotate-letter) * 43))
}

.discount-tag span.char44 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 44));
    -ms-transform: rotate(calc(var(--rotate-letter) * 44));
    transform: rotate(calc(var(--rotate-letter) * 44))
}

.discount-tag span.char45 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 45));
    -ms-transform: rotate(calc(var(--rotate-letter) * 45));
    transform: rotate(calc(var(--rotate-letter) * 45))
}

.discount-tag span.char46 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 46));
    -ms-transform: rotate(calc(var(--rotate-letter) * 46));
    transform: rotate(calc(var(--rotate-letter) * 46))
}

.discount-tag span.char47 {
    -webkit-transform: rotate(calc(var(--rotate-letter) * 47));
    -ms-transform: rotate(calc(var(--rotate-letter) * 47));
    transform: rotate(calc(var(--rotate-letter) * 47))
}

.img-box7 .img1 img {
    width: 100%;
    height: 633px;
    object-fit: cover
}

@media (max-width: 1399px) {
    .img-box7 .img1 img {
        width: auto
    }
}

@media (max-width: 1399px) {
    .img-box7 .img1 {
        text-align: center
    }
}

@media (max-width: 991px) {
    .img-box7 .img1 img {
        height: auto
    }
}

.img-box7-2 {
    position: relative;
    overflow: hidden
}

.img-box7-2 .img1 {
    height: 100%
}

.img-box7-2 .img1 img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.img-box7-2 .about-counter-wrap {
    margin-bottom: 60px
}

@media (max-width: 991px) {
    .img-box7-2 .about-counter-wrap {
        margin-bottom: 80px
    }
}

.img-box7-2 .about-counter-wrap .box-number {
    color: rgb(0, 63, 0);
    font-size: 72px;
    font-weight: 700;
    line-height: 1.2222em;
    letter-spacing: 0.02em;
    margin-top: -0.25em;
    margin-bottom: 0
}

@media (max-width: 1500px) {
    .img-box7-2 .about-counter-wrap .box-number {
        font-size: 60px
    }
}

@media (max-width: 991px) {
    .img-box7-2 .about-counter-wrap .box-number {
        font-size: 48px
    }
}

.img-box7-2 .about-counter-wrap .box-text {
    font-size: 24px;
    color: black;
}

@media (max-width: 1500px) {
    .img-box7-2 .about-counter-wrap .box-text {
        font-size: 20px
    }
}

@media (max-width: 991px) {
    .img-box7-2 .about-counter-wrap .box-text {
        font-size: 18px
    }
}

.img-box7-2 .discount-wrapp {
    position: absolute;
    right: 30px;
    top: 158px
}

.img-box7-2 .discount-wrapp .discount-tag span {
    --rotate-letter: 7.5deg
}

@media (max-width: 1199px) {
    .img-box7-2 {
        margin-top: 40px
    }
}

@media (max-width: 991px) {
    .img-box7-2 {
        margin-top: 60px
    }

    .img-box7-2 .discount-wrapp {
        margin-top: -60px
    }
}

.about-wrap4-right {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.about-wrap4-right .about-wrap4-content {
    max-width: 852px
}

@media (max-width: 1500px) {
    .about-wrap4-right .about-wrap4-content {
        max-width: 820px
    }
}

@media (max-width: 1199px) {
    .about-wrap4-right .about-wrap4-content {
        max-width: none
    }
}

@media (max-width: 1199px) {
    .about-wrap4-right {
        display: block
    }
}

.about-author-wrap {
    text-align: center;
    margin-top: 53px
}

.about-author-wrap .thumb {
    display: inline-block;
    border-radius: 50%;
    height: 300px;
    width: 300px;
    margin-bottom: 18px
}

.about-author-wrap .thumb img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%
}

.about-author-wrap .about-author-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0
}

.about-author-wrap .about-author-desig {
    font-size: 18px;
    font-weight: 500;
    color: black;
    letter-spacing: 0.02em;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 16px
}

.about-author-wrap .about-author-desig:after,
.about-author-wrap .about-author-desig:before {
    content: '';
    position: relative;
    display: inline-block;
    width: 40px;
    height: 1px;
    background: #1C4C5A
}

.about-author-wrap .author-sign {
    margin-top: 24px
}

.about-wrap4 {
    margin-left: -120px;
    margin-right: -60px
}

.about-wrap4 .about-content-wrap {
    padding: 0 0 40px 50px
}

.about-wrap4 .about-content-wrap .title-area {
    max-width: 687px
}

@media (max-width: 1199px) {
    .about-wrap4 .about-content-wrap .title-area {
        max-width: none
    }
}

@media (min-width: 1922px) {
    .about-wrap4 {
        margin-left: 0;
        margin-right: 0
    }
}

@media (max-width: 1500px) {
    .about-wrap4 {
        margin-right: 0;
        margin-left: 0
    }
}

@media (max-width: 1399px) {
    .about-wrap4 .about-content-wrap {
        padding-left: 0
    }
}

.about-room-card {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    background: linear-gradient(135deg,
            #001400 0%,
            #004d00 35%,
            #003600 70%,
            #003800 100%);
    overflow: hidden
}

.about-room-card .box-img {
    width: 402px;
    -webkit-box-flex: 0;
    -webkit-flex: none;
    -ms-flex: none;
    flex: none
}

.about-room-card .box-img img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.about-room-card .box-content {
    padding: 40px;
}

@media (max-width: 991px) {
    .about-room-card .box-content {
        padding: 48px
    }
}

@media (max-width: 575px) {
    .about-room-card .box-content {
        padding: 30px
    }
}

.about-room-card .box-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--body-bg);
    margin-bottom: 24px
}

.about-room-card .box-icon i {
    font-size: 30px;
    color: #000000;
    display: block;
    line-height: 1;
}

.about-room-card .box-title {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin-bottom: 10px
}

@media (max-width: 375px) {
    .about-room-card .box-title {
        font-size: 20px
    }
}

.about-room-card .box-text {
    line-height: 1.75em;
    color: #d3d3d3;
}

@media (max-width: 991px) {
    .about-room-card {
        display: block
    }

    .about-room-card .box-img {
        width: 100%;
        margin-bottom: 0
    }
}

.about-room-slider .slider-pagination {
    position: absolute;
    bottom: 45px;
    left: -190px;
}

@media (max-width: 991px) {
    .about-room-slider .slider-pagination {
        left: 0;
        bottom: 0;
        position: relative;
        margin-top: 50px
    }
}

.box-img {
    overflow: hidden
}

.box-img img {
    width: 100%;
    -webkit-transition: 1.3s all ease;
    transition: 1.3s all ease
}

.mt-35 {
    margin-top: 35px
}

.mb-20 {
    margin-bottom: 20px
}

.mb-45 {
    margin-bottom: 45px
}

.space {
    padding-top: var(--section-space);
    padding-bottom: var(--section-space)
}

@media (max-width: 991px) {
    .space {
        padding-top: var(--section-space-mobile);
        padding-bottom: var(--section-space-mobile)
    }
}

.why-wrap1 {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    background-color: #002d00;
}

.why-wrap1 .why-img-box1 {
    width: 50%
}

.why-wrap1 .why-img-box1 img {
    height: 100%;
    width: 100%;
    object-fit: cover
}

@media (max-width: 1399px) {
    .why-wrap1 .why-img-box1 {
        width: auto;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

.why-wrap-content {
    background-color: #002d00;
}

.why-wrap1 .why-wrap-content {
    padding: 50px;
    width: 50%
}

@media (max-width: 1500px) {
    .why-wrap1 .why-wrap-content {
        padding: 50px 60px
    }
}

@media (max-width: 1399px) {
    .why-wrap1 .why-wrap-content {
        width: auto;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

@media (max-width: 991px) {
    .why-wrap1 .why-wrap-content {
        padding: 80px 60px
    }
}

@media (max-width: 575px) {
    .why-wrap1 .why-wrap-content {
        padding: 80px 30px
    }
}

.why-wrap1 .why-grid-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px
}

.why-wrap1 .why-grid-list li {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px
}

.why-wrap1 .why-grid-list .box-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #e1b700;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 0;
    -webkit-flex: none;
    -ms-flex: none;
    flex: none
}

.why-wrap1 .why-grid-list .box-icon img {
    -webkit-filter: brightness(99);
    filter: brightness(99)
}

.why-wrap1 .why-grid-list .box-text {
    font-size: 16px;
    font-weight: 500;
    color: var(--white-color)
}

@media (max-width: 767px) {
    .why-wrap1 .why-grid-list {
        grid-template-columns: repeat(1, 1fr)
    }
}

@media (max-width: 1299px) {
    .why-wrap1 {
        display: block
    }
}

.mt-60 {
    margin-top: 60px
}

.why-grid-list .box-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #D4AF37, #F7E7A1);
    color: #fff;
    font-size: 28px;

    transition: all .35s ease;
}

/* .why-grid-list li:hover .box-icon {
    transform: translateY(-6px) rotate(5deg);
    box-shadow: 0 15px 35px rgba(212, 175, 55, 0.45);
} */

.contact-details__right p{
    color: rgb(230, 230, 230);
}