body {
    color: #333;
    background-color: #fff;
    min-height: 100%;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 20px
}

.nav-button {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    border: 1px solid var(--white);
    background-color: var(--black);
    filter: invert(0%);
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    padding: 8px 34px;
    transition: filter .4s;
    display: flex
}

.nav-button:hover {
    filter: invert()
}

.nav-button.res-hide {
    border-color: var(--white-border)
}
img {
    vertical-align: middle;
    max-width: 100%;
    display: inline-block
}

.faq-section {
    padding-top: 120px;
    padding-bottom: 120px;
    background-color: #f5f5f5;
}

.w-inline-block {
    max-width: 100%;
    display: inline-block
}

.w-button {
    color: #fff;
    line-height: inherit;
    cursor: pointer;
    background-color: #3898ec;
    border: 0;
    border-radius: 0;
    padding: 9px 15px;
    text-decoration: none;
    display: inline-block
}

h1,
h2,
h3,
h4,
h5 {
    margin-bottom: 10px;
    font-weight: 700
}

h1 {
    margin-top: 20px;
    font-size: 38px;
    line-height: 44px
}

h2 {
    margin-top: 20px;
    font-size: 32px;
    line-height: 36px
}

h3 {
    margin-top: 20px;
    font-size: 24px;
    line-height: 30px
}

h4 {
    margin-top: 10px;
    font-size: 18px;
    line-height: 24px
}

h5 {
    margin-top: 10px;
    font-size: 14px;
    line-height: 20px
}

p {
    margin-top: 0;
    margin-bottom: 10px
}

ul {
    margin-top: 0;
    margin-bottom: 10px;
    padding-left: 40px
}

.w-embed:before,
.w-embed:after {
    content: " ";
    grid-area: 1/1/2/2;
    display: table
}

.w-embed:after {
    clear: both
}

.w-form {
    margin: 0 0 15px
}

.w-form-done {
    text-align: center;
    background-color: #ddd;
    padding: 20px;
    display: none
}

.w-form-fail {
    background-color: #ffdede;
    margin-top: 10px;
    padding: 10px;
    display: none
}

.w-input,
.w-select {
    color: #333;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #ccc;
    width: 100%;
    height: 38px;
    margin-bottom: 10px;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 1.42857;
    display: block
}

.w-input:focus,
.w-select:focus {
    border-color: #3898ec;
    outline: 0
}

textarea.w-input {
    height: auto
}

.w-select {
    background-color: #f3f3f3
}

.w-form-label {
    cursor: pointer;
    margin-bottom: 0;
    font-weight: 400;
    display: inline-block
}

.main-container {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto
}

.main-container:before,
.main-container:after {
    content: " ";
    grid-area: 1/1/2/2;
    display: table
}

.main-container:after {
    clear: both
}

@media screen and (max-width: 991px) {
    .main-container {
        max-width: 728px
    }

}

@media screen and (max-width: 479px) {
    .main-container {
        max-width: none
    }
}

.w-slider {
    text-align: center;
    clear: both;
    -webkit-tap-highlight-color: #0000;
    tap-highlight-color: #0000;
    background: #ddd;
    height: 300px;
    position: relative
}

.w-slider-mask {
    z-index: 1;
    white-space: nowrap;
    height: 100%;
    display: block;
    position: relative;
    left: 0;
    right: 0;
    overflow: hidden
}

.w-slide {
    vertical-align: top;
    white-space: normal;
    text-align: left;
    width: 100%;
    height: 100%;
    display: inline-block;
    position: relative
}

.w-slider-nav {
    z-index: 2;
    text-align: center;
    -webkit-tap-highlight-color: #0000;
    tap-highlight-color: #0000;
    height: 40px;
    margin: auto;
    padding-top: 10px;
    position: absolute;
    inset: auto 0 0
}

.w-slider-nav-invert {
    color: #fff
}

.w-slider-arrow-left,
.w-slider-arrow-right {
    cursor: pointer;
    color: #fff;
    -webkit-tap-highlight-color: #0000;
    tap-highlight-color: #0000;
    -webkit-user-select: none;
    user-select: none;
    width: 80px;
    margin: auto;
    font-size: 40px;
    position: absolute;
    inset: 0;
    overflow: hidden
}

.w-slider-arrow-left [class^=w-icon-],
.w-slider-arrow-right [class^=w-icon-] {
    position: absolute
}

.w-slider-arrow-left:focus,
.w-slider-arrow-right:focus {
    outline: 0
}

.w-slider-arrow-left {
    z-index: 3;
    right: auto
}

.w-slider-arrow-right {
    z-index: 4;
    left: auto
}

.w-icon-slider-left,
.w-icon-slider-right {
    width: 1em;
    height: 1em;
    margin: auto;
    inset: 0
}

.w-dropdown {
    text-align: left;
    z-index: 900;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    position: relative
}

.w-dropdown-toggle {
    vertical-align: top;
    color: #222;
    text-align: left;
    white-space: nowrap;
    margin-left: auto;
    margin-right: auto;
    padding: 20px;
    text-decoration: none;
    position: relative
}

.w-dropdown-toggle {
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    padding-right: 40px;
    display: inline-block
}

.w-dropdown-toggle:focus {
    outline: 0
}

.w-dropdown-list {
    background: #ddd;
    min-width: 100%;
    display: none;
    position: absolute
}

.w-dyn-bind-empty,
.w-condition-invisible {
    display: none !important
}

:root {
    --black: #0d0d0d;
    --text-color: #c9cacc;
    --white: #f5f5f5;
    --transparent: transparent;
    --black-border: #0000001a;
    --white-border: #ffffff1a;
    --text-color-02: #555
}

.first-container {
    max-width: 940px;
    margin-left: auto;
    margin-right: auto;
    display: block
}

.w-layout-grid {
    grid-row-gap: 16px;
    grid-column-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid
}

.w-commerce-commerceaddtocartform {
    margin: 0 0 15px
}

.w-commerce-commerceaddtocartoptionpillgroup {
    margin-bottom: 10px;
    display: flex
}

.w-commerce-commerceaddtocartoptionpill {
    color: #000;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #000;
    margin-right: 10px;
    padding: 8px 15px
}

.w-commerce-commerceaddtocartbutton {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-color: #3898ec;
    border-width: 0;
    border-radius: 0;
    align-items: center;
    padding: 9px 15px;
    text-decoration: none;
    display: flex
}

.w-commerce-commerceaddtocartoutofstock {
    background-color: #ddd;
    margin-top: 10px;
    padding: 10px
}

.w-commerce-commerceaddtocarterror {
    background-color: #ffdede;
    margin-top: 10px;
    padding: 10px
}

.w-commerce-commercebuynowbutton {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-color: #3898ec;
    border-width: 0;
    border-radius: 0;
    align-items: center;
    margin-top: 10px;
    padding: 9px 15px;
    text-decoration: none;
    display: inline-block
}

.w-checkbox {
    margin-bottom: 5px;
    padding-left: 20px;
    display: block
}

.w-checkbox:before {
    content: " ";
    grid-area: 1/1/2/2;
    display: table
}

.w-checkbox:after {
    content: " ";
    clear: both;
    grid-area: 1/1/2/2;
    display: table
}

.w-checkbox-input {
    float: left;
    margin: 4px 0 0 -20px;
    line-height: normal
}

.w-commerce-commercecartwrapper {
    display: inline-block;
    position: relative
}

.w-commerce-commercecartopenlink {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-color: #3898ec;
    border-width: 0;
    border-radius: 0;
    align-items: center;
    padding: 9px 15px;
    text-decoration: none;
    display: flex
}

.w-commerce-commercecartopenlinkcount {
    color: #3898ec;
    text-align: center;
    background-color: #fff;
    border-radius: 9px;
    min-width: 18px;
    height: 18px;
    margin-left: 8px;
    padding-left: 6px;
    padding-right: 6px;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    display: inline-block
}

.w-commerce-commercecartcontainerwrapper {
    z-index: 1001;
    background-color: #000c;
    position: fixed;
    inset: 0
}

.w-commerce-commercecartcontainerwrapper--cartType-modal {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex
}

.w-commerce-commercecartcontainer {
    background-color: #fff;
    flex-direction: column;
    width: 100%;
    min-width: 320px;
    max-width: 480px;
    display: flex;
    overflow: auto;
    box-shadow: 0 5px 25px #00000040
}

.w-commerce-commercecartheader {
    border-bottom: 1px solid #e6e6e6;
    flex: none;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    display: flex;
    position: relative
}

.w-commerce-commercecartheading {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0
}

.w-commerce-commercecartcloselink {
    width: 16px;
    height: 16px
}

.w-commerce-commercecartformwrapper {
    flex-direction: column;
    flex: 1;
    display: flex
}

.w-commerce-commercecartform {
    flex-direction: column;
    flex: 1;
    justify-content: flex-start;
    display: flex
}

.w-commerce-commercecartlist {
    -webkit-overflow-scrolling: touch;
    flex: 1;
    padding: 12px 24px;
    overflow: auto
}

.w-commerce-commercecartitem {
    align-items: flex-start;
    padding-top: 12px;
    padding-bottom: 12px;
    display: flex
}

.w-commerce-commercecartitemimage {
    width: 60px;
    height: 0%
}

.w-commerce-commercecartiteminfo {
    flex-direction: column;
    flex: 1;
    margin-left: 16px;
    margin-right: 16px;
    display: flex
}

