/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.5.15,
* Autoprefixer: v10.5.0
* Browsers: last 4 version
*/

:root {
    --width-frame : 40rem;
    --padding-frame : 1.5rem;
    --width-img: 12rem;
}
main.homeWrapper {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: var(--margin-bottom);
}
/*===========================HERO SECTION==============================*/
section.heroSectionWrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#video-overlay-wrapper {
    position: absolute;
    width: 100%;
    z-index: 1;
    height: 100%;
    inset: 0;
}
.heroSectionInfoWrap {
    --_m:/calc(2*var(--r)) calc(2*var(--r)) radial-gradient(#000 70%,#0000 72%);
    --_g:conic-gradient(at var(--r) var(--r),#000 75%,#0000 0);
    --_d:(var(--s) + var(--r));
    -webkit-mask: calc(var(--_d) + var(--x)) 0 var(--_m), 0 calc(var(--_d) + var(--y)) var(--_m), radial-gradient(var(--s) at 0 0, #0000 99%, #000 calc(100% + 1px)) calc(var(--r) + var(--x)) calc(var(--r) + var(--y)), var(--_g) calc(var(--_d) + var(--x)) 0, var(--_g) 0 calc(var(--_d) + var(--y));
    mask: calc(var(--_d) + var(--x)) 0 var(--_m), 0 calc(var(--_d) + var(--y)) var(--_m), radial-gradient(var(--s) at 0 0, #0000 99%, #000 calc(100% + 1px)) calc(var(--r) + var(--x)) calc(var(--r) + var(--y)), var(--_g) calc(var(--_d) + var(--x)) 0, var(--_g) 0 calc(var(--_d) + var(--y));
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    position: relative;
    z-index: 2;
    margin-bottom: 5rem;
    width: var(--width-frame);
    --r: var(--padding-frame);
    --s: 3rem;
    --y: calc(var(--width-img) - 5rem);
    --x: calc(var(--width-frame) - var(--width-img) - (var(--r) * 3) - var(--s));
    backdrop-filter: blur(8px);
    min-width: var(--width-frame);
    background: rgba(30, 30, 30, 0.20);
    border-radius: var(--radius-box);
    -webkit-box-shadow: 1px 1px 5px 0 #ffffff;
    box-shadow: 1px 1px 5px 0 #ffffff;
}
.heroSectionInfoWrap .frame-box {
    padding: var(--padding-frame);
}
.heroSectionInfoWrap .frame-box .img-frame-wrap {
    width: var(--width-img);
    aspect-ratio: 1 / 1;
    background-color: var(--yellow);
    border-radius: var(--radius-box);
    padding: 5px;
}
.heroSectionInfoWrap .frame-box .heroSectionInfo h1,
.heroSectionInfoWrap .frame-box .heroSectionInfo p {
    text-align: left;
}
.heroSectionInfoWrap .frame-box .img-frame-wrap img {
    vertical-align: middle;
    width: 100%;
    aspect-ratio: 1 / 1;
    -o-object-fit: contain;
    object-fit: contain;
}
.heroSectionInfoWrap .frame-box .heroSectionInfo [class^="icon-"] {
    color: var(--yellow);
    display: block;
    -webkit-margin-start: auto;
    margin-inline-start: auto;
    -webkit-margin-end: auto;
    margin-inline-end: auto;
    position: relative;
}
.video-switch-Wrapper {
    position: relative;
    z-index: 2;
    width: 8rem;
    margin-bottom: 5rem;
}
.video-switch,.video-switch img {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: var(--radius-box);
}
.video-switch img {
    width: 100%;
    aspect-ratio: 1 / 1;
}
.video-switch {
    cursor: pointer;
}
.video-switch.play {
    pointer-events: none;
}
.video-switch.one img {
    -o-object-fit: cover;
    object-fit: cover;
}
.video-switch.two img {
    -o-object-fit: contain;
    object-fit: contain;
}
.blur-box {
    width: 100%;
    height: 100%;
    backdrop-filter: blur(2px);
}
foreignObject {
    pointer-events: all;
}
#video-overlay-wrapper video#video-overlay-wrap {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
/*===========================HERO SECTION==============================*/
/*==========================MINING PROCESS=============================*/
section.miningProcessWrapper {
    --w: 40vw;
    --h: 45vh;
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 5rem;
}
#miningProcessFrame {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    inset: 0;
}
#miningProcessFrame canvas#frameWrap {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}
.miningProcessInfoWrapper {
    position: relative;
    width: var(--w);
    height: var(--h);
    --r: 20px; /* radius */
    --s: 40px; /* size of inner curve */
    --x: 10vw; /* horizontal offset (no percentange) */
    --y: 11vw;  /* vertical offset (no percentange) */
    --_m: /calc(2*var(--r)) calc(2*var(--r)) radial-gradient(#000 70%,#0000 72%);
    --_g:conic-gradient(at var(--r) var(--r),#000 75%,#0000 0);
    --_d:(var(--s) + var(--r));
    -webkit-mask: calc(var(--_d) + var(--x)) 0 var(--_m),
    0 calc(var(--_d) + var(--y)) var(--_m),
    radial-gradient(var(--s) at 0 0,#0000 99%,#000 calc(100% + 1px))
    calc(var(--r) + var(--x)) calc(var(--r) + var(--y)),
    var(--_g) calc(var(--_d) + var(--x)) 0,
    var(--_g) 0 calc(var(--_d) + var(--y));
    mask: calc(var(--_d) + var(--x)) 0 var(--_m),
    0 calc(var(--_d) + var(--y)) var(--_m),
    radial-gradient(var(--s) at 0 0,#0000 99%,#000 calc(100% + 1px))
    calc(var(--r) + var(--x)) calc(var(--r) + var(--y)),
    var(--_g) calc(var(--_d) + var(--x)) 0,
    var(--_g) 0 calc(var(--_d) + var(--y));
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    backdrop-filter: blur(5px);
    background: rgba(30, 30, 30, 0.30);
    border-radius: var(--radius-box);
    -webkit-box-shadow: 1px 1px 5px 0 #ffffff;
    box-shadow: 1px 1px 5px 0 #ffffff;
}
.miningProcessInfoWrap {
    position: absolute;
    width: 100%;
    height: 100%;
    will-change: transform, opacity;
}
.miningProcessInfoWrapper .progress-bar svg {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
}
.miningProcessInfoItems {
    width: calc(var(--w) - var(--x) - var(--r) - var(--s));
    padding-block: 2rem;
    -webkit-padding-start: 2rem;
    padding-inline-start: 2rem;
    -webkit-padding-end: 4rem;
    padding-inline-end: 4rem;
}
.squareNum {
    position: absolute;
    left: 1.5rem;
    bottom: 1.5rem;
    width: calc(var(--x) - 1.5rem);
    height: calc(var(--x) - 1.5rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.squareNumMain {
    position: absolute;
    left: 1.5rem;
    bottom: 1.5rem;
    width: calc(var(--x) - 1.5rem);
    height: calc(var(--x) - 1.5rem);
    background-color: var(--yellow);
    border-radius: var(--radius-box);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.miningProcessInfoTitleNum span.num {
    font-size: 2.875rem;
    font-weight: 700;
    display: block;
}

.miningProcessInfoTitleNum p.title {
    font-size: 1.125rem;
    margin-top: 0;
    font-weight: 700;
    color: var(--yellow);
    margin-bottom: 2rem;
}
.miningProcessInfoTitleNum svg {
    position: absolute;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    right: 1.25rem;
}
.miningProcessContent p {
    margin: 0;
}
.miningProcessInfoWrapper .progress-bar {
    position: absolute;
    left: calc(var(--x) + var(--r) + var(--s) + 1rem);
    z-index: 2;
    top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0.75rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.miningProcessInfoWrapper .progress-bar span {
    width: 2px;
    height: 18px;
    display: block;
    background-color: #A4A4A4;
}
.squareNum span {
    font-family: var(--font-arame), sans-serif;
    font-size: 6rem;
    color: var(--gray);
    font-weight: 800;
}
/*==========================MINING PROCESS=============================*/
/*==========================PROJECTS SECTION=============================*/
section.projectsContainer.homePart .title-wrap {
    width: 78%;
    margin: 0;
}
section.projectsContainer.homePart .projectWrap:nth-of-type(5) {-ms-grid-column-span: 1;grid-column: span 1;-ms-grid-column: 3;grid-column-start: 3;}
section.projectsContainer.homePart .view-all-projects-wrap {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row: 3;
    grid-row-start: 3;
    -ms-grid-column-span: 2;
    grid-column-end: 3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
section.projectsContainer.homePart .view-all-projects-wrap [class^="icon-"] {
    font-size: 18rem;
    color: var(--gray);
    transition: color var(--ease) 0.5s;
}
section.projectsContainer.homePart .view-all-projects-wrap:hover [class^="icon-"] {
    color: var(--medium-yellow);
}

/*==========================PROJECTS SECTION=============================*/
/*==========================ABILITY SECTION=============================*/
.ourAbilityTitleWrap, .ourAbilityWrap{
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr calc(var(--margin-block) / 2) 1fr calc(var(--margin-block) / 2) 1fr;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: calc(var(--margin-block) / 2);
}
.ourAbilityTitleWrap .title-two-wrap {
    -ms-grid-column: 1;
    grid-column-start: 1;
}

.ourAbilityTitleWrap .title-wrap {
    -ms-grid-column: 2;
    grid-column-start: 2;
}
.ourAbilityTitleWrap,
.ourAbilityWrap {
    margin-bottom: calc(var(--margin-block) / 2);
    padding-bottom: calc(var(--margin-block) / 2);
    border-bottom: 1px solid var(--medium-gray);
}
.ourAbilityWrap:last-child {
    border: none;
}
.ourAbilityWrapTitle {
    height: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.ourAbilityWrapMedia {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-box);
}
.ourAbilityWrapMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
}
.ourAbilityWrapTitle .sub-title-wrap {
    margin: 0;
}
.ourAbilityWrapTitle h3 {
    font-size: 2.375rem;
    margin: 0 0 2rem 0;
}
.ourAbilityWrapInfo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative;
}
.ourAbilityWrapInfo p {
    margin: 0;
    font-size: .875rem;
    font-family: var(--font-rokh), sans-serif;
}
.ourAbilityWrapInfo .items {
    width: 18%;
    -webkit-margin-end: 0;
    margin-inline-end: 0;
    -webkit-margin-start: auto;
    margin-inline-start: auto;
    padding-bottom: 1rem;
}
.ourAbilityWrap {
    position: sticky;
    top: var(--headerHeight);
    background-color: var(--background);
    right: 0;
}
.ourAbilityWrapInfo svg {
    position: absolute;
    left: 22%;
    bottom: 0;
}
/*==========================ABILITY SECTION=============================*/
/*==========================HUMAN RESOURCE=============================*/
section.developHumanResourcesContainer {
    position: relative;
    width: 100%;
    min-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
}
section.developHumanResourcesContainer .overlay_wrap {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 1;
}
section.developHumanResourcesContainer .overlay_wrap::before {
    content: '';
    background-image: url("../img/h-r-overlay.webp");
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: .99;
}
section.developHumanResourcesContainer .overlay_wrap img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.developHumanResourcesHead {
    position: relative;
    z-index: 2;
    display: -ms-grid;
    display: grid;
    gap: 7rem;
    -ms-grid-columns: 1fr 7rem 1fr 7rem 1fr 7rem 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    margin-bottom: var(--margin-block);
}
.developHumanResourcesHead .content p {
    font-size: 2rem;
    margin: 0;
}
.developHumanResourcesHead .content {
    -ms-grid-column-span: 2;
    grid-column-end: 5;
    -ms-grid-column: 3;
    grid-column-start: 3;
    width: 70%;
    margin-top: 10px;
}
.developHumanResourcesHead .title-two-wrap {
    margin-top: 10px;
}
/*==========================HUMAN RESOURCE=============================*/
/*==========================MACHINERY SECTION============================*/
section.equipmentMachineryWrapper {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 5rem;
    height: 100vh;
}
section.equipmentMachineryWrapper #equipmentMachineryFrame {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 0;
}
canvas#frameWrapEM {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}
section.equipmentMachineryWrapper #equipmentMachineryFrame .first-frame {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 0;
}
#equipmentMachineryFrame .first-frame img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.equipmentMachineryInfoWrap {
    position: absolute;
    z-index: 1;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.5rem;
    gap: 3rem;
    bottom: 0;
    -webkit-padding-start: calc(1.5rem + 3rem);
    padding-inline-start: calc(1.5rem + 3rem);
    will-change: transform, opacity;
}

.equipmentMachineryInfoWrapper {
    position: absolute;
    left: var(--spaceX);
    bottom: 5rem;
}
.equipmentMachineryInfoWrap.main {
    background: rgba(30, 30, 30, 0.20);
    border-radius: var(--radius-box);
    left: var(--spaceX);
    bottom: 5rem;
    width: 702px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    backdrop-filter: blur(7px);
}

.machinerySketch {
    width: 20rem;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-box);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0.5rem;
}

.equipmentMachineryInfoWrap.main .machinerySketch {
    background: linear-gradient(180deg, var(--yellow) 0%, var(--dark-yellow) 100%);
}

.equipmentMachineryInfoWrap .logo-wrap {
    width: 8rem;
    aspect-ratio: 1 / 1;
}

.equipmentMachineryInfoWrap .logo-wrap img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: middle;
}

.machinerySketch img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: middle;
}

.equipmentMachineryItems {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .75rem;
    -webkit-padding-start: 1rem;
    padding-inline-start: 1rem;
    border-right: 1px solid var(--yellow);
}

.equipmentMachineryItems .equipmentMachineryItem span.title {
    font-size: .75rem;
    opacity: 0.7;
    margin-bottom: 5px;
    display: block;
}

.equipmentMachineryItems .equipmentMachineryItem p {
    margin: 0;
    font-size: 1.125rem;
    font-family: var(--font-arame), sans-serif;
}
section.machineryContainer {
    padding-block: var(--margin-block);
    position: relative;
    width: 100%;
    display: block;
}

.machinery-overlay {
    position: absolute;
    background: linear-gradient(180deg, var(--yellow) 0%, var(--yellow) 8.21%, rgba(232, 84, 22, 0.00) 58.86%);
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 0;
}

section.machineryContainer .machineryItems {
    position: relative;
    width: 100%;
    z-index: 1;
    aspect-ratio: 16 / 9;
}
.machineryItems .machinery-img {
    width: 100%;
    position: relative;
    z-index: 0;
}

.machineryItems .machinery-img img {
    width: 100%;
    aspect-ratio: 16 / 9;
}

section.machineryContainer .machineryItems .blurBtn {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 3.5rem;
    font-weight: 700;
    border: 4px solid var(--yellow);
    border-radius: var(--radius-box);
    padding: 1rem 5rem;
    background: rgba(30, 30, 30, 0.20);
    backdrop-filter: blur(6px);
}
/*==========================MACHINERY SECTION============================*/
/*==========================STATE SECTION============================*/
.stats-section {
    background-color: var(--bg-dark);
    padding: 80px 120px;
}
.stats-section__header,.state-grid-blank {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 64px;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3,1fr);
}

.stats-section__desc {
    font-size: 2.375rem;
    margin: 0;
    font-weight: 700;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2/4;
}
.section-index {
    font-size: 0.85rem;
    white-space: nowrap;
    padding-right: 24px;
}
.stats-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 4rem 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    grid-column-gap: 4rem;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2 / 4;
}
.stat-item {
    padding: 2rem 0;
    border-top: 1px solid var(--border-color);
}
.stat-number {
    display: block;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 16px;
    text-align: left;
    font-family: var(--font-rokh), sans-serif;
    direction: ltr;
}
.stat-label {
    font-size: 1.375rem;
    margin: 0;
    opacity: 0.5;
}
.state-grid-blank {
    margin-bottom: 0;
}
/*==========================STATE SECTION============================*/
/*=========================PARTNER SECTION===========================*/
.partners-section {
    position: relative;
    width: 100%;
    display: block;
}

/* Rock image â€” bottom left */
.partners-section__rock {
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 26vw;
    pointer-events: none;
    z-index: 0;
}

.partners-section__rock img {
    width: 100%;
    height: auto;
    -o-object-fit: contain;
    object-fit: contain;
    -webkit-filter: brightness(0.65) sepia(0.4);
    filter: brightness(0.65) sepia(0.4);
}

/* Header */
.partners-section__header {
    display: -ms-grid;
    display: grid;
    position: relative;
    z-index: 1;
    margin-bottom: 3rem;
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3,1fr);
}

.partners-section__title-wrap,.partners-grid {-ms-grid-column: 2;-ms-grid-column-span: 2;grid-column: 2 / 4;}

.partners-section__title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 900;
    color: var(--text-white);
    margin: 0;
    line-height: 1.3;
}

