:root {
    --color-black: #000000;
    --color-black-rgb: 0, 0, 0;
    --color-filter-black: brightness(0);

    --color-white: #ffffff;
    --color-white-rgb: 255, 255, 255;
    --color-filter-white: brightness(0) invert(1);

    --color-cream-comfort: #fffcf5;
    --color-cream-comfort-rgb: 255, 252, 245;

    --color-aqua-spin: #e4f4f3;
    --color-aqua-spin-rgb: 228, 244, 243;

    --color-ocean-wave: #77b8d8;
    --color-ocean-wave-rgb: 119, 184, 216;
    --color-filter-ocean-wave: brightness(0) saturate(100%) invert(78%) sepia(93%) saturate(981%) hue-rotate(168deg)
        brightness(87%) contrast(94%);

    --color-soft-rinse-silver: #6e6e6e;
    --color-soft-rinse-silver-rgb: 110, 110, 110;
    --color-filter-soft-rinse-silver: brightness(0) saturate(100%) invert(45%) sepia(0%) saturate(0%) hue-rotate(157deg)
        brightness(95%) contrast(88%);

    --color-mist-gray: #ececeb;
    --color-mist-gray-rgb: 236, 236, 235;

    --color-cutton-cream: #ceb38d;
    --color-cutton-cream-rgb: 206, 179, 141;

    --color-washed-sandstone: #937b63;
    --color-washed-sandstone-rgb: 147, 123, 99;

    --color-faded-tangerince: #f79469;
    --color-faded-tangerince-rgb: 247, 148, 105;

    --color-sun-bleached: #f7c27e;
    --color-sun-bleached-rgb: 247, 194, 126;

    --color-soft-olive: #a7af95;
    --color-soft-olive-rgb: 167, 175, 149;

    --color-body: var(--color-body-black);
    --color-body-rgb: var(--color-body-black-rgb);
    --color-body-couple: var(--color-white);
    --color-body-couple-rgb: var(--color-white-rgb);
    --color-theme: var(--color-tree);
    --color-theme-rgb: var(--color-tree-rgb);
    --color-theme-couple: var(--color-white);
    --color-theme-couple-rgb: var(--color-white-rgb);

    --color-active: var(--color-tree);
    --color-active-rgb: var(--color-tree-rgb);

    --rgb: var(--color-body-rgb);
    --rgb-couple: var(--color-body-couple-rgb);

    --font-body: "Rubik", "Noto Sans Thai", "sans-serif";
    --font-heading: "Fields", "Noto Sans Thai", "serif";
    --font-weight-regular: normal;
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 900;
    --font-weight-body: var(--font-weight-regular);

    --font-size-h1: 4.4rem;
    --font-size-h2: 3.6rem;
    --font-size-h3: 2.2rem;
    --font-size-h4: 1.8rem;
    --font-size-h5: 1.4rem;
    --font-size-body: 1.4rem;
    --font-size-body2: 1.2rem;
    --font-size-button: 1.1rem;
    --font-size-sub: 1.3rem;
    --font-size-sub2: 1rem;

    --line-height-h1: 1.18;
    --line-height-h2: 1.166;
    --line-height-h3: 1.18;
    --line-height-h4: 1.18;
    --line-height-h5: 1.285;
    --line-height-body: 1.428;
    --line-height-body2: 1.428;
    --line-height-button: 1.273;
    --line-height-sub: 1.384;
    --line-height-sub2: 1.2;

    --icon-size-4xs: 1rem;
    --icon-size-3xs: 1.2rem;
    --icon-size-2xs: 1.4rem;
    --icon-size-xs: 1.6rem;
    --icon-size-1xs: 1.8rem;
    --icon-size-sm: 2rem;
    --icon-size-2sm: 2.4rem;
    --icon-size-md: 2.6rem;
    --icon-size-lg: 3rem;
    --icon-size-xl: 3.2rem;
    --icon-size-2xl: 3.6rem;
    --icon-size-3xl: 4rem;

    --spacing-8xl: 16rem;
    --spacing-7xl: 14rem;
    --spacing-6xl: 12rem;
    --spacing-5xl: 10rem;
    --spacing-4xl: 8rem;
    --spacing-3xl: 7.2rem;
    --spacing-2xl: 6.4rem;
    --spacing-xl: 6rem;
    --spacing-4lg: 5.6rem;
    --spacing-3lg: 5rem;
    --spacing-2lg: 4.8rem;
    --spacing-lg: 4rem;
    --spacing-2md: 3.6rem;
    --spacing-md: 3rem;
    --spacing-2sm: 2.4rem;
    --spacing-sm: 2rem;
    --spacing-xs: 1.6rem;
    --spacing-2xs: 1.2rem;
    --spacing-3xs: 1rem;
    --spacing-4xs: 0.8rem;
    --spacing-5xs: 0.6rem;
    --spacing-6xs: 0.4rem;
    --spacing-7xs: 0.2rem;
    --container-max-width-xl: 188rem;
    --spacing-container: var(--spacing-lg);
    --gap-section: var(--spacing-4xl);

    --hamburger-size: 2.75rem;
    --hamburger-line: 0.1rem;
    --hamburger-gap: 0.8rem;
    --hamburger-background: var(--color-white);
    --logo-height-expanded: 4.4rem;
    --logo-height: 3rem;
    --header-height-expanded: 7.3rem;
    --header-height: 6rem;
    --footer-height: 0rem;
    --navi-height: 0;

    --border-width: 1px;
    --border-style: solid;
    --border-color: var(--color-mist-gray);
    --border: var(--border-width) var(--border-style) var(--border-color);
    --border-light: var(--border-width) var(--border-style) rgba(var(--color-white-rgb), 0.2);

    --input-height: 4rem;
    --input-spacing-x: var(--spacing-2xs);
    --input-spacing-y: 0.3em;
    --input-border: var(--border-width) var(--border-style) var(--color-lime-light);

    --button-height: 4rem;
    --button-spacing-x: var(--spacing-xs);
    --button-spacing-y: var(--spacing-3xs);

    --radius: 1rem;
    --radius-x2: 2rem;
    --opacity-overlay: 0.7;
    --opacity: 0.5;
    --opacity-light: 0.15;
    --duration: 0.3s;
    --duration-x2: 0.5s;
    --duration-x3: 1s;
    --duration-x4: 1.5s;
    --timing-function: ease-in-out;
}

html[lang="th"] {
    --font-body: "Noto Sans Thai", "sans-serif";
    --font-heading: "Fields", "Noto Sans Thai", "sans-serif";

    --font-size-h1: 4.4rem;
    --font-size-h2: 3.6rem;
    --font-size-h3: 2.3rem;
    --font-size-h4: 2rem;
    --font-size-h5: 1.5rem;
    --font-size-body: 1.6rem;
    --font-size-body2: 1.4rem;
    --font-size-button: 1.3rem;
    --font-size-sub: 1.5rem;
    --font-size-sub2: 1.2rem;

    --line-height-h1: 1.18;
    --line-height-h2: 1.3;
    --line-height-h3: 1.18;
    --line-height-h4: 1.333;
    --line-height-h5: 1.285;
    --line-height-body: 1.428;
    --line-height-body2: 1.428;
    --line-height-button: 1.273;
    --line-height-sub: 1.384;
    --line-height-sub2: 1.2;
}

/* SITE ==================== */
/* GENERAL */
.no-scroll {
    height: 100% !important;
    overflow: hidden !important;
}
.c-black {
    color: var(--color-black) !important;
    --rgb: var(--color-black-rgb);
    --rgb-couple: var(--color-white-rgb);
    --filter: var(--filter-black);
}
.c-white {
    color: var(--color-white) !important;
    --rgb: var(--color-white-rgb);
    --rgb-couple: var(--color-black-rgb);
    --filter: var(--filter-white);
}
.c-theme {
    color: var(--color-theme) !important;
    --rgb: var(--color-theme-rgb);
    --rgb-couple: var(--color-theme-couple-rgb);
}
.c-ocean-wave {
    color: var(--color-ocean-wave) !important;
    --rgb: var(--color-ocean-wave-rgb);
    --rgb-couple: var(--color-white-rgb);
}
.c-cutton-cream {
    color: var(--color-cutton-cream) !important;
    --rgb: var(--color-cutton-cream-rgb);
    --rgb-couple: var(--color-white-rgb);
}

.bg-black {
    background-color: var(--color-black) !important;
}
.bg-white {
    background-color: var(--color-white) !important;
}
.bg-theme {
    background-color: var(--color-theme) !important;
}
.bg-mist-gray {
    background-color: var(--color-mist-gray) !important;
}
.bg-mist-gray-opacity {
    background-color: rgba(var(--color-mist-gray-rgb), 0.4) !important;
}
.bg-mist-gray-opacity-2 {
    background-color: rgba(var(--color-mist-gray-rgb), 0.2) !important;
}

.filter-black {
    -webkit-filter: var(--filter-black) !important;
    filter: var(--filter-black) !important;
}
.filter-white {
    -webkit-filter: var(--filter-white) !important;
    filter: var(--filter-white) !important;
}
.filter-theme {
    -webkit-filter: var(--filter-theme) !important;
    filter: var(--filter-theme) !important;
}

.a-left {
    text-align: left !important;
}
.a-right {
    text-align: right !important;
}
.a-center {
    text-align: center !important;
}

.inline-block {
    display: inline-block !important;
}
.capitalize {
    text-transform: capitalize !important;
}
.uppercase {
    text-transform: uppercase !important;
}
.nowrap {
    white-space: nowrap !important;
}
.hidden {
    display: none !important;
}
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.overflow-hidden {
    overflow: hidden !important;
}
.overflow-visible {
    overflow: visible !important;
}

.media-wrapper {
    display: block;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

*:is(.object, .object-fit, .object-auto, .object-contain, .object-fill-height, .object-fill-width) {
    text-decoration: none !important;
    box-shadow: none !important;
    background-image: none !important;
    display: block;
    overflow: hidden;
    position: relative;
    height: 100%;
}
.object-auto {
    height: auto;
}

.object > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
}

.object-fit > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.object-auto > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: auto;
    height: auto;
}

.object-contain > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}

.object-fill-height > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: auto;
    height: 100%;
}

.object-fill-width > *:is(img, video, iframe) {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: auto;
}

.aspect-ratio-1 {
    aspect-ratio: 1 / 1;
}

.aspect-ratio-4-3 {
    aspect-ratio: 4 / 3;
}

.aspect-ratio-3-2 {
    aspect-ratio: 3 / 2;
}

.aspect-ratio-16-9 {
    aspect-ratio: 16 / 9;
}

.aspect-ratio-1-2 {
    aspect-ratio: 1 / 2;
}

.aspect-ratio-2-3 {
    aspect-ratio: 2 / 3;
}

.aspect-ratio-3-4 {
    aspect-ratio: 3 / 4;
}

.social {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    grid-gap: var(--spacing-3xs) var(--spacing-xs);
    line-height: 1;
}
.social a {
    display: block;
    text-decoration: none;
    background: none;
    box-shadow: none;
}
.social .ic {
    display: block;
    padding: 1px;
    margin: -1px;
    font-size: var(--icon-size-1xs);
    color: var(--color-soft-rinse-silver);
}

.padding-top-0 {
    padding-top: 0 !important;
}

.padding-bottom-0 {
    padding-bottom: 0 !important;
}

.padding-x-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.padding-y-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.padding-0 {
    padding: 0 !important;
}

.margin-top-0 {
    margin-top: 0 !important;
}

.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.margin-x-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.margin-y-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.margin-0 {
    margin: 0 !important;
}

/* RESET ==================== */
*,
*:before,
*:after {
    box-sizing: border-box;
}

::-webkit-scrollbar {
    width: 0;
    overflow: hidden;
}

::-moz-selection {
    background: var(--color-ocean-wave);
    color: var(--color-white);
}
::selection {
    background: var(--color-ocean-wave);
    color: var(--color-white);
}