.w-commerce-commercecartproductname {
    font-weight: 700
}

.w-commerce-commercecartoptionlist {
    margin-bottom: 0;
    padding-left: 0;
    text-decoration: none;
    list-style-type: none
}

.w-commerce-commercecartquantity {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fafafa;
    border: 1px solid #ddd;
    border-radius: 3px;
    width: 60px;
    height: 38px;
    margin-bottom: 10px;
    padding: 8px 6px 8px 12px;
    line-height: 20px;
    display: block
}

.w-commerce-commercecartquantity:focus {
    border-color: #3898ec;
    outline-style: none
}

.w-commerce-commercecartfooter {
    border-top: 1px solid #e6e6e6;
    flex-direction: column;
    flex: none;
    padding: 16px 24px 24px;
    display: flex
}

.w-commerce-commercecartlineitem {
    flex: none;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 16px;
    display: flex
}

.w-commerce-commercecartordervalue {
    font-weight: 700
}

.w-commerce-commercecartapplepaybutton {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-color: #000;
    border-width: 0;
    border-radius: 2px;
    align-items: center;
    height: 38px;
    min-height: 30px;
    margin-bottom: 8px;
    padding: 0;
    text-decoration: none;
    display: flex
}

.w-commerce-commercecartquickcheckoutbutton {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    background-color: #000;
    border-width: 0;
    border-radius: 2px;
    justify-content: center;
    align-items: center;
    height: 38px;
    margin-bottom: 8px;
    padding: 0 15px;
    text-decoration: none;
    display: flex
}

.w-commerce-commercequickcheckoutgoogleicon,
.w-commerce-commercequickcheckoutmicrosofticon {
    margin-right: 8px;
    display: block
}

.w-commerce-commercecartcheckoutbutton {
    color: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    text-align: center;
    background-color: #3898ec;
    border-width: 0;
    border-radius: 2px;
    align-items: center;
    padding: 9px 15px;
    text-decoration: none;
    display: block
}

.w-commerce-commercecartemptystate {
    flex: 1;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex
}

.w-commerce-commercecarterrorstate {
    background-color: #ffdede;
    flex: none;
    margin: 0 24px 24px;
    padding: 10px
}

@media screen and (max-width: 991px) {
    .first-container {
        max-width: 728px
    }
}

@media screen and (max-width: 767px) {
    .first-container {
        max-width: none
    }
}

@media screen and (max-width: 479px) {

    .w-commerce-commercecartcontainerwrapper--cartType-modal {
        flex-direction: row;
        justify-content: center;
        align-items: stretch
    }

    .w-commerce-commercecartquantity {
        font-size: 16px
    }
}

body {
    background-color: var(--black);
    color: var(--text-color);
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 200;
    line-height: 140%
}

h1 {
    color: var(--white);
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 200;
    line-height: 130%;
}

h2 {
    color: var(--white);
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 10vw;
    font-weight: 100;
    line-height: 130%
}

h3 {
    color: var(--white);
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 130%
}

h4 {
    color: var(--white);
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Montserrat, sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 130%
}

h5 {
    color: var(--white);
    text-transform: uppercase;
    margin-top: 0;
    margin-bottom: 0;
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 130%
}

p {
    margin-bottom: 0;
    font-weight: 400;
    line-height: 140%
}

a {
    color: var(--white);
    font-family: Inter, sans-serif;
    font-weight: 400;
    text-decoration: none
}

ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 40px;
    font-family: Inter, sans-serif;
    font-weight: 400
}

li {
    color: var(--text-color)
}

img {
    object-fit: cover;
    width: 100%;
    max-width: 100%;
    height: 100%;
    display: inline-block
}

label {
    margin-bottom: 0;
    font-weight: 500;
    display: block
}

.container {
    max-width: 1860px;
    padding-left: 15px;
    padding-right: 15px
}

.topbar-wrapper {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    color: var(--white);
    grid-template-rows: auto;
    grid-template-columns: min-content 1fr 1fr 1fr min-content min-content;
    grid-auto-columns: 1fr;
    justify-content: space-between;
    align-items: center;
    padding-top: 40px;
    font-family: Inter, sans-serif;
    font-weight: 400;
    display: grid
}

