:root {
    --hero-background: #ffe2ac;

    /* Orb gradient accent colors */
    --orb-color-1: #7ff2d6;
    --orb-color-2: #d8ef72;
    --orb-color-3: #ffd58a;
    
    /* Colors */
    --black: black;
    --color-1: #fefad2;
    --dark: #0c0407;
    --dark-2: #333;
    --light: whitesmoke;
    --transparent: transparent;
    --white: white;

    /* Font Families */
    --_font-family---inter: Inter, sans-serif;
    --_font-family---poppins: Poppins, sans-serif;

    /* Font Sizes */
    --_font-size---fz-12: 12px;
    --_font-size---fz-14: 14px;
    --_font-size---fz-16: 16px;
    --_font-size---fz-18: 18px;
    --_font-size---fz-20: 20px;
    --_font-size---fz-22: 22px;
    --_font-size---fz-24: 24px;
    --_font-size---fz-26: 26px;
    --_font-size---fz-30: 30px;
    --_font-size---fz-32: 32px;
    --_font-size---fz-36: 36px;
    --_font-size---fz-40: 40px;
    --_font-size---fz-48: 48px;
    --_font-size---fz-50: 50px;
    --_font-size---fz-60: 60px;
    --_font-size---fz-72: 72px;
    --_font-size---fz-240: 240px;

    /* Line Heights */
    --_line-height---lh-70: 70%;
    --_line-height---lh-74: 74%;
    --_line-height---lh-80: 80%;
    --_line-height---lh-90: 90%;
    --_line-height---lh-96: 96%;
    --_line-height---lh-100: 100%;
    --_line-height---lh-110: 110%;
    --_line-height---lh-112: 112%;
    --_line-height---lh-120: 120%;
    --_line-height---lh-122: 122%;
    --_line-height---lh-125: 125%;
    --_line-height---lh-130: 130%;
    --_line-height---lh-140: 140%;
    --_line-height---lh-150: 150%;

    /* Letter Spacing */
    --_letter-spacing---ls-0: 0em;
    --_letter-spacing---ls-1: -.01em;
    --_letter-spacing---ls-2: -.02em;
    --_letter-spacing---ls-3: -.03em;
    --_letter-spacing---ls-4: -.04em;
    --_letter-spacing---ls-5: -.05em;
    --_letter-spacing---ls-6: -.06em;
    --_letter-spacing---ls-7: -.07em;
    --_letter-spacing---ls-8: -.08em;
    --_letter-spacing---ls-9: -.09em;
    --_letter-spacing---ls-10: -.1em;

    /* Orb gradient accent colors */
    --orb-color-1: #7ff2d6;
    --orb-color-2: #d8ef72;
    --orb-color-3: #ffd58a;
}


svg:not(:root) {
    overflow: hidden
}

html {
    -webkit-text-size-adjust: 100%;
    font-family: sans-serif;
    scroll-behavior: smooth
}

body {
    margin: 0
}

details,
footer,
header,
main,
menu,
nav,
section {
    display: block
}

video {
    vertical-align: baseline;
    display: inline-block
}

[hidden],
template {
    display: none
}

a {
    background-color: #0000
}

a:active,
a:hover {
    outline: 0
}

b {
    font-weight: 700
}

h1 {
    margin: .67em 0;
    font-size: 2em
}

mark {
    color: #000;
    background: #ff0
}

sub {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

button,
input {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button {
    text-transform: none
}

button,
html input[type=button],
input[type=reset] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

input[type=checkbox],
input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: none
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

@font-face {
    font-family: webflow-icons;
    src: url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBiUAAAC8AAAAYGNtYXDpP+a4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5ZmhS2XEAAAGAAAADHGhlYWQTFw3HAAAEnAAAADZoaGVhCXYFgQAABNQAAAAkaG10eCe4A1oAAAT4AAAAMGxvY2EDtALGAAAFKAAAABptYXhwABAAPgAABUQAAAAgbmFtZSoCsMsAAAVkAAABznBvc3QAAwAAAAAHNAAAACAAAwP4AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg5gPpA//9//8AAAAAACDmAOkA//3//wAB/+MaBBcIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEBIAAAAyADgAAFAAAJAQcJARcDIP5AQAGA/oBAAcABwED+gP6AQAABAOAAAALgA4AABQAAEwEXCQEH4AHAQP6AAYBAAcABwED+gP6AQAAAAwDAAOADQALAAA8AHwAvAAABISIGHQEUFjMhMjY9ATQmByEiBh0BFBYzITI2PQE0JgchIgYdARQWMyEyNj0BNCYDIP3ADRMTDQJADRMTDf3ADRMTDQJADRMTDf3ADRMTDQJADRMTAsATDSANExMNIA0TwBMNIA0TEw0gDRPAEw0gDRMTDSANEwAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFVz+fAGEAAAAAAL//f+9BAMDwwAEAAkAABcBJwEXAwE3AQdpA5ps/GZsbAOabPxmbEMDmmz8ZmwDmvxmbAOabAAAAgAA/8AEAAPAAB0AOwAABSInLgEnJjU0Nz4BNzYzMTIXHgEXFhUUBw4BBwYjNTI3PgE3NjU0Jy4BJyYjMSIHDgEHBhUUFx4BFxYzAgBqXV6LKCgoKIteXWpqXV6LKCgoKIteXWpVSktvICEhIG9LSlVVSktvICEhIG9LSlVAKCiLXl1qal1eiygoKCiLXl1qal1eiygoZiEgb0tKVVVKS28gISEgb0tKVVVKS28gIQABAAABwAIAA8AAEgAAEzQ3PgE3NjMxFSIHDgEHBhUxIwAoKIteXWpVSktvICFmAcBqXV6LKChmISBvS0pVAAAAAgAA/8AFtgPAADIAOgAAARYXHgEXFhUUBw4BBwYHIxUhIicuAScmNTQ3PgE3NjMxOAExNDc+ATc2MzIXHgEXFhcVATMJATMVMzUEjD83NlAXFxYXTjU1PQL8kz01Nk8XFxcXTzY1PSIjd1BQWlJJSXInJw3+mdv+2/7c25MCUQYcHFg5OUA/ODlXHBwIAhcXTzY1PTw1Nk8XF1tQUHcjIhwcYUNDTgL+3QFt/pOTkwABAAAAAQAAmM7nP18PPPUACwQAAAAAANciZKUAAAAA1yJkpf/9/70FtgPDAAAACAACAAAAAAAAAAEAAAPA/8AAAAW3//3//QW2AAEAAAAAAAAAAAAAAAAAAAAMBAAAAAAAAAAAAAAAAgAAAAQAASAEAADgBAAAwAQAAJ0EAP/9BAAAAAQAAAAFtwAAAAAAAAAKABQAHgAyAEYAjACiAL4BFgE2AY4AAAABAAAADAA8AAMAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADQAAAAEAAAAAAAIABwCWAAEAAAAAAAMADQBIAAEAAAAAAAQADQCrAAEAAAAAAAUACwAnAAEAAAAAAAYADQBvAAEAAAAAAAoAGgDSAAMAAQQJAAEAGgANAAMAAQQJAAIADgCdAAMAAQQJAAMAGgBVAAMAAQQJAAQAGgC4AAMAAQQJAAUAFgAyAAMAAQQJAAYAGgB8AAMAAQQJAAoANADsd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzUmVndWxhcgBSAGUAZwB1AGwAYQByd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==") format("truetype");
    font-weight: 400;
    font-style: normal
}

[class*=" w-icon-"],
[class^=w-icon-] {
    speak: none;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    font-family: webflow-icons !important
}

.icon-dropdown-toggle:before {
    content: ""
}

* {
    box-sizing: border-box
}

html {
    height: 100%
}

body {
    color: #333;
    background-color: #fff;
    min-height: 100%;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 20px
}

img {
    vertical-align: middle;
    max-width: 100%;
    display: inline-block
}

.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
}

input.w-button {
    -webkit-appearance: button
}

html[data-w-dynpage] [data-w-cloak] {
    color: #0000 !important
}

h1,
h2,
h3,
h4,
h5,
h6 {
    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
}

h6 {
    margin-top: 10px;
    font-size: 12px;
    line-height: 18px
}

p {
    margin-top: 0;
    margin-bottom: 10px
}

ul {
    margin-top: 0;
    margin-bottom: 10px;
    padding-left: 40px
}

.embed:after,
.embed:before {
    content: " ";
    grid-area: 1/1/2/2;
    display: table
}

.embed:after {
    clear: both
}

.w-video object {
    border: 0;
    margin: 0;
    padding: 0
}

[type=button],
[type=reset],
button {
    cursor: pointer;
    -webkit-appearance: button;
    border: 0
}

label {
    margin-bottom: 5px;
    font-weight: 700;
    display: block
}

.d-block {
    display: block;
}

.w-container:before,
.dropdown,
.w-input,
.w-input::placeholder,
.w-input:focus,
.w-input[disabled],
.w-input[disabled]:not(.w-input-disabled),
.w-input[readonly] {
    text-align: left;
    z-index: 900;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
    position: relative
}

.dropdown-btn,
.dropdown-link,
.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
}