article,
aside,
figcaption,
figure,
picture,
footer,
header,
hgroup,
main,
nav,
section,
dl,
dd {
    display: block;
    margin: 0;
}
html {
    font-family: sans-serif;
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
@view-transition {
    navigation: auto;
}
body {
    margin: 0;
    position: relative;
    min-height: 100svh;
    overflow-x: hidden;
    background: var(--color-cream-comfort);
    color: var(--color-soft-rinse-silver);
    /* -webkit-animation-name: pageAnimation;
    animation-name: pageAnimation;
    -webkit-animation-duration: var(--duration-x3);
    animation-duration: var(--duration-x3);
    -webkit-animation-timing-function: var(--timing-function);
    animation-timing-function: var(--timing-function);
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    will-change: opacity; */
}
@-webkit-keyframes pageAnimation {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes pageAnimation {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}
p {
    margin: 0;
}
small {
    font-size: 88.8888888889%;
}
address {
    font-style: normal;
}
ul,
ol {
    list-style: none;
}
ul,
ol,
li {
    margin: 0;
    padding: 0;
}
a {
    color: inherit;
}
a,
a:hover,
a:focus {
    outline: 0;
    text-decoration: none;
    box-shadow: none;
}
a[href^="tel"] {
    white-space: nowrap;
}
a[href^="mailto"] {
    word-break: break-word;
}
a,
button,
[role="button"] {
    cursor: pointer;
}
button,
input,
textarea,
select {
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: none;
    border-radius: 0;
    border: 0;
    background: none;
    padding: 0;
    margin: 0;
    min-width: 0;
    font: inherit;
    line-height: normal;
    text-transform: inherit;
    text-align: inherit;
    letter-spacing: inherit;
    text-indent: inherit;
    color: inherit;
}
fieldset {
    border: 0 !important;
    background: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
img {
    border: 0;
    outline: 0;
    height: auto;
    width: auto;
    max-width: 100%;
    vertical-align: middle;
}
table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}
th,
td {
    padding: 0;
    font-weight: inherit;
}
hr {
    margin: 0;
    border: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: var(--border-color);
}
iframe {
    border: 0;
}
[tabindex="-1"]:focus {
    outline: 0 !important;
}
script {
    margin: 0 !important;
}

html.resizing * {
    transition: none !important;
}

/* TEXT ==================== */
body {
    font-family: var(--font-body);
    font-weight: var(--font-weight-light);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
strong {
    font-weight: var(--font-weight-bold);
}

.font-body {
    font-family: var(--font-body) !important;
}
.font-heading {
    font-family: var(--font-heading) !important;
}

.style-italic {
    font-style: italic !important;
}
.font-heading.style-italic {
    padding: 0.16em;
    margin: -0.16em;
}

.weight-light {
    font-weight: var(--font-weight-light) !important;
}
.weight-regular {
    font-weight: var(--font-weight-regular) !important;
}
.weight-medium {
    font-weight: var(--font-weight-medium) !important;
}
.weight-semibold {
    font-weight: var(--font-weight-semibold) !important;
}
.weight-bold {
    font-weight: var(--font-weight-bold) !important;
}
.weight-black {
    font-weight: var(--font-weight-black) !important;
}

.size-icon-4xs {
    font-size: var(--icon-size-4xs) !important;
}
.size-icon-3xs {
    font-size: var(--icon-size-3xs) !important;
}
.size-icon-2xs {
    font-size: var(--icon-size-2xs) !important;
}
.size-icon-xs {
    font-size: var(--icon-size-xs) !important;
}
.size-icon-sm {
    font-size: var(--icon-size-sm) !important;
}
.size-icon-2sm {
    font-size: var(--icon-size-2sm) !important;
}
.size-icon-md {
    font-size: var(--icon-size-md) !important;
}
.size-icon-lg {
    font-size: var(--icon-size-lg) !important;
}
.size-icon-xl {
    font-size: var(--icon-size-xl) !important;
}
.size-icon-2xl {
    font-size: var(--icon-size-2xl) !important;
}
.size-icon-3xl {
    font-size: var(--icon-size-3xl) !important;
}

.size-h1 {
    font-size: var(--font-size-h1) !important;
    line-height: var(--line-height-h1);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-h2 {
    font-size: var(--font-size-h2) !important;
    line-height: var(--line-height-h2);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-h3 {
    font-size: var(--font-size-h3) !important;
    line-height: var(--line-height-h3);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-h4 {
    font-size: var(--font-size-h4) !important;
    line-height: var(--line-height-h4);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-h5 {
    font-size: var(--font-size-h5) !important;
    line-height: var(--line-height-h5);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-body {
    font-size: var(--font-size-body) !important;
    line-height: var(--line-height-body) !important;
    font-weight: var(--font-weight-light);
    font-family: var(--font-body);
}
.size-body2 {
    font-size: var(--font-size-body2) !important;
    line-height: var(--line-height-body2) !important;
    font-weight: var(--font-weight-light);
    font-family: var(--font-body);
}
.size-button {
    font-size: var(--font-size-button) !important;
    line-height: var(--line-height-button) !important;
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-sub {
    font-size: var(--font-size-sub) !important;
    line-height: var(--line-height-sub) !important;
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.size-sub2 {
    font-size: var(--font-size-sub2) !important;
    line-height: var(--line-height-sub2) !important;
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}

/* html[lang="th"] {
    .size-body {
        font-weight: var(--font-weight-regular);
    }

    .size-body2 {
        font-weight: var(--font-weight-regular);
    }
} */

/* TRANSITION ====================*/
img,
a,
button,
[role="button"],
input,
textarea,
select,
.select2-selection__placeholder,
.select2-results__option,
.label.anim,
.button,
.ctrl,
.explore,
.container,
.object,
.object-fit,
.bg-img,
.tab-content,
.tabdata-content,
.ic:before,
*[class*="swiper-button-"] {
    transition: var(--duration) var(--timing-function);
}

/* CTAs ====================*/
html.no-touchevents a:hover {
    color: var(--color-active);
}

.link-overlay {
    font-size: 0;
    opacity: 0;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    pointer-events: auto;
}

.link-block {
    display: block;
    position: relative;
    z-index: 1;
}

*:is(.button, .wp-element-button, .wp-block-button__link) {
    --button-border: var(--border-width) var(--border-style) var(--color-mist-gray);
    --button-hover-border: var(--border-width) var(--border-style) rgba(236, 236, 235, 0.4);
    --button-bg: var(--color-white);
    --button-hover-bg: var(--color-cutton-cream);
    --button-color: var(--color-soft-rinse-silver);
    --button-hover-color: var(--color-white);
    text-decoration: none !important;
    box-shadow: none !important;
    margin: 0;
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    grid-gap: var(--spacing-3xs);
    vertical-align: top;
    white-space: normal;
    min-width: 13rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    padding: var(--spacing-2xs) var(--spacing-2sm) !important;
    opacity: 1 !important;
    color: var(--button-color) !important;
    background: var(--button-bg) !important;
    border: var(--button-border) !important;
    border-radius: 0.4rem !important;
    overflow: hidden;
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-button);
    line-height: var(--line-height-button);
    text-align: center;
    transition: var(--duration) var(--timing-function);
    text-transform: capitalize;
}

html.no-touchevents *:is(.button, .wp-element-button, .wp-block-button__link):hover {
    color: var(--button-hover-color) !important;
    background-color: var(--button-hover-bg) !important;
    border: var(--button-hover-border) !important;
}

*:is(.button, .wp-element-button, .wp-block-button__link).secondary {
    --button-border: var(--border-width) var(--border-style) #c9cbcc;
    --button-bg: rgba(var(--color-white-rgb), 0.2);
    --button-color: var(--color-white);
}

*:is(.button, .wp-element-button, .wp-block-button__link).tertiary {
    --button-border: var(--border-width) var(--border-style) #b2b2b1;
    --button-bg: var(--color-soft-rinse-silver);
    --button-color: var(--color-white);
}

.underline-hover {
    --hover-rgb: var(--color-black-rgb);
    --rgb: var(--color-black-rgb);
    display: inline-block;
    position: relative;
}

.underline-hover::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 0.1rem;
    background-color: rgba(var(--rgb), 1);
    transition: var(--duration) var(--timing-function);
}

html.no-touchevents .underline-hover:hover {
    color: rgba(var(--hover-rgb), 1);
}
html.no-touchevents .underline-hover:hover::before {
    width: 100%;
}

/* GENERAL ====================*/
.ic,
.ic-name {
    display: inline-block;
}
.ic > img {
    display: inline-block;
    vertical-align: top;
    width: auto;
    height: 1em;
}
*[class*="ic-"] + *[class*="ic-"] {
    margin-left: var(--spacing-2xs);
}
.ic-youtube:before,
.ic-envelope:before {
    transform: scale(1.25);
    display: block;
    margin: 0 0.2em;
}
.brand {
    text-decoration: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    display: inline-block;
    vertical-align: top;
    line-height: 1;
}
.brand .logo {
    display: inline-block;
    vertical-align: top;
    height: var(--logo-height);
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    transition: none;
}

.lang ul {
    display: inline-flex;
    vertical-align: top;
    align-items: baseline;
}
.lang ul > li:not(:last-child, :empty):after {
    content: "|";
    margin: 0 0.5em;
}
.lang ul > li > a.active {
    color: var(--color-active);
}

html.no-touchevents .lang ul > li > a:not(.active):hover {
    opacity: var(--opacity);
}

/*CONTENT====================*/
.entry-content {
    --gap-row: var(--spacing-md);
    --gap-column: var(--spacing-md);
    --gap-content: var(--spacing-md);
    --wp--preset--font-size--normal: var(--font-size-body);
    --wp--preset--font-size--small: var(--font-size-tagline);
    --wp--preset--font-size--medium: var(--font-size-h5);
    --wp--preset--font-size--large: var(--font-size-h4);
    --wp--preset--font-size--x-large: var(--font-size-h3);
    --wp--preset--font-size--xx-large: var(--font-size-h2);
    --wp--preset--font-size--huge: var(--font-size-h1);
    width: 100%;
}
.entry-content :is(h1, h2, h3, h4, h5, h6) {
    margin: 0;
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
    font-size: inherit;
    line-height: inherit;
    letter-spacing: normal;
    color: var(--color-theme);
}

.entry-content .has-small-font-size {
    font-size: var(--wp--preset--font-size--small) !important;
    line-height: var(--line-height-tagline);
}
.entry-content :is(h6, .has-normal-font-size, .has-regular-font-size) {
    font-size: var(--wp--preset--font-size--normal) !important;
    line-height: var(--line-height-body);
}
.entry-content :is(h5, .has-medium-font-size) {
    font-size: var(--wp--preset--font-size--medium) !important;
    line-height: var(--line-height-h5);
}
.entry-content :is(h4, .has-large-font-size, .has-larger-font-size) {
    font-size: var(--wp--preset--font-size--large) !important;
    line-height: var(--line-height-h4);
}
.entry-content :is(h3, .has-x-large-font-size) {
    font-size: var(--wp--preset--font-size--x-large) !important;
    line-height: var(--line-height-h3);
}
.entry-content :is(h2, .has-xx-large-font-size) {
    font-size: var(--wp--preset--font-size--xx-large) !important;
    line-height: var(--line-height-h2);
}
.entry-content :is(h1, .has-huge-font-size) {
    font-size: var(--wp--preset--font-size--huge) !important;
    line-height: var(--line-height-h1);
}
.entry-content :is(h1, h2, h3, h4, h5, h6) + p:not(:first-child) {
    margin-top: var(--spacing-5xs);
}
.entry-content p {
    margin: 0;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: normal;
    color: inherit;
}
.entry-content a {
    color: var(--color-theme);
    text-decoration: underline;
    display: inline-block;
}
.entry-content ul {
    margin: 0;
    padding: 0;
    list-style-type: disc;
    padding-left: 1.05em;
}
.entry-content ul li::marker {
    color: var(--color-cutton-cream);
}
.entry-content ol {
    margin: 0;
    padding: 0;
    list-style-type: decimal;
    list-style-position: inside;
}

.entry-content ol {
    list-style: none;
    counter-reset: custom-num;
}

.entry-content ol li {
    --counter-size: 4.4rem;
    counter-increment: custom-num;
    position: relative;
    padding-left: var(--spacing-4lg);
    padding-top: var(--spacing-2xs);
    min-height: calc(var(--counter-size) + 0.4rem);
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    color: var(--color-soft-rinse-silver);
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
}

.entry-content ol li::before {
    content: counter(custom-num);
    position: absolute;
    left: 0;
    top: 0;
    width: var(--counter-size);
    aspect-ratio: 1;
    border: 0.1rem solid var(--color-mist-gray);
    background-color: #f7f7f7;
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    color: var(--color-soft-rinse-silver);
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    overflow: hidden;
}

.entry-content .is-layout-flex {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: unset;
    grid-gap: var(--gap-row);
}

.entry-content :is(.wp-block-image, .wp-block-video) :is(img, video) {
    margin: 0;
    height: auto;
    max-height: none;
    max-width: 100%;
    vertical-align: top;
    overflow: hidden;
    border-radius: 0.8rem;
}
.entry-content :is(.wp-block-image, .wp-block-video).size-medium :is(img, video) {
    max-width: min(40rem, calc(100% - 2 * var(--spacing-container)));
    max-height: min(47.3rem, calc(100vh - var(--header-height)));
}

.entry-content .wp-block-embed .wp-block-embed__wrapper {
    position: relative;
}
.entry-content .wp-block-embed .wp-block-embed__wrapper:before {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: 56.25%;
}
.entry-content .wp-block-embed .wp-block-embed__wrapper > * {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    top: 0;
    left: 0;
}

.entry-content [class*="wp-block"] figcaption {
    font-style: normal;
    font-size: var(--font-size-body-sm);
    line-height: var(--line-height-body);
    color: var(--color-body-black);
}

.entry-content > *,
.entry-content :is([class*="wp-block-"], figcaption) {
    margin: 0;
}
.entry-content > *:not(:first-child),
*:is(.wp-block-group, .wp-block-column, .wp-block-quote) > *:not(:first-child) {
    margin-top: var(--gap-content);
}
[class*="wp-block-"]:not(.wp-block-heading, .wp-block-list, .wp-block-column) + *:not(:first-child),
* + [class*="wp-block-"]:not(.wp-block-heading, .wp-block-list, .wp-block-column):not(:first-child) {
    margin-top: var(--gap-row);
}
.entry-content li:not(:first-child),
.entry-content br + *:not(:first-child),
.entry-content [class*="wp-block-"] br + *:not(:first-child),
.entry-content [class*="wp-block-"] figcaption:not(:first-child) {
    margin-top: var(--gap-content-xs);
}

.entry-content .wp-block-columns {
    grid-gap: var(--spacing-2xs);
    flex-wrap: nowrap !important;
}
.entry-content .wp-block-columns > * {
    margin: 0;
}

.entry-content [class*="wp-block"].aligncenter {
    margin-left: auto;
    margin-right: auto;
}

.entry-content .wp-block-separator {
    border: unset;
    background-color: unset;
}

/* HAMBURGER ====================*/
.hamburger {
    position: relative;
    display: block;
    width: auto;
    height: auto;
    line-height: 1;
}
.hamburger .bars {
    display: block;
    width: var(--hamburger-size);
    height: var(--hamburger-size);
    position: relative;
    transform: rotate(0deg);
    transition: var(--duration) var(--timing-function);
    cursor: pointer;
}
.hamburger .bars > .bar {
    display: block;
    position: absolute;
    width: 100%;
    height: var(--hamburger-line);
    background: var(--hamburger-background);
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: var(--duration) var(--timing-function);
}
.hamburger .bars > .bar:nth-child(1) {
    top: calc(30% - (var(--hamburger-line) / 2));
}
.hamburger .bars > .bar:is(:nth-child(2), :nth-child(3)) {
    top: calc((var(--hamburger-size) / 2) - (var(--hamburger-line) / 2));
}
.hamburger .bars > .bar:nth-child(4) {
    top: calc(70% - (var(--hamburger-line) / 2));
}
.active > .hamburger .bars > .bar:is(:nth-child(1), :nth-child(4)) {
    top: calc((var(--hamburger-size) / 2) - (var(--hamburger-line) / 2));
    left: 50%;
    width: 0%;
}
.active > .hamburger .bars > .bar:nth-child(2) {
    transform: rotate(45deg);
}
.active > .hamburger .bars > .bar:nth-child(3) {
    transform: rotate(-45deg);
}

/* FORM  ====================*/
*:is(input, textarea, select) {
    background: none;
    border-radius: 0.4rem;
    border: 0.1rem solid #d1cfca;
    font-family: var(--font-body);
    font-weight: var(--font-weight-regular);
    font-size: var(--font-size-body);
    line-height: normal;
    text-transform: inherit;
    text-align: left;
    letter-spacing: inherit;
    text-indent: inherit;
    color: var(--color-soft-rinse-silver);
    display: block;
    width: 100%;
    height: var(--input-height);
    padding: var(--input-spacing-y) var(--input-spacing-x);
}

textarea {
    --height: calc(var(--input-height) * 3);
    resize: none;
    display: block;
    overflow: auto;
    width: 100% !important;
    min-width: 100%;
    max-width: 100%;
    min-height: var(--height);
    padding: var(--spacing-2xs);
    resize: vertical;
}
textarea::-webkit-input-placeholder {
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
}

.checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: var(--spacing-5xs);
}

.checkbox input[type="checkbox"] {
    --input-height: 20px;
    box-shadow: unset;
    border: none;
    background: none;
    padding: inherit;
    margin: unset;
    min-width: unset;
    font: inherit;
    line-height: normal;
    text-align: center;
    width: unset;
    font: inherit;
    color: currentColor;
    width: 1em;
    height: 1em;
    border: 0.05em solid currentColor;
    border-radius: 0.15em;
    display: grid;
    place-content: center;
}

input[type="checkbox"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    transform-origin: center;
    box-shadow: inset 1em 1em var(--color-black);
    -webkit-clip-path: polygon(16% 48%, 10% 60%, 48% 90%, 92% 20%, 80% 10%, 45% 70%);
            clip-path: polygon(16% 48%, 10% 60%, 48% 90%, 92% 20%, 80% 10%, 45% 70%);
}

input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.input-file {
    display: flex;
    flex-direction: column;
    grid-gap: var(--spacing-3xs);
    z-index: 0;
}

.input-file .file-label .subttl {
    font-size: var(--font-size-description);
    line-height: var(--line-height-description);
    font-weight: var(--font-weight-regular);
}

.input-file .file-upload-wrapper {
    display: flex;
    grid-gap: var(--spacing-4xs);
    align-items: center;
}

.input-file .file-upload-button {
    padding: var(--spacing-xs) var(--spacing-xs);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
    font-weight: var(--font-weight-regular);
}

.input-file .file-upload-placeholder {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex-grow: 1;
}

.input-file .file-upload-placeholder .header {
    display: flex;
    grid-gap: var(--spacing-5xs);
    font-size: var(--font-size-description);
    line-height: var(--line-height-description);
    align-items: center;
}

.input-file .file-upload-placeholder .header .cancel-upload {
    margin-left: auto;
    width: var(--spacing-sm);
    aspect-ratio: 1;
    font-size: var(--font-size-description);
    line-height: 1;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
}

.input-file .file-upload-placeholder .file-progress {
    width: 100%;
    border-radius: 0;
    height: 0.2rem;
    margin-top: var(--spacing-5xs);
    background-color: var(--color-white);
}

.input-file .file-upload-placeholder .file-progress {
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    border: none;
    mask-image: radial-gradient(white, white);
    -webkit-mask-image: radial-gradient(white, white);
}

.input-file .file-upload-placeholder .file-progress::-webkit-progress-bar {
    background-color: var(--color-white) !important;
}

.input-file .file-upload-placeholder .file-progress::-webkit-progress-value {
    background-color: var(--color-theme);
}

.input-file .custom-file-upload.filled .file-upload-placeholder .file-description {
    display: none;
}

/* SELECT */
.select {
    position: relative;
}
.select select {
    line-height: normal;
    padding-right: var(--input-height);
    text-overflow: "";
    cursor: pointer;
}
.select:after {
    font-family: "iconfont";
    content: "\e90c";
    font-size: var(--icon-size-xs);
    font-weight: normal;
    line-height: 1;
    color: inherit;
    vertical-align: top;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-right: var(--input-spacing-x);
    width: var(--input-height);
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}
.select2-parent:after {
    display: none !important;
}
.select2-rendered__match {
    text-decoration: underline;
}
.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: 98;
    background-color: #fff;
    filter: alpha(opacity=0);
}
.select2-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
}
.select2-container {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
}
.select2-dropdown {
    --color-active: var(--color-black);
    box-sizing: border-box;
    display: block;
    width: 100%;
    position: absolute;
    z-index: 1051;
    left: -100000px;
    font-weight: var(--font-weight-body);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body) !important;
    color: var(--color-middark) !important;
    background: var(--color-white) !important;
    border: var(--input-border) !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    transition: none;
}
.select2-container--open .select2-dropdown {
    left: 0;
}
.select2-container--open .select2-dropdown--below {
    margin: -1px 0 0;
}
.select2-container--open .select2-dropdown--above {
    /*top*/
    margin: 0;
}
.select2-results {
    display: block;
}
.select2-results__options {
    list-style: none;
    margin: 0;
    padding: var(--spacing-sm) var(--spacing-2sm);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
    text-align: left;
}
.select2-results__option {
    padding: 0;
}
.select2-results__option:not(:last-child) {
    margin-bottom: var(--spacing-xs);
}
.select2-results__option[aria-selected] {
    cursor: pointer;
}
.select2-results__option:not([id]) {
    margin: 0;
}
.select2-search--dropdown {
    display: block;
    padding: var(--spacing-sm);
}
.select2-search--dropdown .select2-search__field {
    padding: 7px 15px 8px;
    width: 100%;
    box-sizing: border-box;
}
.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none;
}
.select2-search--dropdown.select2-search--hide {
    display: none;
}
.select2-container--default .select2-selection--single {
    outline: 0;
    padding: 0;
    display: block;
    width: 100%;
    height: var(--input-height);
    color: inherit;
    background: none;
    border: 0;
    border-bottom: var(--input-border);
    border-radius: 0;
    transition: none;
    overflow: hidden;
    cursor: pointer;
    font-weight: var(--font-weight-regular);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    display: block;
    padding: var(--input-spacing-y) var(--input-spacing-x);
    padding-right: var(--input-height);
    height: 100%;
    line-height: calc(var(--input-height) - var(--input-spacing-y) * 2);
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: inherit;
}
.select2-container--default .select2-selection--single .select2-selection__rendered[title] {
    background-color: transparent;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
    position: relative;
    cursor: pointer;
    float: right;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--color-theme);
    opacity: 1;
}
.select2-container--default .select2-selection--single .select2-selection__arrow,
.select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 1;
    display: block;
    width: calc(var(--input-height) / 2);
    height: 100%;
    font-size: 0;
    text-align: center;
    color: inherit;
    cursor: pointer;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border: 0;
    margin: 0;
    position: static;
    top: auto;
    left: auto;
    display: block;
    width: 100%;
    height: 100%;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b:before,
.select2-container--default .select2-selection--single .select2-selection__clear:before {
    font-family: "iconfont";
    font-size: var(--icon-size-xs);
    font-weight: normal;
    line-height: 1;
    vertical-align: top;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-right: var(--input-spacing-x);
    text-align: center;
    width: 100%;
    height: 100%;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b:before {
    content: "\e90c";
}
.select2-container--default .select2-selection--single .select2-selection__clear:before {
    content: "\e900";
}
.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #eee;
    cursor: default;
}
.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
    display: none;
}
.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: none;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border: 0;
}
/* .select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
} */
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--border-color);
}
.select2-container--default .select2-search--inline {
    float: left;
}
.select2-container--default .select2-search--inline .select2-search__field {
    -webkit-appearance: textfield;
    box-sizing: border-box;
    box-shadow: none;
    background: none;
    border: none;
    padding: 0;
    outline: 0;
    font-size: 100%;
    margin-top: 5px;
}
.select2-container--default .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
    -webkit-appearance: none;
}
.select2-container--default .select2-results > .select2-results__options {
    max-height: 30vh;
    overflow-y: auto;
}
.select2-container--default .select2-results__option span {
    display: inline;
    font-weight: inherit;
    transition: var(--duration) var(--timing-function);
}
.select2-container--default .select2-results__option[role="group"] {
    padding: 0;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: none;
    color: inherit;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] span {
    color: var(--color-active);
}
.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option[data-selected="true"] {
    font-weight: inherit;
    text-decoration: none;
    background: none;
    color: inherit;
}
.select2-container--default .select2-results__option[aria-selected="true"] span {
    box-shadow: var(--cta-shadow);
}
.select2-container--default .select2-results__option[aria-disabled="true"] {
    background: none !important;
    color: inherit !important;
    opacity: var(--opacity-light) !important;
    pointer-events: none !important;
    text-decoration: none !important;
    box-shadow: none !important;
}
.select2-container--default .select2-results__group {
    display: block;
    padding: 0;
    cursor: default;
}