.partners-section__sub {
    margin: 8px 0 .75rem 0;
    font-size: 1.125rem;
    font-weight: 700;
}

/* Partners 3-col grid */
.partners-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 2.5rem 1fr 2.5rem 1fr;
    grid-template-columns: repeat(3, 1fr);
    position: relative;
    z-index: 1;
    grid-column-gap: 2.5rem;
}

/* Partner list */
.partners-col {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Each partner row */
.partner-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: .75rem 0;
    border-bottom: 1px solid var(--white);
    gap: 1rem;
}

.partner-item:last-child {
}

/* Abbreviation badge */
.partner-abbr {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-btn);
    background-color: var(--border-color);
    color: var(--foreground);
    font-size: 1rem;
    font-weight: 500;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.partner-name {
    font-size: 1rem;
}
.partners-content-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative;
    z-index: 1;
}
.partner-frame {
    position: absolute;
    z-index: 0;
    right: 0;
    width: 53vw;
    pointer-events: none;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.partner-frame img {
    width: 100%;
}
/*=========================PARTNER SECTION===========================*/
/*==============PANELS===============*/
#panels {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
#panels #panels-container {
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 0;
    overflow: hidden;
    -webkit-padding-end: 5rem;
    padding-inline-end: 5rem;
}
#panels #panels-container .panel {
    position: relative;
    /* min-width: 100vw; */
    height: 100vh;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-padding-start: var(--spaceX);
    padding-inline-start: var(--spaceX);
    -webkit-padding-end: var(--spaceXXX);
    padding-inline-end: var(--spaceXXX);
}
#panels-wrapper {
    overflow: hidden;
    position: relative;
}