.dropdown-toggle {
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    padding-right: 40px;
    display: inline-block
}

.dropdown-toggle:focus {
    outline: 0
}

.icon-dropdown-toggle {
    width: 1em;
    height: 1em;
    margin: auto 20px auto auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0
}

.dropdown-list {
    background: #ddd;
    min-width: 100%;
    display: none;
    position: absolute
}

.dropdown-list.w--open {
    display: block
}

.dropdown-link {
    color: #222;
    padding: 10px 20px;
    display: block
}

.dropdown-link.is-current {
    color: #0082f3
}

.dropdown-link:focus {
    outline: 0
}

.w-nav-link.is-current,
.w-nav:before {
    color: #0082f3
}

[data-nav-menu-open] {
    text-align: center;
    background: #c8c8c8;
    min-width: 200px;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    overflow: visible;
    display: block !important
}

.w--nav-dropdown-open,
.w-nav[data-collapse=all] .w-nav-button {
    background-color: #c8c8c8
}

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

    100% {
        transform: rotate(360deg)
    }
}

.cart-wrapper,
.dynamic-bind-empty,
.w-dyn-hide {
    display: inline-block;
    position: relative
}

.cart-open-link {
    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
}

.cart-quantity-badge-badge {
    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
}

.cart-container-wrapper {
    z-index: 1001;
    background-color: #000c;
    position: fixed;
    inset: 0
}

.cart-modal {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex
}

.cart-container {
    background-color: #fff;
    flex-direction: column;
    width: 100%;
    min-width: 320px;
    max-width: 480px;
    display: flex;
    overflow: auto;
    box-shadow: 0 5px 25px #00000040
}

.cart-header {
    border-bottom: 1px solid #e6e6e6;
    flex: none;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    display: flex;
    position: relative
}

.cart-header-title {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0
}

.cart-close-button {
    width: 16px;
    height: 16px
}

.cart-form-wrapper {
    flex-direction: column;
    flex: 1;
    display: flex
}

.cart-form {
    flex-direction: column;
    flex: 1;
    justify-content: flex-start;
    display: flex
}

.cart-list {
    -webkit-overflow-scrolling: touch;
    flex: 1;
    padding: 12px 24px;
    overflow: auto
}

.cart-item {
    align-items: flex-start;
    padding-top: 12px;
    padding-bottom: 12px;
    display: flex
}

.cart-item-image {
    width: 60px;
    height: 0%
}

.cart-item-info {
    flex-direction: column;
    flex: 1;
    margin-left: 16px;
    margin-right: 16px;
    display: flex
}

.cart-item-title {
    font-weight: 700
}

.cart-item-options {
    margin-bottom: 0;
    padding-left: 0;
    text-decoration: none;
    list-style-type: none
}

.cart-item-quantity {
    -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
}

.cart-item-quantity::placeholder {
    color: #999
}

.cart-item-quantity:focus {
    border-color: #3898ec;
    outline-style: none
}

.cart-footer {
    border-top: 1px solid #e6e6e6;
    flex-direction: column;
    flex: none;
    padding: 16px 24px 24px;
    display: flex
}

.cart-line-item {
    flex: none;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 16px;
    display: flex
}

.cart-order-value {
    font-weight: 700
}

.cart-apple-pay-button {
    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
}

.cart-quick-checkout-button {
    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
}

.cart-google-pay-icon,
.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
}

.cart-empty-state {
    flex: 1;
    justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex
}

.cart-error-state {
    background-color: #ffdede;
    flex: none;
    margin: 0 24px 24px;
    padding: 10px
}

body {
    font-family: var(--_font-family---inter);
    color: var(--dark);
    font-size: var(--_font-size---fz-16);
    line-height: var(--_line-height---lh-150)
}

h1 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-72);
    line-height: var(--_line-height---lh-96);
    letter-spacing: var(--_letter-spacing---ls-5);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

h2 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-60);
    line-height: var(--_line-height---lh-110);
    letter-spacing: var(--_letter-spacing---ls-6);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

h3 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-48);
    line-height: var(--_line-height---lh-110);
    letter-spacing: var(--_letter-spacing---ls-3);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

h4 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-40);
    line-height: var(--_line-height---lh-110);
    letter-spacing: var(--_letter-spacing---ls-4);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

h5 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-32);
    line-height: var(--_line-height---lh-120);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

h6 {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-24);
    line-height: var(--_line-height---lh-120);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

p {
    margin-bottom: 0
}

ul {
    margin-top: 0;
    margin-bottom: 10px;
    padding-left: 40px
}

.navigation-dropdown-link {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-150);
    letter-spacing: -.01em;
    border-radius: 4px;
    padding: 8px 16px;
    transition: all .3s linear
}

.navigation-dropdown-link.is-current,
.navigation-dropdown-link:hover {
    background-color: var(--color-1);
    color: #0c0407
}

.section-spacing {
    padding-left: 20px;
    padding-right: 20px
}

.navigation-dropdown-list {
    background-color: #fff;
    border-radius: 6px;
    width: auto;
    min-width: 100px
}

.navigation-dropdown-list.w--open {
    background-color: var(--transparent)
}

.main-wrapper {
    margin-bottom: 0
}

.navigation-menu {
    grid-column-gap: 56px;
    grid-row-gap: 56px;
    justify-content: center;
    align-items: center;
    display: flex
}

.footer-top {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 140px;
    display: flex
}

.footer-bottom-text {
    letter-spacing: 0;
    font-size: 14px
}

.navigation-dropdown-inner {
    border: 1px solid var(--white);
    background-color: var(--white);
    border-radius: 6px;
    padding: 8px;
    overflow: hidden;
    box-shadow: 0 6px 10px -2px #0003
}