/* CHECKBOX & RADIO */
.choice {
    position: relative;
    display: flex;
    max-width: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    line-height: inherit;
    letter-spacing: normal;
    text-transform: none;
}
.choice > span {
    position: relative;
    display: inline-block;
    -webkit-touch-callout: none;
}
.choice > input {
    position: absolute;
    z-index: -1000;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    background: none;
}
.choice input + span {
    display: inline-block;
    vertical-align: baseline;
    text-align: left;
    padding-left: calc(1em + var(--spacing-5xs));
    line-height: inherit;
    min-width: 1em;
    min-height: 1em;
    height: auto;
    cursor: pointer;
    font-size: var(--font-size-sub);
    line-height: var(--line-height-sub);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
}
.choice input + span:before,
.choice input + span:after {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    border-radius: 2px;
    color: rgba(var(--rgb), 1);
    line-height: 1;
    margin: 0;
    position: absolute;
    left: 0;
    top: 0.1em;
}
.choice input + span:before {
    background: none;
    border: 1px solid rgba(110, 110, 110, 0.32);
}
.choice input + span:after {
    background: currentColor;
    opacity: 0;
    transform: scale(0.5);
    transition: opacity var(--duration) var(--timing-function);
}
.choice input:checked + span:after {
    opacity: 1;
}
.choice input[type="checkbox"] + span:after {
    font-family: "iconfont";
    content: "";
    background: none;
    width: 1em;
    height: 1em;
    transform: scale(0.7);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none"><path d="M0 6.4186L1 5.30233L4.25 7.81395C6 5.5814 7.25 3.06977 11 0L12 1.39535C9 3.85116 6.08333 9.48837 5 12L0 6.4186Z" fill="%2377B8D8"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.choice input[type="radio"] + span:before,
.choice input[type="radio"] + span:after {
    border-radius: 50%;
}
.choice-container {
    display: grid;
    grid-template-columns: 100%;
    grid-gap: var(--spacing-7xs);
}
.label:not(.anim) + *[class*="choice"] {
    margin-top: var(--spacing-sm);
}

.fields {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    grid-gap: var(--spacing-2sm) var(--spacing-4xs);
}
.field {
    position: relative;
    width: 100%;
}
.field.half-width {
    width: calc(50% - var(--spacing-4xs) / 2);
}
.field.focusin {
    z-index: 2;
}

.label {
    padding: 0;
    border: 0;
    border-radius: 0;
    position: relative;
    display: block;
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    text-transform: none;
    color: var(--color-theme);
    opacity: 1;
}
.label .required {
    color: var(--color-cutton-cream);
}
.c-white .label {
    color: inherit;
}
.label:not(.anim):not(:last-child) {
    margin-bottom: var(--spacing-4xs);
}
.label a {
    box-shadow: var(--cta-shadow);
}
.label.anim {
    height: auto;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    left: 0;
    top: calc(var(--input-height) / 2);
    transform: translateY(-50%);
    padding: 0 var(--input-spacing-x);
    pointer-events: none;
}
.label.anim:not(.fixed) {
    transition-property: opacity, visibility;
}
.input.filled .label.anim:not(.fixed) {
    opacity: 0;
    visibility: hidden;
}
.input:has(*:-internal-autofill-selected) .label.anim:not(.fixed) {
    opacity: 0;
    visibility: hidden;
}

.input.filled .label.anim.fixed {
    top: 0;
    padding: 0;
    transform: translateY(-50%);
    font-size: var(--font-size-body-sub);
    opacity: var(--opacity);
}
.input:has(*:-internal-autofill-selected) .label.anim.fixed {
    top: 0;
    padding: 0;
    transform: translateY(-50%);
    font-size: var(--font-size-body-sub);
    opacity: var(--opacity);
}

.input {
    position: relative;
    text-align: left;
}

.input .entry-title {
    font-weight: var(--font-weight-body);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-h3);
}
.input .entry-title:not(:last-child) {
    margin-bottom: var(--spacing-2sm);
}

.input.with-cta .cta {
    margin: 0;
    position: absolute;
    z-index: 3;
    right: 0;
    top: calc(var(--input-height) / 2);
    transform: translateY(-50%);
}
.input input:-internal-autofill-selected,
.input textarea:-internal-autofill-selected,
.input select:-internal-autofill-selected {
    color: inherit;
}
.input input:disabled,
.input textarea:disabled,
.input select:disabled,
.select2-container--default.select2-container--disabled .select2-selection--single {
    cursor: default;
    opacity: 0.1;
}
.input input[type="checkbox"]:disabled,
.input input[type="radio"]:disabled {
    background-color: transparent;
}
.input :-ms-input-placeholder {
    font-size: var(--font-size-body) !important;
    font-weight: var(--font-weight-light) !important;
    font-style: normal !important;
    text-transform: none !important;
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.5) !important;
    opacity: 1 !important;
}
.input ::-webkit-input-placeholder {
    font-size: var(--font-size-body) !important;
    font-weight: var(--font-weight-light) !important;
    font-style: normal !important;
    text-transform: none !important;
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.5) !important;
    opacity: 1 !important;
}
.input ::-moz-placeholder {
    font-size: var(--font-size-body) !important;
    font-weight: var(--font-weight-light) !important;
    font-style: normal !important;
    text-transform: none !important;
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.5) !important;
    opacity: 1 !important;
}
.input ::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}
.input ::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 0;
}
input::-webkit-contacts-auto-fill-button {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
    box-shadow: 0 0 0px 1000px #fff inset;
    -webkit-transition: 5000s ease 0s;
    transition: 5000s ease 0s;
}
input[type="number"] {
    -moz-appearance: textfield;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* FORM:UPLOAD FILE ====================*/

/* PLUGIN:POPUP ====================*/

/* PLUGIN:SLIDER ====================*/
.swiper {
    width: 100%;
}
.swiper-wrapper {
    will-change: transform;
}
.swiper-slide {
    width: 100% !important;
}

*[class*="swiper-button-"] {
    z-index: 10;
    outline: none;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    color: inherit;
    background: none;
    border-radius: 0;
    overflow: visible;
    line-height: 1;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--color-white);
    border: var(--border);
    border-radius: 50%;
    overflow: hidden;
}
.swiper-button-next {
    right: 0;
}
.swiper-button-prev {
    left: 0;
}
*[class*="swiper-button-"]:after {
    position: relative;
    font-family: "iconfont";
    font-weight: normal;
    font-size: var(--icon-size-xs);
    color: var(--color-soft-rinse-silver);
    opacity: 1;
    transition: var(--duration) var(--timing-function);
}

html.no-touchevents *[class*="swiper-button-"]:hover {
    background-color: var(--color-cutton-cream);
}

html.no-touchevents *[class*="swiper-button-"]:hover:after {
    color: var(--color-white);
}
.swiper-button-prev:after {
    content: "\e909";
    transform: translateX(-12%);
}
.swiper-button-next:after {
    content: "\e90a";
    transform: translateX(12%);
}
.swiper-button-disabled {
    opacity: var(--opacity-light) !important;
    pointer-events: auto !important;
}
.swiper-button-lock {
    display: none !important;
}