#panels-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    will-change: transform;
}

.panel {
    width: 100vw;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    overflow: hidden;
}
.panel-media-items {
    position: relative;
    width: 24vw;
    height: 29vw;
}

.panel-info-wrapper {
    width: 30vw;
    direction: rtl;
    padding-bottom: 4rem;
}

.panel-media-item:first-child {
    width: 20rem;
    aspect-ratio: 2 / 3;
}

.panel-media-item img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
}

.panel-media-item:last-child {
    width: 21rem;
    aspect-ratio: 16 / 9;
    position: absolute;
    right: 0;
    bottom: 0;
}
.wave-box {
    position: absolute;
    bottom: 33vh;
    left: 0;
    width: 100%;
}
.wave-box svg {
    width: 100%;
}
.panel-info-wrapper h2 {
    margin-top: 0;
    font-size: 2.375rem;
}
#panels #panels-container .panel svg {
    position: absolute;
    bottom: 33vh;
    left: 0;
    width: 100%;
}
line.wave-connector {
    will-change: stroke-dashoffset;
    -webkit-transition: stroke-dashoffset var(--ease) 1s;
    transition: stroke-dashoffset var(--ease) 1s;
}
/*==============PANELS===============*/
/*==============FEATURE PROJECTS===============*/
.featureProjectsContainer {
    position: relative;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding-top: var(--headerHeight);
    overflow: hidden;
}
.featureProjectsContainer .featureProjectsOverlay {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 0;
}
.featureProjectsContainer .featureProjectsOverlay img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.featureProjectsWrapper {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(100vh - var(--headerHeight) * 2 - 3rem);
}
.featureProjectsImage {
    aspect-ratio: 2 / 3;
    width: 12vw;
}