.time {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.primary-button {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    border: 1px solid var(--white);
    background-color: var(--black);
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    padding: 10px 34px;
    transition: border-color .4s, color .4s, background-color .4s;
    display: flex
}

.primary-button:hover {
    border-color: var(--black);
    background-color: var(--white);
    color: var(--black)
}

.primary-button.white {
    background-color: var(--white);
    color: var(--black);
    text-align: center
}

.primary-button.white:hover {
    border-color: var(--white);
    background-color: var(--black);
    color: var(--white)
}

.primary-button.res-hide {
    align-self: center
}

.primary-button.res-show {
    align-self: center;
    display: none
}

.main-icon {
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex
}

.appointment-icon {
    flex: none;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    display: flex
}

.banner-heading-wrapper {
    width: 100%;
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.gradient-block {
    justify-content: center;
    align-items: center;
    display: flex;
    overflow: hidden;
    position: relative;
}

.gradient-block h1 {
    font-size: clamp(2rem, 12vw, 8rem);
    background-image: linear-gradient(268.79deg, var(--black), var(--text-color) 9.96%, var(--text-color) 89.37%, var(--black));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: -0.02em;
    line-height: 1;
    position: relative;
    display: inline-block;
    font-weight: 200;
}

.char {
    display: inline-block;
    opacity: 0;
    animation: fadeIn 0.8s ease-out forwards;
    background-image: inherit;
    -webkit-background-clip: text;
    background-clip: text;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.click-next-wrapper {
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
    inset: auto 0% 0%
}

.click-next-link {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    background-color: var(--white);
    background-image: radial-gradient(circle farthest-corner at 50% 50%, var(--transparent), var(--black));
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.click-next-icon {
    justify-content: center;
    align-items: center;
    display: flex
}

.tool-detail-section {
    background-image: url(https://cdn.prod.website-files.com/67bd5945e3c3279c596c901f/6810a300dc0b5129da67e70d_Tool%20Bg%20Image.avif);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

.tool-grid {
    z-index: 1;
    grid-template-rows: auto;
    position: relative
}

.tool-detail-heading {
    text-align: right;
    margin-top: 140px;
    margin-bottom: 140px;
    position: relative
}

.tool-detail-marquee {
    flex-flow: column;
    max-width: 590px;
    max-height: 880px;
    display: flex;
    overflow: hidden;
}

.tool-card {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 298px;
    display: flex;
}

@keyframes scrollUpMarquee {
    0% {
        transform: translateY(0%);
    }

    100% {
        transform: translateY(-50%);
    }
}

.took-marquee-wrapper {
    display: grid;
    grid-column-gap: 100px;
    grid-row-gap: 100px;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    padding-top: 50px;
    padding-bottom: 50px;
    animation: scrollUpMarquee 40s linear infinite;
}

.shade-r {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    color: #000;
    /* you can adjust color */
}

.marquee-shodow-top {
    z-index: 1;
    background-image: linear-gradient(180deg, var(--black), var(--transparent));
    min-height: 150px;
    position: absolute;
    inset: -1px 0% auto
}

.marquee-shodow-bottom {
    z-index: 1;
    background-image: linear-gradient(0deg, var(--black), var(--transparent));
    min-height: 150px;
    position: absolute;
    inset: auto 0% -1px
}

.about-section {
    background-color: var(--white);
    color: var(--black);
    padding-top: 100px;
    padding-bottom: 100px;
    overflow: hidden
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    /* ensures both columns start from top */
    gap: 4vw;

}

.about-heading-wrapper {
    flex-flow: column;
    justify-content: flex-end;
    align-items: flex-start;
    max-width: 740px;
    display: flex;
    position: relative;
}

.about-heading {
    color: #0000004d;
    font-size: 6.5vw;
    font-weight: 200;
    line-height: 130%;
}

.about-right {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: flex-start;
    align-self: flex-end;
    align-items: flex-end;
    display: flex
}

.about-text {
    max-width: 520px;
    font-family: Inter, sans-serif
}

.about-block {
    perspective: 1000px;
    width: 300px;
    position: relative;
}

.about-image-block {
    position: relative;
    width: 300px;
    height: 300px;
    overflow: hidden;
}

/* Image styles */
.image-show {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1s ease;
    z-index: 1;
}

.image-show.active {
    opacity: 1;
    z-index: 1;
}

/* Curtains */
.curtain-top,
.curtain-bottom {
    position: absolute;
    left: 0;
    width: 100%;
    height: 50%;
    background: black;
    z-index: 2;
    transition: transform 1s ease;
}

.curtain-top {
    top: 0;
    transform: translateY(-100%);
}

.curtain-bottom {
    bottom: 0;
    transform: translateY(100%);
}

.curtain-fall .curtain-top {
    transform: translateY(0%);
}

.curtain-fall .curtain-bottom {
    transform: translateY(0%);
}

.curtain-open .curtain-top {
    transform: translateY(-100%);
}

.curtain-open .curtain-bottom {
    transform: translateY(100%);
}

.about-image-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: row;
    flex: none;
    justify-content: flex-start;
    align-items: flex-end;
    display: flex;
}

.social-media-wraper {
    grid-column-gap: 70px;
    grid-row-gap: 70px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.social-media {
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: flex;
    position: relative;
    overflow: hidden
}

.service-section {
    background-color: var(--black);
    padding-top: 100px;
    padding-bottom: 100px;
    position: relative
}

.service-wrapper {
    grid-column-gap: 280px;
    flex-flow: column;
    justify-content: space-between;
    align-items: stretch;
    display: flex;
    position: relative
}

.service-card {
    color: var(--white);
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    font-family: Montserrat, sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 150%;
    display: flex
}

.service-card-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    display: flex
}

.service-card-wrapper.service-card-wrapper-01 {
    justify-content: space-between;
    align-items: center
}

.service-card-wrapper.service-card-wrapper-02 {
    justify-content: space-around;
    align-items: center
}

.service-section {
background-color: var(--black);
    padding-top: 100px;
    padding-bottom: 100px;
    position: relative;
}

.service-image-wrapper {
    position: absolute;
    inset: 0%;
    width: 100%;
}

.service-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.6s ease;
    pointer-events: none;
}

.service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Show images on hover - Use !important to override inline styles */
.service-image_01.active {
    opacity: 1 !important;
}

.service-image_02.active {
    opacity: 1 !important;
}

.service-image_03.active {
    opacity: 1 !important;
}

.service-image_04.active {
    opacity: 1 !important;
}

.service-image_05.active {
    opacity: 1 !important;
}

/* Service wrapper positioning */
.service-wrapper {
    position: relative;
    z-index: 2;
}

/* Optional: Style for service cards on hover */
.service-card_01:hover,
.service-card_02:hover,
.service-card_03:hover,
.service-card_04:hover,
.service-card_05:hover {
    transform: translateY(-2px);
    transition: transform 0.3s ease;
}

.faq-grid {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: space-between;
    align-items: flex-start;
    display: flex
}

.faq-heading {
    color: var(--black);
    max-width: 435px;
    font-size: 50px;
    font-weight: 300
}

.faq-wrapper {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 1050px
}

.faq {
    z-index: 0;
    border-bottom: 1px solid var(--black-border);
    color: var(--black);
    width: 100%
}

.faq.last {
    border-bottom-style: none
}

.faq-qus {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    white-space: normal;
    justify-content: space-between;
    align-items: center;
    padding: 30px 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 140%;
    display: flex;
    position: relative
}

.icon-flex {
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex
}

.faq-ans-block {
    position: static
}

.faq-ans {
    max-width: 920px;
    padding-bottom: 30px;
    font-size: 16px
}

.tag-marquee-section {
    background-color: var(--white);
    padding-top: 60px;
    padding-bottom: 60px;
    overflow-x: clip
}

.tag-marquee-wrapper {
    flex: none;
    justify-content: flex-end;
    margin-left: -5px;
    margin-right: -5px;
    padding-top: 15px;
    padding-bottom: 15px;
    display: flex;

    width: 100vw;
    overflow: hidden;
    position: relative;
}

.tag-marquee-wrapper.primary {
    z-index: 1;
    background-color: var(--black);
    color: var(--text-color);
    position: relative;
    transform: rotate(3.09deg);
    white-space: nowrap;
}

.tag-marquee-wrapper.secondary {
    color: var(--black);
    background-color: #dfdfdf;
    transform: translateY(-20px)rotate(-3.17deg);
    white-space: nowrap;
}

.tag-marquee-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    text-transform: uppercase;
    flex: none;
    justify-content: space-between;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: 500;
    display: flex;
    white-space: nowrap;

    width: max-content;
    /* ensures content flows horizontally */
    will-change: transform;
}

.tag-marquee {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex: none;
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: inherit;
    white-space: nowrap;
}

.pricing-section {
    padding-top: 100px;
    padding-bottom: 100px
}

.pricing-grid {
    grid-column-gap: 50px;
    grid-row-gap: 100px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%
}

.pricing-block {
    grid-column-gap: 26px;
    grid-row-gap: 26px;
    flex-flow: column;
    display: flex
}

.pricing-detail-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    color: #ccc;
    flex: none;
    justify-content: space-between;
    align-items: center;
    font-family: Inter, sans-serif;
    display: flex
}

.pricing-border {
    background-color: var(--white-border);
    width: 100%;
    height: 1px
}

.price-detail-block {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    display: flex
}

.price-grid-wrap {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex
}

.blog-section {
    background-color: var(--white);
    padding-top: 100px
}

.section-heading-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex
}

.section-heading {
    color: var(--black);
    font-size: 30px;
    font-weight: 400;
    line-height: 120%
}

.blog-grid {
    grid-column-gap: 30px;
    grid-row-gap: 60px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 100%;
    display: grid
}

.blog-image {
    height: 420px;
    position: relative;
    overflow: hidden;
}

.picture-show {
    width: 100%;
    display: block;
    opacity: 0 !important;
    transition: opacity 0.8s ease-in-out,
        transform 0.7s ease-in-out;
    /* medium speed zoom */
    transform: scale(1);
    position: relative;
    z-index: 1;
}

.blog-image:hover .picture-show {
    transform: scale(1.08);
    /* subtle but noticeable zoom */
}

/* Curtains default off-screen */
.curtain {
    position: absolute;
    width: 100%;
    height: 50%;
    background-color: black;
    z-index: 2;
    transition: transform 1s ease-in-out;
    will-change: transform;
}

.curtain-top {
    top: 0;
    transform: translateY(-100%);
}

.curtain-bottom {
    bottom: 0;
    transform: translateY(100%);
}

/* Step 1: curtains fall to center */
.blog-card.step-1 .curtain-top {
    transform: translateY(0%);
}

.blog-card.step-1 .curtain-bottom {
    transform: translateY(0%);
}

/* Step 2: curtains open + image fades in */
.blog-card.step-2 .curtain-top {
    transform: translateY(-100%);
}

.blog-card.step-2 .curtain-bottom {
    transform: translateY(100%);
}

.blog-card.step-2 .picture-show {
    opacity: 1 !important;
}

.blog-card {
    grid-column-gap: 15px;
    grid-row-gap: 15px;
    color: var(--black);
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
    display: flex
}

.blog-add-date {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.blog-detail-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    flex: 1;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
    display: flex
}

.blog-heading {
    color: var(--black);
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 400
}

.read-more-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-content: flex-start;
    align-items: center;
    margin-top: 10px;
    font-weight: 500;
    display: flex
}

.section-grid-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: stretch;
    display: flex
}

.section-grid-wrapper.res-show {
    display: none
}

.gallery-section {
    background-color: var(--white);
    padding-top: 100px;
    padding-bottom: 100px
}

.gallery-heading-block {
    z-index: 2;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    background-color: var(--white);
    flex-flow: column;
    justify-content: center;
    align-items: center;
    width: 252px;
    height: 252px;
    display: flex;
    position: absolute;
    inset: 0% auto
}

.gallery-wrapper {
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative
}

.gallery-heading {
    color: var(--black);
    text-align: center;
    max-width: 185px;
    font-size: 30px;
    font-weight: 400;
    line-height: 120%
}

.footer-contact-link {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-content: flex-start;
    align-items: center;
    transition: transform .4s;
    display: flex
}

.footer-contact-link:hover {
    transform: translateY(-4px)
}

.footer-marquee-wrapper {
    grid-column-gap: 50px;
    grid-row-gap: 50px;
    flex: none;
    justify-content: center;
    align-items: center;
    padding-left: 25px;
    padding-right: 25px;
    display: flex;
    animation: marquee 20s linear infinite;
}

.footer-grid {
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 50px;
    display: flex;
    position: relative
}

.webflow-link {
    text-decoration: underline
}

.footer-marquee-arrow {
    display: flex
}

.footer-link {
    grid-column-gap: 1px;
    grid-row-gap: 1px;
    text-decoration: underline;
    -webkit-text-decoration-color: var(--transparent);
    text-decoration-color: var(--transparent);
    flex-flow: column;
    flex: 0 auto;
    justify-content: flex-start;
    align-items: flex-start;
    font-weight: 400;
    text-decoration-thickness: 2px;
    transition: transform .4s;
    display: flex;
    overflow: hidden
}

.footer-link:hover {
    transform: translateY(-4px)
}

.footer-marquee-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    color: var(--black);
    text-transform: uppercase;
    background-color: #fff;
    border-radius: 100px;
    flex: none;
    justify-content: center;
    align-items: center;
    padding: 10px 36px;
    font-family: Montserrat, sans-serif;
    font-size: 40px;
    font-weight: 300;
    line-height: 140%;
    display: flex
}

.rights-link {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    text-align: center;
    flex-flow: wrap;
    justify-content: space-between;
    align-items: center;
    padding-top: 40px;
    padding-bottom: 40px;
    font-family: Inter, sans-serif;
    line-height: 140%;
    display: flex;
    position: relative
}

.footer-link-block {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    display: flex
}

.footer-link-wrapper {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex
}