.swiper-pagination {
    --rgb: var(--color-white-rgb);
    line-height: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: var(--spacing-2xs);
    pointer-events: none;
}
.swiper-horizontal > .swiper-pagination-bullets {
    bottom: var(--gap-section);
    left: unset;
    right: var(--header-nav-right);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.swiper-pagination.a-center {
    justify-content: center;
}
.swiper-pagination-bullet {
    outline: none !important;
    margin: 0 !important;
    opacity: 1 !important;
    font-size: 0;
    display: block;
    width: 1rem;
    height: 1rem;
    background: transparent;
    border: 1px solid var(--color-white);
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    transition: var(--duration) var(--timing-function);
    pointer-events: auto;
}
.swiper-pagination-bullet-active {
    background: rgba(var(--rgb), 1);
}
.static-pagination .swiper-pagination {
    position: static;
    margin: var(--spacing-2sm) 0;
}
.static-pagination .swiper-pagination-bullet {
    border: var(--border);
}
.static-pagination .swiper-pagination-bullet-active {
    background: rgba(var(--color-theme-rgb), 1);
}
.swiper-pagination[data-style="bar"] {
    grid-gap: 0;
}
.swiper-pagination[data-style="bar"] .swiper-pagination-bullet {
    border-radius: 0;
    height: 2px;
    width: 70px;
    max-width: 12.3076923077vw;
    margin: 0 !important;
}
.swiper-pagination[data-style="bar"] .swiper-pagination-bullet:first-child {
    margin-left: 0 !important;
}
.swiper-pagination[data-style="bar"] .swiper-pagination-bullet:last-child {
    margin-right: 0 !important;
}
.swiper-horizontal > .swiper-pagination[data-style="bar"] {
    bottom: var(--spacing-2md);
}

.swiper-fade .swiper-slide {
    opacity: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}
.swiper-fade .swiper-slide-active {
    opacity: 1 !important;
    z-index: 1 !important;
    pointer-events: auto !important;
}

.swiper.default.fade .swiper-slide,
.swiper.auto.fade .swiper-slide {
    width: 100% !important;
    height: auto !important;
}
.swiper.default.fade .swiper-slide > *,
.swiper.auto.fade .swiper-slide > * {
    height: 100%;
}

.swiper.fix *[class*="swiper-button-"] {
    top: 0;
    transform: none;
}

.swiper-button-prev.spacing-x {
    left: var(--spacing-container);
}
.swiper-button-next.spacing-x {
    right: var(--spacing-container);
}

/*PLUGIN:MARQUEE====================*/
*[data-js="liMarquee"] .mWrap .mMove,
*[data-js="liMarquee"] .mWrap .mItem {
    width: auto !important;
}
*[data-js="liMarquee"] .mWrap .mItem {
    float: left !important;
}
*[data-js="liMarquee"] .cloneContent {
    padding: 0 !important;
}

/* FUNCTION:TAB ====================*/
.tab,
.tabdata {
    position: relative;
}
.tab-content,
.tabdata-content {
    margin: 0 !important;
    position: relative;
    height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition-property: opacity;
    transition-duration: 1s;
}
.tab-content.active,
.tabdata-content.active {
    height: auto;
    opacity: 1;
    overflow: visible;
    pointer-events: auto;
}

/* FUNCTION:ACCORDION ====================*/
.accordion:first-child > .entry-title {
    padding-top: 0;
}
.accordion {
    --border-color: rgba(var(--color-soft-rinse-silver-rgb), 0.2);
    border-bottom: var(--border-width) var(--border-style) var(--border-color);
}
.accordion > .entry-panel {
    display: none;
    padding-bottom: var(--spacing-2sm);
}
.accordion > .entry-panel *[block-width] {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.accordion > .entry-title {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-h5);
    line-height: var(--line-height-h5);
    color: inherit;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0;
    padding: var(--spacing-2sm) 0;
    transition: var(--duration) var(--timing-function);
    cursor: pointer;
}
.accordion.active > .entry-title {
    color: inherit;
    padding-bottom: var(--spacing-4xs);
    transition-delay: var(--duration);
}
.accordion > .entry-title:after {
    flex-shrink: 0;
    width: 2.2rem;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "iconfont";
    content: "\e90c";
    font-size: var(--icon-size-4xs);
    font-weight: normal;
    line-height: 1;
    margin-left: auto;
    pointer-events: none;
    transition: var(--duration) var(--timing-function);
    border-radius: 50%;
    overflow: hidden;
    border: var(--border);
    background-color: var(--color-white);
}
.accordion.active > .entry-title:after {
    transform: rotate(-180deg);
    background-color: var(--color-soft-rinse-silver);
    color: var(--color-white);
}

/* FUNCTION:VIDEO ==================== */

/* FUNCTION:CLIPBOARD ==================== */
#clipboard {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
    width: 100px;
    max-width: 100%;
    margin: 0 auto;
    padding: var(--spacing-xs);
    font-family: var(--font-body);
    font-weight: var(--font-weight-body);
    font-size: var(--font-size-body-sub);
    line-height: normal;
    letter-spacing: normal;
    text-transform: uppercase;
    background-color: var(--color-theme);
    color: var(--color-white);
    border-radius: 50%;
    overflow: hidden;
    position: fixed;
    z-index: 999999;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* FUNCTION:COPY TO CLIPBOARD ==================== */
@-webkit-keyframes copy-slide-up {
    0% {
        transform: translate(-50%, 0) scale(0.8);
        opacity: 0;
    }
    100% {
        transform: translate(-50%, -120%) scale(1);
        opacity: 1;
    }
}
@keyframes copy-slide-up {
    0% {
        transform: translate(-50%, 0) scale(0.8);
        opacity: 0;
    }
    100% {
        transform: translate(-50%, -120%) scale(1);
        opacity: 1;
    }
}

#copy_tooltip {
    display: block;
    position: absolute;
    background: var(--color-cutton-cream);
    color: var(--color-white);
    padding: 0.5rem 1rem;
    border-radius: 4px;
    top: 0;
    width: 10rem;
    left: 50%;
    margin: auto;
    opacity: 0;
    pointer-events: none;
    line-height: var(--line-height-body2);
    font-size: var(--font-size-body2);
    font-family: var(--font-body);
}

#copy_tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid var(--color-cutton-cream);
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
}

#copy_tooltip.active {
    -webkit-animation: copy-slide-up 0.15s cubic-bezier(0.51, 0.92, 0.265, 1.55) both;
    animation: copy-slide-up 0.15s cubic-bezier(0.51, 0.92, 0.265, 1.55) both;
}

#copy_tooltip.inactive {
    -webkit-animation: copy-slide-up 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) reverse both;
    animation: copy-slide-up 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) reverse both;
}

/* PAGE ==================== */
#page {
    display: grid;
    grid-template-rows: 1fr auto;
    min-height: 100svh;
    overflow: clip;
}

/* FILTER ==================== */

/*MODULES==================== */

/* ANIMATE ==================== */
.animate {
    -webkit-animation-duration: var(--duration);
    animation-duration: var(--duration);
    -webkit-animation-timing-function: var(--timing-function);
    animation-timing-function: var(--timing-function);
    /* will-change: opacity, transform; */
}
.animated {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}

@-webkit-keyframes matrixZoomOut {
    from {
        opacity: 0;
        transform: scale(1.05);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes matrixZoomOut {
    from {
        opacity: 0;
        transform: scale(1.05);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
.matrixZoomOut {
    transform-origin: center center;
    -webkit-animation-name: matrixZoomOut;
    animation-name: matrixZoomOut;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
}

@-webkit-keyframes wordAnimate {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes wordAnimate {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.word-animate {
    display: inline-block;
    animation-name: wordAnimate;
    -webkit-animation-name: wordAnimate;
    -webkit-animation-duration: var(--duration-x4);
    -webkit-animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1);
    animation-duration: var(--duration-x4);
    animation-timing-function: cubic-bezier(0.83, 0, 0.17, 1);
}

[data-split][data-split-animate] .word {
    overflow: hidden;
    display: inline-block;
    vertical-align: bottom;
    padding: 0.25em 0;
    margin: -0.25em 0;
}

.lenis {
    height: auto;
}
.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
    -ms-scroll-chaining: none;
        overscroll-behavior: contain;
}
.lenis.lenis-stopped {
    overflow: hidden;
}
.lenis.lenis-scrolling iframe {
    pointer-events: none;
}

/* BUNDLE ==================== */
img,
iframe,
.button,
#header,
#footer,
.mfp-close,
.select2-selection--single,
.select2-results__option,
.choice > span,
.accordion > .entry-title,
.sc-billboard {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

html.touchevents a {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}

.hamburger,
.plaimanas,
.button,
.social a,
.object,
.object-fit,
.qty-btn,
.sc-link,
.mfp-close .modal-dismiss {
    text-decoration: none !important;
    box-shadow: none !important;
}

/* CHECK ==================== */
#page-message {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--spacing-md);
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 999999;
    top: 0;
    left: 0;
    background: var(--color-white);
    color: var(--color-black);
    will-change: opacity;
    opacity: 0;
    pointer-events: none;
}
@media (max-width: 991px) and (orientation: landscape) {
    html.is-device #page-message {
        opacity: 1;
        pointer-events: auto;
        transition: opacity var(--duration) var(--timing-function);
    }
}

/* HEADER ==================== */
/* Header Default */
#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
}

.error-page #header {
    display: none;
}

.header-nav {
    --color: var(--color-white);
    --hover-color: rgba(var(--color-white-rgb), 0.5);
    height: var(--header-height-expanded);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--spacing-container);
    font-size: var(--font-size-button);
    line-height: var(--line-height-button);
    font-family: var(--font-heading);
    font-weight: var(--font-weight-medium);
    color: var(--color);
    transition: background-color var(--duration) var(--timing-function), height var(--duration) var(--timing-function);
}

.header-nav *:is(.header-brand, .header-menu-ctrl) {
    z-index: 20;
}
.header-nav .header-menu-ctrl {
    position: relative;
}
.header-nav .header-menu {
    position: relative;
    z-index: 10;
}

.header-brand {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.header-menu .menu {
    display: flex;
    gap: var(--spacing-xs);
}

html.no-touchevents .menu a:hover,
html.no-touchevents .header-actions-wrapper > a:hover {
    color: var(--hover-color);
}

.header-actions .header-actions-wrapper {
    display: flex;
    gap: var(--spacing-sm);
    align-items: center;
}

.header-actions .actions-button {
    display: flex;
    gap: var(--spacing-5xs);
    align-items: center;
}

.lang-selector {
    --lang-width: 4.2rem;
    --color: var(--color-white);
    --color-active: var(--color-soft-rinse-silver);
    --bg: rgba(var(--color-white-rgb), 0.15);
    --bg-hover: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
    --bg-lang-active: var(--color-white);
    display: flex;
    width: calc(var(--lang-width) + 0.2rem);
    height: 2.8rem;
    border: 0.1rem solid var(--color-mist-gray);
    vertical-align: top;
    align-items: baseline;
    border-radius: 0.4rem;
    background-color: var(--bg);
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
    overflow: hidden;
    transition: var(--duration) var(--timing-function);
}

html.no-touchevents .lang-selector:hover {
    width: calc(var(--lang-width) * var(--lang-count) + 0.2rem);
    -webkit-backdrop-filter: blur(0px);
            backdrop-filter: blur(0px);
    background-color: var(--bg-hover);
    border: 0.1rem solid var(--bg-hover);
}

html.no-touchevents .lang-selector:hover .lang.active {
    background-color: var(--bg-lang-active);
    color: var(--color-active);
}

html.no-touchevents .lang-selector:hover .lang {
    width: var(--lang-width);
}

.lang-selector .lang {
    color: var(--color);
    flex-shrink: 0;
    width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    overflow: hidden;
    transition: var(--duration) var(--timing-function);
}

html.no-touchevents .lang-selector .lang:hover {
    color: var(--color);
}

.lang-selector .lang.active {
    width: var(--lang-width);
}

.header-actions .button {
    height: 2.8rem;
    min-width: unset;
    padding: 0 var(--spacing-2xs) !important;
}

/* Header Scrolled */
*:is(html.page-scrolling, .variant-header) {
    .header-nav {
        height: var(--header-height);
    }
}
*:is(html.page-scrolling, .variant-header, html.header-menu-enabled) .hamburger {
    --hamburger-background: var(--color-soft-rinse-silver);
}
*:is(html:not(.page-scrolling)) .variant-header .header-nav {
    background-color: transparent;
}

*:is(html.page-scrolling, .variant-header, html.header-menu-enabled) {
    .header-nav {
        --color: var(--color-soft-rinse-silver);
        --hover-color: var(--color-ocean-wave);
        background-color: var(--color-cream-comfort);
    }

    .header-brand .logo {
        -webkit-filter: var(--color-filter-ocean-wave);
                filter: var(--color-filter-ocean-wave);
    }

    .header-actions .button {
        --button-border: var(--border-width) var(--border-style) rgba(236, 236, 235, 0.4);
        --button-bg: var(--color-ocean-wave);
        --button-color: var(--color-white);
    }

    .lang-selector {
        --color: var(--color-white);
        --color-active: var(--color-soft-rinse-silver);
        --bg: var(--color-white);
        --bg-hover: #b6b5b1;
        --bg-lang-active: var(--color-white);
    }

    .lang-selector .lang.active {
        color: var(--color-active);
    }
}

/* FOOTER ==================== */
#footer {
    padding: var(--spacing-4lg) var(--spacing-container) var(--spacing-sm);
    background-color: rgba(var(--color-mist-gray-rgb), 0.4);
}

.error-page #footer {
    display: none;
}

.footer-nav {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    align-items: center;
    text-align: center;
}

.footer-nav .footer-logo {
    height: 8.5rem;
    width: auto;
}

.footer-links .accordion {
    border-bottom: unset;
}

.footer-links .accordion .entry-title {
    padding: 0;
}

.footer-nav .copy {
    margin-top: var(--spacing-xs);
}

.footer-nav .copy > p {
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.6);
}

.footer-links .accordion .entry-panel {
    font-size: var(--font-size-sub2);
    line-height: var(--line-height-sub2);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.8);
    padding-bottom: 0;
}

.footer-links .accordion .entry-panel ul {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-3xs);
}

/* MAIN ====================*/
#main {
    --sticky-top: calc(var(--header-height) + var(--spacing-container));
    position: relative;
    width: 100%;
    /* overflow: clip; */
}

section {
    /* overflow: clip; */
    position: relative;
    width: 100vw;
}
section.header-padding {
    padding-top: var(--header-height);
}

.sc-inner {
    position: relative;
    width: 100%;
    padding-top: var(--gap-section);
    padding-bottom: var(--gap-section);
}
.sc-inner.pc-t-header {
    padding-top: var(--header-height);
}
.sc-inner.pc-t-0 {
    padding-top: 0;
}
.sc-inner.pc-t-25 {
    padding-top: calc(var(--gap-section) / 4);
}
.sc-inner.pc-t-50 {
    padding-top: calc(var(--gap-section) / 2);
}
.sc-inner.pc-t-75 {
    padding-top: calc(var(--gap-section) * 3 / 4);
}
.sc-inner.pc-t-100 {
    padding-top: var(--gap-section);
}
.sc-inner.pc-t-125 {
    padding-top: calc(var(--gap-section) * 1.25);
}
.sc-inner.pc-t-150 {
    padding-top: calc(var(--gap-section) * 1.5);
}
.sc-inner.pc-t-175 {
    padding-top: calc(var(--gap-section) * 1.75);
}
.sc-inner.pc-t-200 {
    padding-top: calc(var(--gap-section) * 2);
}
.sc-inner.pc-b-header {
    padding-bottom: var(--header-height);
}
.sc-inner.pc-b-0 {
    padding-bottom: 0;
}
.sc-inner.pc-b-25 {
    padding-bottom: calc(var(--gap-section) / 4);
}
.sc-inner.pc-b-50 {
    padding-bottom: calc(var(--gap-section) / 2);
}
.sc-inner.pc-b-75 {
    padding-bottom: calc(var(--gap-section) * 3 / 4);
}
.sc-inner.pc-b-100 {
    padding-bottom: var(--gap-section);
}
.sc-inner.pc-b-125 {
    padding-bottom: calc(var(--gap-section) * 1.25);
}
.sc-inner.pc-b-150 {
    padding-bottom: calc(var(--gap-section) * 1.5);
}
.sc-inner.pc-b-175 {
    padding-bottom: calc(var(--gap-section) * 1.75);
}
.sc-inner.pc-b-200 {
    padding-bottom: calc(var(--gap-section) * 2);
}