.footer-bottom {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.nav-open {
    display: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.nav-open .nav-bar {
    transition: all 0.3s ease;
}

.cusrsor-pointer {
    cursor: pointer;
}

.nav-open.active .nav-bar._1 {
    transform: rotate(45deg) translate(5px, 5px) !important;
}

.nav-open.active .nav-bar._2 {
    opacity: 0;
}

.nav-open.active .nav-bar._3 {
    transform: rotate(-45deg) translate(5px, -5px) !important;
}

.button-icon-wrapper {
    flex: none;
    justify-content: flex-end;
    align-items: center;
    width: 12px;
    display: flex;
    overflow: hidden
}

.button-icon-wrapper.contact {
    width: 14px
}

.footer-menu-wrapper {
    grid-column-gap: 48px;
    grid-row-gap: 48px;
    flex-flow: wrap;
    justify-content: center;
    align-items: center;
    display: flex
}

.logo {
    width: 100%
}

.nav-wordmark {
    font-family: var(--_font-family---poppins);
    font-weight: 700;
    font-size: clamp(24px, 2.4vw, 28px);
    color: var(--dark);
    letter-spacing: -0.05em;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none;
    display: block;
}

.button-icon {
    flex: none;
    width: 12px;
    line-height: 1%
}

.button-icon.contact {
    width: 14px
}

.logo-wrapper {
    width: auto;
    max-width: none;
    text-decoration: none;
}

.logo-wrapper.is-current {
    max-width: none;
    text-decoration: none;
}

.container {
    width: 100%;
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto
}

.show-mobile {
    display: none
}

.footer-copyright {
    letter-spacing: 0;
    font-size: 14px
}

.navigation-link {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-150);
    letter-spacing: var(--_letter-spacing---ls-1);
    cursor: pointer;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: 400;
    text-decoration: none;
    transition: all .3s linear
}

.navigation-link.is-current,
.navigation-link:hover {
    color: var(--dark-2);
    text-decoration: underline
}

.navigation-section {
    z-index: 999;
    width: 100%;
    padding-top: 16px;
    padding-bottom: 16px;
    position: absolute;
    inset: 0 auto auto 0
}

.footer-section {
    z-index: 1;
    background-image: linear-gradient(180deg, var(--white), var(--hero-background));
    padding-top: 210px;
    padding-bottom: 32px;
    position: relative
}

.navigation-dropdown-icon {
    color: #333;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
    position: static
}

.navigation-right {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    justify-content: flex-end;
    align-items: center;
    display: flex
}

.navigation-layout {
    justify-content: space-between;
    align-items: center;
    display: flex
}

.navigation-dropdown-toggle {
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-150);
    letter-spacing: -.01em;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    transition: all .3s linear;
    display: flex
}

.navigation-dropdown-toggle.w--open,
.navigation-dropdown-toggle:hover {
    color: #0c0407
}

.button-inner {
    grid-column-gap: 6px;
    grid-row-gap: 6px;
    justify-content: center;
    align-items: center;
    height: 16px;
    display: flex
}

.button-primary {
    z-index: 1;
    border: 1px solid var(--dark);
    background-color: var(--dark);
    color: var(--white);
    letter-spacing: -.01em;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 112%;
    text-decoration: none;
    display: inline-flex;
    position: relative;
    overflow: hidden
}

.button-primary.contact-btn-wrap {
    font-size: var(--_font-size---fz-16);
    line-height: var(--_line-height---lh-122);
    letter-spacing: var(--_letter-spacing---ls-1);
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px
}

.footer-bottom-text-link {
    color: #0c0407;
    display: inline-block
}

.button-shape {
    z-index: -1;
    background-color: var(--color-1);
    pointer-events: none;
    width: 120%;
    height: 120%;
    position: absolute;
    inset: -10% auto auto -10%;
    transform: translate(-110%)
}

.button-shape.is-dark-secondary {
    background-color: var(--dark-2)
}

.footer-link {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    text-decoration: none;
    transition: all .3s linear;
    display: inline-block
}

.footer-link:hover {
    color: var(--dark-2);
    text-decoration: underline
}

.footer-title-wrapper {
    text-align: center
}

.footer-title {
    font-size: 120px;
    line-height: var(--_line-height---lh-100);
    font-weight: 500
}

.button-primary-dark {
    z-index: 1;
    border: 1px solid var(--dark);
    background-color: var(--dark);
    color: var(--white);
    letter-spacing: -.01em;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    padding: 12px 16px;
    font-size: 14px;
    font-weight: 600;
    line-height: 112%;
    text-decoration: none;
    display: inline-flex;
    position: relative;
    overflow: hidden
}

.shape-wrapper {
    filter: blur(40px);
    width: 100%;
    max-width: 956px
}

.shape-wrapper.hero-shape {
    filter: blur(40px);
    width: 642px;
    max-width: 642px
}

.shape-wrapper.project-shape {
    filter: blur(40px);
    max-width: 774px
}

.shape-wrapper.faq-shape {
    filter: blur(40px);
    max-width: 774px;
    margin-top: -8%;
    margin-left: -20%
}

.shape-wrapper.services-item-shape {
    filter: blur(26px);
    max-width: 299px;
    margin-top: -8%;
    margin-left: -20%
}

.shape {
    width: 100%
}

.footer-shape-wrapper {
    z-index: -1;
    pointer-events: none;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    padding-top: 80px;
    display: flex;
    position: absolute;
    inset: 0 auto auto 0;
    overflow: clip
}

.hero-section {
    z-index: 1;
    background-image: linear-gradient(180deg, var(--hero-background), var(--white));
    padding-top: 132px;
    padding-bottom: 90px;
    position: relative;
    overflow-x: clip
}

.hero-section.contact-hero {
    z-index: 5;
    background-image: linear-gradient(180deg, var(--color-1), var(--transparent))
}

.hero-section.hero-b-details-section {
    padding-bottom: 0
}

.hero-content {
    z-index: 1;
    position: relative
}

.hero-content.about-hero-heading {
    margin-bottom: 48px
}

.hero-title-wrap {
    margin-bottom: 60px
}

.hero-name .hero-title {
    display: block;
    letter-spacing: var(--_letter-spacing---ls-5)
}

.hero-title-wrap.blogs-hero-title {
    margin-bottom: 40px
}

.hero-title-wrap.common-title-wrap {
    margin-bottom: 0
}

.hero-title {
    font-size: calc(var(--_font-size---fz-240) * var(--hero-font-scale, 1));
    line-height: var(--_line-height---lh-74);
    text-transform: uppercase
}

.hero-title.common-title {
    font-size: 100px
}

.hero-title.home {
    margin-left: -15px
}

#hero {
    --hero-background: #f6e6d0;
    --orb-color-1: #34383d;
    --orb-color-2: #bd8257;
    --orb-color-3: #7f9b92;
}

#hero .hero-title.home {
    font-size: min(12vw, calc(var(--_font-size---fz-240) * var(--hero-font-scale, 1)))
}

#hero .hero-about-video {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover
}

#hero .hero-location {
    font-size: .72em;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -.02em
}

#hero .hero-shape-wrapper {
    opacity: .48
}

#hero .shape-wrapper.hero-shape {
    filter: blur(6px)
}

#hero .hero-shape .shape {
    transform-origin: 50% 50%;
    animation: hero-circle-turn 36s linear infinite
}

@keyframes hero-circle-turn {
    to { transform: rotate(360deg) }
}

@media (prefers-reduced-motion: reduce) {
    #hero .hero-shape .shape {
        animation: none
    }
}

.navigation-section .button-icon svg,
#hero .hero-about-btn-wrap .button-icon svg {
    transform: rotate(-45deg)
}

@media screen and (min-width: 992px) {
    .navigation-section .navigation-layout {
        display: grid;
        grid-template-columns: 1fr auto 1fr
    }

    .navigation-section .navigation-left {
        justify-self: start
    }

    .navigation-section .navigation-menu {
        gap: 36px
    }
}

.hero-sub-title {
    font-size: var(--_font-size---fz-40);
    letter-spacing: var(--_letter-spacing---ls-4)
}

.hero-about-layout {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: row;
    justify-content: space-between;
    align-items: flex-end;
    margin-top: -88px;
    display: flex
}

.hero-about-content {
    width: 100%;
    max-width: 390px
}