.footer-marquee {
    display: flex;
    position: relative;
    overflow-x: clip;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

.footer-social-link {
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: flex;
    position: relative;
    overflow: hidden
}

.footer-section {
    background-color: var(--black);
    color: var(--text-color);
    padding-top: 60px;
    position: relative;
    overflow: hidden
}

.footer-contact-link-text {
    grid-column-gap: 1px;
    grid-row-gap: 1px;
    flex-flow: column;
    flex: 0 auto;
    justify-content: flex-start;
    align-items: flex-start;
    font-weight: 400;
    display: flex;
    overflow: hidden
}

.footer-social-link-wrappr {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.footer-contact-icon {
    flex: none
}

.footer-contact-link-wrapper {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 402px;
    display: flex
}

.foote-hading {
    font-size: 22px;
    font-weight: 600;
    line-height: 120%
}

.menu-button {
    z-index: 99999;
    border: 1px solid var(--white-border);
    background-color: var(--black);
    filter: invert(0%);
    cursor: pointer;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    padding: 14px;
    transition: filter .4s;
    position: relative
}

.menu-button:hover {
    filter: invert()
}

.nav-social-wrapper {
    z-index: 9999999;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-direction: column;
    align-items: flex-end;
    margin-right: 100px;
    display: flex;
    position: static;
    left: 45%;
    right: auto
}

.nav-social-link {
    opacity: 1;
    color: var(--white);
    letter-spacing: 1.04px;
    text-transform: uppercase;
    font-size: 13px;
    line-height: 130%;
    text-decoration: none;
    transition: opacity .4s
}

.nav-social-link:hover {
    opacity: .6
}

.nav-menu-wrapper {
    z-index: 88888;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    display: none;
    position: fixed;
    inset: 0%
}

.nav-menu-bg {
    z-index: 8888;
    background-color: var(--black);
    display: block;
    position: fixed;
    inset: 0%
}

.nav-link {
    opacity: .3;
    color: var(--white);
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 64px;
    font-weight: 300;
    line-height: 120%;
    transition: opacity .4s
}

.nav-link:hover,
.nav-link.w--current {
    opacity: 1
}

.nav-menu-links {
    z-index: 999999;
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-direction: column;
    align-items: flex-start;
    margin-left: 100px;
    display: flex;
    position: static;
    left: 65px
}

.testimonial-section {
    background-color: var(--white);
    color: var(--black);
    padding-top: 100px;
    padding-bottom: 100px
}

.gallery-icon {
    filter: invert()
}

.service-list-grid {
    grid-column-gap: 30px;
    grid-row-gap: 50px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid
}

.service-list-card {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: row;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    align-items: flex-start;
    height: 100%;
    display: grid;
    position: relative
}

.service-list-image {
    height: 100%;
    position: relative;
    overflow: hidden
}

.service-list-detail-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    flex: 1;
    justify-content: center;
    align-items: flex-start;
    height: 100%;
    display: flex
}

.service-list-heading {
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 130%
}

.read-more-icon {
    display: flex
}

.read-more-icon.white {
    filter: invert()
}

.service-text {
    color: var(--text-color-02);
    height: 62px;
    font-size: 14px;
    overflow: hidden
}

.service-text.white {
    color: var(--text-color)
}

.pricing-list-heading {
    font-family: Montserrat, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 150%
}

.blog-date-icon {
    filter: invert();
    flex: none;
    display: flex
}

.blog-date-icon.black {
    filter: none;
    flex: none
}

.inner-container {
    max-width: 1440px;
    padding-left: 15px;
    padding-right: 15px
}

.tool-card-text {
    font-size: 20px;
    line-height: 150%
}

.price-detail {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    display: flex
}

.image-show-top {
    z-index: 1;
    background-color: var(--black);
    height: 0%;
    position: absolute;
    inset: 0% 0% auto;
    top: 0;
    transform: translateY(-100%);
}

.image-show-top.white {
    background-color: var(--white)
}

.image-show-bottom {
    z-index: 1;
    background-color: var(--black);
    height: 0%;
    position: absolute;
    inset: auto 0% 0%;
    bottom: 0;
    transform: translateY(100%);
}

.step-1 .image-show-top,
.step-1 .image-show-bottom {
    transform: translateY(0%);
}

.step-2 .image-show-top {
    transform: translateY(-100%);
}

.step-2 .image-show-bottom {
    transform: translateY(100%);
}

.image-show-bottom.white {
    background-color: var(--white)
}

.gallery-insta-link {
    position: relative
}

.gallery-link-layer {
    background-image: linear-gradient(#0000004d, #0000004d);
    flex-flow: column;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    inset: 0%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.gallery-insta-link:hover .gallery-link-layer {
    opacity: 1;
}

.pricing-card-heading {
    color: var(--white);
    font-size: 20px;
    font-weight: 300
}

.logo {
    border: 1px solid var(--white-border);
    background-color: var(--black);
    filter: invert(0%);
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    padding: 20px;
    transition: filter .4s;
    display: flex
}

.logo:hover {
    filter: invert()
}

.about-section-heading {
    z-index: 1;
    position: relative;
}

.gallery-slider {
    background-color: var(--transparent);
    width: 100%;
    height: 100%;
    overflow: hidden
}

.gallery-left-arrow,
.gallery-right-arrow,
.gallery-slide-nav {
    display: none
}

.gallery-mask {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    scroll-behavior: smooth;
    width: 100%;
    height: 100%;

}

.gallery-slide {
    flex: 0 0 auto;
    width: 250px;
    height: 300px;
    /* or the actual width of your image */
    margin: 0 5.8px;
    /* remove gap */
}

.blog-read-more-icon {
    display: flex
}

.service-card-detail-wrapper {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: column;
    display: flex
}

.blog-card-detail {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    display: flex
}

.tool-detail-heading {
    position: relative;
}

.tool-section-heading {
    color: rgba(249, 250, 252, 0.3);
    /* light gray base */
    font-size: 6.5vw;
    font-weight: 200;
    line-height: 1.3;
    margin: 0;
    position: relative;
}

.tool-section-heading .line {
    display: block;
}

.tool-fill-heading-block {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    width: 100%;
    height: 100%;
}

.tool-fill-heading {
    font-size: 6.5vw;
    font-weight: 200;
    line-height: 1.3;
    margin: 0;
    color: transparent;
}

.tool-fill-heading .line {
    display: block;
}

.tool-letter {
    color: white !important;
}

.spacer {
    height: 100vh;
}

.about-section-heading {
    position: relative;
}

.about-heading,
.fill-about-heading {
    font-size: 6.5vw;
    font-weight: 200;
    line-height: 1.3;
    margin: 0;
    white-space: normal;
    display: block;
}

.about-heading {
    color: var(--gray);
}

.about-fill-heading-block {
    position: absolute;
    top: 0;
    left: -1px;
    width: 100%;
    pointer-events: none;
}

.fill-about-heading {
    color: transparent;
}

.line {
    display: inline-flex;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.letter {
    display: inline-block;
    color: var(--black);
    opacity: 0;
    transition: opacity 0.1s ease;
}

.letter.reveal {
    opacity: 1;
}

.about-image-left-arrow,
.about-image-right-arrow,
.about-image-slide-nav {
    display: none
}

.about-image-slide {
    perspective: 1000px;
    position: relative
}

.about-slider {
    background-color: var(--transparent);
    height: 100%
}

.testimonial-writer-info-block {
    justify-content: flex-start;
    align-items: flex-end;
    display: flex;
    position: relative
}

.testimonial-heading {
    color: var(--black);
    margin-bottom: 5px;
    font-family: Montserrat, sans-serif;
    font-size: 40px;
    font-weight: 300
}

.testimonial-writer-name {
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 600;
    line-height: 140%
}

.testimonial-grid {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: .5fr 1fr;
    height: 100%
}

.testimonial-heading-tag {
    color: var(--black);
    text-transform: uppercase;
    font-size: 14px;
    line-height: 140%
}

.testimonial-writer-position {
    color: var(--text-color-02);
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%
}

.testimonial-left-arrow {
    border: 2px solid var(--black);
    color: var(--black);
    width: 40px;
    height: 40px;
    font-size: 20px;
    display: none;
    inset: auto 60px 0% auto
}

.quota-image {
    position: absolute;
    inset: 0% auto 0% 10%
}

.testimonial-detail-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    color: var(--text-color-02);
    flex-flow: column;
    justify-content: flex-end;
    align-items: flex-start;
    font-family: Inter, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    display: flex
}

.testimonial-slide-nav {
    max-height: 16px;
    padding: 0;
    font-size: 14px;
    position: absolute;
    inset: auto 0% -12% auto
}

.testimonial-slider {
    background-color: #0000;
    height: 100%;
    position: relative
}

.testimonial-writer-detail {
    z-index: 1;
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    flex-flow: column;
    display: flex;
    position: relative
}

.testimonial-right-arrow {
    border: 2px solid var(--black);
    color: var(--black);
    width: 40px;
    height: 40px;
    font-size: 20px;
    display: none;
    inset: auto 0% 0% auto
}

.contact-us-section {
    background-color: var(--white)
}

.contact-wrapper-black {
    background-color: var(--black);
    padding: 40px
}

.contact-us-grid {
    grid-column-gap: 60px;
    grid-row-gap: 60px;
    grid-template-rows: auto;
    grid-template-columns: .75fr 1fr
}

.contact-us-heading-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    font-family: Inter, sans-serif;
    font-weight: 400;
    line-height: 140%;
    display: flex
}

.contact-us-heading {
    margin-bottom: 5px;
    font-family: Montserrat, sans-serif;
    font-size: 50px;
    font-weight: 300
}

.contact-us-detail {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    display: flex
}

.contact-form-heading {
    font-size: 40px
}

.contact-from-heading {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    display: flex
}

.form-policy-wrapper {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex;
        padding-top: 1rem;
}

.contact-us-form {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    display: flex
}

.contact-us-error {
    color: var(--white);
    background-color: #ff0014;
    border-radius: 10px;
    padding-left: 20px;
    padding-right: 20px;
    font-family: Inter, sans-serif;
    font-weight: 400
}

.policy-checkbox {
    width: 16px;
    height: 16px;
    margin: 0 14px 0 0
}

.contact-us-submit-button {
    border: 1px solid var(--white);
    background-color: var(--white);
    color: var(--black);
    border-radius: 50px;
    padding: 10px 34px;
    font-family: Inter, sans-serif;
    font-weight: 500;
    transition: border-color .4s, color .4s, background-color .4s
}

.contact-us-submit-button:hover {
    border-style: solid;
    border-color: var(--white);
    background-color: var(--black);
    color: var(--white)
}

.contact-us-input-grid {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 100%;
    display: grid
}

.contact-us-success {
    border: 1px solid var(--white);
    color: var(--white);
    background-color: #0000;
    border-radius: 10px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 20px;
    font-size: 18px;
    font-weight: 400;
    line-height: 140%
}

.contact-us-input-wrapper {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: column;
    display: flex
}

.policy-checkbox-field {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 0;
    padding-left: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%;
    display: flex
}

.contact-us-input-field {
    color: var(--white);
    background-color: #0000;
    border: 1px #0000;
    border-bottom: 1px solid #f9fafc80;
    min-height: 50px;
    margin-bottom: 0;
    padding: 12px 14px;
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%;
    transition: border-color .5s
}

.contact-us-input-field:hover,
.contact-us-input-field:active,
.contact-us-input-field:focus,
.contact-us-input-field:focus-visible {
    border-bottom-color: var(--white)
}

.contact-us-input-field.h-120 {
    min-height: 120px
}

.contact-us-form-info-wrapper {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    display: flex
}

.contact-us-form-block {
    flex-flow: column;
    justify-content: center;
    width: 100%;
    min-height: 354px;
    margin-bottom: 0;
    display: flex
}

.contact-field-label {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 400;
    line-height: 120%;
    display: none
}

.product-section {
    background-color: var(--white);
    padding-top: 3rem;
}

.product-section.step-1 .curtain-bottom {
    transform: translateY(0%);
    z-index: 6;
}

.product-section.step-1 .curtain-top {
    transform: translateY(0%);
    z-index: 6;
}

.product-section.step-2 .picture-show {
    opacity: 1 !important;
}

.product-section.step-2 .curtain-bottom {
    transform: translateY(100%);
    z-index: 6;
}

.product-section.step-2 .curtain-top {
    transform: translateY(-100%);
    z-index: 6;
}

.w-dyn-list {
    padding: 5rem 0;
}

.product-grid {
    grid-column-gap: 30px;
    grid-row-gap: 60px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    width: 100%;
    display: grid
}

.product-sale-tag {
    display: block;
    z-index: 4;
}

.review-star-wrapper {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.review-star {
    display: flex
}

.review-star.light {
    opacity: .4
}

.product-card {
    position: relative;
    overflow: hidden;
}

.product-image {
    width: 100%;
    position: relative;
    overflow: hidden;
    height: 300px;
}

.main-product-image {
    width: 100%;
    display: block;
    opacity: 0;
    transform: scale(1);
    transition: transform 1.2s ease, opacity 0.6s ease-in-out;
    z-index: 1;
    position: relative;
}

.hover-product-image {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    z-index: 2;
    transition: left 0.8s ease;
}

.reveal-top,
.reveal-bottom {
    position: absolute;
    left: 0;
    width: 100%;
    height: 50%;
    background: black;
    z-index: 3;
    transform: translateY(0);
    /* initial FALL */
    transition: transform 0.8s ease;
}

.reveal-top {
    top: 0;
}

.reveal-bottom {
    bottom: 0;
}

/* When .reveal class is added */
.product-card.reveal .reveal-top {
    transform: translateY(-100%);
}

.product-card.reveal .reveal-bottom {
    transform: translateY(100%);
}

.product-card.reveal .main-product-image {
    opacity: 1;
    transform: scale(1.05);
}

/* Hover effect */
.product-image:hover .hover-product-image {
    left: 0;
}

.product-image:hover .main-product-image {
    transform: scale(1.15);
}

.product-image:not(:hover) .main-product-image {
    transform: scale(1.05);
}

.product-detail-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    flex: 1;
    justify-content: space-between;
    align-items: stretch;
    width: 100%;
    height: 100%;
    display: flex
}

.product-card-detail {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    flex-flow: column;
    display: flex
}

.product-heading {
    color: var(--black);
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 140%
}

.product-price-wrapper {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    justify-content: space-between;
    align-items: center;
    display: flex;
    height: 50px;

}

.product-card-price {
    font-family: Inter, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 120%;
    color: #000;
}

.card-option-list {
    display: none
}

.card-add-to-cart-button {
    background-color: var(--transparent);
    color: var(--black);
    text-align: left;
    width: 100%;
    padding: 0;
    font-family: Inter, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 120%
}

.card-add-to-cart {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: absolute;
    inset: auto auto 12px 6px;
    z-index: 7 !important;
}

.main-product-image:hover .card-add-to-cart {
    z-index: 7 !important;
    position: absolute;
    inset: auto auto 12px 6px;
}

.product-card:hover .card-add-to-cart {
    opacity: 1;
    pointer-events: auto;
    /* Enable interaction when visible */
}

.card-default-state {
    margin-bottom: 0
}

.error-state {
    color: var(--white);
    background-color: #ff2121;
    padding-left: 20px;
    padding-right: 20px;
    font-family: Inter, sans-serif;
    font-weight: 400
}

.product-sale-tag {
    background-color: var(--black);
    border-radius: 6px;
    padding: 3px 10px;
    font-size: 14px;
    position: absolute;
    inset: 10px auto auto 10px
}

.cart-button {
    z-index: 99999;
    border: 1px solid var(--white-border);
    background-color: var(--transparent);
    filter: none;
    color: var(--white);
    border-radius: 50%;
    width: 60px;
    height: 60px;
    padding: 14px;
    transition: background-color .4s, filter .4s;
    position: relative
}

.cart-button:hover {
    background-color: var(--black);
    filter: invert()
}

.cart-quantity {
    background-color: var(--white);
    color: var(--black);
    min-width: 16px;
    height: 16px;
    margin-left: 0;
    padding: 5px;
    font-size: 11px;
    font-weight: 500;
    line-height: 70%;
    position: absolute;
    inset: 12px 15px auto auto
}

.cart-iocn {
    flex: none
}

.cart-wrapper {
    color: var(--black)
}

.cart-heading {
    color: var(--black);
    font-weight: 600
}

.cart-close-icon {
    cursor: pointer;
    transition: transform .4s;
    display: flex
}

.cart-close-icon:hover {
    transform: rotate(90deg)
}

.product-remove-button {
    color: var(--black);
    text-decoration: underline
}

.cart-product-heading {
    text-transform: uppercase;
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 140%
}

.cart-product-price {
    font-size: 16px;
    font-weight: 500;
    line-height: 140%
}

.product-remove-link {
    font-size: 14px
}

.product-price-total {
    font-size: 20px;
    font-weight: 500;
    line-height: 140%
}

.cart-product-image {
    width: 100px
}

.checkout-button {
    background-color: var(--black);
    border-radius: 0;
    transition: box-shadow .4s
}

.checkout-button:hover {
    box-shadow: inset 0 0 15px #fff9
}

.cart-list {
    background-color: var(--white);
    max-height: 400px;
    overflow: auto
}

.cart-footer {
    background-color: var(--white);
    width: 100%
}

.cart-header {
    background-color: var(--white)
}

.cart-empty-state {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    flex-flow: column
}

.policy-link {
    text-decoration: underline
}

.testimonial-slider-mask {
    overflow-x: clip
}

.card-add-to-cart {
    z-index: 0;
    position: absolute;
    inset: auto auto 12px 6px
}

.product-variants-wrapper {
    position: relative
}

.card-variants-button-group {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: column;
    margin-bottom: 0
}

.card-variants-button {
    border-color: var(--black);
    background-color: var(--white);
    color: var(--black);
    margin-right: 0;
    font-weight: 500;
    transition: color .4s, background-color .4s
}

.card-variants-button:hover {
    background-color: var(--black);
    color: var(--white)
}

.default-state {
    margin-bottom: 0
}

.testimonial-text {
    max-width: 100%
}

.testimonial-slider-wrapper {
    position: relative
}

:root {
    --icon-size: 25px;
    --transition-speed: 0.4s;
}

:root {
    --gray: #0000004d;
}

.social-media {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
}

/* Icon wrapper */
.social-media-icon {
    z-index: 2;
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: filter var(--transition-speed) ease;
}

/* The icon (starts black) */
.social-media-icon img {
    width: var(--icon-size);
    height: var(--icon-size);
    filter: brightness(0);
    /* black */
    transition: filter var(--transition-speed) ease;
}

/* Expanding background */
.social-media-bg-color {
    background-color: black;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    height: 80%;
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: transform var(--transition-speed) ease;
    z-index: 1;
}

/* Hover state: background expands + icon turns white */
.social-media:hover .social-media-bg-color {
    transform: translate(-50%, -50%) scale(1);
}

.social-media:hover .social-media-icon img {
    filter: brightness(1000%);
    /* white */
}

.cart-option {
    color: var(--text-color-02);
    font-size: 14px
}

.about-image-wrapper-02 {
    position: relative;

    overflow: hidden;
}

/* === IMAGE (initially hidden) === */
.image-show {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: relative;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.step-2 .image-show {
    opacity: 1;
}

/* === MASK TO SPLIT IMAGE === */
.image-mask {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

.mask-top,
.mask-bottom {
    position: absolute;
    width: 100%;
    height: 50%;
    background-color: black;
    transition: transform 1s ease;
}

.mask-top {
    top: 0;
    transform: translateY(0%);
}

.mask-bottom {
    bottom: 0;
    transform: translateY(0%);
}

.step-2 .mask-top {
    transform: translateY(-100%);
}

.step-2 .mask-bottom {
    transform: translateY(100%);
}

/* === BLACK CURTAIN === */
.image-show-top,
.image-show-bottom {
    position: absolute;
    width: 100%;
    height: 50%;
    background-color: black;
    z-index: 3;
    transition: transform 1s ease;
}

.image-show-top {
    top: 0;
    transform: translateY(-100%);
}

.image-show-bottom {
    bottom: 0;
    transform: translateY(100%);
}

.step-1 .image-show-top,
.step-1 .image-show-bottom {
    transform: translateY(0%);
}

.step-2 .image-show-top {
    transform: translateY(-100%);
}

.step-2 .image-show-bottom {
    transform: translateY(100%);
}

.serviec-price-wrapper {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    border: 1px solid var(--white);
    justify-content: flex-start;
    align-items: center;
    padding: 5px 16px;
    font-size: 16px;
    display: flex
}

.green-dot {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    color: #00ff3d;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.green-dot-inner {
    background-color: #00ff3d;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 6px;
    height: 6px;
    display: flex;
    position: relative
}

.section-time {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: column;
    display: flex
}

.green-text-dot {
    background-color: #00ff3d;
    border-radius: 50%;
    flex: none;
    width: 6px;
    height: 6px;
    position: absolute;
    inset: 0%;
    transform: scale(2.6)
}

.starting-from-text {
    margin-right: 6px
}

.product-card-add-to-cart {
    align-self: flex-start;
    overflow: hidden
}

.add-to-cart-border {
    background-color: var(--white);
    width: 100%;
    height: 1px
}

.add-to-cart-border.black {
    background-color: var(--black)
}

.logo-section {
    justify-content: center;
    align-items: center;
    display: flex
}

.pricing-divider {
    border: 1px solid var(--white);
    width: 20%
}

.testimonial-writer-info {
    grid-column-gap: 14px;
    grid-row-gap: 14px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.testimonial-writer-image {
    filter: grayscale();
    border-radius: 50%;
    width: 60px;
    overflow: hidden
}

.pop-up-wrapper {
    z-index: 999;
    justify-content: flex-start;
    align-items: flex-end;
    display: flex;
    position: fixed;
    inset: auto auto 20px 20px
}

.pop-up-block {
    grid-column-gap: 18px;
    grid-row-gap: 18px;
    color: #000;
    background-color: #fff;
    border-radius: 10px;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    padding: 30px;
    font-size: 16px;
    font-weight: 500;
    line-height: 120%;
    transition: transform .4s;
    display: flex;
    box-shadow: 0 2px 5px #0003
}

.pop-up-block:hover {
    transform: scale(1.05)
}

.pop-up-close {
    color: #000;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    font-family: Inconsolata, monospace;
    font-size: 34px;
    font-weight: 400;
    line-height: 60%;
    display: flex;
    position: absolute;
    inset: 20px 20px auto auto
}

.pop-text {
    max-width: 360px
}

.badge-wrapper {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    justify-content: flex-start;
    align-items: center;
    display: flex
}

.badge-link {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    color: #fff;
    text-transform: capitalize;
    background-color: #356ad1;
    border-radius: 6px;
    justify-content: center;
    align-items: center;
    padding: 10px 16px 10px 10px;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
    display: flex;
    box-shadow: 0 2px 5px #0003
}

.badge-icon {
    justify-content: center;
    align-items: center;
    width: 22px;
    display: flex
}

@media screen and (min-width: 1280px) {
    .pricing-grid {
        grid-column-gap: 60px;
        grid-row-gap: 60px
    }

    .contact-wrapper-black {
        padding: 60px
    }
}

@media screen and (min-width: 1440px) {

    h2 {
        font-size: 9vw
    }

    .tool-detail-marquee {
        max-height: 1000px
    }

    .about-heading-wrapper {
        max-width: 960px
    }

    .about-heading {
        font-size: 6vw
    }

    .pricing-grid {
        grid-column-gap: 100px;
        grid-row-gap: 100px
    }

    .footer-marquee-wrapper {
        grid-column-gap: 50px;
        grid-row-gap: 50px
    }

    .footer-marquee-block {
        padding: 30px 72px;
        font-size: 60px
    }

    .service-list-grid {
        grid-column-gap: 30px;
        grid-row-gap: 50px
    }

    .service-text {
        font-size: 16px
    }

    .fill-about-heading {
        font-size: 6vw
    }

    .testimonial-heading {
        font-size: 46px
    }

    .testimonial-grid {
        grid-column-gap: 70px;
        grid-row-gap: 70px
    }

    .testimonial-slide-nav {
        bottom: -14%
    }

    .contact-wrapper-black {
        padding: 100px
    }

    .contact-us-grid {
        grid-column-gap: 100px;
        grid-row-gap: 100px
    }

    .cart-list {
        max-height: 76vh
    }

    .banner-heading-wrapper {
        height: 220px;
    }
}

@media screen and (min-width: 1920px) {
    h1 {
        color: var(--white)
    }

    .cart-list {
        max-height: 82vh
    }

    .testimonial-slider-mask {
        overflow: clip visible
    }
}

@media screen and (max-width: 991px) {
     .banner-heading-wrapper {
                height: 100%;
    }
            .image-show{
        opacity: 1;
    }
    h1 {
        font-size: 12vw
    }

    h2 {
        font-size: 11vw
    }

    .banner-section {
        height: 80vh
    }

    .topbar-wrapper {
        grid-template-columns: min-content .5fr .5fr 1fr min-content min-content;
        padding-top: 30px;
        padding-bottom: 30px
    }

    .primary-button {
        order: 1
    }

    .tool-detail-section {
        background-image: radial-gradient(circle farthest-corner at 50% 50%, transparent, var(--black)), url(https://cdn.prod.website-files.com/67bd5945e3c3279c596c901f/67bda1cb0b50fc8fa3228efd_Tool%20BG%20Image.avif);
        background-position: 0 0, 50%;
        background-repeat: repeat, no-repeat;
        background-size: auto, cover;
        position: unset;
    }

    .tool-grid {
        grid-template-columns: 1fr 1fr
    }

    .tool-detail-heading {
        margin-top: 100px;
        margin-bottom: 100px
    }

    .tool-detail-marquee {
        max-height: 650px
    }

    .tool-card {
        grid-column-gap: 30px;
        grid-row-gap: 30px
    }

    .took-marquee-wrapper {
        grid-column-gap: 50px;
        grid-row-gap: 50px;
        padding-top: 25px;
        padding-bottom: 25px
    }

    .marquee-shodow-top,
    .marquee-shodow-bottom {
        min-height: 100px
    }

    .about-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .about-grid {
        grid-column-gap: 16px;
        grid-row-gap: 16px;
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr;
        grid-auto-columns: 1fr;
        display: grid
    }

    .about-heading-wrapper {
        align-self: flex-start;
        max-width: none
    }

    .about-heading {
        font-size: 6.5vw
    }

    .about-right {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .social-media-wraper {
        grid-column-gap: 40px;
        grid-row-gap: 40px
    }

    .service-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .service-wrapper {
        grid-column-gap: 200px;
        grid-row-gap: 200px;
        display: none
    }

    .service-image-wrapper {
        display: none
    }

    .faq-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .faq-grid {
        flex-flow: column
    }

    .faq-heading {
        max-width: none
    }

    .faq-qus {
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 18px
    }

    .faq-ans {
        padding-bottom: 30px
    }

    .tag-marquee-wrapper.secondary {
        transform: translateY(20px)
    }

    .pricing-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .pricing-grid {
        grid-row-gap: 60px;
        grid-template-columns: 1fr 1fr
    }

    .blog-section {
        padding-top: 60px
    }

    .section-heading.white {
        color: var(--white)
    }

    .blog-grid {
        grid-template-columns: 1fr 1fr
    }

    .section-grid-wrapper.res-show {
        display: flex
    }

    .gallery-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .gallery-heading-block {
        grid-column-gap: 10px;
        grid-row-gap: 10px;
        flex-flow: row;
        width: auto;
        height: auto;
        position: static
    }

    .gallery-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        flex-flow: column;
        justify-content: center;
        align-items: flex-start
    }

    .gallery-heading {
        max-width: none
    }

    .footer-marquee-wrapper {
        grid-column-gap: 30px;
        grid-row-gap: 30px;
        padding-left: 15px;
        padding-right: 15px
    }

    .footer-grid {
        grid-column-gap: 40px;
        grid-row-gap: 40px;
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr;
        grid-auto-columns: 1fr;
        margin-bottom: 40px;
        display: grid
    }

    .footer-marquee-arrow {
        width: 30px
    }

    .footer-marquee-block {
        padding-left: 34px;
        padding-right: 34px;
        font-size: 30px
    }

    .rights-link {
        padding-top: 30px;
        padding-bottom: 30px
    }

    .footer-link-wrapper {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .footer-social-link-wrappr,
    .footer-contact-link-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .nav-social-wrapper {
        margin-right: 60px;
        left: 20%
    }

    .nav-menu-bg {
        display: block
    }

    .nav-menu-links {
        margin-left: 60px
    }

    .testimonial-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .gallery-icon {
        display: none
    }

    .service-list-grid {
        grid-row-gap: 40px;
        grid-template-columns: 1fr
    }

    .tool-card-text {
        font-size: 18px
    }

    .gallery-link-layer {
        display: flex
    }

    .fill-about-heading {
        font-size: 6.5vw;
        display: inline
    }

    .about-fill-heading {
        display: block
    }

    .testimonial-heading {
        font-size: 36px
    }

    .testimonial-grid {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .quota-image {
        top: auto
    }

    .testimonial-detail-wrapper {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .contact-us-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .contact-wrapper-black {
        padding: 40px
    }

    .contact-us-grid {
        grid-template-columns: 1fr
    }

    .contact-us-heading-wrapper {
        order: 1
    }

    .contact-us-heading {
        font-size: 36px
    }

    .contact-us-form,
    .contact-us-input-grid {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .contact-us-form-info-wrapper {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .contact-us-form-block {
        min-height: 324px
    }

    .contact-field-label {
        font-size: 16px
    }

    .product-section {
        padding-top: 60px;
        padding-bottom: 60px
    }

    .product-grid {
        grid-template-columns: 1fr 1fr
    }

    .cart-product-heading {
        font-size: 18px
    }

    .cart-product-price {
        font-size: 16px
    }

    .add-to-cart-border {
        display: none
    }

    .pop-up-block {
        padding: 20px
    }

    .pop-up-close {
        width: 18px;
        height: 18px
    }

    .badge-icon {
        width: 19px
    }
    .tool-section-heading{
        font-size: 9.5vw;
    }
    .tool-fill-heading{
         font-size: 9.5vw;
    }
}

@media screen and (max-width: 767px) {
    body {
        font-size: 14px
    }

    h2 {
        font-size: 14vw
    }

    h3 {
        font-size: 24px
    }

    h4 {
        font-size: 18px
    }

    h5 {
        font-size: 16px
    }

    ul {
        padding-left: 20px
    }

    .topbar-wrapper {
        grid-row-gap: 6px;
        flex-flow: wrap;
        grid-template-columns: min-content 1fr min-content min-content;
        grid-template-areas: ".Area";
        grid-auto-columns: 1fr;
        padding-top: 20px;
        padding-bottom: 20px
    }

    .time,
    .primary-button.res-hide {
        display: none
    }

    .primary-button.res-show {
        padding-left: 30px;
        padding-right: 30px;
        display: flex
    }

    .tool-detail-section {
        background-image: linear-gradient(180deg, var(--black)40%, var(--transparent)), radial-gradient(circle farthest-corner at 50% 50%, transparent, var(--black)), url(https://cdn.prod.website-files.com/67bd5945e3c3279c596c901f/67bda1cb0b50fc8fa3228efd_Tool%20BG%20Image.avif);
        background-position: 0 0, 0 0, 50%;
        background-repeat: repeat, repeat, no-repeat;
        background-size: auto, auto, cover;
        padding-top: 60px;
        padding-bottom: 60px
    }

    .tool-grid {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        grid-template-columns: 1fr
    }

    .tool-detail-heading {
        max-width: none;
        margin-top: 0;
        margin-bottom: 0
    }

    .tool-detail-marquee {
        max-width: none;
        max-height: 600px;
        box-shadow: 0 -50px 20px #0003
    }

    .tool-card {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .marquee-shodow-top,
    .marquee-shodow-bottom {
        min-height: 120px
    }

    .about-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .about-grid {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        grid-template-columns: 1fr
    }

    .about-heading-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .about-heading {
        font-size: 10vw
    }

    .about-image-wrapper-02 {
        display: none
    }

    .about-right {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        justify-content: flex-start;
        align-items: flex-start;
        margin-top: 0
    }

    .about-block {
        width: 280px;
        margin-top: 0
    }

    .about-image-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .social-media-wraper {
        grid-column-gap: 50px;
        grid-row-gap: 50px;
        flex-flow: row
    }

    .social-media {
        width: auto;
        height: auto
    }

    .service-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .service-wrapper {
        grid-column-gap: 150px;
        grid-row-gap: 150px
    }

    .faq-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .faq-heading {
        font-size: 46px
    }

    .faq-qus {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        padding-top: 20px;
        padding-bottom: 20px
    }

    .faq-ans {
        padding-bottom: 20px;
        font-size: 14px
    }

    .tag-marquee-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .tag-marquee-block,
    .tag-marquee {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .pricing-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .pricing-grid {
        grid-column-gap: 50px;
        grid-row-gap: 50px;
        grid-template-columns: 1fr
    }

    .pricing-block,
    .price-grid-wrap {
        grid-column-gap: 40px;
        grid-row-gap: 40px
    }

    .blog-section {
        padding-top: 40px
    }

    .section-heading {
        font-size: 26px
    }

    .blog-grid {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .blog-image {
        height: 380px
    }

    .blog-card {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .blog-detail-wrapper {
        grid-column-gap: 6px;
        grid-row-gap: 6px
    }

    .blog-heading {
        font-size: 16px
    }

    .section-grid-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .gallery-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .gallery-heading {
        font-size: 26px
    }

    .footer-marquee-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        padding-left: 10px;
        padding-right: 10px
    }

    .footer-grid {
        margin-bottom: 30px
    }

    .webflow-link {
        font-size: 14px
    }

    .footer-marquee-arrow {
        justify-content: center;
        align-items: center;
        display: flex
    }

    .footer-marquee-block {
        padding: 10px 26px;
        font-size: 26px
    }

    .rights-link {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        justify-content: space-around;
        padding-top: 20px;
        padding-bottom: 20px
    }

    .footer-section {
        padding-top: 40px
    }

    .footer-social-link-wrappr {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .footer-contact-icon {
        width: 20px
    }

    .nav-social-wrapper {
        justify-content: flex-start;
        align-items: center;
        margin-right: 0
    }

    .nav-menu-wrapper {
        grid-column-gap: 40px;
        grid-row-gap: 40px;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding-top: 100px;
        padding-bottom: 100px;
        overflow: auto
    }

    .nav-menu-bg {
        display: block
    }

    .nav-link {
        font-size: 50px
    }

    .nav-menu-links {
        grid-column-gap: 30px;
        grid-row-gap: 30px;
        justify-content: flex-start;
        align-items: center;
        margin-left: 0
    }

    .testimonial-section {
        padding-top: 40px
    }

    .service-list-grid {
        grid-row-gap: 30px
    }

    .service-list-heading {
        font-size: 24px
    }

    .pricing-list-heading {
        font-size: 28px
    }

    .tool-card-text {
        font-size: 16px
    }

    .price-detail {
        grid-column-gap: 18px;
        grid-row-gap: 18px
    }

    .pricing-card-heading {
        font-size: 18px
    }

    .logo {
        padding: 20px
    }

    .fill-about-heading {
        font-size: 10vw
    }

    .testimonial-writer-info-block {
        justify-content: flex-end;
        align-items: flex-end
    }

    .testimonial-grid {
        grid-column-gap: 30px;
        grid-row-gap: 30px;
        grid-template-columns: 1fr
    }

    .testimonial-left-arrow {
        width: 40px;
        height: 40px;
        font-size: 16px;
        right: 50px
    }

    .quota-image {
        display: none
    }

    .testimonial-detail-wrapper {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .testimonial-slide-nav {
        bottom: -10%;
        left: 0%;
        right: 0%
    }

    .testimonial-right-arrow {
        width: 40px;
        height: 40px;
        font-size: 16px
    }

    .contact-us-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .contact-wrapper-black {
        padding: 20px
    }

    .contact-us-grid {
        grid-column-gap: 40px;
        grid-row-gap: 40px
    }

    .contact-form-heading {
        font-size: 30px
    }

    .form-policy-wrapper {
        grid-column-gap: 16px;
        grid-row-gap: 16px;
        flex-flow: wrap
    }

    .contact-us-form {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .policy-checkbox {
        width: 14px;
        height: 14px;
        margin-right: 6px
    }

    .contact-us-submit-button {
        padding-left: 30px;
        padding-right: 30px
    }

    .contact-us-input-grid {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .contact-us-success {
        width: 100%;
        font-size: 16px
    }

    .contact-us-form-block {
        min-height: 346px
    }

    .contact-field-label {
        font-size: 14px
    }

    .product-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .product-grid {
        grid-column-gap: 20px;
        grid-row-gap: 40px
    }

    .product-card {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .product-image {
        height: 380px
    }

    .product-detail-wrapper {
        grid-column-gap: 6px;
        grid-row-gap: 6px
    }

    .product-heading {
        font-size: 16px
    }

    .cart-product-heading {
        font-size: 16px
    }

    .cart-product-price {
        font-size: 14px
    }

    .nav-button.res-hide {
        display: none
    }

    .testimonial-text {
        font-size: 14px
    }

    .social-media-icon {
        width: 24px
    }

    .social-media-icon.black {
        filter: none
    }

    .social-media-bg-color {
        display: none
    }
}

@media screen and (max-width: 479px) {
    h2 {
        font-size: 16vw
    }

    h4 {
        font-size: 16px
    }

    .topbar-wrapper {
        grid-column-gap: 10px;
        padding-top: 16px;
        padding-bottom: 16px
    }

    .time {
        justify-content: center;
        align-self: center;
        align-items: center
    }

    .primary-button {
        order: 1
    }

    .primary-button.white {
        align-self: auto
    }

    .tool-detail-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .tool-detail-marquee {
        max-height: 520px
    }

    .tool-card {
        max-width: none
    }

    .marquee-shodow-top,
    .marquee-shodow-bottom {
        min-height: 100px
    }

    .about-grid {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .about-heading-wrapper {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .about-heading {
        font-size: 10vw
    }

    .about-image-wrapper-02 {
        order: -1
    }

    .about-right {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .about-image-wrapper {
        grid-column-gap: 10px;
        grid-row-gap: 10px;
        flex-flow: column;
        justify-content: flex-start;
        align-items: center
    }

    .social-media-wraper {
        grid-column-gap: 30px;
        grid-row-gap: 30px;
        flex-flow: row;
        width: 100%
    }

    .service-wrapper {
        grid-column-gap: 50px;
        grid-row-gap: 50px
    }

    .service-card-wrapper {
        grid-column-gap: 50px;
        grid-row-gap: 50px;
        flex-flow: column;
        justify-content: center;
        align-items: flex-start
    }

    .service-card-wrapper.service-card-wrapper-01,
    .service-card-wrapper.service-card-wrapper-02 {
        justify-content: center;
        align-items: flex-start
    }

    .faq-heading {
        font-size: 40px
    }

    .faq-qus {
        font-size: 16px
    }

    .pricing-block {
        grid-column-gap: 30px;
        grid-row-gap: 30px
    }

    .section-heading-wrapper {
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        justify-content: center;
        align-items: center
    }

    .section-heading {
        font-size: 24px
    }

    .blog-grid {
        grid-template-columns: 1fr
    }

    .blog-detail-wrapper {
        grid-column-gap: 14px;
        grid-row-gap: 14px
    }

    .read-more-wrapper {
        margin-top: 0
    }

    .gallery-heading-block {
        width: 100%
    }

    .gallery-heading {
        font-size: 24px
    }

    .footer-grid {
        grid-column-gap: 24px;
        grid-row-gap: 24px;
        grid-template-columns: 1fr;
        margin-bottom: 20px
    }

    .footer-marquee-arrow {
        width: 22px
    }

    .footer-marquee-block {
        grid-column-gap: 6px;
        grid-row-gap: 6px;
        padding-left: 20px;
        padding-right: 20px;
        font-size: 20px
    }

    .footer-link-block {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .footer-social-link {
        padding: 4px
    }

    .footer-social-link-wrappr,
    .footer-contact-link-wrapper {
        grid-column-gap: 16px;
        grid-row-gap: 16px
    }

    .menu-button {
        width: 50px;
        height: 50px
    }

    .nav-menu-wrapper {
        align-content: flex-start;
        inset: 0% auto
    }

    .nav-link {
        font-size: 40px
    }

    .nav-menu-links {
        grid-column-gap: 26px;
        grid-row-gap: 26px;
        left: auto
    }

    .service-list-grid,
    .service-list-card {
        grid-template-columns: 1fr
    }

    .service-list-image {
        height: 250px;
    }

    .pricing-list-heading {
        font-size: 24px
    }

    .gallery-insta-link {
        width: 100%
    }

    .pricing-card-heading {
        font-size: 16px
    }

    .logo {
        width: 50px;
        height: 50px;
        padding: 16px
    }

    .gallery-mask {
        width: auto
    }

    .gallery-slide {
        margin-left: 0;
        margin-right: 0
    }

    .blog-card-detail {
        grid-column-gap: 8px;
        grid-row-gap: 8px
    }

    .tool-fill-heading-block {
        grid-column-gap: 16px
    }

    .fill-about-heading {
        font-size: 10vw
    }

    .testimonial-heading {
        margin-bottom: 0;
        font-size: 30px
    }

    .testimonial-grid {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .testimonial-slide-nav {
        bottom: -8%
    }

    .contact-wrapper-black {
        padding: 14px
    }

    .contact-us-heading {
        margin-bottom: 0;
        font-size: 30px
    }

    .contact-us-detail {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .contact-form-heading {
        font-size: 26px
    }

    .contact-from-heading {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .form-policy-wrapper {
        flex-flow: column;
        justify-content: space-between;
        align-items: flex-start
    }

    .contact-us-input-grid {
        flex-flow: column;
        grid-template-columns: 1fr;
        display: flex
    }

    .contact-us-success {
        padding: 16px
    }

    .contact-us-form-block {
        min-height: 498px
    }

    .product-grid {
        grid-row-gap: 30px;
        grid-template-columns: 1fr
    }

    .product-detail-wrapper {
        grid-column-gap: 10px;
        grid-row-gap: 10px
    }

    .product-price-wrapper {
        flex-flow: wrap
    }

    .cart-button {
        width: 50px;
        height: 50px
    }

    .cart-quantity {
        top: 8px;
        right: 7px
    }

    .cart-product-image {
        width: 90px
    }

    .cart-list {
        max-height: none
    }

    .cart-footer {
        position: sticky;
        bottom: 0
    }

    .nav-button {
        order: 1
    }

    .product-variants-wrapper {
        align-self: stretch;
        height: 100%
    }

    .social-media-icon {
        width: 22px
    }

    .pop-up-wrapper {
        display: none
    }
        .tool-section-heading{
        font-size: 13.5vw;
    }
    .tool-fill-heading{
         font-size: 13.5vw;
    }
}

#w-node-_080e8afa-6e03-8ee9-ebca-9cadebc55268-596c9032 {
    align-self: center
}

#w-node-_176c869e-6d23-9af7-84b3-500440ee332d-596c9032 {
    justify-self: start
}

#w-node-_00e33b51-dc91-589f-1bb9-565ec8c27e94-596c9032 {
    justify-self: end
}

#w-node-_9d4dde0c-f176-c889-084a-72395ef8dc1c-596c9032 {
    justify-self: start
}

#w-node-_1995e235-7709-e590-bce7-070d7ee04ce8-596c9032 {
    justify-self: end
}

#w-node-_63b50a13-ae01-ca19-41e1-04052f321307-596c9032 {
    justify-self: start
}

#w-node-_63b50a13-ae01-ca19-41e1-04052f32130c-596c9032 {
    justify-self: end
}

#w-node-_63b50a13-ae01-ca19-41e1-04052f321311-596c9032 {
    justify-self: start
}

#w-node-_63b50a13-ae01-ca19-41e1-04052f321316-596c9032 {
    justify-self: end
}

#w-node-_61e0c15d-082f-2e6f-c84b-6815fa721ab1-596c9032 {
    place-self: center end
}

#w-node-fa0b4513-ebbf-3deb-45cd-d6f29cd7bdd8-596c9032 {
    grid-area: span 1/span 2/span 1/span 2
}

#w-node-d1ab91ab-3484-0187-eec0-60f4c058a577-c058a571,
#w-node-d1ab91ab-3484-0187-eec0-60f4c058a57f-c058a571,
#w-node-d1ab91ab-3484-0187-eec0-60f4c058a587-c058a571,
#w-node-d1ab91ab-3484-0187-eec0-60f4c058a58f-c058a571,
#w-node-d1ab91ab-3484-0187-eec0-60f4c058a597-c058a571 {
    grid-area: span 1/span 1/span 1/span 1
}

#w-node-ed766984-7dee-1088-5ebc-2ddf7344b843-b4152cad {
    grid-area: span 1/span 2/span 1/span 2
}

#idendity2 {
    justify-self: end;
    display: flex;
}

@media screen and (max-width: 991px) {
    #w-node-_61e0c15d-082f-2e6f-c84b-6815fa721ab1-596c9032 {
        align-self: center
    }

    #w-node-ed766984-7dee-1088-5ebc-2ddf7344b843-b4152cad {
        justify-self: start
    }
    
}

@media screen and (max-width: 767px) {
    #w-node-_61e0c15d-082f-2e6f-c84b-6815fa721ab1-596c9032 {
        order: -9999
    }

    #w-node-_85232764-a809-e7f5-db02-42252b30ef3f-2b30ef39,
    #w-node-_85232764-a809-e7f5-db02-42252b30ef61-2b30ef39,
    #w-node-_85232764-a809-e7f5-db02-42252b30ef50-2b30ef39 {
        order: 9999
    }

    #idendity1 {
        justify-self: start
    }

    #w-node-ed766984-7dee-1088-5ebc-2ddf7344b843-b4152cad {
        grid-area: span 1/span 1/span 1/span 1;
        justify-self: start
    }

    #idendity2 {
        display:none;
    }
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-family: sans-serif
}

body {
    margin: 0
}

nav,
section {
    display: block
}

a {
    background-color: #0000
}

a:active,
a:hover {
    outline: 0
}

h1 {
    margin: .67em 0;
    font-size: 2em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

input,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

select {
    text-transform: none
}

input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    height: auto
}

textarea {
    overflow: auto
}

.w-icon-slider-right:before {
    content: ""
}

.w-icon-slider-left:before {
    content: ""
}

* {
    box-sizing: border-box
}

html {
    height: 100%
}

.carousel-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}