.container {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--spacing-container);
    padding-right: var(--spacing-container);
}
.wrapper {
    width: 100%;
    height: 100%;
    position: relative;
}
[class*="block-content-"] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2md);
}
.block-content-start {
    align-items: flex-start;
    text-align: start;
}
.block-content-center {
    align-items: center;
    text-align: center;
    text-wrap: balance;
    margin-left: auto;
    margin-right: auto;
}
.block-content-end {
    align-items: flex-end;
    text-align: end;
}
[class*="block-content-"] .block-header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
}

.block-ttl > * {
    transition: var(--duration) var(--timing-function);
}

.block-desc > * {
    transition: var(--duration) var(--timing-function);
}
.block-button {
    display: flex;
    gap: var(--spacing-4xs);
}

.h-svh {
    height: 100svh;
}
.h-lvh {
    height: 100lvh;
}
.h-vh {
    height: 100vh;
}

.sc-billboard {
    position: relative;
    width: 100%;
    /* -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; */
}

.sc-billboard.full-screen {
    height: 100svh;
}

[class*="gradient-overlay-"]::before {
    content: "";
    position: absolute;
    width: 100%;
    height: var(--gradient-height, 30%);
    left: 0;
    background: linear-gradient(
        var(--gradient-direction, 0deg),
        rgba(0, 0, 0, var(--gradient-opacity, 0.6)) 0%,
        rgba(0, 0, 0, 0) 100%
    );
    z-index: 10;
}

.gradient-overlay-top::before {
    top: 0;
    --gradient-direction: 180deg;
}

.gradient-overlay-bottom::before {
    bottom: 0;
    --gradient-direction: 0deg;
}

.overlay::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(var(--color-black-rgb), var(--overlay-opacity, 0.3));
    z-index: 1;
}

.sc-billboard .object-fit,
.sc-billboard .sc-inner,
.sc-billboard *:is(.swiper, .swiper-wrapper, .swiper-slide) {
    height: 100%;
    width: 100%;
}

.card {
    --text-align: left;
    width: 100%;
    display: block;
    position: relative;
    color: rgba(var(--rgb), 1);
    text-align: var(--text-align);
    white-space: normal;
}

.card-container {
    --gap-x: 0rem;
    --gap-y: 0rem;
    --column: 1;
    --minmax: 0rem;
    position: relative;
}

.card-container[data-card-layout="grid"] {
    display: grid;
    grid-gap: var(--gap-y) var(--gap-x);
    grid-template-columns: repeat(var(--column), calc((100% - (var(--gap-x) * (var(--column) - 1))) / var(--column)));
    grid-auto-flow: dense;
}

.card-container[data-card-layout="grid-minmax"] {
    display: grid;
    grid-gap: var(--gap-y) var(--gap-x);
    grid-template-columns: repeat(auto-fill, minmax(var(--minmax), 1fr));
    grid-auto-flow: dense;
}

.card-container[data-card-layout="flex"] {
    display: flex;
    flex-wrap: wrap;
    grid-gap: var(--gap-y) var(--gap-x);
}
.card-container[data-card-layout="flex"] > .card {
    width: calc((100% - (var(--gap-x) * (var(--column) - 1))) / var(--column));
}

.card-container[data-card-layout="slider"] {
    margin-left: calc((var(--gap-x) * -1) / 2);
    margin-right: calc((var(--gap-x) * -1) / 2);
}
.card-container[data-card-layout="slider"] .swiper-slide {
    width: calc(100% / var(--column)) !important;
    padding-left: calc(var(--gap-x) / 2);
    padding-right: calc(var(--gap-x) / 2);
}
.card-container[data-card-layout="slider"] .swiper-button-prev {
    transform: translateX(calc((var(--gap-y)) / 2));
}
.card-container[data-card-layout="slider"] .swiper-button-next {
    transform: translateX(calc((var(--gap-x) * -1) / 2));
}

.card .card-image {
    position: relative;
}

.card .card-content {
    position: relative;
    display: flex;
    flex-direction: column;
    grid-gap: var(--spacing-sm);
}

.sc-header {
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: var(--spacing-md);
}
.sc-header.justify-center {
    justify-content: center;
    text-align: center;
}
.sc-header.justify-between {
    justify-content: space-between;
}
.sc-ttl {
    text-align: center;
}
.marquee {
    display: inline-flex !important;
}

/* Popup */
.popup {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    position: relative;
    z-index: 90;
    --top-offset: var(--spacing-2xs);
}

.popup-content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: calc(100% + var(--top-offset));
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    box-shadow: 0px 0px 10px 0px rgba(var(--color-black-rgb), 0.25);
    transition: var(--duration) var(--timing-function);
}

.popup-content.active {
    opacity: 1;
    visibility: visible;
}

.popup-content-inner {
    padding: var(--spacing-2sm) var(--spacing-xs);
    background-color: var(--color-white);
}

.popup[data-popup-pc-location="start"] .popup-content {
    left: 0;
}

.popup[data-popup-pc-location="center"] .popup-content {
    left: 50%;
    transform: translateX(-50%);
}

.popup[data-popup-pc-location="end"] .popup-content {
    right: 0;
}

/* Map */
.map-wrapper {
    position: relative;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.map-wrapper .map {
    width: 100%;
    aspect-ratio: 5;
}

.map-wrapper .pin {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 3.6rem;
    aspect-ratio: 1;
}

/* COMPONENT */
/* DEFAULT ====================*/
/* FANCY BOX */
/* HTML */
.fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn {
    padding-bottom: var(--spacing-lg);
}
.fancybox__container .fancybox__backdrop {
    background-color: rgba(var(--color-mist-gray-rgb), 0.8);
}

.dialog-content {
    --fancybox-content-color: var(--color-soft-rinse-silver);
}

.service-qv-dialog .dialog-content {
    flex-direction: column;
    row-gap: var(--spacing-md);
    padding: var(--spacing-2xl) var(--spacing-2lg) var(--spacing-2lg);
    border-radius: 0.8rem;
    max-width: 70.9027777778vw;
}

.service-qv-dialog .fancybox__content > .f-button.is-close-btn,
.f-button[data-fancybox-close] {
    --f-button-width: 2.8rem;
    --f-button-height: 2.8rem;
    --f-button-svg-width: 1.4rem;
    --f-button-svg-height: 1.4rem;
    --f-button-hover-bg: var(--color-cutton-cream);
    --f-button-hover-color: var(--color-white);
    --f-close-button-width: 2.8rem;
    --f-close-button-height: 2.8rem;
    --f-close-button-svg-width: 1.4rem;
    --f-close-button-svg-height: 1.4rem;
    border: 0.1rem solid var(--color-mist-gray);
    border-radius: 0.4rem;
    background-color: var(--color-soft-rinse-silver);
    top: var(--spacing-sm);
    right: var(--spacing-sm);
    position: absolute;
}

.f-button.is-close-button svg,
.f-button[data-fancybox-close] svg {
    display: none;
}

.f-button.is-close-button:before,
.f-button[data-fancybox-close]:before {
    content: "";
    width: var(--f-close-button-svg-width);
    height: var(--f-close-button-svg-height);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 11 11" fill="none"><path d="M0.353516 0.353516L10.3535 10.3535" stroke="white"/><path d="M10.3535 0.353516L0.353515 10.3535" stroke="white"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.f-button:hover:not([aria-disabled]),
.f-button[data-fancybox-close]:hover:not([aria-disabled]) {
    color: var(--f-button-hover-color, var(--f-button-color));
    background-color: var(--f-button-hover-bg, var(--f-button-bg));
}

.service-qv-dialog .dialog-body {
    --media-size: 32.7777777778vw;
    display: flex;
    -moz-column-gap: var(--spacing-xl);
         column-gap: var(--spacing-xl);
}

.service-qv-dialog .dialog-media {
    width: var(--media-size);
    flex-shrink: 0;
    aspect-ratio: 1;
    border-radius: 0.8rem;
    overflow: hidden;
}

.service-qv-dialog .dialog-body-content {
    --content-gap: var(--spacing-xs);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--content-gap);
}

.service-qv-dialog .dialog-body-content-scroll {
    --mask-box-image-offset: var(--spacing-sm);
    overflow-y: auto;
    max-height: calc(var(--media-size) - var(--content-gap) - var(--button-height));
    -webkit-mask-box-image: -webkit-linear-gradient(
        -90deg,
        white 0%,
        white calc(100% - var(--mask-box-image-offset)),
        transparent 100%
    );
}

.service-qv-dialog .dialog-body-content-scroll .entry-content {
    padding-bottom: var(--mask-box-image-offset);
}

/* GALLERY */
.gallery-dialog .fancybox__backdrop {
    --fancybox-backdrop-bg: rgba(var(--color-mist-gray-rgb), 0.9);
}

.fancybox__container .f-button {
    --f-button-next-pos: var(--spacing-2sm);
    --f-button-prev-pos: var(--spacing-2sm);
    --f-button-width: 2.8rem;
    --f-button-height: 2.8rem;
    --f-button-svg-width: 1.5rem;
    --f-button-svg-height: 1.5rem;
    --f-button-bg: var(--color-white);
    --f-button-hover-bg: var(--color-cutton-cream);
    --f-button-active-bg: var(--color-cutton-cream);
    --f-button-color: var(--color-soft-rinse-silver);
    --f-button-hover-color: var(--color-white);
    --f-button-active-color: var(--color-white);
    border: var(--border);
}

.fancybox__container .fancybox__nav .f-button:before {
    position: absolute;
    content: "";
    inset: -15px;
    z-index: 1;
}

.fancybox__container .f-button svg {
    -webkit-filter: unset;
            filter: unset;
}

.fancybox__container .fancybox__slide.has-image > .fancybox__content {
    border-radius: 0.8rem;
    overflow: hidden;
}

.gallery-dialog .fancybox__slide {
    padding: var(--spacing-xl);
}

.gallery-dialog .f-thumbs.is-horizontal .f-thumbs__track {
    padding: var(--spacing-sm) 0;
}

.gallery-dialog .f-thumbs__slide {
    --f-thumb-width: auto;
    --f-thumb-height: 4.2rem;
}

.gallery-dialog .f-thumbs__slide__img {
    position: static;
    height: 100%;
    width: auto;
}

.gallery-dialog .is-classic .f-thumbs__slide__button {
    opacity: 1;
}

.gallery-dialog .is-classic .f-thumbs__slide__button:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: auto;
    bottom: 0;
    z-index: 1;
    opacity: 1;
    border: unset !important;
    background-color: rgba(255, 252, 245, 0.72);
    transition: opacity var(--duration) var(--timing-function);
    -webkit-animation: none !important;
            animation: none !important;
}

.gallery-dialog .is-classic .is-nav-selected .f-thumbs__slide__button::after {
    opacity: 0;
}

/* Gallery Caption Styling */
.gallery-dialog .fancybox__caption {
    text-align: center;
    padding-top: var(--spacing-xs);
    font-size: var(--font-size-h3);
    line-height: var(--line-height-h3);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-heading);
    color: var(--color-soft-rinse-silver);
}

.gallery-dialog .fancybox__caption__body {
    font-size: var(--font-size-h3);
    color: var(--color-soft-rinse-silver);
    line-height: 1.4;
}

/* SECTION ====================*/
/* HERO TEMPLATE FULL SCREEN */
[data-section="hero-template-full-screen"] {
    height: 100svh;
    color: var(--color-white);
}

[data-section="hero-template-full-screen"] .bg:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
    z-index: 1;
}

[data-section="hero-template-full-screen"] .container {
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: var(--spacing-4lg);
    z-index: 5;
}

[data-section="hero-template-full-screen"] .hero-content {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    align-items: center;
    text-align: center;
    text-wrap: wrap;
}
[data-section="hero-template-full-screen"] .hero-content .tags {
    display: flex;
    gap: var(--spacing-4xs);
}
[data-section="hero-template-full-screen"] .card-tag {
    border-radius: 0.4rem;
}

/* HERO TEMPLATE */
[data-section="hero-template"] {
    height: 66.66svh;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
}

[data-section="hero-template"] .sc-ttl {
    position: absolute;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0 var(--spacing-container);
    text-align: center;
    text-wrap: balance;
    width: 100%;
}

/* CONTACT FORM */
[data-section="contact-form"] .sc-ttl {
    margin-bottom: var(--spacing-xl);
}

[data-section="contact-form"] .container {
    max-width: calc(67.2rem + var(--spacing-container) * 2);
}

/* ELEMENT ====================*/
/* SC NAVIGATION */
.sc-navigation {
    width: 100vw;
    --gap: var(--spacing-2md);
    padding: var(--spacing-sm) var(--spacing-container);
    background-color: #f4f0e7;
    position: -webkit-sticky;
    position: sticky;
    top: var(--header-height);
    z-index: 90;
}

.sc-navigation .sc-navigation-inner {
    margin-left: calc(var(--gap) * -1 / 2);
    margin-right: calc(var(--gap) * -1 / 2);
}

.sc-navigation .swiper {
    overflow: visible;
}

.sc-navigation .swiper-slide {
    width: auto !important;
    padding-left: calc(var(--gap) / 2);
    padding-right: calc(var(--gap) / 2);
}

/* DIALOG CONTENT */
.dialog-content {
    display: none;
    pointer-events: auto;
}

/* BG DECORATION */
.bg-decoration {
    position: absolute;
    z-index: 1;
    width: var(--pc-width);
    aspect-ratio: var(--pc-aspect-ratio);
    top: var(--pc-top, auto);
    left: var(--pc-left, auto);
    right: var(--pc-right, auto);
    bottom: var(--pc-bottom, auto);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: var(--pc-image);
}

/* HOMEPAGE POPUP */
.homepage-popup {
    position: fixed;
    inset: 0;
    z-index: 400;
}
.homepage-popup .popup-overlay {
    position: absolute;
    inset: 0;
    background-color: #d9d9d9;
    opacity: 0.8;
    z-index: 1;
    cursor: pointer;
}

.homepage-popup .content {
    position: absolute;
    z-index: 5;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-2xs);
}

.homepage-popup .content .media {
    border-radius: 0.8rem;
    overflow: hidden;
    height: 81.4814814815svh;
    max-height: 66rem;
    aspect-ratio: 1;
    position: relative;
    z-index: 5;
}
.close-button {
    position: absolute;
    top: var(--spacing-sm);
    right: var(--spacing-sm);
    height: 2.8rem;
    width: 2.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-soft-rinse-silver);
    color: var(--color-white);
    border: 0.1rem solid var(--color-white);
    border-radius: 0.4rem;
    line-height: 1;
}
html.no-touchevents .close-button:hover {
    background-color: var(--color-cutton-cream);
    color: var(--color-white);
}