.hero-about-thumb-wrap {
    max-width: 460px
}

.hero-about-title-wrap {
    margin-bottom: 12px
}

.hero-about-title {
    font-size: var(--_font-size---fz-24);
    line-height: var(--_line-height---lh-112);
    letter-spacing: var(--_letter-spacing---ls-0);
    font-weight: 500
}

.hero-about-text-wrap {
    margin-bottom: 28px
}

.hero-shape-wrapper {
    z-index: -1;
    pointer-events: none;
    position: absolute;
    inset: -250px -250px auto auto
}

.projects-section {
    z-index: 1;
    padding-top: 90px;
    padding-bottom: 90px;
    position: relative
}

.section-heading.projects-heading {
    text-align: center;
    width: 100%;
    max-width: 677px;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto
}

.section-heading.faq-heading {
    text-align: center;
    width: 100%;
    margin-bottom: 40px
}

.section-heading.blogs-heading {
    text-align: center;
    width: 100%;
    max-width: 799px;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto
}

.section-heading.product-heading {
    text-align: center;
    width: 100%;
    max-width: 900px;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto
}

.section-title {
    font-size: var(--_font-size---fz-72);
    text-transform: uppercase;
    line-height: 80px
}

.section-text-wrap {
    margin-top: 12px
}

.section-text-wrap.faq-section-text {
    margin-top: 20px
}

.projects-layout-1 {
    grid-column-gap: 12px;
    grid-row-gap: 40px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    place-items: start end;
    margin-bottom: 40px;
    display: flex
}

.projects-item-thumb-wrap {
    margin-bottom: 12px;
    text-decoration: none;
    display: block;
    overflow: hidden
}

.projects-item-title-wrap {
    margin-bottom: 8px;
    text-decoration: none
}

.projects-item-title {
    color: var(--dark);
    font-size: var(--_font-size---fz-24);
    line-height: var(--_line-height---lh-112);
    letter-spacing: var(--_letter-spacing---ls-0);
    font-weight: 500
}

.projects-item-category-layout {
    flex-flow: wrap;
    align-items: center;
    display: flex
}

.projects-item-category-wrap {
    justify-content: flex-start;
    align-items: center
}

.projects-item-category {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    letter-spacing: var(--_letter-spacing---ls-1);
    text-decoration: none
}

.services-section {
    --hero-background: #FFF8EE;
    --white: #FFF8EE;
    --orb-color-1: #E2E8DF;
    --orb-color-2: #F3E1C9;
    --orb-color-3: #FFF8EE;
    color: #171412;
    padding-top: 90px;
    padding-bottom: 90px
}

.services-section .services-item:nth-child(3) {
    --service-gradient-end: #EDE5DA
}

.services-section .services-item:nth-child(4) {
    --service-gradient-end: #E2E8DF
}

.services-section .services-item:nth-child(5) {
    --service-gradient-start: #F3E1C9;
    --service-gradient-end: #FFF8EE
}

.services-section .services-item-bg {
    background-image: linear-gradient(155deg, var(--service-gradient-start, #FFF8EE), var(--service-gradient-end, #F3E1C9))
}

.services-section .shape-wrapper.services-item-shape {
    filter: blur(16px)
}

/* Reuse the existing circle rotation; retain each card's original SVG position. */
.services-section .services-item-shape .shape {
    transform-origin: 50% 50%;
    animation: hero-circle-turn 36s linear infinite
}

.services-layout {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid
}

.services-item {
    z-index: 1;
    background-color: #f5f5f5;
    padding: 24px;
    position: relative;
    overflow: hidden
}

.services-item-icon-wrap {
    margin-bottom: 157px
}

.services-item-title-wrap {
    margin-bottom: 16px
}

.services-item-title {
    font-size: var(--_font-size---fz-32);
    font-weight: 500;
    line-height: 40px
}

.services-item-text-wrap {
    width: 100%;
    max-width: 332px
}

.services-item-text {
    font-size: var(--_font-size---fz-14);
    letter-spacing: var(--_letter-spacing---ls-1)
}

.reviews-section {
    padding-top: 90px;
    padding-bottom: 90px
}

.reviews-layout {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    align-items: start;
    display: grid
}

.reviews-section.has-two-testimonials .reviews-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 840px;
    margin-inline: auto
}

.reviews-item {
    background-color: #FAF8F4;
    color: #171412;
    gap: 32px;
    margin: 0;
    flex-flow: column;
    justify-content: space-between;
    align-items: stretch;
    padding: 32px;
    display: flex
}

.reviews-item-text-wrap {
    width: 100%;
    max-width: 319px;
    margin: 0
}

.reviews-item-text {
    font-size: var(--_font-size---fz-20);
    letter-spacing: var(--_letter-spacing---ls-1);
    font-weight: 500
}

.reviews-item-info-wrap {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    align-items: center;
    display: flex
}

.reviews-item-author-wrap {
    width: 100%;
    max-width: 52px
}

.reviews-item-author-name {
    color: #706A63;
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-122);
    letter-spacing: var(--_letter-spacing---ls-1);
    margin-bottom: 4px;
    font-weight: 500
}

.reviews-item-author-info {
    color: #706A63;
    font-size: var(--_font-size---fz-14);
    letter-spacing: var(--_letter-spacing---ls-1)
}

.reviews-item-company-logo {
    display: block;
    width: 110px;
    max-width: 100%;
    height: 30px;
    margin-top: 16px;
    object-fit: contain;
    object-position: left center
}

.reviews-item-company-logo--davitoni {
    width: 130px;
    height: 35px
}

.reviews-preview-notice {
    text-align: center
}

.reviews-item-thumb-wrap {
    width: 100%;
    max-width: 357px;
    margin-bottom: 24px
}

.faq-section {
    z-index: 1;
    padding-top: 90px;
    padding-bottom: 90px;
    position: relative
}

.faq-layout {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    width: 100%;
    max-width: 823px;
    margin-left: auto;
    margin-right: auto
}

.faq-text-wrap {
    width: 100%;
    max-width: 621px;
    overflow: hidden
}

.faq-title-wrap {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    display: flex
}

.faq-icon-minus {
    background-color: #0c0407;
    width: 100%;
    height: 2px;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%)
}

.faq {
    border: 1px #e0e0e0;
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 40px
}

.faq-right {
    grid-column-gap: 40px;
    grid-row-gap: 40px;
    flex-flow: column;
    width: 100%;
    max-width: 823px;
    display: flex
}

.faq-text {
    color: #4c4c4c;
    letter-spacing: 0;
    padding-top: 24px;
    font-size: 16px;
    line-height: 150%
}

.faq-icon {
    z-index: 1;
    flex: none;
    width: 16px;
    height: 16px;
    position: relative
}

.faq-title {
    font-family: var(--_font-family---poppins);
    color: var(--dark);
    font-size: var(--_font-size---fz-24);
    line-height: var(--_line-height---lh-112);
    letter-spacing: var(--_letter-spacing---ls-4);
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 600
}

.faq-icon-plus {
    background-color: #0c0407;
    width: 2px;
    height: 100%;
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%)
}

.blogs-section {
    padding-top: 90px;
    padding-bottom: 90px
}

.blogs-layout {
    grid-column-gap: 12px;
    grid-row-gap: 40px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid
}

.blogs-item-thumb-wrap {
    margin-bottom: 12px;
    text-decoration: none;
    display: block;
    overflow: hidden
}

.blogs-item-content {
    width: 100%;
    max-width: 335px
}

.blogs-item-title-wrap {
    margin-bottom: 12px;
    text-decoration: none
}

.blogs-item-title {
    font-family: var(--_font-family---inter);
    color: var(--dark);
    font-size: var(--_font-size---fz-20);
    line-height: var(--_line-height---lh-150);
    letter-spacing: var(--_letter-spacing---ls-1)
}