.featureProjectsImage img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
}

.featureProjectsWrap {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    height: 100%;
}
.featureProjectsInfoWrapper {
    width: 35%;
}

.featureProjectsImagesWrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: calc(12vw + 1rem);
    gap: 1rem;
}

.featureProjectsImage.one {
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.featureProjectsInfoWrapper h2 {
    margin-top: 0;
}

.featureProjectsInfoWrapper .content p {
    font-size: 1.5rem;
    margin-bottom: 0;
}
.featureProjectsWrap,
.featureProjectsInfoWrapper,
.featureProjectsImage {
    will-change: transform, opacity;
}
.featureProjectsProgressWrap {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    bottom: 3rem;
    right: var(--spaceX);
    width: 40vw;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.progressItems {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 4px;
    background: rgba(255,255,255,0.15);
    border-radius: 2px;
    overflow: visible;
    width: 50vw;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.progressItem {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 100%;
    background: var(--yellow);
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    border-radius: 2px;
    margin-right: 4px;
    will-change: transform;
}

.progressItem:last-child {
    margin-right: 0;
}

.progressTruck {
    position: absolute;
    left: 0;
    z-index: 10;
    bottom: 0;
    width: 6rem;
    height: 4rem;
    will-change: transform;
}

.progressTruck img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-position: bottom;
    object-position: bottom;
    -o-object-fit: contain;
    object-fit: contain;
}
.hand-one {
    position: absolute;
    z-index: 2;
    right: -20px;
    width: 18rem;
    will-change: transform;
}

.hand-two {
    position: absolute;
    z-index: 3;
    left: -10px;
    bottom: 32px;
    width: 17rem;
    will-change: transform;
}
/*==============FEATURE PROJECTS===============*/
/*==================HOME BLOG==================*/
section.homeBlogContainer {
    position: relative;
    width: 100%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3,1fr);
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}
.homeBlogTitleBox {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-column: 1/2;
    position: sticky;
    top: var(--headerHeight);
}
.homeBlogWrapper {
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2/4;
}
.stickyBlogWrap {
    position: relative;
    width: 100%;
    display: block;
    margin-bottom: 4rem;
}
.stickyBlogMedia {
    position: relative;
    width: 100%;
    aspect-ratio: 19 / 9;
    border-radius: var(--radius-box);
    margin-bottom: 2rem;
    overflow: hidden;
}
.stickyBlogMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
    vertical-align: middle;
    -webkit-transition: -webkit-transform 0.4s ease;
    transition: -webkit-transform 0.4s ease;
    transition: transform 0.4s ease;
    transition: transform 0.4s ease, -webkit-transform 0.4s ease;
    will-change: transform;
}
body[data-pagetype="home"] .related-posts-grid {
    grid-gap: 10px;
}
body[data-pagetype="home"] .related-post-card__body {
    padding: .75rem;
    height: 100%;
}
.stickyBlogWrap .stickyBlogInfo {
    position: relative;
    width: 50%;
}