.homepage-popup .content .button {
    position: relative;
    z-index: 5;
}

/* PAGE */
/* PAGE: INDEX */
/* HERO SLIDE BG */
[data-section="hero-slide-bg"] {
    height: 100svh;
}

[data-section="hero-slide-bg"] .swiper {
    height: 100%;
}

[data-section="hero-slide-bg"] .swiper-slide .media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 54.33%, rgba(0, 0, 0, 0.3) 100%),
        linear-gradient(0deg, rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.24) 100%);
    z-index: 1;
    pointer-events: none;
}

[data-section="hero-slide-bg"] .container {
    position: relative;
    z-index: 10;
    height: 100svh;
}

[data-section="hero-slide-bg"] [class*="block-content-"] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-wrap: wrap;
    width: calc(100vw - var(--spacing-container) * 4);
}

[data-section="hero-slide-bg"] .client-marquee {
    --mask-box-image-offset: var(--spacing-4xl);
    position: absolute;
    bottom: var(--spacing-4xs);
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    width: 81rem;
    text-align: center;
    -webkit-mask-box-image: -webkit-linear-gradient(
        0deg,
        transparent 0%,
        white var(--mask-box-image-offset),
        white calc(100% - var(--mask-box-image-offset)),
        transparent 100%
    );
}

.client-marquee .client-marquee-ttl {
    margin-bottom: var(--spacing-5xs);
}

.client-marquee .client-logo {
    width: 10.4rem;
    height: 7.8rem;
    opacity: 0.8;
}

.client-marquee .client-logo img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
       object-fit: contain;
    -o-object-position: center;
       object-position: center;
}

.full-screen-pagination .swiper-pagination {
    bottom: auto;
    left: auto;
    top: 50%;
    right: var(--spacing-container);
    transform: translateY(-50%);
    flex-direction: column;
    gap: var(--spacing-5xs);
    padding: var(--spacing-2xs);
    border: 0.1rem solid rgba(var(--color-white-rgb), 0.5);
    border-radius: 0.4rem;
    overflow: visible;
}

.full-screen-pagination .swiper-pagination-bullet {
    width: 0.3rem;
    height: 0.3rem;
    background-color: rgba(var(--color-white-rgb), 0.5);
    border: none;
    border-radius: 2rem;
}

.full-screen-pagination .swiper-pagination-bullet:before {
    content: "";
    position: absolute;
    inset: -0.3rem;
}

.full-screen-pagination .swiper-pagination-bullet-active {
    height: 1.8rem;
    background-color: var(--color-white);
}

/* SERVICES */
[data-section="services"] .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-lg);
}

[data-section="services"] .card-container {
    --column: 3.2;
    --gap-x: var(--spacing-2xs);
    width: calc(100% + var(--gap-x));
}

[data-section="services"] .card-container .swiper {
    overflow: visible;
}

[data-section="services"] .card-container .swiper-slide {
    height: auto;
}

[data-card="service"] {
    border-radius: 0.8rem;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 0.1rem solid var(--color-mist-gray);
}

[data-card="service"] .card-media {
    aspect-ratio: 1.775862069;
    position: relative;
    flex-shrink: 0;
}

[data-card="service"] .card-media *:is(img, video) {
    transition: transform var(--duration-x3) cubic-bezier(0.22, 1, 0.36, 1);
}

html.no-touchevents [data-card="service"]:hover .card-media *:is(img, video) {
    transform: scale(1.1);
}

[data-card="service"] .card-tag {
    position: absolute;
    top: var(--spacing-2xs);
    right: var(--spacing-2xs);
}

.card-tag {
    padding: var(--spacing-5xs) var(--spacing-2xs);
    line-height: 1;
    color: var(--color-white);
    background-color: var(--color-cutton-cream);
    border-radius: 0.2rem;
}

.card-tag.cottom-cream {
    background-color: var(--color-cutton-cream);
}
.card-tag.ocean-wave {
    background-color: var(--color-ocean-wave);
}
.card-tag.soft-olive {
    background-color: var(--color-soft-olive);
}
.card-tag.faded-tangerince {
    background-color: var(--color-faded-tangerince);
}
.card-tag.white {
    background-color: var(--color-white);
    color: var(--color-soft-rinse-silver);
    border: var(--border);
}

[data-card="service"] .card-content {
    flex-grow: 1;
    background-color: var(--color-white);
    padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-lg);
    gap: var(--spacing-4xs);
}

[data-card="service"] .card-header {
    display: flex;
    gap: var(--spacing-2xs);
    align-items: center;
}

[data-card="service"] .card-icon {
    width: 4.4rem;
    aspect-ratio: 1;
    border: 0.1rem solid var(--color-mist-gray);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background-color: rgba(var(--color-mist-gray-rgb), 0.5);
}

[data-card="service"] .card-quick-view-hover {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: var(--spacing-3xs);
    z-index: 10;
    cursor: pointer;
}

[data-card="service"] .card-quick-view {
    display: flex;
    gap: var(--spacing-3xs);
    align-items: center;
    padding: 0 0.9rem;
    background-color: var(--color-white);
    border: 0.1rem solid var(--color-mist-gray);
    border-radius: 4rem;
    width: 2.2rem;
    height: 2.2rem;
    transition: width var(--duration-x2) cubic-bezier(0.22, 1, 0.36, 1);
    overflow: hidden;
}

html.no-touchevents [data-card="service"] .card-quick-view-hover:hover .card-quick-view {
    width: 8.4rem;
}

[data-card="service"] .card-quick-view .quick-view-i {
    flex-shrink: 0;
    width: 0.2rem;
    aspect-ratio: 0.2;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="2" height="10" viewBox="0 0 2 10" fill="none"><path opacity="0.5" d="M1 0C1.275 2.67125e-08 1.51042 0.108796 1.70625 0.326389C1.90208 0.543981 2 0.805556 2 1.11111C2 1.41667 1.90208 1.67824 1.70625 1.89583C1.51042 2.11343 1.275 2.22222 1 2.22222C0.725 2.22222 0.489584 2.11343 0.29375 1.89583C0.0979172 1.67824 6.75341e-07 1.41667 6.99382e-07 1.11111C7.23423e-07 0.805556 0.0979173 0.543981 0.293751 0.326389C0.489584 0.108796 0.725001 -2.67125e-08 1 0ZM2 3.33333L2 10H0L5.24536e-07 3.33333H2Z" fill="%236E6E6E"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

[data-card="service"] .card-quick-view > p {
    text-wrap: nowrap;
}

/* TAB */
.template-tab {
    margin-top: var(--spacing-lg);
}

.template-tab .tab-links {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
}

.template-tab .tab-links .swiper {
    overflow: visible;
}

.template-tab .tab-links .swiper-slide {
    width: auto !important;
}

.template-tab .tab-links .tab {
    background: rgba(110, 110, 110, 0.5);
    overflow: hidden;
    padding: 0.1rem;
}

.template-tab .tab-links .swiper-slide:first-child .tab {
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
}

.template-tab .tab-links .swiper-slide:last-child .tab {
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

.template-tab .tab-links .tab-link {
    padding: var(--spacing-5xs) var(--spacing-3xs);
    border-radius: 0.4rem;
    color: var(--color-white);
    height: 3rem;
    display: block;
    transition: var(--duration) var(--timing-function);
    min-width: 11.2rem;
    text-align: center;
}

.template-tab .tab-links .tab-link.active {
    background-color: var(--color-white);
    color: var(--color-soft-rinse-silver);
}

.template-tab .tab-contents {
    margin-top: var(--spacing-lg);
}

.template-tab .tab-contents .tab-content {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}
.template-tab .tab-content .tab-ttl {
    padding: var(--spacing-3xs) 0;
    border-bottom: 0.1rem solid rgba(110, 110, 110, 0.24);
}

.template-tab .tab-content .tab-desc {
    max-width: 60rem;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.template-tab .tab-content .card-container {
    --column: 4;
    --gap-x: var(--spacing-xs);
}

.template-tab .tab-content .card-container .swiper {
    max-width: 81.9444444444vw;
    padding: 0 var(--spacing-3lg);
}

.template-tab .tab-content .card-container .swiper:before,
.template-tab .tab-content .card-container .swiper:after {
    content: "";
    position: absolute;
    top: 0;
    width: var(--spacing-3lg);
    height: 100%;
    z-index: 3;
}

.template-tab .tab-content .card-container .swiper:before {
    left: 0;
    background: linear-gradient(-90deg, rgba(247, 246, 241, 0) 0%, #f7f6f1 100%);
}

.template-tab .tab-content .card-container .swiper:after {
    right: 0;
    background: linear-gradient(90deg, rgba(247, 246, 241, 0) 0%, #f7f6f1 100%);
}

[data-card="package"] {
    border-radius: 0.8rem;
    overflow: hidden;
    border: var(--border);
    background-color: var(--color-white);
}

[data-card="package"] .card-header {
    padding: var(--spacing-xs) var(--spacing-3xs);
    background-color: var(--color-ocean-wave);
    color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-card="package"] .card-content {
    gap: var(--spacing-3xs);
    padding: var(--spacing-2sm) var(--spacing-3xs) var(--spacing-xs);
    align-items: center;
    text-align: center;
}

[data-card="package"] .card-content .card-ttl {
    font-size: 3.2rem;
    line-height: 1;
    opacity: 0.9;
    border-bottom: var(--border);
    width: 100%;
    padding-bottom: var(--spacing-xs);
}

/* WASHING MACHINE */
[data-section="washing-machine"] {
    overflow: visible;
}

[data-section="washing-machine"] .sc-inner {
    padding-top: 14.5833333333vw;
    padding-bottom: 14.5833333333vw;
}

[data-section="washing-machine"] .container {
    display: flex;
    justify-content: space-between;
    gap: var(--spacing-7xl);
}

[data-section="washing-machine"] .bullet-list {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2sm);
    max-width: 33rem;
}

[data-section="washing-machine"] .list-ttl {
    text-wrap: balance;
}

.bullet-list .list-icon {
    flex-shrink: 0;
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--color-white);
    border: var(--border);
    width: 4.4rem;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-ocean-wave);
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

.bullet-list ul {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xs);
}

.bullet-list ul li {
    display: flex;
    gap: var(--spacing-5xs);
}

.bullet-list .list-desc {
    text-wrap: balance;
    text-align: start;
    padding-top: calc((4.4rem - (var(--font-size-h5) * var(--line-height-h5))) / 2);
}

[data-section="washing-machine"] .washing-machine {
    width: 35.6944444444vw;
    position: absolute;
    bottom: 3.4722222222vw;
    left: 50%;
    transform: translateX(-50%);
}

[data-section="washing-machine"] .washing-machine .machine {
    aspect-ratio: 0.9500924214;
    width: 35.6944444444vw;
    position: relative;
    z-index: 10;
}

[data-section="washing-machine"] .washing-machine .cloths {
    width: 10.1388888889vw;
    aspect-ratio: 1;
    position: absolute;
    top: 33%;
    left: 36%;
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="146" height="146" viewBox="0 0 146 146" fill="none"><path d="M72.7246 0C113.193 0 146 32.6832 146 73C146 113.317 113.193 146 72.7246 146C35.3237 146 4.46877 118.083 0.00585938 82.0254H45.1211C48.6343 82.0254 48.6348 79.0254 48.6348 77.0254C48.6348 75.0254 49.1366 72.5252 48.6348 68.0254C48.233 64.4257 42.7792 63.8587 40.1025 64.0254H0C4.44024 27.9428 35.3061 0.000214744 72.7246 0Z" fill="black"/></svg>');
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="146" height="146" viewBox="0 0 146 146" fill="none"><path d="M72.7246 0C113.193 0 146 32.6832 146 73C146 113.317 113.193 146 72.7246 146C35.3237 146 4.46877 118.083 0.00585938 82.0254H45.1211C48.6343 82.0254 48.6348 79.0254 48.6348 77.0254C48.6348 75.0254 49.1366 72.5252 48.6348 68.0254C48.233 64.4257 42.7792 63.8587 40.1025 64.0254H0C4.44024 27.9428 35.3061 0.000214744 72.7246 0Z" fill="black"/></svg>');
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center;
    overflow: hidden;
    -webkit-mask-composite: exclude;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    opacity: 0.2;
}

@-webkit-keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    10%,
    30% {
        transform: rotate(90deg);
    }
    50%,
    70% {
        transform: rotate(180deg);
    }
    80%,
    90% {
        transform: rotate(90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }
    10%,
    30% {
        transform: rotate(90deg);
    }
    50%,
    70% {
        transform: rotate(180deg);
    }
    80%,
    90% {
        transform: rotate(90deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

[data-section="washing-machine"] .washing-machine .cloths img {
    -webkit-animation: rotate 10s linear infinite;
            animation: rotate 10s linear infinite;
    -webkit-animation-delay: 1s;
            animation-delay: 1s;
}

[data-section="washing-machine"] .washing-machine .floor {
    width: 100vw;
    aspect-ratio: 6.8571428571;
    min-height: 25.9259259259vh;
    position: absolute;
    top: 87.4306839187%;
    left: 50%;
    transform: translateX(-50%);
}

/* LAUNDRY FOR BUSINESS CTA */
[data-section="laundry-for-business-cta"] {
    z-index: 10;
    height: 100svh;
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="807" viewBox="0 0 1440 807" fill="none"><path d="M403.998 29.6592C564.787 -0.0451932 666.853 -27.9513 910.132 54.3975C1249 130.997 1440 54.3975 1440 54.3975V806.497H0V29.6592C125.067 53.762 243.209 59.3636 403.998 29.6592Z" fill="black"/></svg>');
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="807" viewBox="0 0 1440 807" fill="none"><path d="M403.998 29.6592C564.787 -0.0451932 666.853 -27.9513 910.132 54.3975C1249 130.997 1440 54.3975 1440 54.3975V806.497H0V29.6592C125.067 53.762 243.209 59.3636 403.998 29.6592Z" fill="black"/></svg>');
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: top center;
    overflow: hidden;
    -webkit-mask-composite: exclude;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: top center;
}

[data-section="laundry-for-business-cta"] .sc-inner {
    min-height: 100svh;
}

[data-section="laundry-for-business-cta"] .container {
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100svh - var(--gap-section) * 2);
}

[data-section="laundry-for-business-cta"] .benefits {
    padding: var(--spacing-md) var(--spacing-2xl);
    border-radius: 0.8rem;
    border: 1px solid rgba(236, 236, 235, 0.4);
    background: rgba(var(--color-white-rgb), 0.32);
    -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
}

.benefits .benefits-ttl {
    margin-bottom: var(--spacing-2sm);
}

.benefits .benefits-list {
    display: grid;
    grid-template-columns: repeat(var(--item-count), 13rem);
    gap: var(--spacing-2sm);
}

.benefits .benefit-item {
    width: 13rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-2xs);
}

.benefits .benefit-icon {
    width: 4.4rem;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: var(--border);
    border-radius: 50%;
    background-color: var(--color-white);
    overflow: hidden;
    color: var(--color-ocean-wave);
}

/* ABOUT CTA */
[data-section="about-cta"] {
    /* height: 200svh; */
}

[data-section="about-cta"] [class*="block-content-"] {
    position: sticky;
    position: -webkit-sticky;
    top: 10px;
    height: 100svh;
    justify-content: center;
    z-index: 5;
}

[data-section="about-cta"] .sc-media {
    /* position: absolute;
    bottom: 0;
    left: 0; */
    position: relative;
    width: 100vw;
    height: 100svh;
    z-index: 1;
}

[data-section="about-cta"] .sc-media .object-fit {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.5);
    min-height: 100svh;
    height: auto;
    width: calc(100vw + 1.6rem * 2);
    aspect-ratio: 16 / 9;
    transition: unset;
    border-radius: 1.6rem;
    overflow: hidden;
}

/* LOCATION CTA */
[data-section="location-cta"] .location-map {
    margin-top: var(--spacing-lg);
    max-width: min(69.5833333333vw, 1009.2rem);
    border-radius: 0.8rem;
    margin-left: auto;
    margin-right: auto;
}

[data-section="location-cta"] .map {
    aspect-ratio: 16 / 9;
}

[data-section="location-cta"] .decoration-row {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: flex-end;
    gap: var(--spacing-5xs);
    margin-top: var(--spacing-2xs);
    height: 4.6rem;
    width: calc(100% + (1.4rem + var(--spacing-5xs) * 2));
}

.decoration-row .circle {
    flex-shrink: 0;
    width: 1.4rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-white);
    border: var(--border);
}

.decoration-row .location-tag {
    flex-shrink: 0;
    padding: 0 var(--spacing-lg);
    border: var(--border);
    background-color: var(--color-white);
    border-radius: 8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.decoration-row .car {
    flex-grow: 1;
    aspect-ratio: 2.5;
    max-width: 28rem;
    min-width: 22rem;
    pointer-events: none;
}

.location-map .location-item {
    position: absolute;
}
.location-map .location-item.active {
    z-index: 10;
}

.location-map .location-item .item-pin {
    width: 3.6rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-ocean-wave);
    background-image: url("../media/design/logo-text.png");
    background-size: 80%;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    transition: transform var(--duration) var(--timing-function);
}

.location-map .location-item.active .item-pin {
    background-color: var(--color-cutton-cream);
    transform: scale(1.3333);
}

.location-item .item-popup-overlay {
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--duration) var(--timing-function);
    position: absolute;
    bottom: calc(100% + var(--spacing-2sm));
    left: 50%;
    transform: translateX(-50%);
}