.blogs-item-info-wrap {
    flex-flow: wrap;
    align-items: center;
    display: flex
}

.blogs-item-category {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    letter-spacing: var(--_letter-spacing---ls-1);
    font-weight: 500;
    text-decoration: none;
    display: block
}

.blogs-item-summary {
    color: #706A63;
    margin-top: 12px;
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-150)
}

.blogs-case-study-link {
    height: 100%;
    display: block;
    color: inherit;
    text-decoration: none
}

.blogs-case-study-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 6px
}

#blogs .blogs-item-thumb {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover
}

.blogs-case-study-link:hover .blogs-item-thumb,
.blogs-case-study-link:focus-visible .blogs-item-thumb {
    transform: scale(1.1)
}

.development-placeholder-label {
    color: #706A63;
    margin-bottom: 12px;
    font-size: var(--_font-size---fz-12);
    font-weight: 400;
    line-height: var(--_line-height---lh-150);
    letter-spacing: .02em
}

.blogs-item-date {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    letter-spacing: var(--_letter-spacing---ls-1);
    font-weight: 500
}

.blogs-item-time {
    color: var(--dark);
    font-size: var(--_font-size---fz-14);
    line-height: var(--_line-height---lh-150);
    font-weight: 500
}

.projects-layout-2 {
    grid-column-gap: 12px;
    grid-row-gap: 40px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: flex-end;
    place-items: flex-start end;
    margin-bottom: 40px;
    display: flex
}

.projects-layout-3 {
    grid-column-gap: 12px;
    grid-row-gap: 40px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: space-between;
    place-items: flex-start end;
    display: flex
}

.projects-item-category-gap {
    background-color: #dadada;
    width: 1px;
    height: 20px;
    margin-left: 12px;
    margin-right: 12px
}

.project-shape-wrap {
    z-index: -1;
    pointer-events: none;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-top: 80px;
    display: flex;
    position: absolute;
    inset: 0 auto auto 0;
    overflow: clip
}

.services-item-bg {
    z-index: -1;
    background-image: linear-gradient(180deg, var(--hero-background), var(--white));
    pointer-events: none;
    position: absolute;
    inset: 0
}

.services-item-shape-wrap {
    z-index: -1;
    pointer-events: none;
    justify-content: flex-end;
    align-items: flex-start;
    display: flex;
    position: absolute;
    inset: -75% -25% auto auto
}

.reviews-item-video {
    width: 100%;
    height: 260px
}

.blogs-item-border {
    background-color: #dadada;
    width: 1px;
    height: 20px;
    margin-left: 12px;
    margin-right: 12px
}

.category-item.is-current,
.category-item:hover {
    border-color: var(--dark);
    background-color: var(--dark);
    color: var(--white)
}

.projects-item-wrap {
    width: 32.5%
}

.cart-line-item-label,
.payment-info-wrap {
    color: #0c0407;
    font-size: 24px;
    font-weight: 600;
    line-height: 120%
}

