.heroSection {
    position: relative;
    margin-top: -100dvh;
}
.heroSection .heroSwiper .swiper-pagination {
    bottom: 156px;
}
.heroSection .heroSwiper .swiper-pagination .swiper-pagination-bullet {
    width: 50px;
    height: 3px;
    border-radius: 9999px;
    background: #fff;
    opacity: 0.3;
}
.heroSection
    .heroSwiper
    .swiper-pagination
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
    opacity: 1;
}
.heroSection .heroSlide {
    position: relative;
}
.heroSection .heroSlide .slideBackground {
    position: relative;
    pointer-events: none;
}
.heroSection .heroSlide .slideBackground img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    aspect-ratio: 1920/1080;
}
.heroSection .heroSlide .slideBackground .backgroundOverlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 15, 159, 0.9),
        rgba(76, 189, 236, 0.7)
    );
    mix-blend-mode: multiply;
}
.heroSection .heroSlide .slideContainer {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
}
.heroSection .heroSlide .slideContainer .contianerContent {
    width: min(1140px, 100% - 80px);
    margin-inline: auto;
    text-align: center;
    margin-top: -24px;
    color: #fff;
}
.heroSection .heroSlide .slideContainer .contianerContent .contentTitle {
    font-size: 60px;
    font-weight: 400;
    margin-bottom: 12px;
}
.heroSection .heroSlide .slideContainer .contianerContent .contentDesc {
    font-size: 30px;
    font-weight: 300;
    line-height: 1.5;
    max-width: 1140px;
    margin-inline: auto;
    margin-bottom: 35px;
}
.heroSection .heroSlide .slideContainer .contianerContent .contentCta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
}
.heroSection
    .heroSlide
    .slideContainer
    .contianerContent
    .contentCta
    .ctaThumb {
    width: 261px;
    height: 60px;
    display: grid;
    place-items: center;
    color: #fff;
    border: 1px solid #fff;
    font-size: 20px;
    font-weight: 400;
    transition: all 0.3s ease;
}
.heroSection
    .heroSlide
    .slideContainer
    .contianerContent
    .contentCta
    .ctaThumb:hover {
    background: #fff;
    color: #000fa0;
    transform: translateY(-2px);
}
.heroSection .sectionFooter {
    position: absolute;
    inset: auto 0 0 0;
    display: flex;
    justify-content: center;
    z-index: 1;
}
.heroSection .sectionFooter .footerScroll {
    color: #fff;
    padding-block: 32px;
    text-align: center;
}
.heroSection .sectionFooter .footerScroll .scrollLabel {
    font-size: 2.5rem;
    font-weight: 300;
    margin-bottom: 8px;
    display: block;
}
.heroSection .sectionFooter .footerScroll svg {
    margin-inline: auto;
    width: 20px;
    height: 20px;
    animation: scrollHint 1.6s ease-in-out infinite;
    will-change: transform, opacity;
}