.location-item.active .item-popup-overlay {
    opacity: 1;
    pointer-events: auto;
}

.location-item .item-popup-content {
    display: flex;
    border: var(--border);
    border-radius: 0.8rem;
    background-color: var(--color-white);
    overflow: hidden;
}

.location-item .popup-media {
    width: 16.2rem;
    aspect-ratio: 1;
    position: relative;
}

.location-item .popup-detail {
    width: 28rem;
    padding: var(--spacing-xs) var(--spacing-2sm);
}

.location-item .popup-header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-4xs);
    padding-bottom: var(--spacing-3xs);
    border-bottom: var(--border);
}

.location-item .popup-list {
    padding-top: var(--spacing-3xs);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-6xs);
}

.location-item .popup-list .list-item {
    display: flex;
    gap: var(--spacing-2xs);
    align-items: center;
}

.location-item .popup-list .list-item .list-category {
    padding: var(--spacing-6xs) var(--spacing-2xs);
    border: var(--border);
    border-radius: 0.3rem;
    background-color: var(--color-white);
}

/* WHY WOW */
[data-section="why-wow"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-2xs);
    margin-top: var(--spacing-lg);
}

[data-section="why-wow"] .card {
    aspect-ratio: 1;
    border-radius: 0.8rem;
}

[data-section="why-wow"] .card .card-media {
    width: 100%;
    height: 100%;
}

[data-section="why-wow"] .card .card-media:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
}

[data-section="why-wow"] .card .card-content {
    position: absolute;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-6xs);
    left: 0;
    bottom: 0;
    color: var(--color-white);
    padding: var(--spacing-sm);
    text-wrap: balance;
}

/* TESTIMONIAL */
[data-section="testimonials"] .sc-inner {
    padding-top: max(13.8888888889vw, 20rem);
    background: linear-gradient(180deg, #ececeb 0%, rgba(236, 236, 235, 0) 100%);
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="938" viewBox="0 0 1440 938" fill="none"><path d="M403.998 61.3384C564.787 91.0428 666.852 118.948 910.131 36.5995C1153.41 -45.7494 1440 36.5995 1440 36.5995V937.5H0V61.3384C125.067 37.2356 243.209 31.634 403.998 61.3384Z" fill="black"/></svg>');
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="938" viewBox="0 0 1440 938" fill="none"><path d="M403.998 61.3384C564.787 91.0428 666.852 118.948 910.131 36.5995C1153.41 -45.7494 1440 36.5995 1440 36.5995V937.5H0V61.3384C125.067 37.2356 243.209 31.634 403.998 61.3384Z" fill="black"/></svg>');
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: top center;
    overflow: hidden;
    -webkit-mask-composite: exclude;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: top center;
}

[data-section="testimonials"] .container {
    padding-left: 9rem;
    padding-right: 9rem;
}

[data-section="testimonials"] .sc-ttl {
    margin-bottom: var(--spacing-lg);
}

[data-section="testimonials"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2lg);
}

[data-section="testimonials"] .swiper {
    overflow: visible;
}

[data-section="testimonials"] .swiper-button-prev {
    left: calc(-1 * var(--spacing-lg));
}

[data-section="testimonials"] .swiper-button-next {
    right: calc(-1 * var(--spacing-lg));
}

.testimonial-item {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xs);
}

.swiper-slide:nth-child(even) .testimonial-item {
    padding-top: var(--spacing-5xl);
    flex-direction: column-reverse;
}

.testimonial-item .testimonial-media {
    width: 100%;
    aspect-ratio: 1.3299319728;
    border-radius: 0.8rem;
    overflow: hidden;
}

.testimonial-item .testimonial-content {
    border-radius: 0.8rem;
    overflow: hidden;
    border: var(--border);
    background-color: var(--color-white);
    padding: var(--spacing-xs);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.testimonial-content .quote {
    width: 2rem;
    aspect-ratio: 1.2800625;
}

.testimonial-content .testimonial-desc {
    margin-top: var(--spacing-3xs);
}

.testimonial-content .testimonial-name {
    margin-top: var(--spacing-xs);
}

/* CTA */
[data-section="cta"] {
    height: 100svh;
}

[data-section="cta"] .sc-inner {
    min-height: 100svh;
}

[data-section="cta"] .container {
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100svh - var(--gap-section) * 2);
    color: var(--color-white);
}

[data-section="cta"] [class*="block-content-"] {
    text-wrap: wrap;
    width: 100%;
}

[data-section="cta"] .block-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-xs);
}

[data-section="cta"] .leading-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.4rem;
    background-color: var(--color-cutton-cream);
    height: 2.3rem;
    padding: 0 var(--spacing-2xs);
}

[data-section="cta"] .cta-links {
    display: flex;
    gap: var(--spacing-5xs);
    align-items: center;
}

.cta-links .cta-link-item {
    border-radius: 0.8rem;
    overflow: hidden;
    border: 0.1rem solid #cdcccb;
    background-color: rgba(var(--color-white-rgb), 0.3);
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-3xs);
    height: 6.2rem;
    padding: 0 var(--spacing-sm);
    width: 22rem;
    transition: background-color var(--duration) var(--timing-function);
}

html.no-touchevents .cta-links .cta-link-item:hover {
    background-color: rgba(var(--color-white-rgb), 0.5);
}

.cta-links .cta-link-item .item-detail {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-7xs);
    text-align: start;
}

.cta-links .cta-link-item .item-detail .category {
    opacity: 0.5;
}

.cta-links .cta-link-item .plain-bg {
    border-radius: 50%;
    overflow: hidden;
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    aspect-ratio: 1;
    color: var(--color-soft-rinse-silver);
}

/* PAGE: ABOUT */
/* ABOUT STANDARDS */
.about-standards-container {
    position: relative;
}

.about-standards-container .sticky-item {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 10;
    height: 100svh;
    display: flex;
    align-items: center;
    padding-left: var(--spacing-container);
    padding-right: var(--spacing-container);
}
[data-section="about-standards"] {
    margin-top: -0.1rem;
}

[data-section="about-standards"].mask-bg {
    margin-top: -100svh;
    mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="807" viewBox="0 0 1440 807" fill="none"><path d="M403.998 29.6592C564.787 -0.0451932 666.853 -27.9513 910.132 54.3975C1249 130.997 1440 54.3975 1440 54.3975V806.497H0V29.6592C125.067 53.762 243.209 59.3636 403.998 29.6592Z" fill="black"/></svg>');
    -webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="807" viewBox="0 0 1440 807" fill="none"><path d="M403.998 29.6592C564.787 -0.0451932 666.853 -27.9513 910.132 54.3975C1249 130.997 1440 54.3975 1440 54.3975V806.497H0V29.6592C125.067 53.762 243.209 59.3636 403.998 29.6592Z" fill="black"/></svg>');
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: top center;
    overflow: clip;
    -webkit-mask-composite: exclude;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: top center;
}

[data-section="about-standards"] .container {
    display: flex;
    align-items: center;
    height: 100svh;
}

[data-section="about-standards"] .flex-content {
    display: flex;
    gap: var(--spacing-md);
    color: var(--color-white);
    position: relative;
    z-index: 10;
    width: 100%;
}

[data-section="about-standards"] .flex-content .content-item {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    max-width: 44.8rem;
}

[data-section="about-standards"] .flex-content .content-item:last-child {
    margin-left: auto;
    text-align: end;
}

/* ABOUT POINTS */
[data-section="about-points"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-xl);
    --media-aspect-ratio: 1.193922252;
    margin-top: var(--spacing-lg);
}

[data-section="about-points"] .swiper {
    overflow: visible;
}

[data-section="about-points"] [class*="swiper-button-"] {
    --content-width: calc(100vw - var(--spacing-container) * 2);
    --content-width-without-gap: calc(var(--content-width) - var(--gap-x) * var(--gap-count));
    --gap-count: calc(var(--column) - 1);
    top: calc((var(--content-width-without-gap) / var(--column)) / var(--media-aspect-ratio) / 2);
}

[data-section="about-points"] .swiper-button-next {
    right: 0;
    transform: translateX(calc(50% - var(--gap-x) / 2)) !important;
}

[data-section="about-points"] .swiper-button-prev {
    left: 0;
    transform: translateX(calc(-50% + var(--gap-x) / 2)) !important;
}

[data-card="about-point"] .card-media {
    width: 100%;
    aspect-ratio: var(--media-aspect-ratio);
    border-radius: 0.8rem;
    overflow: hidden;
}

[data-card="about-point"] .card-content {
    margin-top: var(--spacing-2sm);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-xs);
    align-items: center;
    text-align: center;
    text-wrap: balance;
}

/* ABOUT GALLERY */
[data-section="gallery"] .gallery-container {
    --gap: var(--spacing-2xs);
    --aspect-ratio-wide: 1.3320158103;
    --aspect-ratio-square: 1;
    /* Height difference calculation:
       Square height - Wide height = width - (width / wide-ratio)
       = width * (1 - 1/wide-ratio) 
       = width * (1 - 1/1.3320158103)
       = width * 0.249243... */
    --height-diff-factor: calc(1 - (1 / var(--aspect-ratio-wide))); /* ≈ 0.249243 */
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap);
    margin-top: var(--spacing-3lg);
    align-items: start;
}

[data-section="gallery"] .gallery-item {
    position: relative;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    -moz-column-break-inside: avoid;
         break-inside: avoid;
}

[data-section="gallery"] .gallery-item .item-media {
    height: 100%;
    width: 100%;
    border-radius: 0.8rem;
    overflow: hidden;
    position: relative;
}

[data-section="gallery"] .gallery-item.has-caption .item-media:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 56.3%, rgba(0, 0, 0, 0.4) 100%);
}

[data-section="gallery"] .gallery-item:nth-child(4n + 1),
[data-section="gallery"] .gallery-item:nth-child(4n + 4) {
    aspect-ratio: var(--aspect-ratio-wide);
}

[data-section="gallery"] .gallery-item:nth-child(4n + 2),
[data-section="gallery"] .gallery-item:nth-child(4n + 3) {
    aspect-ratio: var(--aspect-ratio-square);
}

[data-section="gallery"] .gallery-item:nth-child(4n + 3) {
    --column-width: calc(((100vw - var(--spacing-container) * 2) - var(--gap)) / 2);
    --height-diff: calc(var(--column-width) * var(--height-diff-factor));
    margin-top: calc(-1 * (var(--height-diff)));
}

[data-section="gallery"] .gallery-item:nth-child(4n + 2),
[data-section="gallery"] .gallery-item:nth-child(4n + 4) {
    -webkit-animation-delay: var(--duration);
            animation-delay: var(--duration);
}

[data-section="gallery"] .gallery-item .item-text {
    position: absolute;
    bottom: var(--spacing-md);
    left: var(--spacing-md);
    color: var(--color-white);
    width: 24.5rem;
    z-index: 5;
}

[data-section="gallery"] .load-more-btn {
    margin-top: var(--spacing-xl);
    display: flex;
    justify-content: center;
}

/* PAGE: SERVICE */
/* SERVICES GRID */
[data-section="services-grid"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-lg);
    margin-top: var(--spacing-xl);
}

/* TURNAROUND & DELIVERY */
[data-section="turnaround-delivery"] .container {
    --gap: var(--spacing-sm);
    display: flex;
    gap: var(--gap);
}

[data-section="turnaround-delivery"] .turnaround-figure,
[data-section="turnaround-delivery"] .turnaround-content {
    width: calc(50% - var(--gap) / 2);
}

[data-section="turnaround-delivery"] .turnaround-figure {
    position: relative;
    aspect-ratio: 1;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

[data-section="turnaround-delivery"] .turnaround-figure .sign {
    padding: var(--spacing-md) var(--spacing-3xs) var(--spacing-sm);
    border-radius: 0.8rem;
    border: var(--border);
    background-color: var(--color-mist-gray);
    text-align: center;
    position: absolute;
    bottom: 14.9031296572%;
    right: 14.9031296572%;
    z-index: 10;
    rotate: 4deg;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.turnaround-figure .sign .icon {
    position: absolute;
    border-radius: 50%;
    background-color: var(--color-white);
    border: var(--border);
    width: 4.4rem;
    height: 4.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    color: var(--color-black);
}

.turnaround-figure .sign .subttl {
    margin-top: var(--spacing-5xs);
}

.turnaround-figure .sign .tag {
    background-color: var(--color-white);
    border-radius: 3rem;
    padding: var(--spacing-5xs) var(--spacing-3xs);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-top: var(--spacing-xs);
}

[data-section="turnaround-delivery"] .turnaround-content {
    display: flex;
    justify-content: center;
    align-items: center;
}

.turnaround-content .content-inner {
    max-width: 38.2rem;
}

.turnaround-content .content-ttl {
    margin-bottom: var(--spacing-4lg);
}

.turnaround-content .list-container {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2md);
}

.turnaround-content .list-container .list-ttl {
    margin-bottom: var(--spacing-2xs);
}

.turnaround-content .list-container .list ul {
    list-style-type: disc;
    padding-left: 1.05em;
}

/* PAGE: SERVICE SINGLE */
/* HOW IT WORKS */
[data-section="how-it-works"] .container {
    --gap: var(--spacing-sm);
    display: flex;
    gap: var(--gap);
}

[data-section="how-it-works"] .how-it-works-content,
[data-section="how-it-works"] .how-it-works-figure {
    width: calc(50% - var(--gap) / 2);
}

[data-section="how-it-works"] .how-it-works-content {
    display: flex;
    justify-content: center;
    align-items: center;
}

[data-section="how-it-works"] .how-it-works-figure {
    position: relative;
    aspect-ratio: 1.342;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 0.8rem;
    overflow: hidden;
}

/* THE PROCESS */
[data-section="the-process"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-lg);
    --gap-y: var(--spacing-lg);
    margin-top: var(--spacing-3lg);
}