.cart-item-thumbnail {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.c-cart-error-state {
    color: #0c0407;
    text-align: center;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    margin: 12px 0 0;
    padding: 4px 16px;
    font-size: 14px;
    font-weight: 400;
    display: flex
}

.cart-line-item-value {
    color: #0c0407;
    font-size: 24px;
    font-weight: 600;
    line-height: 120%
}

.c-cart-checkout-button {
    background-color: #0c0407;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    height: 42px;
    padding: 4px 16px;
    font-size: 14px;
    font-weight: 600;
    transition: all .35s linear;
    display: flex
}

.c-cart-checkout-button:hover {
    background-color: #333
}

.cart-quantity-badge {
    color: #fff;
    text-align: center;
    background-color: #0c0407;
    border: 1px solid #0c0407;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    display: flex;
    position: absolute;
    inset: -8px -8px auto auto
}

.cart-item-title {
    color: #0c0407;
    font-size: 24px;
    font-weight: 600;
    line-height: 120%
}

.cart-container {
    border-radius: 10px;
    max-width: 735px;
    padding: 32px
}

.cart-close-button {
    color: #0c0407;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    display: flex
}

.cart-icon-wrapper {
    background-color: #0000;
    justify-content: flex-end;
    align-items: center;
    padding: 0;
    position: relative
}

.cart-item-title-wrapper {
    flex-flow: column;
    margin-bottom: 12px;
    display: flex
}

.cart-item-options-wrapper {
    margin-bottom: 24px
}

.cart-item-quantity {
    color: #0c0407;
    text-align: center;
    background-color: #0000;
    border-style: solid;
    border-color: #e5e5e5;
    border-radius: 0;
    width: 54px;
    margin-bottom: 0
}

.c-cart-empty-wrap {
    color: #0c0407;
    background-color: #f8f8f8;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 90px;
    font-size: 18px;
    font-weight: 400;
    display: flex
}

.cart-header {
    border-bottom-style: none;
    border-bottom-color: #e5e5e5;
    padding: 0 0 12px
}

.cart-item-thumbnail-wrapper {
    flex: none;
    width: 100%;
    max-width: 168px
}

.cart-item-quantity-wrapper {
    margin-bottom: 32px;
    display: none
}

.cart-header-title {
    color: #0c0407;
    letter-spacing: -.03em;
    font-size: 36px;
    line-height: 43px
}

.cart-item {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    justify-content: flex-start;
    align-items: stretch;
    padding-top: 16px;
    padding-bottom: 16px
}

.cart-item-option {
    font-weight: 600
}

.cart-footer {
    border-top-color: #e5e5e5;
    margin-top: 16px;
    padding: 12px 0 0
}

.cart-item-content {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    flex-flow: row;
    justify-content: space-between;
    align-items: flex-start;
    margin-left: 0;
    margin-right: 0;
    display: flex
}

.cart-item-price-wrapper.mobile-only {
    display: none
}

.cart-apple-pay-button {
    border-radius: 0;
    height: 42px;
    margin-bottom: 12px;
    padding-left: 16px;
    padding-right: 16px;
    font-weight: 600
}

.cart-empty-state {
    padding: 0;
    display: block
}

.cart-item-price {
    color: #0c0407;
    font-size: 24px;
    font-weight: 600;
    line-height: 120%
}

.cart-item-remove-button {
    color: #fc372d;
    font-size: 14px;
    font-weight: 600;
    line-height: 120%;
    text-decoration: none
}

.option-list {
    color: #0c0407;
    font-size: 16px;
    font-weight: 400
}

.cart-empty-continue-button-wrap {
    margin-top: 20px
}

.cart-list {
    max-height: 550px;
    padding: 0
}

.cart-empty-continue-button {
    color: #fff;
    background-color: #0c0407;
    border-radius: 0;
    justify-content: center;
    align-items: center;
    height: 40px;
    font-size: 14px;
    font-weight: 600;
    line-height: 120%;
    transition: all .35s linear;
    display: flex
}

.cart-empty-continue-button:hover {
    background-color: #4c4c4c
}

.cart-item-content-right {
    flex: none
}

.cart,
.shopping-cart-wrapper {
    justify-content: flex-end;
    align-items: center;
    display: flex
}

.hero-about-thumb-layout {
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    margin-bottom: 40px;
    display: grid
}

@media screen and (max-width:575px) {
    .w-container {
        max-width: none
    }

    .w-nav[data-collapse=tiny] .w-nav-menu {
        display: none
    }

    .w-nav[data-collapse=tiny] .w-nav-button {
        display: block
    }

    .cart-modal {
        flex-direction: row;
        justify-content: center;
        align-items: stretch
    }

    .cart-item-quantity {
        font-size: 16px
    }

    .c-shape-wrap,
    .c-shape-wrap-2 {
        max-width: 150px
    }

    .footer-bottom-text-wrapper {
        order: 1
    }

    .footer-menu-wrapper {
        grid-column-gap: 20px;
        grid-row-gap: 6px;
        justify-content: flex-start;
        align-items: center
    }

    .c-hero-title {
        font-size: 36px
    }

    .footer-title {
        font-size: 40px
    }

    .hero-section {
        padding-top: 100px
    }

    .hero-title {
        font-size: 60px;
        line-height: var(--_line-height---lh-80)
    }

    .hero-title.common-title {
        font-size: 32px
    }

    .hero-title.home {
        margin-left: -4px
    }

    .hero-sub-title {
        font-size: var(--_font-size---fz-24)
    }

    .hero-about-layout {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .hero-shape-wrapper {
        top: -250px;
        right: -250px
    }

    .section-title {
        font-size: var(--_font-size---fz-26)
    }

    .projects-layout-1 {
        grid-row-gap: 20px;
        grid-template-columns: 1fr;
        margin-bottom: 20px
    }

    .projects-item-title-wrap {
        width: 100%
    }

    .projects-item-title {
        line-height: var(--_line-height---lh-120)
    }

    .services-layout {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        grid-template-columns: 1fr
    }

    .reviews-layout {
        grid-template-columns: 1fr
    }

    .reviews-item {
        grid-column-gap: 24px;
        grid-row-gap: 24px
    }

    .reviews-item-thumb-wrap {
        margin-bottom: 0
    }

    .faq-right {
        flex-flow: column
    }

    .faq-text {
        padding-right: 0
    }

    .faq-title {
        font-size: 16px;
        line-height: var(--_line-height---lh-150)
    }

    .blogs-layout {
        grid-template-columns: 1fr
    }

    .projects-layout-2 {
        grid-row-gap: 20px;
        grid-template-columns: 1fr;
        margin-bottom: 20px
    }

    .projects-layout-3 {
        grid-row-gap: 20px;
        grid-template-columns: 1fr
    }

    .services-item-shape-wrap {
        top: -50%;
        right: -50%
    }

    .about-layout {
        grid-template-columns: 1fr
    }

    .contact-title {
        font-size: var(--_font-size---fz-26)
    }

    .b-details-title {
        font-size: var(--_font-size---fz-26);
        line-height: var(--_line-height---lh-120)
    }

    .categories-template-layout,
    .projects-layout-4 {
        grid-template-columns: 1fr
    }

    .product-details-title {
        font-size: var(--_font-size---fz-26)
    }

    .p-details-title.projects-title {
        font-size: 32px
    }

    .p-details-project-title {
        font-size: var(--_font-size---fz-26)
    }

    .error-title {
        font-size: 100px
    }

    .error-sub-title {
        font-size: var(--_font-size---fz-24)
    }

    .error-text {
        font-size: var(--_font-size---fz-16)
    }

    .checkout-common-title,
    .password-form-label {
        font-size: var(--_font-size---fz-26)
    }

    .error-hero-section {
        padding-top: 100px
    }

    .cart-line-item-label,
    .cart-line-item-value {
        font-size: 16px
    }

    .cart-item-title {
        font-size: 20px
    }

    .cart-item-thumbnail-wrapper {
        max-width: 100%
    }

    .cart-item {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        flex-flow: column
    }

    .cart-item-option {
        font-size: 14px
    }

    .cart-item-content {
        width: 100%
    }

    .cart-item-price {
        font-size: 16px
    }

    .cart-list {
        max-height: 600px
    }

    .projects-layout-5 {
        grid-template-columns: 1fr
    }

    .hero-about-thumb-layout {
        width: 100%
    }
}

@media screen and (max-width:767px) {
    .w-nav-brand {
        padding-left: 10px
    }

    .w-nav[data-collapse=small] .w-nav-menu {
        display: none
    }

    .w-nav[data-collapse=small] .w-nav-button {
        display: block
    }

    .w-nav-brand {
        padding-left: 10px
    }

    h1 {
        font-size: var(--_font-size---fz-40)
    }

    h2 {
        font-size: var(--_font-size---fz-36)
    }

    h3 {
        font-size: var(--_font-size---fz-30)
    }

    h4 {
        font-size: var(--_font-size---fz-26)
    }

    h5 {
        font-size: var(--_font-size---fz-22)
    }

    h6 {
        font-size: var(--_font-size---fz-20)
    }

    .c-hero-text {
        font-size: 16px
    }

    .footer-bottom {
        flex-flow: wrap
    }

    .c-hero-text-wrap {
        max-width: 100%
    }

    .footer-menu-wrapper {
        grid-column-gap: 40px;
        grid-row-gap: 40px;
        order: 1;
        width: 100%
    }

    .c-hero-title {
        font-size: 40px
    }

    .footer-title {
        font-size: 60px
    }

    .shape-wrapper.footer-shape {
        max-width: 400px
    }

    .hero-title-wrap {
        margin-bottom: 20px
    }

    .hero-title {
        font-size: 100px
    }

    .hero-title.common-title {
        font-size: 48px;
        line-height: var(--_line-height---lh-90)
    }

    .hero-title.home {
        margin-left: -6px
    }

    .hero-about-layout {
        flex-flow: column;
        justify-content: space-between;
        align-items: flex-start;
        margin-top: 40px
    }

    .hero-about-content {
        max-width: 100%
    }

    .hero-about-thumb-wrap {
        order: -1;
        max-width: 100%
    }

    .hero-shape-wrapper {
        top: -200px;
        right: -200px
    }

    .section-title {
        font-size: var(--_font-size---fz-40)
    }

    .projects-layout-1 {
        grid-column-gap: 20px
    }

    .projects-item-title {
        font-size: var(--_font-size---fz-20)
    }

    .services-layout {
        grid-column-gap: 20px;
        grid-row-gap: 20px
    }

    .services-item {
        padding: 20px
    }

    .services-item-icon-wrap {
        margin-bottom: 40px
    }

    .services-item-title {
        font-size: var(--_font-size---fz-20)
    }

    .reviews-item {
        padding: 20px
    }

    .reviews-item-text {
        font-size: var(--_font-size---fz-16)
    }

    .faq-text {
        font-size: 14px
    }

    .faq-title {
        font-size: 20px
    }

    .blogs-item-title {
        line-height: var(--_line-height---lh-120)
    }

    .projects-layout-2,
    .projects-layout-3 {
        grid-column-gap: 20px
    }

    .reviews-item-video {
        height: 200px
    }

    .hero-about-thumb-wrap-2 {
        max-width: 100%
    }

    .about-layout {
        grid-template-columns: 1fr 1fr
    }

    .about-item-title {
        font-size: var(--_font-size---fz-20)
    }

    .contact-layout {
        margin-top: 40px
    }

    .contact-input-wrap {
        margin-bottom: 20px
    }

    .contact-input-label {
        font-size: var(--_font-size---fz-16)
    }

    .b-details-title,
    .contact-title {
        font-size: var(--_font-size---fz-40)
    }

    .product-details-title {
        font-size: var(--_font-size---fz-40);
        line-height: var(--_line-height---lh-120)
    }

    .p-details-title.projects-title {
        font-size: 48px
    }

    .p-details-project-title {
        font-size: var(--_font-size---fz-32);
        line-height: var(--_line-height---lh-120)
    }

    .error-title {
        font-size: 200px
    }

    .password-form {
        width: auto;
        max-width: 100%;
        margin-left: 20px;
        margin-right: 20px
    }

    .password-form-label {
        font-size: var(--_font-size---fz-32)
    }

    .cart-line-item-label,
    .cart-line-item-value,
    .cart-item-title {
        font-size: 20px
    }

    .cart-container {
        max-width: 90%;
        padding: 20px
    }

    .cart-item-options-wrapper {
        margin-bottom: 12px
    }

    .cart-item-thumbnail-wrapper {
        max-width: 130px
    }

    .cart-item-quantity-wrapper {
        margin-bottom: 12px
    }

    .cart-header-title {
        font-size: 30px;
        line-height: 1.2
    }

    .cart-item {
        justify-content: flex-start;
        align-items: flex-start
    }

    .cart-item-content {
        flex-flow: wrap
    }

    .cart-item-price-wrapper.mobile-only {
        margin-bottom: 12px;
        display: block
    }

    .cart-item-content-left {
        width: 100%
    }

    .cart-item-price {
        font-size: 20px
    }

    .cart-list {
        max-height: 300px
    }

    .cart-item-content-right {
        display: none
    }

    .hero-about-thumb-layout {
        width: 80%
    }
}

@media screen and (max-width:991px) {
    .w-container {
        max-width: 728px
    }

    .w-nav[data-collapse=medium] .w-nav-menu {
        display: none
    }

    .w-nav[data-collapse=medium] .w-nav-button {
        display: block
    }

    .c-hero-text {
        font-size: 18px
    }

    .navigation-dropdown-link.is-current {
        padding-top: 6px;
        padding-bottom: 6px
    }

    .nav-bar {
        background-color: #fff;
        width: 16px;
        height: 2px;
        padding: 0
    }

    .navigation-dropdown-list {
        position: static
    }

    .navigation-menu {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        border-top: 1px solid var(--dark);
        border-bottom: 1px solid var(--dark);
        background-color: #fff;
        flex-flow: column;
        justify-content: flex-start;
        align-items: flex-start;
        width: 100%;
        padding: 20px;
        display: none;
        position: absolute;
        inset: 100% auto auto 0
    }

    .navigation-menu.is-open {
        display: flex
    }

    .c-shape-wrap-2 {
        max-width: 200px
    }

    .footer-top {
        flex-flow: column;
        padding-bottom: 40px
    }

    .navigation-dropdown-inner {
        padding: 10px
    }

    .footer-bottom {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        flex-flow: wrap
    }

    .c-shape-wrap {
        max-width: 200px
    }

    .nav-open {
        grid-column-gap: 4px;
        grid-row-gap: 4px;
        cursor: pointer;
        background-color: #0c0407;
        flex-flow: column;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        display: flex;
        overflow: hidden;
        cursor: pointer;
        transition: transform 0.3s ease;
    }

    .c-hero-text-wrap {
        max-width: 650px
    }

    .footer-menu-wrapper {
        order: -1;
        width: 100%
    }

    .navigation-left {
        justify-content: space-between;
        align-items: center;
        display: flex
    }

    .navigation-dropdown {
        width: 100%;
        margin-left: 0
    }

    .show-mobile {
        width: 100%;
        line-height: 100%;
        display: block
    }

    .c-hero-section {
        padding-top: 120px;
        padding-bottom: 40px
    }

    .navigation-link {
        width: 100%
    }

    .navigation-link.is-current {
        display: flex
    }

    .footer-section {
        padding-top: 40px;
        padding-bottom: 20px
    }

    .c-hero-title {
        letter-spacing: -.03em;
        font-size: 60px;
        line-height: 120%
    }

    .footer-title {
        font-size: 80px
    }

    .shape-wrapper.hero-shape {
        filter: blur(20px);
        width: 400px;
        max-width: 400px
    }

    .shape-wrapper.footer-shape,
    .shape-wrapper.project-shape {
        filter: blur(30px);
        max-width: 600px
    }

    .hero-section {
        padding-top: 120px;
        padding-bottom: 40px
    }

    .hero-title-wrap {
        margin-bottom: 40px
    }

    .hero-title {
        font-size: 150px
    }

    .hero-title.common-title {
        font-size: 60px;
        line-height: var(--_line-height---lh-90)
    }

    .hero-title.home {
        margin-left: -10px
    }

    .hero-sub-title {
        font-size: var(--_font-size---fz-32)
    }

    .hero-about-layout {
        align-items: stretch;
        margin-top: 40px
    }

    .hero-about-thumb-wrap {
        max-width: 300px
    }

    .hero-about-thumb {
        object-fit: cover;
        height: 100%
    }

    .hero-about-title {
        font-size: var(--_font-size---fz-22)
    }

    .hero-about-text-wrap {
        margin-bottom: 20px
    }

    .hero-shape-wrapper {
        top: -160px;
        right: -160px
    }

    .projects-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .section-heading.faq-heading {
        text-align: center;
        max-width: 100%
    }

    .section-title {
        font-size: var(--_font-size---fz-48);
        line-height: var(--_line-height---lh-120)
    }

    .projects-layout-1 {
        grid-column-gap: 12px;
        grid-row-gap: 40px;
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr;
        grid-auto-columns: 1fr;
        display: grid
    }

    .services-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .services-layout {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        grid-template-columns: 1fr
    }

    .services-item {
        padding: 20px
    }

    .services-item-icon-wrap {
        margin-bottom: 40px
    }

    .services-item-title {
        font-size: var(--_font-size---fz-24);
        line-height: var(--_line-height---lh-120)
    }

    .reviews-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .reviews-layout {
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        grid-template-columns: 1fr 1fr
    }

    .reviews-item {
        padding: 20px
    }

    .faq-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .faq-layout {
        flex-flow: column;
        justify-content: space-between;
        align-items: center
    }

    .faq-text-wrap {
        max-width: 90%
    }

    .faq {
        padding-top: 20px;
        padding-bottom: 20px
    }

    .faq-right {
        grid-column-gap: 0;
        grid-row-gap: 0;
        max-width: 100%
    }

    .faq-text {
        padding-right: 40px
    }

    .faq-title {
        font-size: 20px
    }

    .blogs-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .blogs-layout {
        grid-column-gap: 20px;
        grid-template-columns: 1fr 1fr
    }

    .blogs-item-title {
        line-height: var(--_line-height---lh-120)
    }

    .services-item-gap {
        display: none
    }

    .projects-layout-2,
    .projects-layout-3 {
        grid-column-gap: 12px;
        grid-row-gap: 40px;
        grid-template-rows: auto;
        grid-template-columns: 1fr 1fr;
        grid-auto-columns: 1fr;
        display: grid
    }

    .services-item-shape-wrap {
        top: -100%;
        right: -40%
    }

    .about-item {
        padding: 20px
    }

    .about-item-icon-wrap {
        width: 40px;
        height: 40px;
        padding: 8px
    }

    .about-item-title {
        font-size: var(--_font-size---fz-24)
    }

    .contact-layout {
        flex-flow: column;
        margin-top: 40px
    }

    .contact-title {
        line-height: var(--_line-height---lh-120)
    }

    .category-layout {
        margin-bottom: 20px;
        padding-bottom: 20px;
        overflow-x: auto
    }

    .projects-item-wrap {
        width: 100%
    }

    .categories-template-layout,
    .projects-layout-4 {
        grid-column-gap: 20px;
        grid-template-columns: 1fr 1fr
    }

    .product-details-layout {
        grid-column-gap: 40px;
        grid-row-gap: 40px;
        flex-flow: column
    }

    .product-details-left {
        max-width: 100%
    }

    .product-details-right {
        width: 100%
    }

    .p-details-title-wrap {
        margin-bottom: 40px
    }

    .p-details-title.projects-title {
        font-size: 80px;
        line-height: var(--_line-height---lh-90);
        letter-spacing: var(--_letter-spacing---ls-4)
    }

    .licenses-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .changelog-text {
        font-size: var(--_font-size---fz-16)
    }

    .error-title {
        font-size: 250px
    }

    .password-form {
        margin-top: 40px;
        margin-bottom: 40px
    }

    .password-form-label {
        font-size: var(--_font-size---fz-40)
    }

    .checkout-form {
        padding-top: 40px;
        padding-bottom: 80px
    }

    .checkout-layout {
        flex-flow: column
    }

    .checkout-left {
        width: 100%;
        max-width: 100%
    }

    .checkout-right {
        width: 100%;
        max-width: 100%;
        padding: 20px
    }

    .payment-info-wrap {
        padding: 20px
    }

    .reviews-item-gap {
        display: none
    }

    .error-hero-section {
        padding-top: 120px;
        padding-bottom: 40px
    }

    .hide-mobile {
        display: none
    }

    .c-cart-checkout-button {
        border-radius: 0
    }

    .cart-container {
        max-width: 700px
    }

    .cart-apple-pay-button {
        border-radius: 0
    }

    .projects-layout-5 {
        grid-column-gap: 20px;
        grid-template-columns: 1fr 1fr
    }

    .b-details-section {
        padding-bottom: 40px
    }

    .p-details-section {
        padding-top: 40px;
        padding-bottom: 40px
    }

    .hero-about-thumb-layout {
        width: 69%;
        margin-bottom: 20px
    }
}

.projects-item-thumb-wrap {
    overflow: hidden;
    display: block;
}

.projects-item-thumb {
    transition: transform 0.4s ease;
    transform: scale(1);
}

.projects-item-thumb-wrap:hover .projects-item-thumb {
    transform: scale(1.1);
}

.blogs-item-thumb-wrap {
  overflow: hidden;
  display: block;
}

.blogs-item-thumb {
  transition: transform 0.4s ease;
  transform: scale(1);
}

.blogs-item-thumb-wrap:hover .blogs-item-thumb {
  transform: scale(1.1);
}

.faq-text-wrap {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.faq.active .faq-text-wrap {
  margin-top: 1rem;
}

.faq-icon {
  position: relative;
  width: 24px;
  height: 24px;
  transition: transform 0.3s ease;
}

.faq-icon-plus,
.faq-icon-minus {
  display: none;
}

.faq-icon::after {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%) rotate(45deg);
  transition: transform 0.3s ease;
}

.faq.active .faq-icon::after {
  transform: translate(-50%, -40%) rotate(225deg);
}

.faq-title-wrap {
  cursor: pointer;
  user-select: none;
}

/* Scoped lower-homepage refinements. */
#reviews[hidden],
#blogs[hidden],
.footer-social-links[hidden] {
    display: none !important
}

.footer-section {
    --dark: #171412;
    color: #171412;
    background: #FAF8F5;
    padding: 0
}

.footer-section .footer-layout {
    border-top: 1px solid #D8D1C9
}

.footer-section .footer-top {
    min-height: 0;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 24px;
    padding: clamp(48px, 6vw, 80px) 0 clamp(40px, 5vw, 64px)
}

.footer-section .footer-title-wrapper {
    text-align: left
}

.footer-section .footer-eyebrow {
    margin: 0 0 18px;
    color: #68615B;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: .14em
}

.footer-section .footer-title {
    font-size: clamp(36px, 5vw, 64px);
    line-height: 1.12;
    letter-spacing: -.045em
}

.footer-section .footer-supporting-text {
    max-width: 560px;
    margin: 18px 0 0;
    color: #68615B;
    font-size: clamp(16px, 1.6vw, 18px);
    line-height: 1.65
}

.footer-section .footer-social-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 8px 28px
}

.footer-section .footer-social-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    gap: 4px;
    color: #171412;
    font-size: 15px;
    white-space: nowrap;
    text-decoration: underline;
    text-decoration-color: #D8D1C9;
    text-underline-offset: 5px;
    transition: none
}