.stickyBlogWrap .stickyBlogInfo h3 {
    margin: 0;
    font-size: 2.875rem;
}

.stickyBlogWrap .stickyBlogInfo p.blog-author {
    font-size: 1.125rem;
    font-weight: 700;
}

.stickyBlogWrap .stickyBlogInfo .blog-content {
    font-size: .75rem;
    opacity: .7;
}

.stickyBlogWrap:hover .stickyBlogMedia img {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}
section.related-posts {
    margin-bottom: 4rem;
}

section.homeBlogContainer .btn-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
/*==================HOME BLOG==================*/
/*===============PODCAST SECTION===============*/
section.homePodcastContainer {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh;
    padding-bottom: 8rem;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
section.homePodcastContainer .featurePodcastWrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
    inset: 0;
    padding-inline: var(--spaceX);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 8rem;
}
section.homePodcastContainer .featurePodcastWrapper .featurePodcastMedia {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 0;
}

section.homePodcastContainer .featurePodcastWrapper .featurePodcastMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.featurePodcastTitleCTA {
    position: relative;
    z-index: 2;
    width: 20vw;
}

.featurePodcastTitleCTA h3 {
    margin: 0 0 1.25rem 0;
    font-size: 1.625rem;
}

.homePodcastWrapper {
    position: relative;
    z-index: 2;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 3.5rem 1fr 3.5rem 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    width: 40vw;
    grid-gap: 3.5rem;
}