[data-card="process"] .card-media {
    aspect-ratio: 1;
    border-radius: 0.65rem;
    overflow: hidden;
    width: 41.4507772021%;
    margin: 0 auto;
    margin-bottom: var(--spacing-md);
}

[data-card="process"] .card-content {
    align-items: center;
    text-align: center;
    gap: var(--spacing-3xs);
}

[data-card="process"] .card-content .card-counter {
    width: 4.4rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    border: var(--border);
}

/* PRICE */
[data-section="price"] .price-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md) var(--spacing-3xl);
    max-width: 107.6rem;
    margin: 0 auto;
    margin-top: var(--spacing-xl);
}

.price-list .price-label {
    display: flex;
    justify-content: space-between;
    padding-bottom: var(--spacing-4xs);
    border-bottom: var(--border);
    font-size: var(--font-size-sub);
    line-height: var(--line-height-sub);
    font-weight: var(--font-weight-medium);
}

.price-list .accordion .entry-title {
    padding-top: 0;
    padding-bottom: var(--spacing-xs);
}

.price-list .accordion .entry-panel {
    padding-bottom: var(--spacing-md);
}

.price-list .accordion .entry-panel ul {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xs);
}

.price-list .accordion .entry-panel ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.price-list .accordion .entry-panel ul li .item-price {
    display: flex;
    align-items: center;
    gap: var(--spacing-4xs);
}

/* ESTIMATED TURNAROUND TIME */
[data-section="estimated-turnaround-time"] .template-tab .tab-content .tab-desc {
    max-width: unset;
}

[data-section="estimated-turnaround-time"] .template-tab .tab-links .tab-link {
    min-width: 15.5rem;
}

[data-section="estimated-turnaround-time"] .tab-table {
    padding: var(--spacing-lg);
    border-radius: 0.8rem;
    border: var(--border);
    background-color: var(--color-white);
}

[data-section="estimated-turnaround-time"] .tab-table .table-row {
    display: flex;
    align-items: center;
    padding: var(--spacing-xs) 0;
    border-bottom: 0.1rem solid rgba(var(--color-soft-rinse-silver-rgb), 0.1);
}

.tab-table .table-row:first-child {
    padding-top: 0;
}

.tab-table .table-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.tab-table .table-row > * {
    flex: 1;
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 0 var(--spacing-5xs);
}

/* BENEFITS */
[data-section="benefits"] .container {
    --gap: var(--spacing-sm);
    display: flex;
    gap: var(--gap);
    z-index: 10;
}

[data-section="benefits"] .benefit-media,
[data-section="benefits"] .benefit-list {
    width: calc(50% - var(--gap) / 2);
}

[data-section="benefits"] .benefit-media {
    position: relative;
    aspect-ratio: 1;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 0.8rem;
    overflow: hidden;
}

[data-section="benefits"] .benefit-list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-2md);
}

.benefit-list .list-content {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-sm);
}

.benefit-list .list-content .list-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-xs);
    background-color: var(--color-white);
    padding: var(--spacing-2sm) var(--spacing-2xs);
    border-radius: 0.8rem;
    border: var(--border);
    text-align: center;
}

.benefit-list .list-content .list-item .item-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4.4rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-white);
    border: var(--border);
}

/* FAQ */
[data-section="faq"] .sc-ttl {
    margin-bottom: var(--spacing-2lg);
}

/* RELATED SERVICES */
[data-section="related-services"] .card-container {
    --column: 3.2;
    --gap-x: var(--spacing-2xs);
    margin-top: var(--spacing-2lg);
}

[data-section="related-services"] .card-container .swiper {
    overflow: visible;
}

[data-section="related-services"] .card-container .swiper-slide {
    height: auto;
}

[data-section="related-services"] .sc-button {
    margin-top: var(--spacing-lg);
    text-align: center;
}

/* PAGE: LAUNDRY FOR BUSINESS */
/* DUAL CONTENT LIST */
[data-section="dual-content-list"] .container {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
}

[data-section="dual-content-list"] .dual-content {
    --gap: var(--spacing-sm);
    display: flex;
    gap: var(--gap);
}

[data-section="dual-content-list"] .dual-content:nth-child(even) {
    flex-direction: row-reverse;
}

[data-section="dual-content-list"] .dual-content-media,
[data-section="dual-content-list"] .dual-content-text {
    width: calc(50% - var(--gap) / 2);
}

[data-section="dual-content-list"] .dual-content-media {
    position: relative;
    aspect-ratio: 1.342;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    border-radius: 0.8rem;
    overflow: hidden;
}

[data-section="dual-content-list"] .dual-content-text {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* PARTNERS */
[data-section="partners"] .card-container {
    --column: 8;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-2xs);
    margin-top: var(--spacing-xl);
}

[data-card="partner"] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--spacing-xs) var(--spacing-2sm);
    border-radius: 0.8rem;
    border: var(--border);
}

[data-card="partner"] .card-media {
    width: 8rem;
    aspect-ratio: 1;
    transition: var(--duration) var(--timing-function);
    -webkit-mask-image: url("assets/media/design/logo-1.png");
            mask-image: url("assets/media/design/logo-1.png");
    -webkit-mask-size: contain;
            mask-size: contain;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    background-color: var(--color-soft-rinse-silver);
    opacity: 1;
}
[data-card="partner"]:hover .card-media {
    opacity: 0;
}

[data-card="partner"] .card-media-hover {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8rem;
    aspect-ratio: 1;
    transition: var(--duration) var(--timing-function);
    opacity: 0;
}

[data-card="partner"]:hover .card-media-hover {
    opacity: 1;
}

[data-card="partner"].disable-bg .card-media-hover {
    opacity: 1 !important;
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
}

[data-card="partner"].disable-bg .card-media {
    opacity: 0 !important;
}

[data-card="partner"].disable-bg:hover .card-media-hover {
    -webkit-filter: grayscale(0%);
            filter: grayscale(0%);
}

/* CONTACT FORM */
.choice-container.choic-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-7xs) var(--spacing-sm);
    max-width: 55rem;
}

.other-specify-input input {
    --input-height: 3rem;
    padding: 0;
    border-radius: 0;
    border: none;
    border-bottom: var(--border);
}

[data-section="contact-form"] .form-button {
    margin-top: var(--spacing-xl);
    text-align: center;
}

/* Subject Dropdown Styles */
.select-slide-dropdown {
    position: relative;
    width: 100%;
    perspective: 1000px;
}

.select-slide-dropdown input {
    width: 100%;
    padding-right: 3rem;
    cursor: pointer;
}

.dropdown-arrow {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.2rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-white);
    border: var(--border);
    position: absolute;
    right: var(--spacing-2xs);
    top: calc(var(--input-height) / 2);
    transform: translateY(-50%);
    pointer-events: none;
    transition: transform var(--duration) var(--timing-function);
    transform-style: preserve-3d;
}

.dropdown-arrow .ic {
    transform: translateY(12%);
}

.select-slide-dropdown.active .dropdown-arrow {
    background-color: var(--color-soft-rinse-silver);
    color: var(--color-white);
    transform: translateY(-50%) rotateX(180deg);
}

.select-slide-dropdown .dropdown-options {
    display: none;
    overflow: hidden;
    border-bottom-left-radius: 0.8rem;
    border-bottom-right-radius: 0.8rem;
    border: 0.1rem solid #d1cfca;
    border-top: none;
}

.select-slide-dropdown .dropdown-options .option {
    padding: var(--spacing-4xs) var(--input-spacing-x);
    cursor: pointer;
    transition: background-color 0.2s ease;
    display: flex;
    align-items: center;
    grid-gap: var(--spacing-5xs);
}

html.no-touchevents .select-slide-dropdown .dropdown-options .option:hover,
.dropdown-options .option.selected {
    background-color: var(--color-mist-gray);
}

.select-slide-dropdown.active input {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* PAGE: BLOG */
/* BLOG GRID */
[data-section="blog-grid"] .tab-links {
    --gap: var(--spacing-6xs);
    margin-left: calc(var(--gap) / 2);
    margin-right: calc(var(--gap) / 2);
}

[data-section="blog-grid"] .tab-links .swiper {
    overflow: visible;
}

[data-section="blog-grid"] .tab-links .swiper-slide {
    width: auto !important;
    padding-left: calc(var(--gap) / 2);
    padding-right: calc(var(--gap) / 2);
}

[data-section="blog-grid"] .tab-links .tab-link {
    color: var(--color-white);
    background-color: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
    border: var(--border);
    border-radius: 0.4rem;
    padding: var(--spacing-5xs) var(--spacing-3xs);
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--duration) var(--timing-function);
}

html.no-touchevents [data-section="blog-grid"] .tab-links .tab-link:hover {
    background-color: var(--color-cutton-cream);
}

[data-section="blog-grid"] .tab-links .tab-link.active {
    color: var(--color-soft-rinse-silver);
    background-color: var(--color-white);
    pointer-events: none;
}

[data-section="blog-grid"] .tab-contents {
    margin-top: var(--spacing-xl);
}

[data-section="blog-grid"] .tab-content .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-lg);
}

[data-section="blog-grid"] .load-more-btn {
    text-align: center;
    margin-top: var(--spacing-xl);
}

[data-card="blog"] {
    border: var(--border);
    border-radius: 0.8rem;
    overflow: hidden;
}

[data-card="blog"] .card-media {
    aspect-ratio: 1.25;
}

[data-card="blog"] .card-media *:is(img, video) {
    transition: transform var(--duration-x3) cubic-bezier(0.22, 1, 0.36, 1);
}

html.no-touchevents [data-card="blog"]:hover .card-media *:is(img, video) {
    transform: scale(1.1);
}

[data-card="blog"] .card-content {
    padding: var(--spacing-sm);
    background-color: var(--color-white);
}

[data-card="blog"] .card-content .card-header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-6xs);
}

[data-card="blog"] .card-content .card-tags {
    display: flex;
    gap: var(--spacing-4xs);
    flex-wrap: wrap;
}

/* PAGE: BLOG SINGLE */
[data-section="blog-content"] .container {
    max-width: calc(67.2rem + var(--spacing-container) * 2);
}

.share {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--spacing-2xs);
    margin-top: var(--spacing-5xl);
}

.social {
    gap: var(--spacing-5xs);
}

.social a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4.4rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background-color: var(--color-white);
    border: var(--border);
    position: relative;
}

html.no-touchevents .share .social a:hover {
    background-color: var(--color-cutton-cream);
    color: var(--color-white);
}

[data-section="related-blog"] .swiper {
    overflow: visible;
}

[data-section="related-blog"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    margin-top: var(--spacing-2lg);
}

[data-section="related-blog"] .sc-button {
    margin-top: var(--spacing-xl);
    text-align: center;
}

/* PAGE: CONTACT */
/* CONTACT HERO */
[data-section="contact-hero"] {
    height: 100svh;
    overflow: visible;
    max-height: 81rem;
}

[data-section="contact-hero"]:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(226, 226, 226, 0.7) 0%, rgba(236, 236, 235, 0) 100%);
    z-index: 1;
    pointer-events: none;
}

[data-section="contact-hero"] .sc-inner,
[data-section="contact-hero"] .container {
    height: 100%;
}

[data-section="contact-hero"] .container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    z-index: 5;
}

[data-section="contact-hero"] .contact-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--spacing-lg);
    margin-right: 13.4722222222vw;
}

[data-section="contact-hero"] .contact-info .info-item {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xs);
    max-width: 36rem;
}

[data-section="contact-hero"] .contact-info .info-item .item-ttl {
    color: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
}

/* PAGE: LOCATIONS */
/* LOCATION CTA */
.locations-main [data-section="location-cta"] {
    overflow: visible;
}

.locations-main [data-section="location-cta"] .container {
    z-index: 10;
}

/* LOCATION LIST */
[data-section="location-list"] .card-container {
    --column: 3;
    --gap-x: var(--spacing-2xs);
    --gap-y: var(--spacing-2xs);
}

[data-card="location"] {
    border: var(--border);
    border-radius: 0.8rem;
    overflow: hidden;
    background-color: var(--color-white);
}

[data-card="location"] .card-media {
    aspect-ratio: 1;
}

[data-card="location"] .card-content {
    padding: var(--spacing-2sm) var(--spacing-sm);
    align-items: center;
    gap: var(--spacing-2sm);
}

[data-card="location"] .card-content .card-header {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xs);
}

[data-card="location"] .card-content .card-header .card-desc a {
    text-decoration: underline;
    -webkit-text-decoration-color: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
            text-decoration-color: rgba(var(--color-soft-rinse-silver-rgb), 0.5);
}

[data-card="location"] .card-content .card-services {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-5xs) var(--spacing-md);
    width: 100%;
}

[data-card="location"] .service-item {
    display: flex;
    align-items: center;
    gap: var(--spacing-3xs);
    justify-content: flex-start;
}

/* [data-card="location"] .service-item:nth-child(odd) {
    padding-right: var(--spacing-lg);
} */

[data-card="location"] .service-item .service-category {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.3rem;
    text-align: center;
    width: 11.6rem;
    padding: 0 var(--spacing-5xs);
    border: var(--border);
    border-radius: 0.3rem;
    text-transform: uppercase;
}

/* PAGE: TERMS */
[data-section="terms"] .container {
    max-width: calc(67.2rem + var(--spacing-container) * 2);
    z-index: 10;
}

/* PAGE: NOT FOUND */
[data-section="not-found"] {
    height: 100svh;
    color: var(--color-white);
}

[data-section="not-found"] .cover:before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(270deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
    z-index: 1;
}

[data-section="not-found"] .sc-inner,
[data-section="not-found"] .container {
    height: 100%;
}

[data-section="not-found"] .container {
    display: flex;
    align-items: center;
    z-index: 5;
}

[data-section="not-found"] .not-found-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-lg);
    width: 56.4rem;
    text-wrap: balance;
}

[data-section="not-found"] .not-found-content .block-ttl {
    margin-bottom: -1rem;
}

[data-section="not-found"] .not-found-content .block-desc {
    margin-bottom: -0.5rem;
}