@keyframes scrollHint {
    0% {
        transform: translateY(0);
        opacity: 0.6;
    }
    40% {
        transform: translateY(6px);
        opacity: 1;
    }
    80% {
        transform: translateY(10px);
        opacity: 0.2;
    }
    100% {
        transform: translateY(0);
        opacity: 0.6;
    }
}
.main {
    padding-bottom: 84px;
}
.main .mainHubs {
    width: min(1140px, 100% - 48px);
    margin: 0 auto 92px;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    background: #fff;
}
.main .mainHubs .hubsContainer {
    display: grid;
    background: #c8c8c8;
    -moz-column-gap: 1px;
    column-gap: 1px;
    grid-template-columns: repeat(4, 1fr);
}
.main .mainHubs .hubsContainer.items-1 {
    grid-template-columns: 1fr;
}
.main .mainHubs .hubsContainer.items-2 {
    grid-template-columns: repeat(2, 1fr);
}
.main .mainHubs .hubsContainer.items-3 {
    grid-template-columns: repeat(3, 1fr);
}
.main .mainHubs .hubsContainer.items-4 {
    grid-template-columns: repeat(4, 1fr);
}
.main .mainHubs .hubsContainer.items-5 {
    grid-template-columns: repeat(6, 1fr);
}
.main .mainHubs .hubsContainer.items-5 .containerThumb {
    grid-column: span 2;
}
.main .mainHubs .hubsContainer.items-5 .containerThumb:last-child,
.main .mainHubs .hubsContainer.items-5 .containerThumb:nth-last-child(2) {
    grid-column: span 3;
}
.main .mainHubs .hubsContainer.items-6 {
    grid-template-columns: repeat(3, 1fr);
}
.main .mainHubs .hubsContainer.items-7 {
    grid-template-columns: repeat(12, 1fr);
}
.main .mainHubs .hubsContainer.items-7 .containerThumb {
    grid-column: span 3;
}
.main .mainHubs .hubsContainer.items-7 .containerThumb:last-child,
.main .mainHubs .hubsContainer.items-7 .containerThumb:nth-last-child(2),
.main .mainHubs .hubsContainer.items-7 .containerThumb:nth-last-child(3) {
    grid-column: span 4;
}
.main .mainHubs .hubsContainer.items-8 {
    grid-template-columns: repeat(4, 1fr);
}
.main .mainHubs .hubsContainer .containerThumb {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100px;
    display: grid;
    place-items: center;
    font-size: 1.125rem;
    font-weight: 300;
    text-align: center;
    color: inherit;
    background: #fff;
    border-bottom: 3px solid var(--item-color);
    transition: color 0.2s ease;
}
.main .mainHubs .hubsContainer .containerThumb span {
    position: relative;
    z-index: 2;
}
.main .mainHubs .hubsContainer .containerThumb::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--item-color);
    transform: scaleY(0);
    transform-origin: bottom center;
    transition: transform 0.2s ease;
    z-index: 1;
}
.main .mainHubs .hubsContainer .containerThumb:hover {
    color: #fff;
}
.main .mainHubs .hubsContainer .containerThumb:hover::before {
    transform: scaleY(1);
}
.main .mainSection:not(:last-child) {
    margin-bottom: 84px;
}
.main .mainSection.countdownSection {
    padding-bottom: 64px;
    background: linear-gradient(180deg, #f7f7f7 0%, #e6e6e6 100%);
}
.main .mainSection .sectionContainer {
    width: min(1140px, 100% - 80px);
    margin-inline: auto;
}
.main .mainSection .sectionContainer .containerHeader {
    margin-bottom: 24px;
}
.main .mainSection .sectionContainer .containerHeader .headerTitle {
    font-size: 40px;
    font-weight: 500;
    text-align: center;
}
.main .mainSection .sectionContainer .containerHeader .headerTitle::before {
    content: "";
    display: block;
    width: 2px;
    height: 50px;
    background: #4cbdec;
    margin: 0 auto 12px;
}
.main .mainSection .sectionContainer .containerHeader .headerSubtitle {
    font-size: 1.25rem;
    font-weight: 300;
    text-align: center;
    margin-top: 14px;
}
.main .mainSection .sectionContainer .containerMain .mainContent p {
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
    line-height: 1.75;
}
.main .mainSection .sectionContainer .containerMain .mainAccordions {
    margin: 42px auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb {
    border-bottom: 1px solid #969696;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb:first-child {
    border-top: 1px solid #969696;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb.active
    .thumbHeader
    .headerToggler::after {
    transform: rotate(180deg);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb.active
    .thumbHeader
    .headerToggler::before {
    transform: rotate(90deg);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb.active
    .thumbMain {
    grid-template-rows: 1fr;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader {
    padding-block: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    h5 {
    width: 100%;
    font-size: 25px;
    font-weight: 500;
    text-align: right;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    .headerToggler {
    position: relative;
    width: 32px;
    height: 32px;
    margin-top: 0;
    flex-shrink: 0;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    .headerToggler::after,
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    .headerToggler::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    display: block;
    background: #4cbdec;
    border-radius: 9999px;
    transition: all 0.4s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    .headerToggler::after {
    width: 32px;
    height: 2px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbHeader
    .headerToggler::before {
    width: 2px;
    height: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain {
    display: grid;
    overflow: hidden;
    grid-template-rows: 0fr;
    transition: all 0.25s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer {
    overflow: hidden;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer
    .containerContent {
    overflow: hidden;
    font-size: 20px;
    font-weight: 300;
    padding-bottom: 36px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer
    .containerContent
    * {
    width: 100%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer
    .containerContent
    .contentOptions {
    gap: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block: 50px 16px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer
    .containerContent
    .contentOptions
    .optionLink {
    width: 261px;
    height: 60px;
    display: grid;
    font-size: 18px;
    font-weight: 400;
    background: #fff;
    color: #000f9f;
    place-items: center;
    transition: all 0.3s ease;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainAccordions
    .accordionThumb
    .thumbMain
    .mainContainer
    .containerContent
    .contentOptions
    .optionLink:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainWhy {
    gap: 32px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: row-reverse;
}
.main .mainSection .sectionContainer .containerMain .mainWhy.fifthColumn {
    gap: 20px;
}
.main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb {
    width: calc((100% - 96px) / 4);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy.fifthColumn
    .whyThumb {
    width: calc((100% - 100px) / 5);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy
    .whyThumb
    .thumbHeader {
    color: #c8c8c8;
    text-align: center;
    font-size: 5rem;
    font-weight: 300;
    margin-bottom: 10px;
    font-family: "ModamB", sans-serif;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy.fifthColumn
    .whyThumb
    .thumbHeader {
    font-size: 130px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy
    .whyThumb
    .thumbMain {
    text-align: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy
    .whyThumb
    .thumbMain
    .mainTitle {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 14px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy.fifthColumn
    .whyThumb
    .thumbMain
    .mainTitle {
    font-size: 20px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy
    .whyThumb
    .thumbMain
    .mainDesc {
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWhy.fifthColumn
    .whyThumb
    .thumbMain
    .mainDesc {
    font-size: 20px;
}
.main .mainSection .sectionContainer .containerMain .mainServices {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .serviceCategoryPanel[hidden],
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPaginationCounter[hidden] {
    display: none !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination {
    margin-bottom: 16px;
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .swiper {
    padding-bottom: 2px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .paginationThumb {
    position: relative;
    width: 267px;
    text-align: center;
    padding-block: 16px;
    font-size: 1.25rem;
    color: #969696;
    font-weight: 300;
    cursor: pointer;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .paginationThumb::after {
    content: "";
    display: block;
    position: absolute;
    inset: auto 0 -2px 0;
    height: 3px;
    background: transparent;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .active {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPagination
    .active::after {
    background: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .swiper {
    margin-inline: -18px;
    padding: 10px 18px 20px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb {
    background: #fff;
    border-bottom: 2px solid #4cbdec;
    box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.25);
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb:hover {
    border-bottom-color: #2aa7df;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb:hover
    .thumbContent
    .contentHeader
    .headerLine {
    width: 70px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb:hover
    .thumbContent
    .contentHeader
    .headerLink {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbPic {
    aspect-ratio: 554/350;
    overflow: hidden;
    width: 100%;
    min-height: 100%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.6s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent {
    padding: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentHeader
    .headerLine {
    width: 50px;
    height: 2px;
    background: #4cbdec;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentHeader
    .headerLink {
    font-size: 0.9375rem;
    color: #323232;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    p {
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
    line-height: 1.5;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentTitle {
    font-size: 1.5625rem;
    margin-bottom: 24px;
    font-weight: 600;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentDesc {
    margin-bottom: 20px;
    height: 60px;
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentDetail {
    font-size: 15px;
    font-weight: 700;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentLink {
    width: 164px;
    height: 60px;
    display: grid;
    font-size: 18px;
    font-weight: 400;
    color: #000f9f;
    background: #fff;
    place-items: center;
    position: absolute;
    inset: auto auto -34px 0;
    transition: all 0.3s ease;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentLink:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMain
    .mainThumb
    .thumbContent
    .contentMain
    .mainContent
    .contentDetail:not(:last-child) {
    margin-bottom: 16px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMore {
    gap: 32px;
    width: 100%;
    display: grid;
    max-width: 554px;
    margin-inline: auto;
    grid-template-columns: 1fr 1fr;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMore
    .moreThumb {
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    color: #000f9f;
    font-size: 1.25rem;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesMore
    .moreThumb:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainProjects {
    margin-block: 42px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPaginationCounter {
    direction: ltr;
    margin-bottom: 40px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPaginationCounter
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPaginationCounter
    .servicesPaginationThumb {
    padding-block: 8px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 2px;
    border-bottom: 3px solid transparent;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesPaginationCounter
    .servicesPaginationThumb.active {
    color: #323232;
    border-color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation {
    position: absolute;
    inset: 32% -32px auto auto;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    background: #fff;
    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb.swiper-button-disabled {
    cursor: auto;
    background: #f9f9f9 !important;
    pointer-events: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb.swiper-button-disabled
    svg
    path {
    stroke: #b2b6de !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb
    svg {
    transition: transform 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb:first-child {
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb:hover {
    background: #f7fbfd;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb:hover
    svg {
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb:active {
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.15);
}
.main .mainSection .sectionContainer .containerMain .mainProjects {
    margin-block: 42px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    margin-bottom: 68px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList {
    display: block !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .projectsSwiper {
    margin-block: -30px;
    padding-block: 30px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbPic {
    aspect-ratio: 359/245;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbContent {
    padding: 27px 50px 66px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbContent
    .contentHeader {
    height: 15px;
    margin-bottom: 25px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbContent
    .contentHeader
    .headerLink {
    font-size: 10px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbContent
    .contentMain
    .mainTitle {
    font-size: 15px;
    font-weight: 600;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList
    .listThumb
    .thumbContent
    .contentMain
    .mainDesc {
    font-size: 15px;
    font-weight: 300;
    text-align: justify;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb {
    background: #fff;
    border-bottom: 3px solid #4cbdec;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb:hover {
    transform: translateY(-6px);
    box-shadow: 8px 14px 30px rgba(0, 0, 0, 0.28);
    border-bottom-color: #2aa7df;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb:hover
    .thumbContent
    .contentHeader
    .headerLine {
    width: 70px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb:hover
    .thumbContent
    .contentHeader
    .headerLink {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb.fullThumb {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb.fullThumb
    .thumbPic {
    aspect-ratio: 554/350;
    width: 100%;
    min-height: 100%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb.fullThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb.fullThumb
    .thumbContent {
    padding: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbPic {
    overflow: hidden;
    aspect-ratio: 554/277;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent {
    padding: 32px 32px 42px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent
    .contentHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent
    .contentHeader
    .headerLine {
    width: 50px;
    height: 2px;
    background: #4cbdec;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent
    .contentHeader
    .headerLink {
    font-size: 0.9375rem;
    color: #323232;
    font-weight: 400;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent
    .contentMain
    .mainTitle {
    font-size: 1.5625rem;
    margin-bottom: 24px;
    font-weight: 600;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList
    .listThumb
    .thumbContent
    .contentMain
    .mainDesc {
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
    line-height: 1.5;
}
.main .mainSection .sectionContainer .containerMain .mainProjects .projectMore {
    display: flex;
    justify-content: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectMore
    .moreThumb {
    max-width: 554px;
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    color: #000f9f;
    font-size: 1.25rem;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectMore
    .moreThumb:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainCountdown {
    display: grid;
    gap: 32px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block: 22px 24px;
    border-bottom: 2px solid #4cbdec;
    direction: ltr;
    font-family: "ModamB", sans-serif;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader
    .headerCounter {
    position: relative;
    width: fit-content;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader
    .headerCounter
    .headerIcon {
    position: absolute;
    right: 100%;
    top: 14px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader
    .headerNumber {
    font-weight: 300;
    font-size: 5rem;
    color: #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader
    .headerIcon {
    font-weight: 300;
    font-size: 5rem;
    color: #c8c8c8;
    line-height: 64px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbHeader
    .headerUnit {
    font-size: 1.875rem;
    font-weight: 300;
    color: #c8c8c8;
    margin-left: 4px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbMain {
    padding-top: 42px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCountdown
    .countdownThumb
    .thumbMain
    .mainTitle {
    text-align: center;
    color: #323232;
    font-size: 1.5625rem;
    font-weight: 700;
}
.main .mainSection .sectionContainer .containerMain .mainBlogs .blogsMain {
    position: relative;
    margin-bottom: 4px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainSlider {
    width: 74%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainSlider
    .swiper {
    padding: 18px 22px 24px 16px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainSlider
    .blogsSwiper
    .mainThumb {
    overflow: hidden;
    aspect-ratio: 847/554;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainSlider
    .blogsSwiper
    .mainThumb:hover
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainSlider
    .blogsSwiper
    .mainThumb
    img {
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox {
    position: absolute;
    inset: 0 auto 0 0;
    z-index: 2;
    width: 400px;
    height: 400px;
    margin-block: auto;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer {
    padding: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer
    .containerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer
    .containerHeader
    .headerLine {
    width: 50px;
    height: 2px;
    background: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer
    .containerHeader
    .headerLink {
    font-size: 0.9375rem;
    color: #323232;
    font-weight: 4200;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer
    .containerMain
    .mainTitle {
    font-size: 20px;
    margin-bottom: 24px;
    font-weight: 700;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox
    .boxContainer
    .containerMain
    .mainDesc {
    font-size: 15px;
    font-weight: 300;
    color: #323232;
    line-height: 1.5;
    text-align: justify;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 10;
    overflow: hidden;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation {
    position: absolute;
    inset: 0 -10px 0 auto;
    height: 116px;
    margin-block: auto;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    background: #fff;
    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb.swiper-button-disabled {
    cursor: auto;
    background: #f9f9f9 !important;
    pointer-events: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb.swiper-button-disabled
    svg
    path {
    stroke: #b2b6de !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb
    svg {
    transition: transform 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb:first-child {
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb:hover {
    background: #f7fbfd;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb:hover
    svg {
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb:active {
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.15);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsPagination {
    direction: ltr;
    margin-bottom: 38px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsPagination
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsPagination
    .blogsPaginationThumb {
    padding-block: 8px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 2px;
    border-bottom: 3px solid transparent;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsPagination
    .blogsPaginationThumb.active {
    color: #323232;
    border-color: #4cbdec;
}
.main .mainSection .sectionContainer .containerMain .mainBlogs .blogsMore {
    display: flex;
    justify-content: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMore
    .moreThumb {
    max-width: 554px;
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    color: #000f9f;
    font-size: 1.25rem;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMore
    .moreThumb:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCustomers
    .swiper
    .swiper-wrapper {
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCustomers
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCustomers
    .customerThumb {
    width: 284px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCustomers
    .customerThumb:hover
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainCustomers
    .customerThumb
    img {
    width: 150px;
    aspect-ratio: 1;
    object-fit: contain;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainRewards
    .swiper
    .swiper-wrapper {
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainRewards
    .swiper
    .swiper-slide {
    width: auto;
}
.main .mainSection .sectionContainer .containerMain .mainRewards .rewardThumb {
    width: 261px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainRewards
    .rewardThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainRewards
    .rewardThumb
    .thumbPic
    img {
    width: 170px;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainRewards
    .rewardThumb
    .thumbTitle {
    font-size: 0.9375rem;
    font-weight: 300;
    text-align: center;
    line-height: 1.5;
}
.main .mainSection .sectionContainer .containerMain .mainContacts {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainContacts
    .contactThumb {
    width: 261px;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    font-size: 1.25rem;
    font-weight: 400;
    color: #000f9f;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainContacts
    .contactThumb:hover {
    background: #000fa0;
    color: #fff;
    transform: translateY(-2px);
}
.main .mainBanner {
    position: relative;
    margin-bottom: 96px;
}
.main .mainBanner .bannerBackground {
    position: relative;
}
.main .mainBanner .bannerBackground img {
    aspect-ratio: 1920/800;
    width: 100%;
}
.main .mainBanner .bannerBackground .backgroundOverlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 15, 159, 0.9),
        rgba(76, 189, 236, 0.7)
    );
    mix-blend-mode: multiply;
}
.main .mainBanner .bannerContainer {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
}
.main .mainBanner .bannerContainer .containerContent {
    color: #fff;
    text-align: center;
    width: min(1140px, 100% - 48px);
    margin-inline: auto;
}
.main .mainBanner .bannerContainer .containerContent .contentTitle {
    font-size: 40px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 14px;
}
.main .mainBanner .bannerContainer .containerContent .contentTitle::before {
    content: "";
    display: block;
    width: 2px;
    height: 50px;
    background: #4cbdec;
    margin: 0 auto 12px;
}
.main .mainBanner .bannerContainer .containerContent .contentDesc {
    font-size: 1.25rem;
    font-weight: 350;
    margin-bottom: 32px;
}
.main .mainBanner .bannerContainer .containerContent .contentLink {
    max-width: 554px;
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    border: 1px solid #fff;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 400;
    margin-inline: auto;
    transition: all 0.3s ease;
}
.main .mainBanner .bannerContainer .containerContent .contentLink:hover {
    background: #fff;
    color: #000fa0;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainWinners {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .swiperNavigation {
    top: 20%;
}
.main .mainSection .sectionContainer .containerMain .mainWinners .swiper {
    padding-block: 30px;
    margin-block: 30px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .thumbPic {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    margin-bottom: 22px;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .picWrapper {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb.routeThumb
    .picWrapper {
    margin-bottom: 58px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb.routeThumb
    .picWrapper
    .thumbPic {
    margin-bottom: 0;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .picWrapper
    .picPlayer {
    position: absolute;
    width: 65px;
    height: 65px;
    display: grid;
    place-items: center;
    background: #fff;
    color: #000f9f;
    inset: auto 0 -32px 0;
    margin-inline: auto;
    transition: all 0.3s ease;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .picWrapper
    .picPlayer:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .thumbContent {
    text-align: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .thumbContent
    .contentTitle {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 14px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainWinners
    .winnerThumb
    .thumbContent
    .contentDesc {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main .mainSection .sectionContainer .containerMain .swiperNavigation {
    position: absolute;
    inset: auto -32px auto auto;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    background: #fff;
    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-disabled {
    cursor: auto;
    background: #f9f9f9 !important;
    pointer-events: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-disabled
    svg
    path {
    stroke: #b2b6de !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-disabled {
    cursor: auto;
    background: #f9f9f9 !important;
    pointer-events: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-lock {
    display: none !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-disabled
    svg
    path {
    stroke: #b2b6de !important;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb.swiper-button-hidden {
    cursor: auto;
    opacity: 0;
    pointer-events: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb
    svg {
    transition: transform 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb:first-child {
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb:hover {
    background: #f7fbfd;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb:hover
    svg {
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .swiperNavigation
    .navigationThumb:active {
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.15);
}
.main .mainSection .sectionContainer .containerMain .mainMore {
    display: flex;
    margin-top: 30px;
    justify-content: center;
}
.main .mainSection .sectionContainer .containerMain .mainMore .moreThumb {
    width: 554px;
    height: 60px;
    display: grid;
    font-size: 20px;
    font-weight: 400;
    color: #000f9f;
    background: #fff;
    place-items: center;
    transition: all 0.3s ease;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
}
.main .mainSection .sectionContainer .containerMain .mainMore .moreThumb:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainSwiperGrid {
    margin-block: 42px;
}
.main .mainSection .sectionContainer .containerMain .mainSwiperGrid .gridsList {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .swiper {
    padding-block: 30px;
    margin-block: -30px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb {
    background: #fff;
    border-bottom: 3px solid #4cbdec;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb:hover {
    transform: translateY(-6px);
    box-shadow: 8px 14px 30px rgba(0, 0, 0, 0.28);
    border-bottom-color: #2aa7df;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb:hover
    .thumbContent
    .contentHeader
    .headerLine {
    width: 70px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb:hover
    .thumbContent
    .contentHeader
    .headerLink {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb.fullThumb {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb.fullThumb
    .thumbPic {
    aspect-ratio: 554/350;
    width: 100%;
    min-height: 100%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb.fullThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb.fullThumb
    .thumbContent {
    padding: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbPic {
    overflow: hidden;
    aspect-ratio: 554/277;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent {
    padding: 32px 32px 42px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent
    .contentHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent
    .contentHeader
    .headerLine {
    width: 50px;
    height: 2px;
    background: #4cbdec;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent
    .contentHeader
    .headerLink {
    font-size: 0.9375rem;
    color: #323232;
    font-weight: 400;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent
    .contentMain
    .mainTitle {
    font-size: 1.5625rem;
    margin-bottom: 24px;
    font-weight: 600;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .listThumb
    .thumbContent
    .contentMain
    .mainDesc {
    height: 120px;
    font-size: 1.25rem;
    font-weight: 300;
    color: #323232;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainSwiperGrid
    .gridsList
    .swiperNavigation {
    bottom: 345px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .paginationCounter
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .paginationCounter
    .counterPaginationThumb {
    padding-block: 8px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 2px;
    border-bottom: 3px solid transparent;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .paginationCounter
    .counterPaginationThumb.active {
    color: #323232;
    border-color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .swiperNavigation {
    top: 35%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .swiperNavigation.nonePageNav {
    top: 24%;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .swiperNavigation.leadersNav {
    top: 26%;
}
.main .mainSection .sectionContainer .containerMain .mainProud {
    display: grid;
    align-items: flex-end;
    grid-template-columns: 554px 1fr;
}
.main .mainSection .sectionContainer .containerMain .mainProud .proudContent {
    padding-bottom: 32px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentTitle {
    font-size: 40px;
    font-weight: 500;
    margin-bottom: 27px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentDesc {
    font-size: 1.25rem;
    font-weight: 300;
    text-align: justify;
    line-height: 1.5;
    margin-bottom: 24px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentBold {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 36px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentBold
    svg {
    margin: 32px auto 0;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentLink {
    max-width: 554px;
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    color: #000f9f;
    font-size: 1.25rem;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProud
    .proudContent
    .contentLink:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}
.main .mainSection .sectionContainer .containerMain .mainProud .proudPic img {
    width: 90%;
    margin-right: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader {
    padding-block: 22px;
    margin-bottom: 30px;
    background: linear-gradient(270deg, #000f9f 0%, #4cbdec 100%);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader
    .headerContainer {
    display: flex;
    align-items: center;
    padding-inline: 22px;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader
    .headerContainer
    .containerTitle {
    font-size: 20px;
    font-weight: 300;
    color: #ffffff;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader
    .headerContainer
    .containerOptions {
    gap: 18px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader
    .headerContainer
    .containerOptions
    .optionThumb {
    gap: 3px;
    width: 111px;
    height: 36px;
    display: flex;
    border-radius: 6px;
    background: #fff;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8c3c9;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastHeader
    .headerContainer
    .containerOptions
    .optionThumb
    .thumbContent {
    text-align: left;
}
.main .mainSection .sectionContainer .containerMain .mainPodcast .podcastMain {
    width: 100%;
    background: #fff;
    box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.25);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader {
    display: grid;
    border-bottom: 1px solid #c8c8c8;
    grid-template-columns: calc(100% - 261px) 261px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent {
    padding: 26px 37px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader {
    display: flex;
    align-items: center;
    margin-bottom: 14px;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb {
    gap: 6px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink {
    font-size: 13px;
    font-weight: 300;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink:not(:last-child) {
    gap: 6px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink:not(:last-child)::after {
    content: "/";
    display: block;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink:last-child {
    font-weight: 500;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink
    span {
    transition: all 0.25s;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerBreadcrumb
    .crumbLink
    span:hover {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerOptions {
    gap: 28px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerOptions
    .optionThumb {
    gap: 8px;
    display: flex;
    font-size: 10px;
    font-weight: 500;
    align-items: center;
    transition: all 0.25s;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentHeader
    .headerOptions
    .optionThumb:hover {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainTitle {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 15px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerheader {
    display: flex;
    margin-bottom: 8px;
    align-items: center;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerheader
    .headerTHumb {
    font-size: 13px;
    font-weight: 300;
    letter-spacing: 1px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerMain {
    margin-bottom: 25px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerMain
    .mainWave {
    height: 64px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions {
    gap: 48px;
    display: flex;
    color: #c8c8c8;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .voiceOption {
    gap: 14px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .voiceOption
    .optionProgress {
    width: 135px;
    height: 3px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background: #525252;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .voiceOption
    .optionProgress
    .progressInner {
    position: absolute;
    inset: 0 auto 0 0;
    background: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .voiceOption
    .optionToggle {
    cursor: pointer;
    transition: all 0.25s;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .voiceOption
    .optionToggle:hover {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .optionThumb {
    transition: all 0.25s;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerContent
    .contentMain
    .mainController
    .controllerFooter
    .footerOptions
    .optionThumb:hover {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerPic {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainHeader
    .headerPic
    img {
    width: 100%;
    aspect-ratio: 1;
    -o-object-fit: cover;
    object-fit: cover;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList {
    display: flex;
    height: 300px;
    align-items: flex-start;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listScroll {
    width: 8px;
    height: 100%;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    border-left: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listScroll
    .scrollHanlder {
    top: 0;
    left: 0;
    width: 100%;
    height: 31px;
    position: absolute;
    cursor: pointer;
    background: #323232;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems {
    flex-grow: 1;
    height: 100%;
    overflow-y: auto;
    scrollbar-width: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems::-webkit-scrollbar {
    display: none;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb {
    display: flex;
    padding: 15px 30px;
    align-items: center;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb:not(:last-child) {
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb
    .thumbCreated {
    font-size: 10px;
    font-weight: 300;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb
    .thumbContent {
    gap: 23px;
    display: flex;
    align-items: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb
    .thumbContent
    .contentTitle {
    font-size: 15px;
    font-weight: 300;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb
    .thumbContent
    .contentOption {
    width: 30px;
    height: 30px;
    display: grid;
    color: #4cbdec;
    place-items: center;
    transition: all 0.3s ease;
    border: 1px solid #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainPodcast
    .podcastMain
    .mainList
    .listItems
    .itemThumb
    .thumbContent
    .contentOption:hover {
    color: #fff;
    background: #4cbdec;
    transform: translateY(-2px);
}
.ltr .main .mainSection .sectionContainer .containerMain .mainWhy {
    flex-direction: row;
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation {
    inset: auto auto 142px -32px;
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb
    svg {
    transform: rotate(180deg);
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainServices
    .servicesNavigation
    .navigationThumb:hover
    svg {
    transform: rotate(180deg) translateY(-2px);
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainBox {
    inset: 0 0 0 auto;
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation {
    inset: 0 auto 0 -10px;
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb
    svg {
    transform: rotate(180deg);
}
.ltr
    .main
    .mainSection
    .sectionContainer
    .containerMain
    .mainBlogs
    .blogsMain
    .mainNavigation
    .navigationThumb:hover
    svg {
    transform: rotate(180deg) translateY(-2px);
}
@media (max-width: 1681px) {
    .heroSection .heroSlide .slideContainer .contianerContent .contentTitle {
        font-size: 49px;
        margin-bottom: 10px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentDesc {
        font-size: 1.125rem;
        max-width: 792px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentCta {
        gap: 28px;
    }
    .heroSection
        .heroSlide
        .slideContainer
        .contianerContent
        .contentCta
        .ctaThumb {
        width: 235px;
        height: 54px;
        font-size: 1.125rem;
    }
    .heroSection .sectionFooter .footerScroll .scrollLabel {
        font-size: 2.25rem;
    }
    .main .mainHubs {
        width: min(1140px, 100% - 654px);
    }
    .main .mainHubs .hubsContainer .containerThumb {
        font-size: 1rem;
    }
    .main .mainSection:not(:last-child) {
        margin-bottom: 80px;
    }
    .main .mainSection .sectionContainer {
        width: min(1140px, 100% - 654px);
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle {
        font-size: 33px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle::before {
        height: 46px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerSubtitle {
        font-size: 1.125rem;
        margin-top: 12px;
    }
    .main .mainSection .sectionContainer .containerMain .mainContent p {
        font-size: 1.125rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy {
        gap: 26px;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb {
        width: calc((100% - 78px) / 4);
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbHeader {
        margin-bottom: 9px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbMain
        .mainTitle {
        font-size: 1.125rem;
        margin-bottom: 13px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbMain
        .mainDesc {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPagination
        .paginationThumb {
        width: 238px;
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent {
        padding: 29px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        p {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation {
        bottom: 27%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation
        .navigationThumb {
        width: 52px;
        height: 52px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPaginationCounter
        .servicesPaginationThumb {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList {
        gap: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb.fullThumb
        .thumbContent {
        padding: 29px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent {
        padding: 29px 29px 38px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 1.313rem;
        margin-bottom: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainDesc {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectMore
        .moreThumb {
        max-width: 499px;
        width: 100%;
        height: 54px;
        font-size: 1.125rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainCountdown {
        gap: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader {
        padding-block: 20px 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerNumber {
        font-size: 4.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerIcon {
        margin-top: -12px;
        font-size: 4.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerUnit {
        font-size: 1.563rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbMain {
        padding-top: 38px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbMain
        .mainTitle {
        font-size: 1.313rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox {
        width: 360px;
        height: 360px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer {
        padding: 29px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerHeader {
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerHeader
        .headerLink {
        font-size: 0.875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainTitle {
        font-size: 16px;
        margin-bottom: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainDesc {
        font-size: 13px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation {
        right: -6px;
        height: 104px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation
        .navigationThum {
        width: 52px;
        height: 52px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsPagination
        .blogsPaginationThumb {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMore
        .moreThumb {
        max-width: 499px;
        width: 100%;
        height: 54px;
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCustomers
        .customerThumb {
        width: 256px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCustomers
        .customerThumb
        img {
        width: 135px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb {
        width: 235px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb
        .thumbPic
        img {
        width: 153px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb
        .thumbTitle {
        font-size: 0.84375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainContacts {
        gap: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainContacts
        .contactThumb {
        width: 235px;
        height: 54px;
        font-size: 1.125rem;
    }
    .main .mainBanner .bannerContainer .containerContent {
        width: min(1140px, 100% - 654px);
    }
    .main .mainBanner .bannerContainer .containerContent .contentTitle {
        font-size: 33px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentDesc {
        font-size: 1.125rem;
        margin-bottom: 29px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentLink {
        max-width: 499px;
        width: 100%;
        height: 54px;
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader {
        padding-block: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        h5 {
        font-size: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        .headerToggler::before {
        height: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        .headerToggler::after {
        width: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb
        .thumbPic {
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb
        .thumbContent
        .contentTitle {
        font-size: 16px;
        margin-bottom: 11px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb
        .thumbContent
        .contentDesc {
        font-size: 16px;
    }
    .main .mainSection .sectionContainer .containerMain .mainMore .moreThumb {
        max-width: 499px;
        width: 100%;
        height: 54px;
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent {
        padding: 26px 26px 34px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 20px;
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentMain
        .mainDesc {
        font-size: 16px;
        height: 96px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .swiperNavigation {
        bottom: 288px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentTitle {
        font-size: 20px;
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentDesc {
        margin-bottom: 16px;
        font-size: 16px;
        height: 48px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentDetail {
        font-size: 13px;
        margin-bottom: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentLink {
        width: 134px;
        height: 49px;
        font-size: 15px;
        bottom: -28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb.routeThumb
        .picWrapper {
        margin-bottom: 48px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb
        .picWrapper
        .picPlayer {
        width: 53px;
        height: 53px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .winnerThumb
        .picWrapper
        .picPlayer
        svg {
        width: 18px;
        height: 21px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore {
        gap: 26px;
        max-width: 499px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore
        .moreThumb {
        height: 54px;
        font-size: 1.125rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainProud {
        grid-template-columns: 499px 1fr;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent {
        padding-bottom: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentTitle {
        font-size: 33px;
        margin-bottom: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentDesc {
        font-size: 1.125rem;
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold {
        font-size: 0.9375rem;
        margin-bottom: 30px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold
        svg {
        margin-top: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentLink {
        max-width: 499px;
        height: 54px;
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader {
        padding-block: 18px;
        margin-bottom: 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer {
        padding-inline: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerTitle {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions {
        gap: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions
        .optionThumb {
        width: 100px;
        height: 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader {
        grid-template-columns: calc(100% - 235px) 235px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent {
        padding: 22px 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader {
        margin-bottom: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerBreadcrumb
        .crumbLink {
        font-size: 0.75rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions {
        gap: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions
        .optionThumb {
        font-size: 0.5625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainTitle {
        font-size: 1.125rem;
        margin-bottom: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerheader
        .headerTHumb {
        font-size: 0.75rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain {
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain
        .mainWave {
        height: 58px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions {
        gap: 38px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .voiceOption {
        gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .voiceOption
        .optionProgress {
        width: 120px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList {
        height: 270px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb {
        padding: 13px 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbCreated {
        font-size: 0.5625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent {
        gap: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentTitle {
        font-size: 0.8125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentOption {
        width: 27px;
        height: 27px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList.swiperList
        .listThumb
        .thumbContent {
        padding: 22px 41px 54px;
    }
    .ltr
        .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation {
        right: auto;
        left: -6px;
    }
}
@media (max-width: 1400px) {
    .heroSection .heroSwiper .swiper-pagination {
        bottom: 112px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentTitle {
        font-size: 41px;
        margin-bottom: 8px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentDesc {
        font-size: 0.9rem;
        max-width: 648px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentCta {
        gap: 24px;
    }
    .heroSection
        .heroSlide
        .slideContainer
        .contianerContent
        .contentCta
        .ctaThumb {
        width: 190px;
        height: 44px;
        font-size: 0.9rem;
    }
    .heroSection .sectionFooter .footerScroll {
        padding-block: 24px;
    }
    .heroSection .sectionFooter .footerScroll .scrollLabel {
        font-size: 1.8rem;
        margin-bottom: 6px;
    }
    .main .mainHubs {
        width: min(1140px, 100% - 554px);
        margin: 0 auto 64px;
    }
    .main .mainHubs .hubsContainer .containerThumb {
        height: 72px;
        font-size: 0.8rem;
    }
    .main .mainSection:not(:last-child) {
        margin-bottom: 60px;
    }
    .main .mainSection.countdownSection {
        padding-bottom: 48px;
    }
    .main .mainSection .sectionContainer {
        width: min(1140px, 100% - 554px);
    }
    .main .mainSection .sectionContainer .containerHeader {
        margin-bottom: 16px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle {
        font-size: 29px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle::before {
        height: 21px !important;
        margin: 0 auto 8px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerSubtitle {
        font-size: 0.9rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainContent p {
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPagination
        .paginationThumb {
        font-size: 0.9rem;
        width: 184px;
        padding-block: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent {
        padding: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        p {
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation {
        right: -26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation
        .navigationThumb {
        width: 44px;
        height: 44px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation
        .navigationThumb
        svg {
        width: 8px;
        height: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPaginationCounter
        .servicesPaginationThumb {
        padding-block: 6px;
        font-size: 0.9rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainProjects {
        margin-block: 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList {
        gap: 24px;
        margin-bottom: 48px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb.fullThumb
        .thumbContent {
        padding: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent {
        padding: 24px 24px 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 1.125rem;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainDesc {
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectMore
        .moreThumb {
        max-width: 576px;
        width: 100%;
        height: 44px;
        font-size: 0.9rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainCountdown {
        gap: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerNumber {
        font-size: 3.625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerUnit {
        font-size: 1.375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerIcon {
        font-size: 3.625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbMain {
        padding-top: 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbMain
        .mainTitle {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox {
        width: 288px;
        height: 288px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer {
        padding: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerHeader {
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerHeader
        .headerLink {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainTitle {
        font-size: 14px;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainDesc {
        font-size: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation {
        height: 88px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation
        .navigationThumb {
        width: 44px;
        height: 44px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation
        .navigationThumb
        svg {
        width: 8px;
        height: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsPagination
        .blogsPaginationThumb {
        padding-block: 6px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMore
        .moreThumb {
        max-width: 576px;
        width: 100%;
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCustomers
        .customerThumb {
        width: 184px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCustomers
        .customerThumb
        img {
        width: 108px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb {
        width: 192px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb
        .thumbPic
        img {
        width: 124px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainRewards
        .rewardThumb
        .thumbTitle {
        font-size: 0.6875rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainContacts {
        gap: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainContacts
        .contactThumb {
        width: 190px;
        height: 44px;
        font-size: 0.9rem;
    }
    .main .mainBanner {
        margin-bottom: 72px;
    }
    .main .mainBanner .bannerContainer .containerContent {
        width: min(1140px, 100% - 554px);
    }
    .main .mainBanner .bannerContainer .containerContent .contentTitle {
        font-size: 29px;
        margin-bottom: 10px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentTitle::before {
        height: 36px;
        margin: 0 auto 8px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentDesc {
        font-size: 0.9rem;
        margin-bottom: 24px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentLink {
        max-width: 576px;
        width: 100%;
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb {
        width: calc((100% - 40px) / 3);
    }
    .main .mainSection .sectionContainer .containerMain .mainMore .moreThumb {
        max-width: 576px;
        width: 100%;
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader {
        padding-block: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        h5 {
        font-size: 19px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbMain
        .mainContainer
        .containerContent {
        font-size: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbMain
        .mainContainer
        .containerContent
        .contentOptions
        .optionLink {
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 10px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 18px;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .listThumb
        .thumbContent
        .contentMain
        .mainDesc {
        font-size: 14px;
        height: 84px;
    }
    .main .mainSection .sectionContainer .containerMain .swiperNavigation {
        right: -27px;
        bottom: 271px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .swiperNavigation
        .navigationThumb {
        width: 50px;
        height: 50px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentTitle {
        font-size: 17px;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentDesc {
        font-size: 14px;
        margin-bottom: 14px;
        height: 42px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentDetail:first-child {
        margin-bottom: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentDetail:not(:last-child) {
        font-size: 11px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        .contentLink {
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .swiperNavigation {
        top: 32%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWinners
        .swiperNavigation {
        top: 28%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore {
        gap: 24px;
        max-width: 576px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore
        .moreThumb {
        height: 44px;
        font-size: 0.9rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainProud {
        grid-template-columns: minmax(280px, 420px) 1fr;
        gap: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent {
        padding-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentTitle {
        font-size: 29px;
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentDesc {
        font-size: 0.9rem;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold {
        font-size: 0.8rem;
        margin-bottom: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold
        svg {
        margin-top: 20px;
        width: 24px;
        height: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentLink {
        max-width: 576px;
        height: 44px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudPic
        img {
        width: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader {
        padding-block: 14px;
        margin-bottom: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer {
        padding-inline: 16px;
        gap: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerTitle {
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions {
        gap: 10px;
        flex-shrink: 0;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions
        .optionThumb {
        width: 92px;
        height: 30px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader {
        grid-template-columns: calc(100% - 200px) 200px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent {
        padding: 20px 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader {
        margin-bottom: 10px;
        gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerBreadcrumb
        .crumbLink {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions {
        gap: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions
        .optionThumb {
        gap: 6px;
        font-size: 0.5625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions
        .optionThumb
        svg {
        width: 10px;
        height: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainTitle {
        font-size: 1.125rem;
        margin-bottom: 10px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerheader {
        margin-bottom: 6px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerheader
        .headerTHumb {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain {
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain
        .mainWave {
        height: 48px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions {
        gap: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .voiceOption {
        gap: 10px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .voiceOption
        .optionProgress {
        width: 96px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .voiceOption
        .optionToggle
        svg {
        width: 22px;
        height: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions
        .optionThumb
        svg {
        width: 15px;
        height: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList {
        height: 240px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .listScroll {
        width: 6px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb {
        padding: 12px 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbCreated {
        font-size: 0.5625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent {
        gap: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentTitle {
        font-size: 0.8125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentOption {
        width: 26px;
        height: 26px;
    }
}
@media (max-width: 1200px) {
    .heroSection {
        margin-top: 0;
        margin-top: -100dvh;
    }
    .heroSection .heroSlide .slideBackground img {
        min-height: 634px;
        -o-object-fit: cover;
        object-fit: cover;
    }
    .main .mainHubs,
    .main .mainSection .sectionContainer,
    .main .mainBanner .bannerContainer .containerContent {
        width: min(1140px, 90%);
    }
    .main .mainBanner .bannerBackground img {
        aspect-ratio: 1;
        -o-object-fit: cover;
        object-fit: cover;
        max-height: 476px;
        width: 100%;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy {
        gap: 24px;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb {
        width: calc((100% - 72px) / 4);
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb {
        width: calc((100% - 100px) / 5);
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbHeader {
        font-size: 88px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbMain
        .mainTitle {
        font-size: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbMain
        .mainDesc {
        font-size: 16px;
    }
    .main .mainSection .sectionContainer .containerMain .mainProud {
        grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr);
        gap: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentTitle {
        font-size: 29px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer {
        flex-wrap: wrap;
        row-gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader {
        grid-template-columns: calc(100% - 180px) 180px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent {
        padding: 18px 20px;
    }
}
@media (max-width: 992px) {
    .main .mainSection .sectionContainer .containerMain .mainWhy {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb {
        width: calc((100% - 24px) / 2);
    }
    .main .mainSection .sectionContainer .containerMain .swiperNavigation {
        display: none !important;
    }
}
@media (max-width: 768px) {
    .main .mainSection .sectionContainer .containerMain .mainWhy {
        grid-template-columns: 1fr;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb {
        width: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbHeader {
        font-size: 4rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .swiperNavigation {
        display: none;
    }
}
@media (max-width: 576px) {
    .heroSection .heroSwiper .swiper-pagination {
        bottom: 84px;
    }
    .heroSection .heroSwiper .swiper-pagination .swiper-pagination-bullet {
        width: 28px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent {
        padding-inline: 32px;
        width: 100%;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentTitle {
        font-size: 32px;
        margin-bottom: 12px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentDesc {
        font-size: 0.9375rem;
        margin-bottom: 32px;
    }
    .heroSection .heroSlide .slideContainer .contianerContent .contentCta {
        flex-direction: column;
        gap: 12px;
    }
    .heroSection
        .heroSlide
        .slideContainer
        .contianerContent
        .contentCta
        .ctaThumb {
        width: 100%;
        height: 40px;
        font-size: 0.9375rem;
    }
    .heroSection .sectionFooter .footerScroll {
        padding-block: 16px;
    }
    .heroSection .sectionFooter .footerScroll .scrollLabel {
        font-size: 1.25rem;
    }
    .heroSection .sectionFooter .footerScroll .scrollLabel span {
        margin-bottom: 4px;
    }
    .heroSection .sectionFooter .footerScroll .scrollLabel svg {
        width: 15px;
        height: 15px;
    }
    .main .mainHubs {
        width: calc(100% - 64px);
        margin-bottom: 40px;
    }
    .main .mainHubs .hubsContainer {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-1 {
        grid-template-columns: 1fr;
    }
    .main .mainHubs .hubsContainer.items-2 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-3 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-3 .containerThumb {
        grid-column: span 1;
    }
    .main .mainHubs .hubsContainer.items-3 .containerThumb:last-child {
        grid-column: span 2;
    }
    .main .mainHubs .hubsContainer.items-4 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-5 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-5 .containerThumb {
        grid-column: span 1;
    }
    .main .mainHubs .hubsContainer.items-5 .containerThumb:nth-last-child(2) {
        grid-column: span 1;
    }
    .main .mainHubs .hubsContainer.items-5 .containerThumb:last-child {
        grid-column: span 2;
    }
    .main .mainHubs .hubsContainer.items-6 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-7 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer.items-7 .containerThumb {
        grid-column: span 1;
    }
    .main .mainHubs .hubsContainer.items-7 .containerThumb:nth-last-child(2),
    .main .mainHubs .hubsContainer.items-7 .containerThumb:nth-last-child(3) {
        grid-column: span 1;
    }
    .main .mainHubs .hubsContainer.items-7 .containerThumb:last-child {
        grid-column: span 2;
    }
    .main .mainHubs .hubsContainer.items-8 {
        grid-template-columns: 1fr 1fr;
    }
    .main .mainHubs .hubsContainer .containerThumb {
        height: 60px;
        font-size: 0.75rem;
        font-weight: 400;
    }
    .main .mainSection:not(:last-child) {
        margin-bottom: 40px;
    }
    .main .mainSection .sectionContainer {
        width: calc(100% - 64px);
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle {
        font-size: 25px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerTitle::before {
        height: 25px;
        width: 2px;
    }
    .main .mainSection .sectionContainer .containerHeader .headerSubtitle {
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainContent p {
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy,
    .main .mainSection .sectionContainer .containerMain .mainWhy.fifthColumn {
        grid-template-columns: 100%;
        gap: 16px;
    }
    .main .mainSection .sectionContainer .containerMain .mainWhy .whyThumb,
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb {
        width: 100%;
        max-width: 261px;
        margin-inline: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbHeader,
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbHeader {
        font-size: 8.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbMain,
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbMain {
        margin-top: -24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbMain
        .mainTitle,
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbMain
        .mainTitle {
        font-size: 1.25rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy
        .whyThumb
        .thumbMain
        .mainDesc,
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainWhy.fifthColumn
        .whyThumb
        .thumbMain
        .mainDesc {
        font-size: 1.25rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPagination {
        margin-inline: -32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPagination
        .paginationThumb {
        font-size: 0.75rem;
        font-weight: 700;
        width: 150px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb {
        grid-template-columns: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbPic {
        width: 100%;
        aspect-ratio: 337.39/168.7;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.9625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMain
        .mainThumb
        .thumbContent
        .contentMain
        .mainContent
        p {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesNavigation {
        display: none;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPaginationCounter {
        margin-bottom: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPaginationCounter
        .servicesPaginationThumb {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList {
        grid-template-columns: 100%;
        margin-bottom: 40px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb.fullThumb {
        grid-column: span 1;
        grid-template-columns: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb.fullThumb
        .thumbPic {
        width: 100%;
        aspect-ratio: 337.39/168.7;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.9625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 1.25rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList
        .listThumb
        .thumbContent
        .contentMain
        .mainDesc {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectMore
        .moreThumb {
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainCountdown {
        grid-template-columns: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb {
        width: 231px;
        margin-inline: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbHeader
        .headerNumber {
        font-size: 3.75rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainCountdown
        .countdownThumb
        .thumbMain
        .mainTitle {
        font-size: 1.25rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainBlogs {
        padding-top: 8px;
    }
    .main .mainSection .sectionContainer .containerMain .mainBlogs .blogsMain {
        margin-bottom: 28px;
        padding-top: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainSlider {
        width: auto;
        margin-inline: -32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainSlider
        .swiper {
        padding: 0;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox {
        position: static;
        width: 100%;
        height: auto;
        margin-inline: auto;
        aspect-ratio: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer {
        padding: 24px 24px 29px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerHeader
        .headerLink {
        font-size: 11px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainTitle {
        font-size: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainBox
        .boxContainer
        .containerMain
        .mainDesc {
        font-size: 13px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainNavigation {
        inset: 0 0 auto 0;
        width: -moz-fit-content;
        width: fit-content;
        height: auto;
        margin-inline: auto;
        display: flex;
        align-items: center;
        flex-direction: row-reverse;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsPagination {
        margin-bottom: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsPagination
        .blogsPaginationThumb {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMore
        .moreThumb {
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainContacts {
        flex-direction: column;
        gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainContacts
        .contactThumb {
        width: 100%;
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainCustomers,
    .main .mainSection .sectionContainer .containerMain .mainRewards {
        margin-inline: -32px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentTitle {
        font-size: 25px;
    }
    .main .mainBanner .bannerContainer .containerContent .contentTitle::before {
        height: 25px !important;
    }
    .main .mainBanner .bannerContainer .containerContent .contentDesc {
        font-size: 0.9375rem;
    }
    .main .mainBanner .bannerContainer .containerContent .contentLink {
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainWinners .swiper {
        margin-inline: -19px;
        padding: 19px;
    }
    .main > .mainContent .sectionAccordions .accordionThumb .thumbHeader {
        padding-block: 18px;
        gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        h5 {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        .headerToggler {
        width: 24px;
        height: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        .headerToggler::after {
        width: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbHeader
        .headerToggler::before {
        height: 21px !important;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainAccordions
        .accordionThumb
        .thumbMain
        .mainContainer
        .containerContent {
        padding-bottom: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainSwiperGrid
        .gridsList
        .swiper {
        margin-inline: -19px;
        padding-inline: 19px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore {
        gap: 16px;
        width: 100%;
        grid-template-columns: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesMore
        .moreThumb {
        width: 100%;
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainProud {
        grid-template-columns: 100%;
        gap: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent {
        padding-bottom: 0;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentTitle {
        font-size: 1.875rem;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentDesc {
        font-size: 0.9375rem;
        margin-bottom: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold {
        font-size: 0.9375rem;
        margin-bottom: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold
        svg {
        margin-top: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentLink {
        max-width: 100%;
        height: 40px;
        font-size: 0.9375rem;
    }
    .main .mainSection .sectionContainer .containerMain .mainProud .proudPic {
        order: -1;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudPic
        img {
        width: 70%;
        margin-inline: auto;
        display: block;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader {
        padding-block: 16px;
        margin-bottom: 20px;
        margin-inline: -32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer {
        flex-direction: column;
        align-items: flex-start;
        padding-inline: 20px;
        gap: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerTitle {
        font-size: 0.9375rem;
        line-height: 1.6;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions {
        width: 100%;
        gap: 10px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions
        .optionThumb {
        width: calc(50% - 5px);
        height: 36px;
        flex: 1 1 auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader {
        grid-template-columns: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerPic {
        order: -1;
        margin-inline: auto;
        width: 100%;
        border-bottom: 1px solid #c8c8c8;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent {
        padding: 20px 16px 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        margin-bottom: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerBreadcrumb
        .crumbLink {
        font-size: 0.75rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions {
        width: 100%;
        justify-content: space-between;
        gap: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentHeader
        .headerOptions
        .optionThumb {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainTitle {
        font-size: 1.25rem;
        margin-bottom: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerheader
        .headerTHumb {
        font-size: 0.75rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain {
        margin-bottom: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerMain
        .mainWave {
        height: 52px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter {
        flex-wrap: wrap;
        gap: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions {
        gap: 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions:first-child {
        width: 100%;
        order: 2;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions:first-child
        .voiceOption {
        width: 100%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions:first-child
        .voiceOption
        .optionProgress {
        flex-grow: 1;
        width: auto;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions:last-child {
        width: 100%;
        justify-content: center;
        gap: 36px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList {
        height: 260px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .listScroll {
        width: 6px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 14px 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbCreated {
        font-size: 0.625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent {
        width: 100%;
        gap: 12px;
        justify-content: space-between;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentTitle {
        flex: 1;
        font-size: 0.9375rem;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentOption {
        width: 28px;
        height: 28px;
        flex-shrink: 0;
    }
}
@media (max-width: 467px) {
    .heroSection .heroSlide .slideContainer .contianerContent {
        padding-inline: 20px;
    }
    .main .mainHubs,
    .main .mainSection .sectionContainer {
        width: calc(100% - 40px);
    }
    .main .mainHubs .hubsContainer .containerThumb:hover {
        color: #323232;
    }
    .main .mainHubs .hubsContainer .containerThumb:hover::before {
        transform: scaleY(0);
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainServices
        .servicesPagination {
        margin-inline: -20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainBlogs
        .blogsMain
        .mainSlider {
        margin-inline: -20px;
    }
    .main .mainSection .sectionContainer .containerMain .mainCustomers,
    .main .mainSection .sectionContainer .containerMain .mainRewards {
        margin-inline: -20px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentTitle {
        font-size: 1.625rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudContent
        .contentBold
        svg {
        width: 22px;
        height: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProud
        .proudPic
        img {
        width: 85%;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader {
        margin-inline: -20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer {
        padding-inline: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastHeader
        .headerContainer
        .containerOptions
        .optionThumb {
        height: 34px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent {
        padding: 16px 12px 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainTitle {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions {
        gap: 18px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainHeader
        .headerContent
        .contentMain
        .mainController
        .controllerFooter
        .footerOptions:last-child {
        gap: 28px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList {
        height: 240px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb {
        padding: 12px 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainPodcast
        .podcastMain
        .mainList
        .itemThumb
        .thumbContent
        .contentTitle {
        font-size: 0.875rem;
    }
}

/* Section styles copied from indexPage-static.css */
.main .mainSection .sectionContainer .containerMain .mainShop .shopMain {
    position: relative;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .swiper {
    padding-block: 30px;
    margin-block: -30px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb {
    background: #fff;
    border-bottom: 3px solid #4cbdec;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb:hover {
    transform: translateY(-6px);
    box-shadow: 8px 14px 30px rgba(0, 0, 0, 0.28);
    border-bottom-color: #2aa7df;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb:hover
    .thumbPic
    img {
    transform: scale(1.05);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb:hover
    .thumbContent
    .contentHeader
    .headerLine {
    width: 70px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb:hover
    .thumbContent
    .contentHeader
    .headerLink {
    color: #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbPic {
    overflow: hidden;
    aspect-ratio: 360/240;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbPic
    img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent {
    padding: 20px 50px 30px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentHeader {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 28px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentHeader
    .headerRate {
    gap: 7px;
    display: flex;
    font-size: 20px;
    font-weight: 400;
    align-items: center;
    padding: 0 5px 16px;
    border-bottom: 2px solid #4cbdec;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentHeader
    .headerLink {
    font-size: 10px;
    color: #323232;
    font-weight: 400;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainTitle {
    font-size: 15px;
    margin-bottom: 24px;
    font-weight: 600;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsDiscount
    .discountThumb {
    width: 40px;
    height: 40px;
    display: grid;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    border-radius: 8px;
    place-items: center;
    background: #000f9f;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice
    .priceNew {
    gap: 4px;
    display: flex;
    align-items: baseline;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice
    .priceNew
    .newNumber {
    font-size: 20px;
    font-weight: 400;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice
    .priceNew
    .newUnit {
    font-size: 10px;
    font-weight: 400;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice
    .priceOld {
    margin-top: -6px;
    text-align: left;
    padding-inline-end: 28px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopThumb
    .thumbContent
    .contentMain
    .mainDetails
    .detailsPrice
    .priceOld
    .oldNumber {
    font-size: 13px;
    font-weight: 400;
    color: #909090;
    text-decoration: line-through;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation {
    position: absolute;
    inset: auto -32px 217px auto;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    z-index: 2;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    background: #fff;
    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb
    svg {
    transition: transform 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb:first-child {
    border-bottom: 1px solid #c8c8c8;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb:hover {
    background: #f7fbfd;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb:hover
    svg {
    transform: translateY(-2px);
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMain
    .shopNavigation
    .navigationThumb:active {
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.15);
}
.main .mainSection .sectionContainer .containerMain .mainShop .shopPagination {
    direction: ltr;
    margin-block: 40px 38px;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopPagination
    .swiper
    .swiper-slide {
    width: auto;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopPagination
    .shopPaginationThumb {
    padding-block: 8px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 2px;
    border-bottom: 3px solid transparent;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopPagination
    .shopPaginationThumb.active {
    color: #323232;
    border-color: #4cbdec;
}
.main .mainSection .sectionContainer .containerMain .mainShop .shopMore {
    display: flex;
    justify-content: center;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMore
    .moreThumb {
    max-width: 554px;
    width: 100%;
    height: 60px;
    display: grid;
    place-items: center;
    background: #fff;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
    color: #000f9f;
    font-size: 1.25rem;
    font-weight: 400;
    transition: all 0.3s ease;
}
.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainShop
    .shopMore
    .moreThumb:hover {
    color: #fff;
    background: #000f9f;
    transform: translateY(-2px);
}

@media (max-width: 1681px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent {
        padding: 16px 41px 25px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 23px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 8px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerRate {
        gap: 6px;
        font-size: 16px;
        padding: 0 4px 13px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerRate
        svg {
        width: 17px;
        height: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 12px;
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainDetails
        .detailsDiscount
        .discountThumb {
        width: 33px;
        height: 33px;
        font-size: 13px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainDetails
        .detailsPrice
        .priceNew
        .newNumber {
        font-size: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainDetails
        .detailsPrice
        .priceNew
        .newUnit {
        font-size: 8px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainDetails
        .detailsPrice
        .priceOld {
        padding-inline-end: 24px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainDetails
        .detailsPrice
        .priceOld
        .oldNumber {
        font-size: 11px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation {
        bottom: 183px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation
        .navigationThumb {
        width: 52px;
        height: 52px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination {
        margin-block: 34px 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination
        .shopPaginationThumb {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMore
        .moreThumb {
        max-width: 499px;
        height: 54px;
        font-size: 1.125rem;
    }
}

@media (max-width: 1400px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent {
        padding: 14px 36px 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader {
        margin-bottom: 20px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerRate {
        gap: 5px;
        font-size: 14px;
        padding: 0 3px 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerRate
        svg {
        width: 15px;
        height: 14px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 7px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 12px;
        margin-bottom: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainMeta {
        height: 38px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation {
        right: -26px;
        bottom: 176px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation
        .navigationThumb {
        width: 44px;
        height: 44px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation
        .navigationThumb
        svg {
        width: 8px;
        height: 12px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination {
        margin-block: 28px 26px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination
        .shopPaginationThumb {
        padding-block: 6px;
        font-size: 0.9rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMore
        .moreThumb {
        max-width: 404px;
        height: 44px;
        font-size: 0.9rem;
    }
}

@media (max-width: 1200px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation {
        right: -18px;
    }
}

@media (max-width: 576px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .swiper {
        padding-block: 20px;
        margin-block: -20px;
        margin-inline: -32px;
        padding-inline: 32px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentHeader
        .headerLink {
        font-size: 0.6875rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainTitle {
        font-size: 16px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainMeta {
        height: auto;
        min-height: 0;
        font-size: 0.9375rem;
        -webkit-line-clamp: 3;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopThumb
        .thumbContent
        .contentMain
        .mainMeta:not(:last-child) {
        margin-bottom: 6px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .shopNavigation {
        display: none;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination {
        margin-block: 24px 22px;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopPagination
        .shopPaginationThumb {
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMore
        .moreThumb {
        max-width: 100%;
        height: 40px;
        font-size: 0.9375rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsList.swiperList
        .projectsSwiper {
        margin-inline: -20px;
        padding-inline: 20px;
    }
}

@media (max-width: 467px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainShop
        .shopMain
        .swiper {
        margin-inline: -20px;
        padding-inline: 20px;
    }
}

/*# sourceMappingURL=indexPage.css.map */
.mainBox {
    position: relative;
}

.boxContainer {
    display: none;
    animation: fade 0.4s;
}

.boxContainer.active {
    display: block;
}

@keyframes fade {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsMain {
    position: relative;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsList.swiperList {
    margin-bottom: 0;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation {
    z-index: 2;
    right: -32px;
    bottom: 239px;
    position: absolute;
    box-shadow: 5px 5px 20px 0 rgba(0, 0, 0, 0.25);
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    background: #fff;
    transition:
        background 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb
    svg {
    transition: transform 0.3s ease;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb:first-child {
    border-bottom: 1px solid #c8c8c8;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb:hover {
    background: #f7fbfd;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb:hover
    svg {
    transform: translateY(-2px);
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsNavigation
    .navigationThumb:active {
    box-shadow: 3px 3px 12px rgba(0, 0, 0, 0.15);
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsPagination {
    direction: ltr;
    margin-block: 40px 38px;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsPagination
    .swiper
    .swiper-slide {
    width: auto;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsPagination
    .projectsPaginationThumb {
    padding-block: 8px;
    font-size: 1.25rem;
    font-weight: 400;
    color: #c8c8c8;
    letter-spacing: 2px;
    border-bottom: 3px solid transparent;
}

.main
    .mainSection
    .sectionContainer
    .containerMain
    .mainProjects
    .projectsPagination
    .projectsPaginationThumb.active {
    color: #323232;
    border-color: #4cbdec;
}

@media (max-width: 1681px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation
        .navigationThumb {
        width: 52px;
        height: 52px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination {
        margin-block: 34px 32px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination
        .projectsPaginationThumb {
        font-size: 1.125rem;
    }
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation {
        bottom: 228px;
    }
}

@media (max-width: 1400px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation {
        right: -26px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation
        .navigationThumb {
        width: 44px;
        height: 44px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation
        .navigationThumb
        svg {
        width: 8px;
        height: 12px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination {
        margin-block: 28px 26px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination
        .projectsPaginationThumb {
        padding-block: 6px;
        font-size: 0.9rem;
    }
}

@media (max-width: 1200px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation {
        right: -18px;
    }
}

@media (max-width: 576px) {
    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsNavigation {
        display: none;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination {
        margin-block: 24px 22px;
    }

    .main
        .mainSection
        .sectionContainer
        .containerMain
        .mainProjects
        .projectsPagination
        .projectsPaginationThumb {
        font-size: 0.9375rem;
    }
}