.homePodcastWrap {
    position: relative;
    width: 100%;
    display: block;
}

.homePodcastMediaDurationWrap {
    position: relative;
}

.homePodcastMedia {
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    z-index: 0;
    border-radius: var(--radius-box);
    overflow: hidden;
}
.podcast-duration {
    position: absolute;
    z-index: 1;
    left: 1.5rem;
    top: 1.5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .5rem;
    background-color: var(--gray);
    padding: 5px 12px;
    border-radius: .75rem;
}
.podcast-duration p {
    margin: 0;
    font-size: .75rem;
}
.homePodcastMedia img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: var(--radius-box);
    position: relative;
    z-index: 0;
}
.podcast-duration [class^="icon-"] {
    color: var(--yellow);
}

.homePodcastWrap .podcast-title {
    margin-bottom: 0;
    font-weight: 700;
}
section.homePodcastContainer .featurePodcastWrapper .featurePodcastMedia::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 75.23%, #000 100%), linear-gradient(124deg, rgba(200, 55, 11, 0.00) 46.73%, #f5b800 105.2%), linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%);
}
/*===============PODCAST SECTION===============*/
@media (max-width: 1024px) {
    .stats-section,
    .partners-section {
        padding: 60px 48px;
    }
}

@media (max-width: 768px) {
    .stats-section,
    .partners-section {
        padding: 48px 24px;
    }

    .stats-grid {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .stat-item:nth-child(even) {
        border-right: none;
        padding-right: 0;
    }
    .partners-grid {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        gap: 0;
    }
    .partners-section__rock {
        width: 200px;
        opacity: 0.4;
    }
}
@media only screen and (max-width: 768px){}
@media only screen and (min-width: 640px) and (max-width: 768px){}
@media only screen and (min-width: 769px) and (max-width: 1199px){}
@media only screen and (min-width: 1200px) and (max-width: 1399px){}
@media only screen and (min-width: 1400px) and (max-width: 1700px){}