.footer-section .footer-social-link:hover {
    text-decoration-color: currentColor
}

.footer-section a:focus-visible {
    outline: 2px solid #171412;
    outline-offset: 5px
}

.footer-section .footer-bottom {
    flex-flow: row;
    gap: 24px;
    border-top: 1px solid #D8D1C9;
    padding: 24px 0
}

.footer-section .footer-logo {
    flex-shrink: 0
}

.footer-section .footer-bottom-text-wrapper {
    text-align: right
}

.footer-section .footer-copyright {
    color: #68615B;
    font-size: 12px;
    line-height: 1.5
}

.footer-section .footer-bottom-text {
    margin-top: 4px;
    color: #68615B;
    font-size: 11px;
    line-height: 1.5
}

.footer-section .footer-bottom-text-link {
    color: inherit;
    text-underline-offset: 3px
}

#reviews .section-title,
#blogs .section-title {
    line-height: var(--_line-height---lh-112)
}

@media screen and (max-width: 767px) {
    #reviews .reviews-layout,
    #blogs .blogs-layout {
        grid-template-columns: minmax(0, 1fr)
    }

    #reviews .reviews-item-gap {
        display: none
    }

    #reviews .reviews-item-text-wrap,
    #blogs .blogs-item-content {
        max-width: none
    }

}

@media (prefers-reduced-motion: reduce) {
    .services-section .services-item-shape .shape {
        animation: none
    }
}

/* ── Email Modal ── */
.modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(12, 4, 7, .55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease
}

.modal-overlay.is-open {
    opacity: 1;
    pointer-events: auto
}

.modal-box {
    background: var(--hero-background);
    width: 92%;
    max-width: 440px;
    padding: 48px 36px 40px;
    position: relative;
    transform: translateY(24px) scale(.97);
    transition: transform .3s ease;
    font-family: var(--_font-family---poppins)
}

.modal-overlay.is-open .modal-box {
    transform: translateY(0) scale(1)
}

.modal-close {
    position: absolute;
    top: 14px;
    right: 16px;
    background: none;
    border: none;
    font-size: 28px;
    line-height: 1;
    color: var(--dark);
    cursor: pointer;
    padding: 4px 8px;
    transition: opacity .2s
}

.modal-close:hover {
    opacity: .6
}

.modal-title {
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-30);
    font-weight: 600;
    line-height: var(--_line-height---lh-110);
    letter-spacing: var(--_letter-spacing---ls-3);
    color: var(--dark);
    margin: 0 0 8px
}

.modal-text {
    font-family: var(--_font-family---inter);
    font-size: var(--_font-size---fz-16);
    line-height: var(--_line-height---lh-150);
    color: var(--dark-2);
    margin: 0 0 24px
}

.modal-form {
    display: flex;
    gap: 0
}

.modal-input {
    flex: 1;
    border: 1px solid var(--dark);
    border-right: none;
    background: var(--white);
    color: var(--dark);
    font-family: var(--_font-family---inter);
    font-size: var(--_font-size---fz-14);
    padding: 14px 16px;
    outline: none;
    border-radius: 0
}

.modal-input::placeholder {
    color: #999
}

.modal-input:focus {
    border-color: var(--dark)
}

.modal-submit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--dark);
    background: var(--dark);
    color: var(--white);
    font-family: var(--_font-family---poppins);
    font-size: var(--_font-size---fz-14);
    font-weight: 600;
    padding: 14px 20px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s, color .2s;
    border-radius: 0
}

.modal-submit:hover {
    background: var(--dark-2)
}

.modal-status {
    font-family: var(--_font-family---inter);
    font-size: var(--_font-size---fz-16);
    color: var(--dark);
    text-align: center;
    margin: 8px 0 0;
    font-weight: 500
}

@media screen and (max-width: 479px) {
    .modal-box {
        padding: 40px 24px 32px
    }
    .modal-form {
        flex-direction: column;
        gap: 10px
    }
    .modal-input {
        border-right: 1px solid var(--dark)
    }
    .modal-submit {
        justify-content: center
    }
}