/*!
Theme Name:     PIED-DE-POULE
Author:         Oleksandr Piskun
Author URI:     https://www.instagram.com/lovu_volnu/
Description:    https://www.instagram.com/lovu_volnu/
Version:        3.2.3
Text Domain:    pdp
*/

/* Variables */

:root {
    --beige-100: #AA957C;
    --beige-25: #AA957C40;
    --beige-10: #AA957C1A;
    --light-beige-100: #F7F5F2;
    --dark-beige-100: #5A4936;
    --green-100: #1CB751;
    --green-10: #1CB7511A;
    --green-5: #1CB7510D;
    --red-100: #D74C4C;
    --red-10: #D74C4C1A;
    --red-5: #D74C4C0D;
    --white-100: #FFFFFF;
    --white-85: #FFFFFFD9;
    --white-80: #FFFFFFCC;
    --white-70: #FFFFFFB3;
    --white-60: #FFFFFF99;
    --white-50: #FFFFFF80;
    --white-33: #FFFFFF54;
    --white-30: #FFFFFF4D;
    --white-25: #FFFFFF40;
    --white-20: #FFFFFF33;
    --white-15: #FFFFFF26;
    --white-10: #FFFFFF1A;
    --white-5: #FFFFFF0D;
    --black-100: #000000;
    --black-80: #000000CC;
    --black-75: #000000BF;
    --black-70: #000000B3;
    --black-60: #00000099;
    --black-50: #00000080;
    --black-40: #00000066;
    --black-30: #0000004D;
    --black-25: #00000040;
    --black-20: #00000033;
    --black-10: #0000001A;
    --black-5: #0000000D;
    --light-grey-100: #F3F3F3;
    --grey-100: #E6E6E6;
    --dark-grey-100: #B2B2B2;

    --primary-font: 'Gotham Pro';
    --secondary-font: 'Gotham Pro';
}

/* Reset Styles */

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

html {
    position: relative;
}

html, body {
    width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: clip;
}

body {
    line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

blockquote {
    margin: 0;
}

blockquote::before {
    content: '«';
}

blockquote::after {
    content: '»';
}

a {
    color: inherit;
    text-decoration: none;
}

label[for],
label:has(input) {
    cursor: pointer;
}

fieldset {
    min-width: unset;
    margin: 0;
    padding: 0;
    border: 0;
}

input {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    font-weight: 500;
    font-size: 14px;
    border-radius: 0;
    border: 0;
}

textarea {
    width: 100%;
    padding: 16px;
    font-weight: 500;
    font-size: 14px;
    border-radius: 0;
    border: 0;
    resize: vertical;
}

input:focus,
textarea:focus {
    outline: none;
}

input[type="range"] {
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    height: 2px;
    padding: unset;
    background: linear-gradient(to right, var(--beige-100) var(--range-value,50%), var(--beige-25) var(--range-value,50%));
    cursor: pointer;
}

input[type="range"]::-webkit-slider-runnable-track {
    background: var(--beige-25);
    height: 2px;
    border-radius: 2px;
}

input[type="range"]::-moz-range-track {
    background: var(--beige-25);
    height: 2px;
    border-radius: 2px;
}

input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
    margin-top: -5px;
    background-color: var(--beige-100);
    border-radius: 50%;
}

input[type="range"]::-moz-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 12px;
    height: 12px;
    margin-top: -5px;
    background-color: var(--beige-100);
    border-radius: 50%;
}

select {
    height: 48px;
    padding: 0 16px;
    color: var(--white-100);
    font-weight: 500;
    background-color: unset;
    border: 1px solid var(--white-25);
}

select option {
    color: var(--black-100);
}

button {
    padding: 0;
    color: inherit;
    font-size: 1rem;
    background: none;
    border: 0;
    cursor: pointer;
}

body, input, textarea, select, button {
    font-family: var(--primary-font), sans-serif;
}

img {
    /* width: 100%; */
    max-width: 100%;
    height: auto;
    object-fit: cover;
}

video {
    max-width: 100%;
    height: auto;
}

#wpadminbar {
    z-index: 100001;
}

/* Scrollbar */

::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    background: var(--light-grey-100);
}

::-webkit-scrollbar-thumb {
    background: var(--beige-100);
}

/* Uppercase */

.uppercase {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Formatted Text */

.formatted-text > :first-child {
    margin-top: unset;
}

.formatted-text > :last-child {
    margin-bottom: unset;
}

.formatted-text > * {
    margin: 24px 0;
}

.formatted-text ul {
    list-style: none;
    padding-left: 18px;
}

.formatted-text > ul {
    list-style: disc;
}

/* Section */

.section {
    position: relative;
    padding-top: 80px;
    padding-bottom: 80px;
}

.section--pv-0 {
    padding-top: 0;
    padding-bottom: 0;
}

.section--pt-0 {
    padding-top: 0;
}

.section--pb-0 {
    padding-bottom: 0;
}

.section--pv-l {
    padding-top: 120px;
    padding-bottom: 120px;
}

.section--pt-l {
    padding-top: 120px;
}

.section--light-grey {
    background-color: var(--light-grey-100);
}

.section--beige {
    background-color: var(--beige-100);
}

.section--light-beige {
    background-color: var(--light-beige-100);
}

.section--w2lg {
    background-image: linear-gradient(to bottom, var(--white-100), var(--light-grey-100));
}

.section--cta {
    overflow: hidden;
}

/* Container */

.container {
    width: 100%;
    max-width: 1232px;
    margin: 0 auto;
    padding: 0 16px;
}

/* Grid */

.grid {
    display: grid;
    gap: 32px 16px;
}

.grid--col-2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid--col-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid--col-4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid--gap-8 {
    gap: 8px;
}

.grid--vacancies {
    row-gap: 8px;
}

/* Headings */

.h1, .h2, .h3, .h4, .h5, .h6 {
    line-height: 1.4;
}

.h3 {
    font-weight: 700;
    font-size: 24px;
}

/* Button */

.button {
    position: relative;
    display: inline-block;
    height: 40px;
    padding: 0 16px;
    font-family: var(--primary-font), sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 40px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;

    transition-property: color, background-color, border-color, opacity;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.button svg {
    vertical-align: middle;
}

.button:disabled,
.button--disabled {
    opacity: .5;
    pointer-events: none;
    cursor: not-allowed;
}

.button--md {
    height: 48px;
    line-height: 48px;
}

.button--lg {
    height: 56px;
    line-height: 56px;
}

.button--xlg {
    height: 72px;
    line-height: 72px;
}

.button--solid {
    color: var(--black-100);
    background-color: var(--white-100);
}

.button--solid:not(.button--custom-hover)::after {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--black-10);

    opacity: 0;
    pointer-events: none;

    transition: opacity .3s ease;
}

.button--solid:not(.button--custom-hover):hover::after {
    opacity: 1;
}

.button--solid.button--light-beige {
    color: var(--dark-beige-100);
    background-color: var(--light-beige-100);
}

.button--solid.button--green {
    color: var(--white-100);
    background-color: var(--green-100);
}

.button--solid.button--white-20 {
    color: var(--white-100);
    background-color: var(--white-20);
}

.button--solid.button--black {
    color: var(--white-100);
    background-color: var(--black-100);
}

.button--solid.button--black:not(.button--custom-hover)::after {
    background-color: var(--white-10);
}

.button--solid.button--light-grey {
    background-color: var(--light-grey-100);
}

.button--square {
    aspect-ratio: 1;
    padding: 0;
}

/* Link Button */

.link-button {
    position: relative;
    display: flex;
    align-items: center;
    height: 48px;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    background-color: var(--light-grey-100);
}

.link-button::after {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--black-5);

    opacity: 0;
    pointer-events: none;

    transition: opacity .3s ease;
}

.link-button:hover::after {
    opacity: 1;
}

.link-button__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    aspect-ratio: 1;
    background-color: var(--black-5);
}

.link-button__icon {
    width: 16px;
    height: 16px;
}

.link-button__title {
    margin-left: 8px;
}

.link-button__icon-wrap + .link-button__title {
    flex-grow: 1;
    padding: 0 16px;
}

/* Link Button - Phone */

.link-button--phone {
    color: var(--white-100);
    background-color: var(--black-100);
}

.link-button--phone::after {
    background-color: var(--white-10);
}

.link-button--phone .link-button__icon-wrap {
    background-color: var(--white-30);
}

.link-button--phone .link-button__icon {
    fill: var(--white-100);
}

/* Link Button - Viber */

.link-button--viber .link-button__icon-wrap {
    background: linear-gradient(90deg, rgba(154, 25, 215, 0.1) 0%, rgba(154, 25, 215, 0) 100%);
}

/* Link Button - Instagram */

.link-button--instagram .link-button__icon-wrap {
    background: linear-gradient(90deg, rgba(255, 146, 1, 0.1) 0%, rgba(255, 146, 1, 0) 100%);
}

/* Link Button - WhatsApp */

.link-button--whatsapp .link-button__icon-wrap {
    background: linear-gradient(90deg, rgba(28, 183, 81, 0.1) 0%, rgba(28, 183, 81, 0) 100%);
}

/* Link Button - Telegram */

.link-button--telegram .link-button__icon-wrap {
    background: linear-gradient(90deg, rgba(0, 117, 255, 0.1) 0%, rgba(0, 117, 255, 0) 100%);
}

/* Tooltip */

.tooltip {
    position: absolute;
    width: 280px;
    margin-top: 8px;
    padding: 16px;
    color: var(--white-100);
    font-weight: 400;
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: unset;
    text-transform: none;
    text-align: center;
    white-space: normal;
    background-color: #96969680;
    border-radius: 16px;
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    z-index: 1;
    
    opacity: 0;
    transform: translateY(1rem);
    pointer-events: none;

    transition-property: opacity, transform;
    transition-duration: .3s;
    transition-timing-function: ease-in-out;
}

.tooltip--active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: initial;
}

/* Input - Border */

.input--border {
    border: 1px solid var(--black-10);

    transition: border-color .3s ease;
}

.input--border:focus {
    border-color: var(--beige-100);
}

/* Selectron */

.selectron-select {
    position: relative;
    height: var(--selectron-select-height, 48px);
    font-size: 14px;
    background-color: var(--black-5);
    border: 1px solid transparent;
    cursor: pointer;
    user-select: none;

    transition-property: background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.selectron-select:hover {
    background-color: var(--beige-10);
}

.selectron-select:focus {
    border-color: var(--beige-100);
    outline: none;
}

.selectron-selection {
    display: flex;
    align-items: center;
}

.selectron-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: calc(var(--selectron-select-height, 48px) - 2px);
    aspect-ratio: 1;
    border-right: 1px solid var(--black-10);

    transition: border-color .3s ease;
}

.selectron-select--active .selectron-icon {
    border-color: var(--beige-100);
}

.selectron-icon::before {
    content: "";
    display: block;
    width: 16px;
    aspect-ratio: 1;
    background-color: var(--black-40);

    transition: background-color .3s ease;
}

.selectron-select--active .selectron-icon::before {
    background-color: var(--beige-100);
}

.selectron-icon--service-category::before {
    mask: url(./assets/svg/icons/fields/service-category.svg) center / contain no-repeat;
}

.selectron-icon--hair-length::before {
    mask: url(./assets/svg/icons/fields/hair-length.svg) center / contain no-repeat;
}

.selectron-placeholder {
    flex-grow: 1;
    padding-left: var(--selectron-placeholder-padding-left, 16px);
    padding-right: var(--selectron-placeholder-padding-right, 48px);
    font-weight: 500;
    line-height: calc(var(--selectron-select-height, 48px) - 2px);
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.selectron-arrow {
    position: absolute;
    top: calc(50% - 8px);
    right: var(--selectron-arrow-offset, 16px);
    width: 16px;
    aspect-ratio: 1;
    background-color: var(--black-40);
    mask: url(./assets/svg/icons/chevron-down.svg) center / contain no-repeat;

    transition-property: background-color, transform;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.selectron-select--active .selectron-arrow {
    background-color: var(--beige-100);
    transform: rotate3d(0,0,1,-180deg);
}

.selectron-backdrop {
    background-color: var(--black-10);
}

.selectron-dropdown {
    max-height: 200px;
    font-weight: 500;
    font-size: 14px;
    background-color: var(--white-100);
    overflow-x: hidden;
    overflow-y: auto;
}

.admin-bar .selectron-dropdown {
    margin-top: -32px;
}

.selectron-dropdown-item {
    padding: 14px 16px;
    background-color: var(--black-5);
    cursor: pointer;
    
    transition: background-color .3s ease;
}

.selectron-dropdown-item:not(:last-child) {
    margin-bottom: 1px;
}

.selectron-dropdown-item--selected {
    color: var(--beige-100);
}

.selectron-dropdown-item:hover {
    background-color: var(--black-10);
}

/* Selectron - Light */

.selectron-select--light {
    background-color: unset;
    border-color: var(--white-25);
}

.selectron-select--light:hover {
    background-color: var(--white-5);
}

.selectron-select--light .selectron-icon {
    border-color: var(--white-25);
}

.selectron-select--light.selectron-select--active .selectron-icon {
    border-color: var(--beige-100);
}

.selectron-select--light .selectron-icon::before {
    background-color: var(--white-60);
}

.selectron-select--light.selectron-select--active .selectron-icon::before {
    background-color: var(--beige-100);
}

.selectron-select--light .selectron-arrow {
    background-color: var(--white-60);
}

.selectron-select--light.selectron-select--active .selectron-arrow {
    background-color: var(--beige-100);
}

/* Selectron - White */

.selectron-select--white {
    color: var(--black-100);
    background-color: var(--white-100);
}

.selectron-select--white:hover {
    background-color: var(--light-beige-100);
}

/* Field */

.field__label {
    margin-bottom: 16px;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
}

.field__input-wrap {
    position: relative;
    background-color: var(--white-100);
}

.field__input {
    padding-left: 64px;
    background-color: var(--light-grey-100);
    border: 1px solid transparent;
}

.field__input:hover {
    background-color: var(--beige-10);
}

.field__input:focus {
    border-color: var(--beige-100);
}

.field__select {
    width: 100%;
}

.field__icon-wrap {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 1px;
    bottom: 1px;
    left: 1px;
    width: 47px;
    border-right: 1px solid var(--black-10);
    pointer-events: none;

    transition: border-color .3s ease;
}

.field__input:focus + .field__icon-wrap {
    border-color: var(--beige-100);
}

.field__icon {
    display: block;

    transition: fill .3s ease;
}

.field__input:focus + .field__icon-wrap > .field__icon {
    fill: var(--beige-100);
}

/* Field - Error */

.field--error .field__input {
    border-color: var(--red-100);
}

.field--error .field__icon-wrap,
.field--error .field__input:focus + .field__icon-wrap {
    border-color: var(--red-100);
}

/* Field - Phone */

.field--phone .field__country-codes-wrap {
    --selectron-select-height: 40px;
    --selectron-placeholder-padding-left: 8px;
    --selectron-placeholder-padding-right: 28px;
    --selectron-arrow-offset: 8px;

    position: absolute;
    top: 4px;
    left: 52px;
    height: 40px;
    color: var(--black-100);
    border: 0;
}

.field--phone .field__input {
    padding-left: 142px;
}

/* Field - Master */

.field--master {
    font-weight: 500;
    font-size: 12px;
}

.field--master .field__label {
    color: var(--black-75);
}

.field--master .field__input-wrap {
    display: flex;
    column-gap: 2px;
}

.field--master .field__radio {
    flex: 1 0 0;
}

.field--master .field__radio-input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0; 
}

.field--master .field__radio-title {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    padding: 0 20px;
    font-size: 10px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    background-color: var(--light-grey-100);
    cursor: pointer;

    transition-property: color, background-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.field--master .field__radio-title:hover {
    background-color: var(--light-beige-100);
}

.field--master .field__radio-input:checked + .field__radio-title {
    color: var(--white-100);
    background-color: var(--beige-100);
}

/* Field - Amount */

.field--amount .field__input-wrap {
    display: flex;
}

.field--amount .field__radio {
    flex: 1 0 0;
}

.field--amount .field__radio-input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0; 
}

.field--amount .field__radio-title {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    padding: 0 20px;
    color: var(--black-50);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    background-color: transparent;
    border: 1px solid var(--light-grey-100);
    cursor: pointer;

    transition-property: color, background-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.field--amount .field__radio-title:hover {
    border-color: var(--beige-100);
}

.field--amount .field__radio-input:checked + .field__radio-title {
    color: var(--black-100);
    background-color: var(--light-beige-100);
    border-color: var(--beige-100);
}

/* Field - Select */

.field--select .field__input-wrap {
    background-color: unset;
}

/* Field - File */

.field--file .field__drop-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
    color: var(--beige-100);
    font-weight: 700;
    font-size: 14px;
    border: 1px dashed var(--beige-100);
    cursor: pointer;
}

.field--file.field--error .field__drop-area {
    background-color: var(--red-5);
    border-color: var(--red-100);
}

.field--file.field--active .field__drop-area {
    display: none;
}

.field--file .field__drop-area--dragover {
    background-color: var(--beige-25);
}

.field--file .field__drop-area-icon {
    margin-bottom: 12px;
    pointer-events: none;
}

.field--file.field--error .field__drop-area-icon {
    fill: var(--red-100);
}

.field--file .field__drop-area-title {
    pointer-events: none;

    transition: color .3s ease;
}

.field--file:hover .field__drop-area-title {
    color: var(--dark-beige-100);
}

.field--file.field--error .field__drop-area-title {
    color: var(--red-100);
}

.field--file .field__input {
    position: absolute;
    width: 0;
    height: 0;
    border: 0;
    opacity: 0;
}

.field--file .field__file {
    position: relative;
    display: none;
    align-items: center;
    height: 48px;
    border: 1px solid var(--beige-100);
}

.field--file.field--active .field__file {
    display: flex;
}

.field--file .field__file-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 100%;
    width: 48px;
    border-right: 1px solid var(--beige-100);
}

.field--file .field__file-title {
    padding: 0 48px 0 16px;
    font-weight: 700;
    line-height: 48px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.field--file .field__file-remove {
    position: absolute;
    display: block;
    top: calc(50% - 8px);
    right: 16px;
    width: 16px;
    height: 16px;
    background-color: var(--black-50);
    mask: url(./assets/svg/icons/close.svg) center / contain no-repeat;
    -webkit-mask: url(./assets/svg/icons/close.svg) center / contain no-repeat;
}

/* Form */

.form {
    position: relative;
    overflow: hidden;
}

.form__content {
    display: flex;
    flex-direction: column;
    height: 100%;

    transition-property: transform, opacity;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94), ease;
}

.form__title {
    margin-bottom: 32px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.form__fields .field:not(:last-child) {
    margin-bottom: 1px;
}

.form__cart {
    overflow-y: auto;
}

.form__cart-controls {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 40px;
}

.form__cart-services {
    margin-bottom: 40px;
}

.form__submit {
    width: 100%;
    margin-top: 24px;
}

.form__thank-you {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    
    opacity: 0;
    transform: scale(1.1);
    pointer-events: none;

    transition-property: opacity, transform;
    transition-duration: .3s;
    transition-timing-function: ease, cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Form - Success */

.form--success .form__content {
    transform: scale(0.9);
}

.form--success .form__thank-you {
    opacity: 1;
    transform: scale(1);
    pointer-events: initial;
}

/* Form - Booking Widget */

.form--booking-widget {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.form--booking-widget .form__fields {
    padding: 0 16px;
}

.form--booking-widget .form__cart {
    margin: 40px 0;
    padding: 0 16px;
}

.form--booking-widget .form__submit {
    margin-top: auto;
}

/* Form - Booking CTA */

.form--booking-cta {
    overflow: unset;
}

.form--booking-cta .form__fields {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form--booking-cta.form--success .form__content {
    opacity: 0;
}

/* Form - Pricing */

.form--pricing .form__content {
    max-height: 600px;
    padding-top: 40px;
}

.form--pricing .form__fields {
    padding: 0 16px;
}

.form--pricing .form__cart {
    margin-top: 40px;
    padding: 0 16px 40px;
}

.form--pricing .form__submit {
    margin-top: unset;
}

.form--pricing .form__submit span {
    color: var(--white-80);
}

/* Form - Vacancy */

.form--vacancy {
    padding-top: 40px;
    color: var(--black-100);
}

.form--vacancy .form__fields {
    padding: 0 16px;
}

.form--vacancy .form__fields .field--file {
    margin-top: 40px;
}

/* Form - Gifts Modal */

.form--gifts-modal .form__content {
    padding: 32px;
}

.form--gifts-modal .form__title {
    margin-bottom: 40px;
    font-weight: 400;
    font-size: 32px;
    line-height: 1.2;
    text-align: unset;
}

.form--gifts-modal .form__fields .field--amount {
    margin-top: 40px;
}

.form--gifts-modal .form__fields {
    margin-bottom: auto;
}

/* Form - Gifts */

.form--gifts {
    overflow: unset;
}

/* Navigation */

.navigation .menu-item > a {
    transition-property: background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.navigation .sub-menu-wrap {
    display: none;
}

.navigation .menu > .menu-item > a {
    text-transform: uppercase;
}

/* Navigation - Header Primary */

.navigation--header-primary {
    font-weight: 500;
}

.navigation--header-primary .menu {
    display: flex;
}

.navigation--header-primary .menu > .menu-item > a {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    border: 1px solid transparent;

    transition-property: background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.navigation--header-primary .menu > .menu-item:not(.current-menu-item,.current-menu-ancestor):hover > a {
    background-color: var(--white-10);
    border-color: var(--white-25);
}

.navigation--header-primary .menu > .current-menu-item > a,
.navigation--header-primary .menu > .current-menu-ancestor > a {
    color: var(dar);
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

.header--fixed .navigation--header-primary .menu > .current-menu-item > a,
.header--fixed .navigation--header-primary .menu > .current-menu-ancestor > a,
.header--navigating .navigation--header-primary .menu > .current-menu-item > a,
.header--navigating .navigation--header-primary .menu > .current-menu-ancestor > a,
.header--white .navigation--header-primary .menu > .current-menu-item > a,
.header--white .navigation--header-primary .menu > .current-menu-ancestor > a {
    color: var(--dark-beige-100);
}

.navigation--header-primary .sub-menu .menu-item > a {
    background-color: var(--white-50);
}

.navigation--header-primary .sub-menu .menu-item:hover > a,
.navigation--header-primary .sub-menu .menu-item-expanded > a {
    background-color: var(--white-100);
}

.navigation--header-primary .sub-menu .current-menu-item > a,
.navigation--header-primary .sub-menu .current-menu-ancestor > a {
    color: var(--dark-beige-100);
    background-color: var(--beige-10) !important;
    border: 1px solid var(--beige-25);
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap {
    position: absolute;
    display: block;
    left: 0;
    right: 0;
    padding-top: 24px;
    color: var(--black-100);

    opacity: 0;
    pointer-events: none;

    transition: opacity .3s ease;
}

.navigation--header-primary .menu > .menu-item-expanded > .sub-menu-wrap {
    padding-bottom: 24px;

    opacity: 1;
    pointer-events: initial;

    transition-delay: .3s;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu {
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0,1fr));
    column-gap: 8px;
    font-size: 14px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > a {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 16px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > a > .menu-item-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-right: 12px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu .menu-item > .sub-menu-wrap {
    position: absolute;
    display: none;
    top: 100%;
    left: 0;
    width: 100%;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu .menu-item-expanded > .sub-menu-wrap {
    display: block;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item {
    position: relative;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap {
    padding-top: 16px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap > .sub-menu {
    font-size: 12px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap > .sub-menu .menu-item {
    position: relative;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap > .sub-menu .menu-item > a {
    display: block;
    padding: 16px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap > .sub-menu .menu-item:not(:last-child) > a {
    border-bottom: 1px solid var(--black-5);
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item > .sub-menu-wrap > .sub-menu > .menu-item > .sub-menu-wrap {
    position: absolute;
    top: 0;
    left: 100%;
    width: calc(100% + 8px);
    padding-left: 8px;
}

.navigation--header-primary .menu > .menu-item > .sub-menu-wrap > .container > .sub-menu > .menu-item:last-child > .sub-menu-wrap > .sub-menu > .menu-item > .sub-menu-wrap {
    right: 100%;
    left: unset;
}

/* Navigation - Offcanvas Primary */

.navigation--offcanvas-primary .menu {
    font-weight: 500;
    text-align: center;
}

.navigation--offcanvas-primary .menu-item-content {
    display: flex;
    align-items: center;
    width: 100%;
}

.navigation--offcanvas-primary .menu-item-sub-menu-toggler {
    display: flex;
    align-items: center;
    column-gap: 8px;
    margin-left: auto;
    padding: unset;
    color: var(--black-60);
    font-weight: 500;
    background-color: unset;
}

.navigation--offcanvas-primary .menu-item-sub-menu-toggler::after {
    content: "";
    display: block;
    width: 16px;
    aspect-ratio: 1;
    background-color: var(--black-20);
    mask-image: url(./assets/svg/icons/chevron-right.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/chevron-right.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.navigation--offcanvas-primary .menu-item-sub-menu {
    position: absolute;
    display: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.navigation--offcanvas-primary .menu-item-active > .menu-item-sub-menu {
    display: block;
}

.navigation--offcanvas-primary .sub-menu-wrap {
    display: block;
}

.navigation--offcanvas-primary .sub-menu-header {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    height: 56px;
    padding: 0 16px;
    background-color: var(--light-grey-100);
}

.navigation--offcanvas-primary .sub-menu-back {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    aspect-ratio: 1;
    padding: 0;
}

.navigation--offcanvas-primary .sub-menu-back::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--black-50);
    mask-image: url(./assets/svg/icons/chevron-left.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/chevron-left.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.navigation--offcanvas-primary .sub-menu-title {
    flex-grow: 1;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
}

.navigation--offcanvas-primary .sub-menu-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    aspect-ratio: 1;
    padding: 0;
}

.navigation--offcanvas-primary .sub-menu-close::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: var(--black-50);
    mask-image: url(./assets/svg/icons/close.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/close.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.navigation--offcanvas-primary .sub-menu {
    font-size: 14px;
    text-align: unset;
}

.navigation--offcanvas-primary .sub-menu .menu-item {
    display: flex;
    align-items: center;
    height: 48px;
    padding: 0 16px;
}

.navigation--offcanvas-primary .sub-menu .menu-item:not(:first-child) {
    border-top: 1px solid var(--black-5);
}

.navigation--offcanvas-primary .menu > .menu-item {
    padding: 18px 0;
}

.navigation--offcanvas-primary .menu > .menu-item:not(:first-child) {
    border-top: 1px solid var(--black-10);
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-content {
    justify-content: center;
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-content > a {
    text-transform: uppercase;
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-sub-menu {
    background-color: var(--black-10);
    overflow: hidden;
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-sub-menu .sub-menu-wrap {
    position: absolute;
    display: flex;
    flex-direction: column;
    background-color: var(--white-100);
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-sub-menu > .sub-menu-wrap {
    top: 208px;
    right: 16px;
    bottom: 64px;
    left: 16px;
    box-shadow: 0px 8px 25px 5px #1C1D311F;
    overflow: hidden;
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-sub-menu > .sub-menu-wrap .sub-menu {
    overflow: auto;
}

.navigation--offcanvas-primary .menu > .menu-item > .menu-item-sub-menu > .sub-menu-wrap .sub-menu-wrap {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/* Navigation - Offcanvas Secondary */

.navigation--offcanvas-secondary {
    font-weight: 500;
    font-size: 12px;
}

.navigation--offcanvas-secondary .menu > .menu-item {
    padding: 16px 0;
}

.navigation--offcanvas-secondary .menu > .menu-item:not(:first-child) {
    border-top: 1px solid var(--black-10);
}

.navigation--offcanvas-secondary .menu > .menu-item > a {
    text-transform: unset;
}

/* Navigation - Footer Primary */

.navigation--footer-primary {
    font-weight: 700;
}

.navigation--footer-primary .menu {
    display: flex;
    align-items: center;
    column-gap: 24px;
}

/* Navigation - Footer Secondary */

.navigation--footer-secondary {
    color: var(--white-50);
    font-size: 12px;
    line-height: 1.4;
}

.navigation--footer-secondary .menu {
    display: flex;
    flex-direction: column;
    row-gap: 24px;
}

/* Logo */

.logo {
    display: flex;
    align-items: center;
}

.logo__link,
.logo__image {
    display: block;
}

.logo__image {
    height: auto;
}

/* Logo - Header */

.logo--header .logo__image {
    fill: var(--white-100);
}

.header--fixed .logo--header .logo__image,
.header--navigating .logo--header .logo__image,
.header--white .logo--header .logo__image {
    fill: var(--black-100);
}

/* Language Switcher */

.language-switcher {
    position: relative;
    width: fit-content;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase;
}

.language-switcher__current {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: inherit;
    background-color: unset;
    border: 1px solid transparent;

    transition-property: color, background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.language-switcher__list {
    position: absolute;
    display: none;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    color: var(--black-100);
    background-color: var(--white-100);
    z-index: 10;
}

.language-switcher--active .language-switcher__list {
    display: block;
}

.language-switcher__item {
    width: 100%;
    height: 40px;
}

.language-switcher__item:not(:last-child) {
    border-bottom: 1px solid var(--light-grey-100);
}

.language-switcher__item-link {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.language-switcher__item-link:hover {
    background-color: var(--light-grey-100);
}

/* Language Switcher - Header */

.language-switcher--header .language-switcher__current {
    background-color: var(--white-10);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.language-switcher--header:hover .language-switcher__current {
    border-color: var(--white-25);
}

.language-switcher--header.language-switcher--active .language-switcher__current {
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

.header--navigating .language-switcher--header .language-switcher__current,
.header--fixed .language-switcher--header .language-switcher__current,
.header--white .language-switcher--header .language-switcher__current {
    background-color: transparent;
    border-color: var(--black-10);
}

.header--navigating .language-switcher--header:hover .language-switcher__current,
.header--fixed .language-switcher--header:hover .language-switcher__current,
.header--white .language-switcher--header:hover .language-switcher__current {
    background-color: var(--black-5);
    border-color: var(--black-5);
}

.header--navigating .language-switcher--header.language-switcher--active .language-switcher__current,
.header--fixed .language-switcher--header.language-switcher--active .language-switcher__current,
.header--white .language-switcher--header.language-switcher--active .language-switcher__current {
    color: var(--dark-beige-100);
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

/* Language Switcher - Mobile Header */

.language-switcher--mobile-header {
    position: unset;
}

.language-switcher--mobile-header .language-switcher__current {
    background-color: var(--white-10);
    border: 1px solid transparent;
    /* border-radius: 1em; */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.language-switcher--mobile-header .language-switcher__list {
    right: 16px;
    left: 16px;
    width: unset;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: unset;
    text-transform: none;
    box-shadow: 0px 8px 25px 5px #1C1D311F;
}

.language-switcher--mobile-header .language-switcher__item {
    height: 50px;
}

.language-switcher--mobile-header .language-switcher__item:not(:last-child) {
    border-bottom: 1px solid var(--light-grey-100);
}

.language-switcher--mobile-header .language-switcher__item-link {
    justify-content: unset;
    padding: 0 16px;
}

.header--navigating .language-switcher--mobile-header .language-switcher__current,
.header--fixed .language-switcher--mobile-header .language-switcher__current,
.header--white .language-switcher--mobile-header .language-switcher__current {
    background-color: transparent;
    border-color: var(--black-10);
}

/* Language Switcher - Footer */

.language-switcher--footer .language-switcher__current {
    background-color: var(--white-10);
}

.language-switcher--footer:hover .language-switcher__current {
    border-color: var(--white-25);
}

.language-switcher--footer.language-switcher--active .language-switcher__current {
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

/* Language List */

.language-list {
    display: flex;
    gap: 1px;
}

.language-list__item-link {
    display: block;
    height: 40px;
    padding: 0 16px;
    font-weight: 500;
    font-size: 10px;
    line-height: 40px;
    text-align: center;
    text-transform: uppercase;
    background-color: var(--white-50);
}

.language-list__item-link:not([href]) {
    background-color: var(--white-100);
}

/* Salon Actions */

.salon-actions {
    position: relative;
    display: flex;
    gap: 8px;
}

/* Salon Switcher */

.salon-switcher {
    width: 100%;
}

.salon-switcher__current {
    display: flex;
    align-items: center;
    column-gap: 8px;
    width: 100%;
    height: 40px;
    padding: 0 16px;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: left;
    background-color: unset;
    border: 1px solid transparent;

    transition-property: color, background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.salon-switcher__current-icon {
    flex-shrink: 0;

    transition: fill .3s ease;
}

.salon-switcher__current-label {
    flex-grow: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.salon-switcher__dropdown {
    position: absolute;
    display: none;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    max-height: 450px;
    color: var(--black-100);
    overflow: hidden auto;
    z-index: 10;
}

.salon-switcher--active .salon-switcher__dropdown {
    display: block;
}

.salon-switcher__locations {
    transition: transform .3s ease-in-out;
}

.salon-switcher__location-button {
    display: flex;
    align-items: center;
    column-gap: 8px;
    width: 100%;
    height: 50px;
    padding: 0 16px;
    font-weight: 500;
    background-color: var(--white-100);
}

.salon-switcher__location--current .salon-switcher__location-button {
    color: var(--beige-100);
}

.salon-switcher__location-button:hover {
    background-color: var(--light-grey-100);
}

.salon-switcher__location:not(:last-child) .salon-switcher__location-button {
    border-bottom: 1px solid var(--light-grey-100);
}

.salon-switcher__location-salons-menu {
    position: absolute;
    display: none;
    top: 0;
    left: 100%;
    width: 100%;
}

.salon-switcher__location--active .salon-switcher__location-salons-menu {
    display: block;
}

.salon-switcher__location-salons-back {
    display: flex;
    align-items: center;
    width: 100%;
    height: 56px;
    padding: 0 16px;
    font-weight: 500;
    font-size: 18px;
    background-color: var(--light-grey-100);
}

.salon-switcher__location-salons-back-icon {
    stroke: var(--black-50);
}

.salon-switcher__location-salons-back-title {
    margin: 0 auto;
}

.salon-switcher__location-salon {
    background-color: var(--white-100);
}

.salon-switcher__location-salon:not(:last-child) {   
    border-bottom: 1px solid var(--light-grey-100);
}

.salon-switcher__location-salon--current {
    color: var(--beige-100);
}

.salon-switcher__location-salon-link {
    display: flex;
    align-items: center;
    height: 50px;
    padding: 0 16px;
    font-weight: 500;
}

.salon-switcher__location-salon-link:hover {
    background-color: var(--light-grey-100);
}

/* Salon Switcher - Header */

.salon-switcher--header {
    max-width: 170px;
}

.salon-switcher--header .salon-switcher__current {
    background-color: var(--white-10);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.salon-switcher--header:hover .salon-switcher__current {
    border-color: var(--white-25);
}

.salon-switcher--header.salon-switcher--active .salon-switcher__current {
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

.header--navigating .salon-switcher--header .salon-switcher__current,
.header--fixed .salon-switcher--header .salon-switcher__current,
.header--white .salon-switcher--header .salon-switcher__current {
    background-color: transparent;
    border-color: var(--black-10);
}

.header--navigating .salon-switcher--header:hover .salon-switcher__current,
.header--fixed .salon-switcher--header:hover .salon-switcher__current,
.header--white .salon-switcher--header:hover .salon-switcher__current {
    background-color: var(--black-5);
    border-color: var(--black-5);
}

.header--navigating .salon-switcher--header.salon-switcher--active .salon-switcher__current,
.header--fixed .salon-switcher--header.salon-switcher--active .salon-switcher__current,
.header--white .salon-switcher--header.salon-switcher--active .salon-switcher__current {
    color: var(--dark-beige-100);
    background-color: var(--beige-25);
    border-color: var(--beige-25);
}

.header--navigating .salon-switcher--header .salon-switcher__current-icon,
.header--fixed .salon-switcher--header .salon-switcher__current-icon,
.header--white .salon-switcher--header .salon-switcher__current-icon {
    fill: var(--black-100);
}

.header--navigating .salon-switcher--header.salon-switcher--active .salon-switcher__current-icon,
.header--fixed .salon-switcher--header.salon-switcher--active .salon-switcher__current-icon,
.header--white .salon-switcher--header.salon-switcher--active .salon-switcher__current-icon {
    fill: var(--dark-beige-100);
}

/* Salon Switcher - Footer */

.salon-switcher--footer {
    max-width: 170px;
}

.salon-switcher--footer .salon-switcher__current {
    background-color: var(--white-10);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.salon-switcher--footer:hover .salon-switcher__current {
    border-color: var(--white-25);
}

.salon-switcher--footer.salon-switcher--active .salon-switcher__current {
    background-color: var(--beige-10);
    border-color: var(--beige-25);
}

.salon-switcher--footer .salon-switcher__dropdown {
    max-height: 300px;
}

/* Salon Switcher - Client Bar */

.salon-switcher--client-bar {
    position: unset;
    max-width: 200px;
}

.salon-switcher--client-bar .salon-switcher__current {
    background-color: var(--white-100);
}

.salon-switcher--client-bar .salon-switcher__current-icon {
    display: none;
}

.salon-switcher--client-bar .salon-switcher__dropdown {
    top: unset;
    bottom: 100%;
}

/* Salon Switcher - Offcanvas */

.salon-switcher--offcanvas {
    flex-grow: 1;
}

.salon-switcher--offcanvas .salon-switcher__current {
    column-gap: 12px;
    width: 100%;
    max-width: unset;
    height: 56px;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: unset;
    text-transform: unset;
    border: 1px solid var(--beige-100);
}

.salon-switcher--offcanvas .salon-switcher__current-icon {
    fill: var(--beige-100);
}

.salon-switcher--offcanvas .salon-switcher__current-label {
    max-width: unset;
}

.salon-switcher--offcanvas .salon-switcher__dropdown {
    top: unset;
    right: 16px;
    bottom: calc(100% + 8px);
    left: 16px;
    width: unset;
    box-shadow: 0px 8px 25px 5px #1C1D311F;
}

.salon-switcher--offcanvas .salon-switcher__location-salons-menu {
    top: unset;
    bottom: 0;
}

/* Phone */

.phone {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 8px;
    height: 40px;
    padding: 0 20px;
    font-weight: 700;
    font-size: 12px;
    line-height: 40px;
    letter-spacing: 0.05em;
    white-space: nowrap;
    background-color: var(--white-10);
    border: 1px solid transparent;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    transition-property: color, background-color, border-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.phone:hover {
    border-color: var(--white-25);
}

.phone__icon {
    flex-shrink: 0;
    fill: var(--white-100);
    transition: fill .3s ease-in-out;
}

/* Phone - Header */

.header--fixed .phone--header,
.header--navigating .phone--header,
.header--white .phone--header {
    background-color: transparent;
    border-color: var(--black-10);
}

.header--fixed .phone--header:hover,
.header--navigating .phone--header:hover,
.header--white .phone--header:hover {
    background-color: var(--black-5);
    border-color: var(--black-5);
}

.header--fixed .phone--header .phone__icon,
.header--navigating .phone--header .phone__icon,
.header--white .phone--header .phone__icon {
    fill: var(--black-100);
}

/* Phone - Mobile Header */

.phone--mobile-header {
    /* border-radius: 1em; */
}

.header--fixed .phone--mobile-header,
.header--navigating .phone--mobile-header,
.header--white .phone--mobile-header {
    background-color: var(--black-5);
}

.header--fixed .phone--mobile-header .phone__icon,
.header--navigating .phone--mobile-header .phone__icon,
.header--white .phone--mobile-header .phone__icon {
    fill: var(--black-100);
}

/* Burger */

.burger {
    position: relative;
    width: 40px;
    aspect-ratio: 1;
    background-color: var(--white-100);
    /* border-radius: 16px; */
}

.header--fixed .burger {
    background-color: var(--black-5);
}

.burger__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.burger__icon div {
    position: absolute;
    width: 18px;
    height: 2px;
    background-color: var(--black-100);

    transition-property: background-color, transform;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.burger__icon div:nth-child(1) {
    transform: translate3d(0,-4px,0);
}

.burger__icon div:nth-child(2) {
    transform: translate3d(0,4px,0);
}

.burger--active .burger__icon div {
    background-color: var(--dark-grey-100);
}

.burger--active .burger__icon div:nth-child(1) {
    transform: translate3d(0,0,0) rotate3d(0,0,1,45deg);
}

.burger--active .burger__icon div:nth-child(2) {
    transform: translate3d(0,0,0) rotate3d(0,0,1,-45deg);
}

.header--fixed .burger,
.header--navigating .burger,
.header--white .burger {
    background-color: var(--black-5);
}

/* Close */

.close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: var(--light-grey-100);
}

.close__icon {
    fill: var(--dark-grey-100);
    pointer-events: none;
}

/* Client Bar */

.client-bar {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--white-80);
    backdrop-filter: blur(40px);
    -webkit-backdrop-filter: blur(40px);
    transform-origin: top center;
    transform: translate3d(0,100%,0) scale(1.1);
    z-index: 10001;

    transition: transform .3s ease-in-out;
}

.client-bar--active {
    transform: translate3d(0,0,0);
}

.client-bar__widgets {
    display: flex;
    font-weight: 500;
}

.client-bar__widget {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 0;
    padding: 16px;
}

.client-bar__widget:not(:last-child) {
    border-right: 1px solid var(--black-10);
}

.client-bar__widget-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    aspect-ratio: 1;
    margin-right: 12px;
    background-color: var(--white-100);
    border-radius: 50%;
}

.client-bar__widget-icon {
    fill: var(--beige-100);
}

.client-bar__widget-title {
    font-size: 14px;
}

.client-bar__widget-content {
    margin-left: auto;
}

.client-bar__save {
    width: 100%;
}

/* Backdrop */

.backdrop {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--black-20);
}

/* Title */

.title {
    margin-bottom: 32px;
    font-size: 24px;
}

.title__suptitle {
    margin-bottom: 16px;
    color: var(--black-50);
    font-family: var(--secondary-font), sans-serif;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.title__heading {
    font-family: var(--secondary-font), sans-serif;
    font-weight: 500;
    font-size: inherit;
    text-transform: uppercase;
}

.title__heading span {
    color: var(--beige-100);
}

.title__subtitle {
    margin-top: 16px;
    font-weight: 500;
}

/* Title - Center */

.title--center {
    text-align: center;
}

/* Title - Hero */

.title--hero {
    margin-bottom: unset;
    text-transform: uppercase;
}

.title--hero .title__heading {
    font-family: var(--secondary-font), sans-serif;
    font-weight: 400;
    font-size: inherit;
}

/* Title - Alt */

.title--alt {
    font-size: 18px;
}

.title--alt .title__heading {
    text-transform: unset;
}

/* Title - CTA */

.title--cta {
    margin-bottom: auto;
}

.title--cta .title__heading {
    font-weight: 400;
    font-size: 48px;
    line-height: 1;
}

/* Title - About */

.title--about .title__heading span {
    color: unset;
}

/* Title - Welcome */

.title--welcome {
    margin-bottom: unset;
}

.title--welcome .title__heading {
    font-weight: 400;
    font-size: 48px;
    line-height: 1;
}

/* Title - Gifts */

.title--gifts .title__suptitle {
    margin-bottom: 12px;
    color: var(--beige-100);
    font-size: 12px;
}

.title--gifts .title__heading {
    text-transform: unset;
}

/* Title - Thank You */

.title--thank-you .title__subtitle {
    color: var(--black-80);
    font-size: 14px;
}

/* Title - 404 */

.title--404 {
    color: var(--white-100);
    font-size: 54px;
    line-height: 1;
    text-transform: uppercase;
}

.title--404 .title__heading {
    font-weight: 400;
}

/* Breadcrumbs */

.breadcrumbs {
    color: var(--white-70);
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
}

.breadcrumbs .breadcrumb_last {
    color: var(--white-100);
}

/* Socials */

.socials {
    display: flex;
    align-items: center;
    gap: 8px;
}

.socials__item {
    width: 40px;
    height: 40px;
}

.socials__item-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background-color: var(--white-10);

    transition: background-color .3s ease;
}

.socials__item-link:hover {
    background-color: var(--white-20);
}

/* Contacts */

.contacts {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}

.contacts__item {
    width: calc(50% - 16px);
}

.contacts__item-label {
    margin-bottom: 8px;
    font-family: var(--secondary-font), sans-serif;
    color: var(--white-50);
    font-size: 12px;
    line-height: 1;
}

/* Footer Logo */

.footer-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.footer-logo__spinner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    margin-bottom: 32px;
}

.footer-logo__spinner-text {
    position: absolute;
    fill: var(--beige-100);
    font-size: 8px;

    animation: anim_spinning 10s linear infinite;
}

/* Copyright */

.copyright {
    color: var(--white-50);
}

/* Scroll To Top */

.scroll-to-top {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
}

/* Designed */

.designed {
    color: var(--white-50);
}

.designed a {
    color: var(--white-100);
}

/* Hero */

.hero {
    position: relative;
    display: flex;
    align-items: stretch;
    min-height: 380px;
    padding-top: 64px;
    padding-bottom: 40px;
    color: var(--white-100);
    background-image: linear-gradient(120.54deg, #323035 26.86%, #191620 71.39%);
}

.hero__container {
    position: relative;
    z-index: 2;
}

.hero__content {
    display: flex;
    column-gap: 64px;
    row-gap: 32px;
    height: 100%;
    padding-top: 16px;
    border-top: 1px solid var(--white-10);
}

.hero__left,
.hero__right {
    display: flex;
    flex-direction: column;
}

.hero__left {
    flex-grow: 1;
}

.hero__right {
    flex-shrink: 0;
    width: 392px;
}

.hero__toolbar {
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin-bottom: auto;
    padding-bottom: 32px;
}

.hero__back {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    aspect-ratio: 1;
    background-color: var(--black-10);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);

    transition: background-color .3s ease;
}

.hero__back:hover {
    background-color: var(--black-50);
}

.hero__tag {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    padding: 0 24px;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background-color: var(--beige-100);
}

.hero__breadcrumbs {
    margin-top: auto;
}

.hero__title {
    font-size: 54px;
}

.hero__title span {
    color: var(--white-50);
}

.hero__breadcrumbs {
    margin-bottom: 24px;
}

.hero__widget {
    margin-top: auto;
    padding-top: 32px;
}

.hero__form {
    background-color: var(--white-100);
}

.hero__description {
    margin-bottom: 32px;
}

.hero__actions {
    margin-top: auto;
}

.hero__logo {
    position: absolute;
    display: block;
    top: -80px;
    left: 16px;
    bottom: -40px;
    aspect-ratio: 1;
    background: url(./assets/svg/footer/background.svg) center/contain no-repeat;
    transform: scale(1.1);
    pointer-events: none;
}

.hero__background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

.hero__background::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(120.54deg, rgba(50, 48, 53, 0.5) 26.86%, rgba(25, 22, 32, 0.5) 71.39%);
    z-index: 1;
}

.hero__background-image {
    display: block;
    width: 100%;
    height: 100%;
    transform: scale(1.1);
}

/* Hero - Archive */

.hero--archive {
    min-height: unset;
}

/* Hero - Single */

.hero--single .hero__title {
    font-size: 40px;
    line-height: 1.2;
}

/* Hero - Page */

.hero--page {
    min-height: unset;
}

/* Hero - Vacancy */

.hero--vacancy {
    min-height: unset;
}

/* Hero - Pricing */

.hero--pricing .hero__widget {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 24px;
}

/* Hero Actions */

.hero-actions__buttons {
    display: flex;
    align-items: center;
}

.hero-actions__button {
    flex: 1 1 0;
}

.hero-actions__description {
    margin-top: 16px;
    font-size: 12px;
    text-align: center;
}

/* Hero Actions - Salon */

.hero-actions--salon .hero-actions__description {
    display: none;
}

/* Archive Layout */

.archive-layout__section:not(:last-child) {
    margin-bottom: 120px;
}

.archive-layout__section-header {
    margin-bottom: 40px;
}

.archive-layout__section-title {
    padding-left: 200px;
    color: var(--beige-100);
    font-size: 40px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.archive-layout__section-body {
    display: flex;
}

.archive-layout__section-left {
    position: relative;
    flex-shrink: 0;
    width: 200px;
}

.archive-layout__section-right {
    flex-grow: 1;
}

.archive-layout__section-terms {
    position: sticky;
    top: 100px;
}

.archive-layout__section-term:not(:last-child) {
    margin-bottom: 16px;
}

.archive-layout__section-term-link {
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.archive-layout__section-term-link--active {
    color: var(--beige-100);
}

.archive-layout__section-group:not(:last-child) {
    margin-bottom: 64px;
    padding-bottom: 64px;
    border-bottom: 2px solid var(--black-10);
}

.archive-layout__section-group-title {
    display: none;
    margin-bottom: 24px;
    font-weight: 700;
    text-align: center;
}

/* Load More */

.load-more {
    width: 100%;
    margin-top: 32px;
}

.load-more span {
    color: var(--beige-100);
}

/* Tranding Posts */

.tranding-posts__title {
    margin-bottom: 32px;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Post Date */

.post-date {
    color: var(--white-80);
    font-weight: 500;
}

.post-date span {
    color: var(--white-100);
}

/* Post Header */

.post-header {
    display: flex;
    row-gap: 24px;
}

.post-header__author {
    display: flex;
    align-items: center;
    column-gap: 16px;
    flex-shrink: 0;
    width: 240px;
    font-weight: 500;
}

.post-header__author-image {
    border-radius: 50%;
}

.post-header__author-role {
    color: var(--black-50);
    font-size: 14px;
}

.post-header__excerpt {
    flex-grow: 1;
    font-weight: 500;
    font-size: 18px;
}

/* Post Layout */

.post-layout {
    position: relative;
    display: flex;
    align-items: flex-start;
    column-gap: 64px;
}

.post-layout__sidebar {
    position: sticky;
    flex-shrink: 0;
    top: 100px;
    width: 240px;
}

.post-layout__content {
    flex-grow: 1;
}

/* Table of Contents */

.table-of-contents {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.table-of-contents__item:not(:last-child) {
    margin-bottom: 16px;
}

.table-of-contents__item--active {
    color: var(--beige-100);
}

/* Page Layout */

.page-layout {
    display: flex;
    column-gap: 64px;
}

.page-layout__content {
    flex-grow: 1;
}

.page-layout__sidebar {
    position: relative;
    flex-shrink: 0;
    width: 392px;
    z-index: 1;
}

.page-layout__form {
    position: sticky;
    top: 100px;
    background-color: var(--white-100);
    border: 1px solid var(--light-grey-100);
}

.page-layout__sidebar-widget:not(:last-child) {
    margin-bottom: 64px;
}

/* Page Layout - Overlapping */

.page-layout--overlapping .page-layout__sidebar {
    margin-top: -380px;
}

/* Service Layout */

.service-layout {
    position: relative;
    display: flex;
    align-items: flex-start;
    column-gap: 64px;
}

.service-layout__image {
    position: sticky;
    flex-grow: 1;
    top: 100px;
    width: 100%;
    max-width: 400px;
}

.service-layout__content {
    flex-grow: 1;
}

.service-layout__title {
    margin-bottom: 32px;
    font-weight: 500;
    font-size: 24px;
    text-transform: uppercase;
}

/* Categories */

.categories {
    position: relative;
    height: 40px;
    margin-bottom: 32px;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
}

.categories__list {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
}

.categories__list-item-link {
    display: block;
    align-items: center;
    height: 40px;
    padding: 0 20px;
    line-height: 40px;
    background-color: var(--light-grey-100);
    white-space: nowrap;

    transition: background-color .3s ease;
}

.categories__list-item-link:hover {
    background-color: var(--light-beige-100);
}

.categories__list-item-link:not([href]) {
    color: var(--white-100);
    background-color: var(--beige-100);
}

.categories__expand {
    position: absolute;
    display: flex;
    align-items: center;
    height: 40px;
    top: 0;
    right: 0;
    padding: 0 12px;
    color: var(--dark-beige-100);
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-align: center;
    background-color: var(--light-beige-100);
}

.categories--expanded .categories__expand {
    display: none;
}

.categories__expand::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 100%;
    width: 110px;
    height: 100%;
    background: linear-gradient(to right, #FFFFFF00, var(--white-100));
}

.categories__expand::after {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    margin-left: 4px;
    background-color: var(--dark-beige-100);
    mask: url(./assets/svg/icons/chevron-right.svg) center / contain no-repeat;
    -webkit-mask: url(./assets/svg/icons/chevron-right.svg) center / contain no-repeat;
}

/* Countries */

.countries {
    display: flex;
    font-weight: 500;
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.countries__item {
    margin-right: -1px;
}

.countries__item-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 160px;
    height: 48px;
    padding: 1px 16px 0;
    border: 1px solid var(--white-10);

    transition: background-color .3s ease;
}

.countries__item-link:hover {
    background-color: var(--white-10);
}

.countries__item-link:not([href]) {
    background-color: var(--beige-100);
    cursor: default;
}

.countries__item-flag {
    margin-right: 12px;
}

/* Card */

.card {
    position: relative;
    cursor: pointer;
}

.card__link {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.card__image-wrap {
    overflow: hidden;
}

.card__image {
    display: block;
    width: 100%;

    transition: transform .3s ease;
}

.card:hover .card__image {
    transform: scale(1.1);
}

.card__content {
    margin-top: 16px;
}

.card__suptitle {
    margin-bottom: 4px;
    font-family: var(--secondary-font);
    color: var(--beige-100);
    font-weight: 700;
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.card__title {
    font-weight: 500;
    font-size: 14px;
}

.card__arrow {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 16px;
    bottom: 16px;
    width: 48px;
    height: 48px;
    background-color: var(--black-30);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    pointer-events: none;

    transition: background-color .3s ease;
}

.card:hover .card__arrow {
    background-color: var(--beige-100);
}

.card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    height: 40px;
    padding: 0 16px;
    color: var(--white-100);
    font-weight: 700;
    font-size: 12px;
    line-height: 40px;
    letter-spacing: 0.05em;
    background-color: var(--beige-100);
}

/* Card - Pricing Category */

.card--pricing-category {
    color: var(--white-100);
}

.card--pricing-category .card__content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin-top: unset;
    padding: 16px;
    background-image: linear-gradient(to bottom, var(--black-70), #00000000 65%);
}

.card--pricing-category .card__title {
    font-size: 16px;
}

.card--pricing-category .card__arrow {
    left: 16px;
    right: unset;
    width: unset;
    height: unset;
    background-color: unset;
    backdrop-filter: unset;
    opacity: .7;
}

.card--pricing-category:hover .card__arrow {
    background-color: unset;
}

/* Card - Salon */

.card--salon .card__suptitle {
    font-size: 10px;
}

/* Card - Vacancy Large */

.card--vacancy-lg {
    display: grid;
    grid-template-columns: minmax(0,2fr) minmax(0,1fr);
    background-color: var(--light-grey-100);
    border: 1px solid transparent;

    transition: border-color .3s ease;
}

.card--vacancy-lg:hover {
    border-color: var(--beige-100);
}

.card--vacancy-lg .card__image {
    height: 100%;
}

.card--vacancy-lg .card__content {
    margin-top: unset;
    padding: 32px;
}

.card--vacancy-lg .card__suptitle {
    margin-bottom: 16px;
}

.card--vacancy-lg .card__title {
    font-weight: 700;
    font-size: 24px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.card--vacancy-lg .card__excerpt {
    margin-top: 24px;
    color: var(--black-80);
    font-weight: 500;
    font-size: 14px;
}

/* Card - Gift */

.card--gift {
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.card--gift .card__title {
    font-weight: inherit;
}

.card--gift .card__title span {
    color: var(--black-30);
}

.card--gift .card__subtitle {
    margin-top: 8px;
    font-size: 12px;
}

.card--gift .card__subtitle span {
    color: var(--black-50);
}

/* Icon Box */

.icon-box__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 16px;
    border-radius: 50%;
    background-color: var(--beige-10);
}

.icon-box__icon {
    transition: transform .3s ease;
}

.icon-box__title {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.icon-box__description {
    color: var(--black-75);
    font-size: 14px;
    transition: color .3s ease;
}

.icon-box:hover .icon-box__description  {
    color: var(--black-100);
}

/* Icon Box - Boxed */

.icon-box--boxed {
    padding: 16px;
    background-color: var(--white-100);
    border: 1px solid var(--beige-100);
}

/* Quote */

.quote {
    position: relative;
    margin: 0;
    padding: 32px;
    overflow: hidden;
}

.quote::before {
    position: absolute;
    content: "";
    display: block;
    top: 24px;
    right: 24px;
    width: 128px;
    height: 112px;
    background-color: var(--black-5);
    mask: url(./assets/svg/quote.svg) center / contain no-repeat;
}

.quote__author {
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin-top: 32px;
    font-weight: 500;
}

.quote__author-name {
    font-size: 18px;
}

.quote__author-role {
    color: var(--white-70);
    font-size: 14px;
}

/* Cart Preview */

.cart-preview {
    position: fixed;
    display: none;
    align-items: center;
    gap: 2px;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: var(--white-100);
    z-index: 100;

    transform: translate3d(0,100%,0);

    transition: transform .3s ease-in-out;
}

.cart-preview--active {
    transform: translate3d(0,0,0);
}

.cart-preview__count {
    width: 40px;
    height: 40px;
    margin-left: 8px;
    font-weight: 500;
    font-size: 14px;
    line-height: 40px;
    text-align: center;
    background-color: var(--light-grey-100);
}

.cart-preview__total {
    height: 40px;
    padding: 0 20px;
    font-weight: 500;
    font-size: 18px;
    line-height: 40px;
    text-align: center;
    background-color: var(--light-grey-100);
}

.cart-preview__action {
    width: 120px;
    margin-left: auto;
}

/* Cart Empty */

.cart-empty {
    display: flex;
    align-items: center;
    width: 100%;
    border: 1px solid var(--white-20);
}

.cart-empty__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-empty__subtitle {
    margin-top: 12px;
    color: var(--black-50);
    font-weight: 500;
    font-size: 12px;
}

.cart-empty__action {
    margin-top: 40px;
}

.cart-empty__icon-wrap {
    width: 48px;
    height: 56px;
    border-right: 1px solid var(--white-20);
}

.cart-empty__content {
    flex-grow: 1;
    padding: 0 16px;
}

.cart-empty__title {
    font-size: 14px;
}

.cart-empty__add-services {
    width: 50%;
}

/* Cart Empty - Booking CTA */

.cart-empty--booking-cta .cart-empty__icon {
    fill: var(--white-100);
}

/* Cart Empty - Booking Widget */

.cart-empty--booking-widget {
    margin-bottom: 40px;
    border-color: var(--black-20);
}

.cart-empty--booking-widget .cart-empty__icon-wrap {
    border-color: var(--black-20);
}

/* Salon Map */

.salon-map__description {
    display: none;
    margin-bottom: 40px;
    color: var(--black-80);
    font-weight: 500;
    font-size: 14px;
}

.salon-map__map {
    height: 380px;
}

.salon-map__links {
    display: flex;
    align-items: center;
}

.salon-map__link {
    flex: 1 0 0;
}

/* Working Hours */

.working-hours {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    font-weight: 500;
}

.working-hours__title {
    font-size: 24px;
    line-height: 1.15;
}

.working-hours__content {
    color: var(--black-80);
}

.working-hours__content span {
    display: block;
    color: var(--black-100);
}

/* Working Hours - Map Salon */

.working-hours--map-salon {
    display: block;
}

/* Salon Links - Map */

.salon-links--map .salon-links__item-link svg {
    width: 17px;
    height: auto;
}

/* Pricing Categories */

.pricing-categories__list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

/* Pricing */

.pricing__container {
    display: flex;
    column-gap: 64px;
    padding-top: 80px;
    padding-bottom: 120px;
}

.pricing__content {
    flex-grow: 1;
}

.pricing__controls {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 20px;
}

.pricing__control {
    flex: 1 0 0;
}

.pricing__sidebar {
    flex-shrink: 0;
    width: 392px;
    margin-top: -380px;
    z-index: 2;
}

.pricing__form {
    position: sticky;
    top: 100px;
    background-color: var(--white-100);
    border: 1px solid var(--light-grey-100);
}

/* Pricing Widget */

.pricing-widget {
    position: fixed;
    display: flex;
    justify-content: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-top: 56px;
    z-index: 1001;
    
    opacity: 0;
    pointer-events: none;

    transition: opacity .3s ease;
}

.admin-bar .pricing-widget {
    padding-top: 88px;
}

.pricing-widget__inner {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 1040px;
    background-color: var(--white-100);
    box-shadow: 0px 8px 25px 5px rgba(28, 29, 49, 0.12);
    overflow: auto;
    z-index: 1;

    transform-origin: bottom center;
    transform: scale(.9);

    transition: transform .3s ease-in-out;
}

.pricing-widget__close {
    position: absolute;
    top: 0;
    right: 0;
}

.pricing-widget__content {
    padding: 24px;
}

.pricing-widget__title {
    margin-bottom: 24px;
    font-weight: 500;
}

.pricing-widget__controls {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 24px 16px;
    margin-bottom: 32px;
}

.pricing-widget__control {
    flex-grow: 1;
    min-width: calc(50% - 8px);
}

.pricing-widget__control--expert {
    width: 100%;
}

/* Pricing Widget - Active */

.pricing-widget--active {
    opacity: 1;
    pointer-events: initial;
}

.pricing-widget--active .pricing-widget__inner {
    transform: scale(1);
}

/* Pricing Section */

.pricing-section {
    display: flex;
    column-gap: 64px;
}

.pricing-section__left {
    position: relative;
    flex-shrink: 0;
    flex-grow: 1;
    width: 100%;
    max-width: 400px;
}

.pricing-section__gallery {
    position: sticky;
    top: 100px;
}

.pricing-section__right {
    flex-grow: 1;
}

.pricing-section__title {
    margin-bottom: 20px;
    font-weight: 500;
    font-size: 24px;
    text-transform: uppercase;
}

.pricing-section__description {
    margin-bottom: 48px;
    color: var(--black-80);
    font-weight: 500;
    font-size: 14px;
}

.pricing-section__controls {
    display: flex;
    gap: 32px 16px;
    margin-bottom: 32px;
}

.pricing-section__control {
    flex-grow: 1;
    min-width: calc(50% - 8px);
}

/* Pricing Search */

.pricing-search__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 80px 0;
    text-align: center;
    background-color: var(--beige-10);
}

.pricing-search__placeholder--not-found {
    background-color: var(--red-10);
}

.pricing-search__placeholder-icon {
    fill: var(--beige-100);
    margin-bottom: 16px;
}

.pricing-search__placeholder--not-found .pricing-search__placeholder-icon {
    fill: var(--red-100);
}

.pricing-search__placeholder-title {
    max-width: 220px;
    font-weight: 500;
    font-size: 14px;
}

/* Pricing Category */

.pricing-category:not(:last-child) {
    margin-bottom: 24px;
}

.pricing-category__title {
    margin-bottom: 14px;
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Pricing Service */

.pricing-service {
    font-size: 14px;
    background-color: var(--black-5);

    transition: background-color .3s ease;
}

.pricing-service:not(:last-child) {
    margin-bottom: 1px;
}

.pricing-service:hover:not(.pricing-service--added) {
    background-color: var(--beige-10);
}

.pricing-service__header {
    display: flex;
    align-items: center;
    padding: 8px 8px 8px 16px;
    font-weight: 500;
}

.pricing-service__expand {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    background-color: unset;
}

.pricing-service__expand-icon {
    fill: var(--black-40);
    transition: transform .3s ease;
}

.pricing-service--expanded .pricing-service__expand-icon {
    transform: rotateZ(180deg);
}

.pricing-service__title {
    flex-grow: 1;
    padding-right: 8px;
}

.pricing-service__action {
    display: flex;
    align-items: stretch;
}

.pricing-service__discount {
    display: flex;
    align-items: center;
    margin-right: 1px;
    padding: 0 8px;
    color: var(--white-100);
    font-size: 12px;
    white-space: nowrap;
    background-color: var(--beige-100);

    transition-property: color, background-color;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.pricing-service__price-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 80px;
    height: 40px;
    margin-right: 1px;
    padding: 0 16px;
    background-color: var(--white-100);

    transition: background-color .3s ease;
}

.pricing-service__price {
    color: var(--black-100);
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;

    transition: color .3s ease;
}

.pricing-service__price .currency {
    color: var(--black-25);
}

.pricing-service__price--old {
    font-size: 10px;
    text-decoration: line-through;

    opacity: .4;
}

.pricing-service__action-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    background-color: var(--white-100);
    overflow: hidden;

    transition: background-color .3s ease;
}

.pricing-service__action--add .pricing-service__action-icon::before {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    background-color: var(--beige-100);
    mask-image: url(./assets/svg/icons/plus.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/plus.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;

    transition: transform .3s ease;
}

.pricing-service__action--add .pricing-service__action-icon::after {
    content: "";
    position: absolute;
    display: block;
    width: 14px;
    height: 12px;
    background-color: var(--white-100);
    mask-image: url(./assets/svg/icons/checkmark.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/checkmark.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;

    transform: translate3d(32px, 0, 0);

    transition: transform .3s ease;
}

.pricing-service__action--remove .pricing-service__action-icon::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background-color: var(--black-40);
    mask-image: url(./assets/svg/icons/close.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/icons/close.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.pricing-service__description {
    padding: 0 24px 24px 24px;
    color: var(--black-75);
}

/* Pricing Service - Added */

.pricing-service--added {
    background-color: var(--green-10);
}

.pricing-service--added  .pricing-service__discount,
.pricing-service--added .pricing-service__price-wrap {
    background-color: var(--green-100);
}

.pricing-service--added  .pricing-service__discount {
    color: var(--white-100);
}

.pricing-service--added .pricing-service__price .currency {
    color: var(--white-50);
}

.pricing-service--added .pricing-service__price {
    color: var(--white-100);
}

.pricing-service--added .pricing-service__action-icon {
    background-color: var(--green-100);
}

.pricing-service--added .pricing-service__action-icon::before {
    transform: translate3d(-32px, 0, 0);
}

.pricing-service--added .pricing-service__action-icon::after {
    transform: translate3d(0, 0, 0);
}

/* Pricing Service - Not Available */

.pricing-service--not-available {
    pointer-events: none;
}

.pricing-service--not-available .pricing-service__header {
    opacity: .5;
}

/* Spinner - Animated */

.spinner--animated {
    animation: anim_spinning 10s linear infinite;
}

/* Header */

.header {
    --header-height: 56px;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    color: var(--white-100);
    background: linear-gradient(to bottom, var(--black-50), transparent);
    z-index: 10001;
}

.header__background {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    left: 0;
    height: var( --header-height);
    background-color: var(--white-80);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: -1;

    opacity: 0;

    transition: height .3s ease;
    transition-delay: .3s;
}

.header:hover .header__background {
    transition-delay: 0s;
}

.header__content {
    display: flex;
    align-items: center;
    height: var( --header-height);
}

.header__content--mobile {
    display: none;
}

.header__col {
    display: flex;
    align-items: center;
    flex-grow: 1;
    flex-basis: 0;
    column-gap: 8px;
}

.header__col--center {
    flex-grow: 0;
}

.header__col--right {
    justify-content: flex-end;
}

/* Header - Fixed */

.header--fixed {
    position: fixed;
    color: var(--black-100);

    animation: .5s ease-in-out .3s both anim_header_reveal;
}

.admin-bar .header--fixed {
    top: 32px;
}

.header--fixed .header__background {
    opacity: 1;
}

/* Header - Navigating */

.header--navigating {
    color: var(--black-100);
}

.header--navigating .header__background {
    opacity: 1;
}

/* Header - White */

.header--white {
    color: var(--black-100);
    background: unset;
}

.header--white .header__background {
    opacity: 1;
}

/* Offcanvas Menu */

.offcanvas-menu {
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 56px;
    left: 0;
    bottom: 0;
    width: 400px;
    background-color: var(--white-100);
    transform: translate3d(-100%,0,0);
    z-index: 1000;

    transition: transform .3s ease-in-out;
}

.admin-bar .offcanvas-menu {
    top: 88px;
}

.offcanvas-menu--active {
    transform: translate3d(0,0,0);
}

.offcanvas-menu__top {
    flex-grow: 1;
    padding: 40px 0;
}

.offcanvas-menu__middle {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 16px;
    background-color: var(--light-grey-100);
}

.offcanvas-menu__middle-title {
    padding-top: 16px;
    color: var(--black-50);
    font-size: 10px;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.offcanvas-menu__bottom {
    position: relative;
    display: flex;
}

/* Booking Trigger */

.booking-trigger {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 16px;
    bottom: 16px;
    width: 64px;
    height: 64px;
    background-color: var(--black-100);
    border-radius: 50%;
    z-index: 999;
}

.booking-trigger__counter {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 24px;
    height: 24px;
    color: var(--white-100);
    font-weight: 700;
    font-size: 12px;
    line-height: 24px;
    text-align: center;
    background-color: var(--green-100);
    border-radius: 50%;
}

/* Booking Widget */

.booking-widget {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-top: 56px;
    z-index: 1000;

    opacity: 0;
    pointer-events: none;

    transition: opacity .3s ease;
}

.admin-bar .booking-widget {
    padding-top: 88px;
}

.booking-widget__inner {
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 392px;
    margin-left: auto;
    padding-top: 40px;
    background-color: var(--white-100);
    border: 1px solid var(--light-grey-100);
    z-index: 1;

    transform-origin: top center;
    transform: scale(.9);

    transition: transform .3s ease-in-out;
}

.booking-widget__close {
    position: absolute;
    top: 0;
    right: 0;
}

/* Booking Widget - Active */

.booking-widget--active {
    opacity: 1;
    pointer-events: initial;
}

.booking-widget--active .booking-widget__inner {
    transform: scale(1);
}

/* Booking Methods */

.booking-methods {
    text-align: center;
}

.booking-methods__title {
    margin-bottom: 16px;
    color: var(--black-70);
    font-weight: 500;
    font-size: 14px;
}

.booking-methods__list {
    display: flex;
    justify-content: center;
    gap: 8px;
}

.booking-methods__item-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background-color: var(--beige-10);
    border-radius: 50%;
}

.booking-methods__item-icon {
    fill: var(--beige-100);
}

/* Footer */

.footer {
    color: var(--white-100);
    background: linear-gradient(120.54deg, #323035 26.86%, #191620 71.39%);
}

.footer__container {
    position: relative;
    padding: 80px 16px;
    overflow: hidden;
}

.footer__container::before {
    content: "";
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    width: 506px;
    height: 506px;
    background: url(./assets/svg/footer/background.svg) center/contain no-repeat;
    transform: translate3d(0, -50%, 0);
    pointer-events: none;
}

.footer__top {
    display: flex;
    align-items: flex-start;
    padding-bottom: 40px;
}

.footer__top-left,
.footer__top-right {
    flex-grow: 1;
    flex-basis: 0;
}

.footer__top-right {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    column-gap: 8px;
}

.footer__middle {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-top: 40px;
    border-top: 1px solid var(--white-10);
}

.footer__middle-right {
    display: grid;
    grid-template-columns: 210px 1fr;
}

.footer__bottom {
    padding: 24px 0;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase;
    background-color: var(--black-100);
}

.footer__bottom-container {
    position: relative;
    display: flex;
    justify-content: space-between;
}

/* Modal */

.modal {
    position: fixed;
    display: none;
    align-items: center;
    justify-content: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10002;
}

.modal--active {
    display: flex;
}

.modal__inner {
    position: relative;
    width: 100%;
    max-width: 1200px;
    max-height: 100%;
    padding: 8px;
    background-color: var(--white-100);
    z-index: 1;
    overflow: auto;
}

.modal[aria-hidden="false"] .modal__inner {
    animation: fade_in_up .3s cubic-bezier(0, 0, .2, 1);
}

.modal[aria-hidden="true"] .modal__inner {
    animation: fade_out_down .3s cubic-bezier(0, 0, .2, 1);
}

.modal__close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
}

.modal[aria-hidden="false"] .modal__backdrop {
    animation: fade_in .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

.modal[aria-hidden="true"] .modal__backdrop {
    animation: fade_out .3s cubic-bezier(0.0, 0.0, 0.2, 1);
}

/* Slider */

.slider {
    position: relative;
}

.slider--dragging {
    cursor: grabbing;
}

.slider__content {
    position: relative;
    display: flex;
    align-items: stretch;
    height: 100svh;
    padding-top: 72px;
    padding-bottom: 80px;
    user-select: none;
}

.slider__container {
    position: relative;
    display: flex;
    flex-direction: column;
    height: auto;
    z-index: 10;
}

.slider__pagination {
    display: flex;
    column-gap: 8px;
    margin-bottom: 40px;
}

.slider__pagination-item {
    flex-grow: 1;
    flex-basis: 0;
    max-width: 100px;
    height: 4px;
    background-color: var(--white-33);
    border-radius: 2px;
    cursor: pointer;

    transition: background-color .3s ease-in-out;
}

.slider__pagination-item:hover {
    background-color: var(--white-100);
}

.slider__pagination-item--active {
    background-color: var(--white-100);
    pointer-events: none;
}

.slider__title {
    max-width: 740px;
    min-height: calc(3em * 1.1);
    margin: 0;
    color: var(--white-70);
    font-weight: 500;
    font-size: 40px;
    line-height: 1.1;
}

.slider__title-text {
    color: var(--white-100);
}

.slider__title-cursor {
    display: inline-block;
    height: 40px;
    width: 2px;
    vertical-align: bottom;
    background-color: var(--white-100);
    border-radius: 2px;
}

.slider__navigation {
    display: flex;
    align-items: center;
    margin-top: 32px;
    margin-bottom: auto;
}

.slider__navigation-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 1px solid var(--white-20);

    transition: background-color .3s ease;
}

.slider__navigation-button:hover {
    background-color: var(--white-30);
}

.slider__navigation-button--prev {
    border-right: 0;
}

.slider__description {
    width: 40%;
    margin-top: 32px;
    padding-right: 64px;
    color: var(--white-100);
    font-size: 14px;
}

.slider__actions {
    margin-top: 32px;
}

.slider__action {
    display: none;
    min-width: 220px;
}

.slider__action--active {
    display: inline-block;
}

.slider__promotion {
    position: absolute;
    display: flex;
    right: 16px;
    bottom: 0;
    max-width: 400px;
    color: var(--white-100);
    background-color: var(--white-10);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    z-index: 10;

    animation: fade_in_up .5s .25s cubic-bezier(0.25, 1, 0.5, 1) backwards;
}

.slider__promotion-link {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.slider__promotion-image-wrap {
    flex-shrink: 0;
    overflow: hidden;
}

.slider__promotion-image {
    display: block;

    transition: transform .3s ease;
}

.slider__promotion:hover .slider__promotion-image {
    transform: scale(1.1);
}

.slider__promotion-content {
    display: flex;
    flex-direction: column;
    padding: 16px;
}

.slider__promotion-title {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.5;
}

.slider__promotion-description {
    margin-top: 16px;
    font-weight: 500;
    font-size: 14px;
}

.slider__promotion-arrow {
    margin-top: auto;
}

.slider__promotion-arrow-icon {
    display: block;
}

.slider__stage {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
}

.slider__slides {
    position: absolute;
    display: flex;
    align-items: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: fit-content;
}

.slider__slide {
    position: relative;
    display: flex;
    flex-shrink: 0;
    width: 100dvw;
    height: 100%;
    overflow: hidden;
}

.slider__slide-background-picture,
.slider__slide-background-image {
    width: 100%;
    height: 100%;
}

.slider__slide-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5;
}

.slider__slide-image-picture {
    position: absolute;
    display: block;
    right: 15%;
    bottom: 0;
    max-height: 100%;
    z-index: 10;
}

.slider__slide-image {
    display: block;
}

/* Instagram */

.instagram {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.instagram__stage {
    position: absolute;
    bottom: 85px;
    width: max-content;
    will-change: tranform;
    backface-visibility: hidden;
    animation: anim_instagram_feed 60s linear infinite;
    z-index: 2;
}

.instagram__feed {
    display: flex;
    align-items: center;
    column-gap: 12px;
}

.instagram__feed-item {
    flex-shrink: 0;
    border-radius: 8px;
    box-shadow: 0px 8px 25px 5px #1C1D311F;
    overflow: hidden;

    transition: scale .3s ease;
}

.instagram__feed-item:hover {
    scale: 1.1;
}

.instagram__feed-item-link {
    display: block;
}

.instagram__feed-item-header,
.instagram__feed-item-footer {
    height: 20px;
    padding: 0 4px;
    background-color: var(--white-100);
}

.instagram__feed-item-header {
    display: flex;
    align-items: center;
    column-gap: 4px;
}

.instagram__feed-item-avatar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    padding: 1px;
    background-image: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
    border-radius: 50%;
}

.instagram__feed-item-avatar::before {
    content: "";
    display: block;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background-color: var(--white-100);
}

.instagram__feed-item-avatar::after {
    content: "";
    position: absolute;
    display: block;
    width: 7px;
    height: 7px;
    background-color: var(--black-100);
    mask: url(./assets/svg/logo.svg) center / contain no-repeat;
}

.instagram__feed-item-username,
.instagram__feed-item-city {
    font-size: 6px;
    line-height: 1;
}

.instagram__feed-item-username {
    font-weight: 700;
}

.instagram__feed-item-image {
    display: block;
    width: 157px;
    height: 182px;
}

.instagram__feed-item-footer {
    display: flex;
    align-items: center;
}

.instagram__feed-item-action {
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

.instagram__feed-item-action--favorite {
    margin-right: unset;
    margin-left: auto;
}

.instagram__mockup {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white-100);
    border-radius: 30px;
    box-shadow: 0px 8px 25px 5px #1C1D311F;
}

.instagram__mockup-username {
    position: absolute;
    bottom: 318px;
    font-weight: 700;
    font-size: 6px;
    text-transform: uppercase;
    z-index: 3;
}

.instagram__mockup-screen {
    position: absolute;
    width: 157px;
    z-index: 1;
}

.instagram__mockup-border {
    position: relative;
    display: block;
    width: 173px;
    z-index: 3;
    pointer-events: none;
}

.instagram__action {
    position: absolute;
    bottom: 32px;
    width: 140px;
    z-index: 4;
}

/* Advantages */

.advantages {
    display: flex;
    flex-direction: column;
}

.advantages__title {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    margin-bottom: 80px;
}

.advantages__description {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.4;
    letter-spacing: -0.03rem;
}

.advantages__items {
    display: flex;
    width: fit-content;
}

.advantages__item {
    position: relative;
    flex: 1 0 auto;
    width: 480px;
    background-color: var(--white-100);
    border-right: 1px solid var(--dark-grey-100);
    border-bottom: 1px solid var(--dark-grey-100);
}

.advantages__item-counter {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 32px;
    left: 32px;
    width: 40px;
    height: 40px;
    color: var(--beige-100);
    font-size: 12px;
    background-color: var(--white-100);
    border-radius: 50%;
}

.advantages__item-image {
    display: block;
    max-height: 35vh;
}

.advantages__item-content {
    padding: 32px;
}

.advantages__item-title {
    margin-bottom: 24px;
    font-weight: 700;
    text-transform: uppercase;
}

.advantages__item-description {
    color: var(--black-75);
    font-weight: 500;
    font-size: 14px;
}

/* Icons Grid */

.icons-grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    column-gap: 64px;
}

.icons-grid__title {
    margin-bottom: unset;
}

.icons-grid__content {
    gap: 32px 64px;
}

/* Map */

.map {
    --map-height: 524px;

    position: relative;
    border-top: 1px solid var(--black-10);
    border-bottom: 1px solid var(--black-10);
}

.map__header {
    display: flex;
    align-items: center;
    gap: 32px;
    padding: 24px;
    background-color: var(--white-100);
}

.map__title {
    flex-shrink: 0;
    margin-bottom: unset;
}

.map__cities {
    display: flex;
    width: 100%;
    overflow-x: auto;
}

.map__city-input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
}

.map__city-title {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 48px;
    margin-right: -1px;
    padding: 12px 20px;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background-color: var(--light-grey-100);
    border: 1px solid var(--white-100);
    cursor: pointer;
}

.map__city-input:checked + .map__city-title {
    color: var(--white-100);
    background-color: var(--beige-100);
}

.map__map {
    height: var(--map-height);
    border-top: 1px solid var(--black-10);
}

.map__salons {
    position: absolute;
    top: 116px;
    right: 16px;
    bottom: 16px;
    width: 100%;
    max-width: 824px;
    z-index: 100000;

    pointer-events: none;
}

.map__salons:has(.map__salon--active) {
    pointer-events: initial;
}

.map__salon {
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--white-100);
    border-left: 1px solid var(--light-grey-100);
    border-right: 1px solid var(--light-grey-100);
    overflow-y: auto;
    
    opacity: 0;
    transform: scale(.9) translate3d(1rem, 0, 0);
    transform-origin: center right;
    pointer-events: none;

    transition-property: opacity, transform;
    transition-duration: .3s;
    transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.map__salon--active {
    pointer-events: initial;
    z-index: 100;

    opacity: 1;
    transform: scale(1);
}

.map__salon-close {
    position: absolute;
    top: 0;
    right: 0;
    width: 48px;
    height: 48px;
    padding: 0;
}

.map__salon-image-wrap {
    position: relative;
    flex-shrink: 0;
    width: 360px;
}

.map__salon-image {
    display: block;
    height: 100%;
}

.map__salon-phone {
    position: absolute;
    justify-content: center;
    right: 32px;
    bottom: 32px;
    left: 32px;
}

.map__salon-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 32px;
}

.map__salon-address {
    margin-bottom: 16px;
    font-weight: 500;
    font-size: 24px;
    text-transform: uppercase;
}

.map__salon-description {
    margin-bottom: 32px;
    color: var(--black-75);
    font-weight: 500;
    font-size: 14px;
    line-height: 1.4;
}

.map__salon-links {
    display: flex;
    column-gap: 12px;
    margin-top: auto;
}

.map__salon-link--gmaps {
    width: 48px;
}

/* Map Marker */

.map-marker {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Latest Posts */

.latest-posts__header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 32px;
}

.latest-posts__title {
    margin-bottom: unset;
}

.latest-posts__items {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

/* Testimonials */

.testimonials__content {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
}

.testimonials__content::after {
    content: "";
    position: absolute;
    display: block;
    bottom: 0;
    left: 4px;
    width: 50%;
    height: 100px;
    background-image: linear-gradient(to bottom, #FFFFFF00, var(--white-100));
    pointer-events: none;
}

.testimonials__nav {
    max-height: 350px;
    direction: rtl;
    text-align: left;
    overflow: auto;
}

.testimonials__nav-item {
    direction: ltr;
}

.testimonials__nav-item-button {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 16px;
    text-align: inherit;
    background-color: unset;
    cursor: pointer;
}

.testimonials__nav-item--active {
    background-color: var(--light-grey-100);
}

.testimonials__nav-item-image {
    width: 56px;
    height: 56px;
    margin-right: 16px;
    border-radius: 50%;
}

.testimonials__nav-item-content {
    font-weight: 500;
}

.testimonials__nav-item-name {
    margin-bottom: 4px;
    line-height: 1.25;
}

.testimonials__nav-item-position {
    color: var(--black-50);
    font-size: 14px;
}

.testimonials__items {
    position: relative;
    font-weight: 500;
    border: 1px solid var(--black-10);
    z-index: 10;
}

.testimonials__item {
    position: relative;
    display: none;
    align-items: flex-end;
    height: 100%;
    padding: 32px;
}

.testimonials__item::before {
    content: "";
    position: absolute;
    display: block;
    top: 32px;
    left: 32px;
    width: 95px;
    height: 78px;
    background-color: var(--beige-10);
    mask-image: url(./assets/svg/quote.svg);
    mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-image: url(./assets/svg/quote.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
}

.testimonials__item--active {
    display: flex;
}

/* Media */

.media {
    overflow: unset;
}

.media__item {
    filter: grayscale(1);

    transition: filter .3s ease;
}

.media__item--active {
    filter: grayscale(0);
}

/* CTA */

.cta {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 32px;
    color: var(--white-100);
}

.cta__left {
    display: flex;
    flex-direction: column;
    padding-right: 64px;
}

.cta__background {
    position: absolute;
    display: block;
    top: -120px;
    left: -120px;
    width: 585px;
    height: 585px;
    background-color: var(--white-5);
    mask: url(./assets/svg/logo.svg) center / contain no-repeat;
    -webkit-mask: url(./assets/svg/logo.svg) center / contain no-repeat;
    pointer-events: none;
}

.cta__description {
    margin-top: 32px;
    font-weight: 500;
    font-size: 14px;
}

/* About */

.about {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: flex-start;
}

.about__left {
    position: relative;
}

.about__title {
    position: absolute;
    display: flex;
    top: 80px;
    left: 50%;
    width: 100%;
    max-width: 420px;
    color: var(--white-100);
    transform: translateX(-50%);
}

.about__title::before {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    margin-top: 4px;
    margin-right: 24px;
    background-color: var(--white-100);
    mask-image: url(./assets/svg/logo.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url(./assets/svg/logo.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.about__image {
    display: block;
    width: 100%;
    height: calc(100vh - 56px);
}

.about__right {
    position: relative;
    overflow: hidden;
}

.about__right::after {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 500px;
    background: linear-gradient(to bottom, #FFFFFF00 0%, #FFFFFF 50%);

    transition: opacity .3s ease;
}

.about__content {
    padding: 80px 48px;
}

.about__expand {
    position: absolute;
    left: 50%;
    bottom: 205px;
    padding: 0;
    color: var(--beige-100);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background-color: unset;
    transform: translateX(-50%);
    z-index: 1;
}

/* About - Expanded */

.about--expanded .about__left {
    position: sticky;
    top: 56px;
}

.admin-bar .about--expanded .about__left {
    top: 88px;
}

.about--expanded .about__right::after {
    opacity: 0;
    pointer-events: none;
}

.about--expanded .about__expand {
    display: none;
}

/* Welcome */

.welcome {
    height: 100vh;
}

.welcome__content {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    min-height: 50%;
    padding-top: 104px;
    background-color: var(--white-100);
}

.welcome__container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding-bottom: 120px;
}

.welcome__description {
    font-weight: 500;
    font-size: 18px;
}

.welcome__spinner-wrap {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 50%;
    bottom: 0;
    padding: 8px;
    background-color: var(--light-grey-100);
    border-radius: 50%;
    transform: translate3d(-50%, 50%, 0);
}

.welcome__spinner {
    fill: var(--dark-beige-100);
    transform: rotateZ(-30deg);
}

.welcome__spinner-icon {
    position: absolute;
    fill: var(--beige-100);
}

.welcome__image {
    display: block;
    height: 100%;
}

/* Expandable */

.expandable__header {
    text-align: center;
}

.expandable__title {
    margin-bottom: 40px;
}

.expandable__expand {
    display: inline-flex;
    min-width: 240px;
    padding: unset;
}

.expandable__expand-icon-wrap {
    height: 100%;
    aspect-ratio: 1;
    background-color: var(--black-5);
}

.expandable__expand-icon {
    fill: var(--black-50);
    transform: rotate3d(0,0,1,45deg);
    
    transition-property: fill, transform;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.expandable__expand-title {
    flex-grow: 1;
    padding: 0 20px;
}

.expandable__expand-title-hide {
    display: none;
}

.expandable__body {
    height: 0;
    background-color: #25222A;
    overflow: hidden;
}

.expandable__body-content {
    padding: 120px 0;
    color: var(--white-100);
}

.expandable__body-content span {
    color: var(--beige-100);
}

/* Expandable - Expanded */

.expandable--expanded .expandable__expand {
    color: var(--white-100);
    background-color: #25222A;
}

.expandable--expanded .expandable__expand-icon {
    fill: var(--white-70);
    transform: rotate3d(0,0,0,0deg);
}

.expandable--expanded .expandable__expand-title-show {
    display: none;
}

.expandable--expanded .expandable__expand-title-hide {
    display: block;
}

/* Founders */

.founders {
    position: relative;
    padding: 120px 0;
    overflow: hidden;
}

.founders::before {
    position: absolute;
    content: "";
    display: block;
    top: calc(50% - 220px);
    left: calc(50% - 342px);
    width: 1218px;
    height: 638px;
    background-color: var(--black-5);
    mask: url(./assets/svg/about/founders-background.svg) center / contain no-repeat;
    user-select: none;
    pointer-events: none;
}

.founders__content {
    position: relative;
    max-width: 586px;
    z-index: 1;
}

.founders__description {
    margin-bottom: 32px;
    font-size: 24px;
    line-height: 1.3;
}

.founders__description span {
    color: var(--beige-100);
}

.founders__quote {
    max-width: 480px;
    color: var(--white-100);
    background-color: var(--beige-100);
}

.founders__action {
    width: 100%;
    max-width: 480px;
    margin-top: 16px;
}

.founders__image {
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    user-select: none;
    pointer-events: none;
}

/* Brands */

.brands__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px;
}

.brands__item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 12%;
    height: 98px;
    min-width: 112px;
    max-width: 148px;
    padding: 8px;
    background-color: var(--white-100);
}

/* Franchise Calculator */

.franchise-calculator__header {
    display: grid;
    grid-template-columns: minmax(0,2fr) minmax(0,1fr);
    margin-bottom: 80px;
}

.franchise-calculator__header-left {
    padding-right: 32px;
}

.franchise-calculator__title {
    margin-bottom: unset;
}

.franchise-calculator__action {
    min-width: 260px;
    margin-top: 32px;
}

.franchise-calculator__header-description {
    color: var(--black-80);
    font-weight: 500;
}

.franchise-calculator__advantages {
    display: flex;
}

.franchise-calculator__advantage {
    flex: 1 0 0;
    padding: 32px;
    text-transform: uppercase;
    border: 1px solid var(--beige-100);
}

.franchise-calculator__advantage:not(:last-child) {
    border-right: unset;
}

.franchise-calculator__advantage-title {
    margin-bottom: 16px;
    color: var(--black-70);
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 0.05em;
}

.franchise-calculator__advantage-content {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.3;
}

.franchise-calculator__body {
    display: grid;
    grid-template-columns: minmax(0,2fr) minmax(0,1fr);
}

.franchise-calculator__body-left {
    padding: 32px;
    background-color: var(--white-100);
}

.franchise-calculator__param {
    display: flex;
    align-items: flex-end;
}

.franchise-calculator__param:not(:last-child) {
    margin-bottom: 24px;
}

.franchise-calculator__param-control {
    width: 75%;
}

.franchise-calculator__param-label {
    margin-bottom: 4px;
    font-weight: 500;
}

.franchise-calculator__param-value {
    margin-left: 20px;
    color: var(--beige-100);
    font-size: 24px;
    line-height: 1.3;
    white-space: nowrap;
}

.franchise-calculator__params-description {
    margin-top: 40px;
    color: var(--black-70);
    font-weight: 500;
}

.franchise-calculator__params-description span {
    color: var(--beige-100);
}

.franchise-calculator__body-right {
    display: flex;
    flex-direction: column;
    min-height: 360px;
    color: var(--white-100);
    font-weight: 500;
    background-color: var(--beige-100);
}

.franchise-calculator__summary {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 32px;
}

.franchise-calculator__summary-title {
    margin-bottom: auto;
}

.franchise-calculator__summary-result {
    font-size: 80px;
    line-height: 1;
    letter-spacing: -0.03em;
}

.franchise-calculator__summary-result-suffix {
    font-size: 40px;
}

.franchise-calculator__summary-action {
    width: 100%;
}

/* FAQ */

.faq {
    display: grid;
    grid-template-columns: 1fr 2fr;
}

.faq__item-header {
    display: flex;
    align-items: center;
    width: 100%;
    height: 48px;
    padding: 0;
    text-align: unset;
    background-color: var(--white-100);
    border: 4px solid var(--white-100);
}

.faq__item:hover .faq__item-header {
    background-color: var(--light-beige-100);
}

.faq__item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    aspect-ratio: 1;
    background-color: var(--light-beige-100);
}

.faq__item--active .faq__item-icon {
    background-color: var(--beige-100);
}

.faq__item-icon::before {
    content: "";
    width: 14px;
    aspect-ratio: 1;
    background-color: var(--black-40);
    mask: url(./assets/svg/icons/arrow-top-right.svg) center / contain no-repeat;

    transition-property: background-color, transform;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.faq__item:hover:not(.faq__item--active) .faq__item-icon::before {
    transform: rotate3d(0,0,1,45deg);
}

.faq__item--active .faq__item-icon::before {
    background-color: var(--white-100);
    transform: rotate3d(0,0,1,135deg);
}

.faq__item-title {
    flex-grow: 1;
    padding: 0 16px;
    font-weight: 500;
    font-size: 14px;
}

.faq__item-counter {
    padding-right: 20px;
    color: var(--black-25);
    font-weight: 500;
    font-size: 10px;
}

.faq__item-body {
    height: 0;
    overflow: hidden;

    transition: height .3s ease;
}

.faq__item-description {
    padding: 16px 4px 16px 68px;
    color: var(--black-70);
    font-weight: 500;
    font-size: 14px;
    background-color: var(--white-100);
    border-top: 1px solid var(--black-5);
}

/* Banner */

.banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 16px;
    color: var(--white-100);
    text-align: center;
}

.banner__content {
    position: relative;
    z-index: 1;
}

.banner__description {
    font-size: 14px;
}

.banner__action {
    min-width: 220px;
    margin-top: 64px;
}

.banner__background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.banner__background::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--black-10);
}

.banner__background-image {
    display: block;
    width: 100%;
    height: 100%;
}

/* Gifts */

.gifts {
    position: relative;
}

.gifts__image {
    display: block;
    width: 50%;
    max-height: 720px;
}

.gifts__container {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.gifts__content {
    padding-left: calc(50% + 56px);
}

.gifts__description {
    color: var(--black-70);
    font-weight: 500;
}

.gifts__advantages {
    position: absolute;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
}

.gifts__advantages .icon-box:not(:last-child) {
    margin-right: -1px;
}

/* Gifts Modal */

.gifts-modal {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
}

/* Gallery */

.gallery__carousel {
    user-select: none;
}

.gallery__carousel .swiper-navigation {
    position: absolute;
    display: flex;
    gap: 1px;
    right: 4px;
    bottom: 4px;
}

.gallery__carousel .swiper-button-prev,
.gallery__carousel .swiper-button-next {
    position: unset;
    width: 48px;
    height: 48px;
    background-color: var(--white-100);
}

.gallery__carousel .swiper-button-prev.swiper-button-disabled,
.gallery__carousel .swiper-button-next.swiper-button-disabled {
    opacity: 1;
}

.gallery__carousel .swiper-button-prev::after,
.gallery__carousel .swiper-button-next::after {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background-color: var(--black-100);
}

.gallery__carousel .swiper-button-prev::after {
    mask: url(./assets/svg/icons/chevron-left.svg) center / contain no-repeat;
    -webkit-mask: url(./assets/svg/icons/chevron-left.svg) center / contain no-repeat;
}

.gallery__carousel .swiper-button-next::after {
    mask: url(./assets/svg/icons/chevron-right.svg) center / contain no-repeat;
    -webkit-mask: url(./assets/svg/icons/chevron-right.svg) center / contain no-repeat;
}

.gallery__carousel-item-image {
    display: block;
}

.gallery__nav {
    margin-top: 8px;
}

.gallery__nav-item.swiper-slide-thumb-active {
    border: 1px solid var(--beige-100);
}

.gallery__nav-item-image {
    display: block;
}

/* Gallery - Gifts */

.gallery--gifts .gallery__carousel-item-image {
    max-height: 500px;
}

/* Thank You Page */

.thank-you-page {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 56px 16px 16px;
    background: linear-gradient(120.54deg, #323035 26.86%, #191620 71.39%);
}

.thank-you-page__inner {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1200px;
    background-color: var(--white-100);
}

.thank-you-page__left,
.thank-you-page__right {
    width: 50%;
}

.thank-you-page__right {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px;
}

.thank-you-page__image {
    display: block;
    height: 100%;
}

.thank-you-page__header {
    display: flex;
    gap: 24px 40px;
    margin-bottom: 32px;
}

.thank-you-page__icon {
    flex-shrink: 0;
}

.thank-you-page__title {
    margin-bottom: unset;
}

.thank-you-page__booking-props {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 16px;
    width: 100%;
    margin-bottom: 32px;
    padding: 24px;
    font-weight: 500;
    font-size: 14px;
    background-color: var(--light-grey-100);
}

.thank-you-page__booking-prop {
    width: calc(32.7% - 8px);
}

.thank-you-page__booking-prop--salon {
    width: 100%;
}

.thank-you-page__booking-prop-icon {
    display: block;
    margin-bottom: 4px;
    fill: var(--beige-100);
}

.thank-you-page__action {
    min-width: 220px;
    margin-top: auto;
}

/* Thank You */

.thank-you {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px;
    text-align: center;
    background-color: var(--white-100);
}

.thank-you__icon-wrap {
    flex-shrink: 0;
    margin-bottom: 24px;
}

.thank-you__icon {
    flex-shrink: 0;
    fill: var(--green-100);
}

.thank-you__title {
    margin-bottom: 24px;
    color: var(--black-100);
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.thank-you__description {
    color: var(--black-80);
    font-weight: 500;
    font-size: 14px;
}

/* Thank You - Booking CTA */

.thank-you--booking-cta {
    background-color: var(--white-5);
    border: 1px solid var(--white-25);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

.thank-you--booking-cta .thank-you__icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    margin-bottom: 24px;
    background-color: var(--white-100);
    border-radius: 50%;
}

.thank-you--booking-cta .thank-you__title {
    margin-bottom: 16px;
    color: var(--white-100);
}

.thank-you--booking-cta .thank-you__description {
    color: var(--white-80);
}

/* Page Not Found */

.page-not-found {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    height: 100dvh;
}

.page-not-found__background-wrap {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--black-100);
    pointer-events: none;
}

.page-not-found__background {
    display: block;
    width: 50%;
    height: 100%;
    object-fit: cover;
}

.page-not-found__number {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 100%;
    margin-top: 114px;
    padding: 0 16px;
    z-index: 1;
}

.page-not-found__spinner {
    fill: var(--white-100);
}

.page-not-found__content {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    padding: 32px;
    z-index: 1;
}

.page-not-found__title {
    font-size: 64px;
}

.page-not-found__action {
    width: 100%;
}

/* Binotel GetCall */

a#bingc-phone-button {
    right: 8px !important;
    bottom: 88px !important;
    left: unset !important;
    width: 80px !important;
    height: 80px !important;
    z-index: 999 !important;
}

a#bingc-phone-button div.bingc-phone-button-tooltip.bingc-phone-button-tooltip-show-first {
    bottom: 100px !important;
    background-color: var(--black-100) !important;
}

a#bingc-phone-button div.bingc-phone-button-tooltip svg.bingc-phone-button-arrow polyline {
    fill: var(--black-100) !important;
}

a#bingc-phone-button svg.bingc-phone-button-circle {
    width: 80px;
    height: 80px;
}

a#bingc-phone-button svg.bingc-phone-button-circle circle.bingc-phone-button-circle-inside,
a#bingc-phone-button:hover svg.bingc-phone-button-circle circle.bingc-phone-button-circle-inside {
    fill: var(--green-100) !important;
}

a#bingc-phone-button div.bingc-phone-button-icon-text {
    top: 24px;
    right: 17px;
}

a#bingc-phone-button div.bingc-phone-button-icon-text span {
    font-size: 12px;
    line-height: 14px;
}

a#bingc-phone-button svg.bingc-phone-button-icon-icon {
    top: 16px;
    right: 18px;
    height: 50px;
}

/* Keyframes */

@keyframes anim_header_reveal {
    from { transform: translate3d(0, -100%, 0); }
    to { transform: translate3d(0, 0, 0); }
}

@keyframes anim_spinning {
    from { transform: rotate3d(0,0,1,0); }
    to { transform: rotate3d(0,0,1,360deg); }
}

@keyframes anim_instagram_feed {
    from { transform: translate3d(calc(-25% - 6px), 0, 0); }
    to { transform: translate3d(25%, 0, 0); }
}

@keyframes fade_in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fade_out {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes fade_in_up {
    from { opacity: 0; transform: translateY(2rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fade_out_down {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(2rem); }
}

/* Media Queries */

@media screen and (max-width: 1400px) {
    /* About (Laptop) */

    .about__right::after {
        height: 300px;
        background: linear-gradient(to bottom, #FFFFFF00, var(--white-100) 85%);
    }

    .about__expand {
        bottom: 32px;
    }

    /* Founders (Laptop) */

    .founders__image {
        right: -240px;
        left: unset;
    }
}

@media screen and (max-width: 1200px) {
    /* Founders (Medium Laptop) */

    .founders__image {
        right: -340px;
    }
}

@media screen and (max-width: 1100px) {
    /* Footer (Small Laptop) */

    .footer__top {
        flex-wrap: wrap;
    }

    .footer__top-center {
        order: -1;
        width: 100%;
        margin-bottom: 32px;
    }

    /* Pricing Section (Small Laptop) */

    .pricing-section__controls {
        flex-wrap: wrap;
    }
}

@media screen and (max-width: 1025px) {
    /* Grid (Tablet) */

    .grid--col-3,
    .grid--col-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Header (Tablet) */

    .header__background {
        background-color: var(--white-100);
    }

    .header__content--desktop {
        display: none;
    }

    .header__content--mobile {
        display: flex;
    }

    /* Phone - Mobile Header (Tablet) */

    .header--fixed .phone--mobile-header,
    .header--navigating .phone--mobile-header,
    .header--white .phone--mobile-header {
        background-color: var(--black-5);
    }

    .header--fixed .phone--mobile-header .phone__icon,
    .header--navigating .phone--mobile-header .phone__icon,
    .header--white .phone--mobile-header .phone__icon {
        fill: var(--black-100);
    }

    /* Language Switcher - Header (Tablet) */

    .language-switcher--header {
        position: unset;
    }

    .language-switcher--header .language-switcher__list {
        top: 100%;
        right: 16px;
        left: 16px;
        width: unset;
        font-weight: 500;
        font-size: 14px;
        text-transform: none;
        box-shadow: 0px 8px 25px 5px #1C1D311F;
    }

    .language-switcher--header .language-switcher__item-link {
        justify-content: unset;
        padding: 0 16px;
    }

    /* Contacts (Tablet) */

    .contacts {
        flex-direction: column;
    }

    .contacts__item {
        width: 100%;
    }

    /* Hero Actions - Salon (Tablet) */

    .hero-actions--salon .hero-actions__description {
        display: block;
    }

    /* Post Header (Tablet) */

    .post-header {
        flex-direction: column;
    }

    /* Post Layout (Tablet) */

    .post-layout__sidebar {
        display: none;
    }

    /* Slider (Tablet) */

    .slider__container {
        align-items: center;
    }

    .slider__pagination {
        width: 100%;
        margin-bottom: 32px;
    }

    .slider__pagination-item {
        max-width: unset;
    }

    .slider__title {
        max-width: unset;
        padding: 0 32px;
        text-align: center;
    }

    .slider__description {
        width: unset;
        max-width: 400px;
        padding-right: unset;
        text-align: center;
    }

    .slider__promotion {
        position: unset;
        margin-top: 32px;
    }

    .slider__slide {
        flex-direction: column;
    }

    /* Advantages (Tablet) */

    .advantages__header {
        grid-template-columns: 1fr;
    }

    .advantages__items {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
    }

    .advantages__item {
        width: unset;
    }

    /* Map (Tablet) */

    .map {
        --map-height: 550px;
    }

    .map__header {
        position: unset;
        flex-direction: column;
        gap: 24px;
        padding: unset;

        transform: unset;
    }

    .map__title {
        padding: 32px 32px 0;
    }

    .map__cities::-webkit-scrollbar {
        display: none;
    }

    .map__city {
        border-color: var(--light-grey-100);
    }

    .map__city--active {
        border-color: var(--beige-100);
    }

    .map__salons {
        top: 156px;
        left: 50%;

        transform: translateX(-50%);
    }

    .map__salon {
        transform-origin: top center;
    }

    /* About (Tablet) */

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

    .about__image {
        max-height: 600px;
    }

    .about__right {
        height: 320px;
    }

    .about__right::after {
        height: 300px;
        background: linear-gradient(to bottom, #FFFFFF00, var(--white-100) 85%);
    }

    .about__content {
        padding: 32px 16px;
    }

    .about__expand {
        bottom: 32px;
    }

    /* About - Expanded (Tablet) */

    .about--expanded .about__left {
        position: unset;
    }

    .about--expanded .about__right {
        height: unset;
    }

    /* Gifts (Tablet) */

    .gifts__container {
        position: unset;
    }

    .gifts__content {
        margin-bottom: 32px;
        padding-left: unset;
    }

    .gifts__image {
        width: 100%;
        max-height: unset;
    }
}

@media screen and (max-width: 960px) {
    /* Form (Medium Tablet) */

    .form__title {
        margin-bottom: 24px;
    }

    /* Form - Vacancy (Medium Tablet) */

    .form--vacancy {
        padding-top: unset;
    }

    .form--vacancy .form__fields {
        padding: unset;
    }

    /* Client Bar (Medium Tablet) */

    .client-bar__widgets {
        flex-wrap: wrap;
    }

    .client-bar__widget {
        flex: unset;
        width: 100%;
        padding: 12px;
    }

    .client-bar__widget:not(:last-child) {
        border-right: unset;
        border-bottom: 1px solid var(--black-10);
    }

    /* Hero (Medium Tablet) */

    .hero__content {
        flex-direction: column;
    }

    .hero__right {
        width: unset;
    }

    /* Hero - Pricing (Medium Tablet) */

    .hero--pricing .hero__content {
        flex-direction: row;
    }

    .hero--pricing .hero__right {
        width: 392px;
    }

    .hero--pricing .hero__widget {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Hero - Blog (Medium Tablet) */

    .hero--blog .hero__left {
        flex-grow: unset;
    }

    .hero--blog .hero__right {
        flex-grow: 1;
    }

    .hero--blog .hero__description {
        margin-bottom: auto;
    }

    /* Hero - Salon (Medium Tablet) */

    .hero--salon .hero__description {
        display: none;
    }

    .hero--salon .hero__actions {
        margin-top: unset;
    }

    /* Hero - Gifts (Medium Tablet) */

    .hero--gifts {
        text-align: center;
    }

    .hero--gifts .hero__right {
        margin-top: auto;
    }

    .hero--gifts .hero__left,
    .hero--gifts .hero__right {
        flex: unset;
    }

    /* Page Layout (Medium Tablet) */

    .page-layout {
        flex-direction: column;
    }

    .page-layout__sidebar {
        width: unset;
        margin-top: unset;
    }

    .page-layout__sidebar-widget:not(:last-child) {
        margin-bottom: 40px;
    }

    .page-layout__form {
        border: unset;
    }

    /* Page Layout - Overlapping (Medium Tablet) */

    .page-layout--overlapping .page-layout__sidebar {
        margin-top: unset;
        padding-top: 80px;
    }

    /* Page Layout - Blog (Medium Tablet) */

    .page-layout--blog {
        flex-direction: column-reverse;
        row-gap: 32px;
    }

    /* Service Layout (Medium Tablet) */

    .service-layout {
        column-gap: 24px;
    }

    .service-layout__image {
        max-width: unset;
    }

    .service-layout__image,
    .service-layout__content {
        width: 50%;
    }

    /* Card - Vacancy Large (Medium Tablet) */

    .card--vacancy-lg {
        display: flex;
        flex-direction: column-reverse;
    }

    .card--vacancy-lg .card__arrow {
        top: 16px;
        right: unset;
        bottom: unset;
        left: 16px;
    }

    /* Salon Map (Medium Tablet) */

    .salon-map__description {
        display: block;
    }

    /* Service Categories (Medium Tablet) */

    .pricing-categories__list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* Pricing Section (Medium Tablet) */

    .pricing-section__left {
        display: none;
    }

    /* CTA (Medium Tablet) */

    .cta {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Founders (Medium Tablet) */

    .founders::before {
        right: -148px;
        left: unset;
        width: 620px;
        height: 324px;
    }

    .founders__image {
        top: 196px;
        right: -150px;
        width: 590px;
    }

    /* Gifts Modal (Medium Tablet) */

    .gifts-modal {
        grid-template-columns: minmax(0,1fr);
    }

    /* Thank You Page (Medium Tablet) */

    .thank-you-page__header {
        flex-direction: column;
    }

    .thank-you-page__booking-prop {
        width: 100%;
    }
}

@media screen and (max-width: 782px) {
    /* Selectron (Small Tablet) */

    .admin-bar .selectron-dropdown {
        margin-top: -46px;
    }

    /* Header (Small Tablet) */

    .admin-bar .header--fixed {
        top: 46px;
    }

    /* Form - Pricing (Small Tablet) */

    .form--pricing .form__content {
        max-height: unset;
    }

    /* Hero - Pricing (Small Tablet) */

    .hero--pricing .hero__right {
        display: none;
    }

    /* Pricing (Small Tablet) */

    .pricing__container {
        flex-direction: column;
        padding-top: 40px;
        padding-bottom: unset;
    }

    .pricing__content {
        padding-bottom: 40px;
        border-bottom: 1px solid var(--black-20);
    }

    .pricing__sidebar {
        flex-shrink: unset;
        width: unset;
        margin-top: unset;
        margin-right: -16px;
        margin-left: -16px;
        padding-bottom: 40px;
    }

    .pricing__form {
        position: unset;
        border: unset;
    }

    /* Cart Preview (Small Tablet) */

    .cart-preview {
        display: flex;
    }

    /* Offcanvas Menu (Small Tablet) */

    .admin-bar .offcanvas-menu {
        top: 102px;
    }

    /* Advantages (Small Tablet) */

    .advantages__items {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Map (Small Tablet) */

    .map__salons {
        inset: 156px 16px 16px 16px;
        width: unset;
        transform: unset;
    }

    .map__salon {
        transform: scale(0.9);
    }

    .map__salon--active {
        transform: scale(1);
    }

    .map__salon-image-wrap {
        width: 50%;
    }

    /* Media (Small Tablet) */

    .media__list {
        margin: 0 -16px;
        padding: 0 16px;
    }

    /* Welcome (Small Tablet) */

    .welcome__content {
        padding-top: 72px;
    }

    .welcome__container {
        grid-template-columns: 1fr;
    }

    /* Franchise Calculator (Small Tablet) */

    .franchise-calculator__header {
        grid-template-columns: minmax(0,1fr);
        text-align: center;
    }

    .franchise-calculator__header-left {
        margin-bottom: 32px;
        padding-right: unset;
    }

    .franchise-calculator__body {
        grid-template-columns: minmax(0,1fr);
    }

    .franchise-calculator__body-right {
        min-height: unset;
    }

    .franchise-calculator__summary {
        flex-direction: unset;
        align-items: center;
    }

    .franchise-calculator__summary-title {
        margin-bottom: unset;
    }

    .franchise-calculator__summary-result {
        margin-left: auto;
    }

    /* FAQ (Small Tablet) */

    .faq {
        grid-template-columns: 1fr;
    }

    /* Thank You Page (Small Tablet) */

    .thank-you-page__left,
    .thank-you-page__right {
        width: 100%;
    }

    .thank-you-page__image {
        height: 400px;
    }

    .thank-you-page__booking-props {
        gap: 16px;
    }

    .thank-you-page__booking-prop {
        width: calc(50% - 8px);
    }
}

@media screen and (max-width: 600px) {
    #wpadminbar {
        top: -46px;
    }

    /* Section (Mobile) */

    .section--mob-pv-d {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .section--mob-pt-0 {
        padding-top: 0;
    }

    /* Grid (Mobile) */

    .grid--sm-col-1 {
        grid-template-columns: minmax(0, 1fr);
    }

    .grid--sm-gap-2 {
        gap: 2px;
    }

    .grid--vacancies {
        row-gap: 24px;
    }

    /* Form - Gifts Modal (Mobile) */

    .form--gifts-modal .form__content {
        padding: 16px;
    }

    .form--gifts-modal .form__title {
        font-size: 24px;
    }

    /* Logo (Mobile) */

    .logo__image {
        width: calc(3.5vw * 12);
    }

    /* Language Switcher - Mobile Header (Mobile) */

    .language-switcher--mobile-header .language-switcher__current {
        width: calc(3.5vw * 3);
        height: calc(3.5vw * 3);
        padding-top: 3px;
        border-color: var(--white-20);
    }

    /* Language Switcher - Footer (Mobile) */

    .language-switcher--footer {
        width: 100%;
    }

    .language-switcher--footer .language-switcher__current {
        width: 100%;
        height: 40px;
        aspect-ratio: unset;
    }

    /* Salon Actions - Footer (Mobile) */

    .salon-actions--footer {
        grid-column: 2 / 5;
    }

    .salon-actions--footer .salon-actions__phone {
        display: none;
    }

    /* Salon Switcher - Footer (Mobile) */

    .salon-switcher--footer {
        max-width: unset;
    }

    .salon-switcher--footer .salon-switcher__dropdown {
        width: 134%;
        margin-left: -34%;
    }

    /* Phone - Mobile Header (Mobile) */

    .phone--mobile-header {
        width: 3em;
        height: 3em;
        padding: 0;
        font-size: 3.5vw;
        background-color: var(--white-100);
    }

    .phone--mobile-header .phone__icon {
        fill: var(--black-70);
    }

    .phone--mobile-header .phone__title {
        display: none;
    }

    /* Burger (Mobile) */

    .burger {
        width: 3em;
        font-size: 3.5vw;   
        /* border-radius: 1em; */
    }

    .burger__icon div {
        width: 1.1em;
    }

    /* Header (Mobile) */

    .admin-bar .header--fixed {
        top: 0;
    }

    /* Offcanvas Menu (Mobile) */
    
    .offcanvas-menu {
        width: 100%;
    }

    .admin-bar .offcanvas-menu {
        top: 56px;
    }

    /* Booking Widget (Mobile) */
    
    .booking-widget,
    .admin-bar .booking-widget {
        top: 0;
        padding-top: 56px;
    }
    
    .booking-widget__inner {
        max-width: unset;
        margin-left: unset;
    }

    /* Footer (Mobile) */

    .footer__container::before {
        top: unset;
        right: 0;
        bottom: 0;
        left: 0;
        width: unset;
        height: unset;
        aspect-ratio: 1;
        transform: unset;
    }

    .footer__top {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .footer__top-center {
        order: 1;
        margin-bottom: 40px;
    }

    .footer__top-right {
        display: grid;
        grid-template-columns: repeat(4, minmax(0,1fr));
        order: 2;
        margin-bottom: 8px;
    }

    .footer__top-left {
        order: 3;
    }

    .footer__middle {
        display: flex;
        flex-direction: column;
        padding-top: unset;
        border-top: unset;
    }

    .footer__middle-left {
        padding-bottom: 40px;
        border-bottom: 1px solid var(--white-10);
    }

    .footer__middle-right {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .footer__bottom {
        padding: 40px 0;
    }

    .footer__bottom-container {
        flex-direction: column;
        align-items: center;
        row-gap: 32px;
    }

    /* Navigation - Footer Primary (Mobile) */

    .navigation--footer-primary {
        font-size: 12px;
    }

    .navigation--footer-primary .menu {
        justify-content: space-between;
        column-gap: unset;
    }

    /* Navigation - Footer Secondary (Mobile) */

    .navigation--footer-secondary {
        width: 100%;
        padding-top: 40px;
        padding-bottom: 40px;
        color: var(--white-100);
        border-bottom: 1px solid var(--white-10);
    }

    .navigation--footer-secondary .menu {
        align-items: center;
    }

    /* Header (Mobile) */

    .header__content--mobile {
        justify-content: space-between;
    }

    .header__col {
        flex-grow: unset;
        flex-basis: unset;
    }

    /* Title (Mobile) */

    .title__heading br {
        content: "";
    }

    .title__heading br::before {
        content: " ";
    }

    /* Title - Hero (Mobile) */

    .title--hero .title__heading {
        display: flex;
        justify-content: space-between;
    }

    /* Title - CTA (Mobile) */

    .title--cta .title__heading {
        font-size: 18px;
    }

    /* Title - Gifts (Mobile) */

    .title--gifts .title__heading {
        font-size: 18px;
    }

    /* Title - Thank You (Mobile) */

    .title--thank-you {
        text-align: center;
    }

    /* Hero (Mobile) */

    .hero {
        min-height: 440px;
        padding-top: 64px;
    }

    .hero__back {
        width: 40px;
    }

    .hero__tag {
        height: 40px;
        padding: 0 16px;
    }

    .hero__logo {
        top: 0;
        right: 0;
        left: 0;
    }

    /* Hero - Archive (Mobile) */

    .hero--archive {
        min-height: unset;
    }

    .hero--archive .hero__content {
        flex-direction: column;
    }

    .hero--archive .hero__title {
        font-size: 48px;
        line-height: 1;
    }

    /* Hero - Single (Mobile) */

    .hero--single .hero__title {
        font-size: 32px;
    }

    /* Hero - Page (Mobile) */

    .hero--page {
        min-height: unset;
    }

    /* Hero - Vacancy (Mobile) */

    .hero--vacancy {
        min-height: unset;
    }

    /* Hero - Pricing (Mobile) */

    .hero--pricing .hero__title {
        text-align: center;
    }

    .hero--pricing .hero__widget {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Archive Layout (Mobile) */

    .archive-layout__section:not(:last-child) {
        margin-bottom: 80px;
    }

    .archive-layout__section-header {
        margin-bottom: 8px;
    }

    .archive-layout__section-title {
        padding-left: unset;
        font-size: 24px;
        text-align: center;
    }

    .archive-layout__section-body {
        grid-template-columns: 1fr;
    }

    .archive-layout__section-left {
        display: none;
    }

    .archive-layout__section-group:not(:last-child) {
        margin-bottom: 40px;
        padding-bottom: unset;
        border-bottom: unset;
    }

    .archive-layout__section-group-title {
        display: block;
    }

    /* Service Layout (Mobile) */

    .service-layout {
        flex-direction: column;
        margin: 0 -16px;
    }

    .service-layout__image,
    .service-layout__content {
        width: 100%;
    }

    .service-layout__image {
        position: unset;
    }

    .service-layout__content {
        padding: 32px 16px 0;
    }

    /* Countries (Mobile) */

    .countries {
        flex-wrap: wrap;
    }

    .countries__item {
        width: 50%;
    }

    /* Card - Pricing Category (Mobile) */

    .card--pricing-category .card__image {
        height: 114px;
    }

    .card--pricing-category .card__title {
        font-size: 12px;
    }

    .card--pricing-category .card__arrow {
        opacity: 1;
    }

    /* Card - Vacancy Large (Mobile) */

    .card--vacancy-lg {
        background-color: unset;
        border: unset;
    }

    .card--vacancy-lg .card__content {
        margin-top: 24px;
        padding: 0;
    }

    .card--vacancy-lg .card__suptitle {
        margin-bottom: 12px;
    }

    .card--vacancy-lg .card__excerpt {
        margin-top: 8px;
    }

    /* Quote (Mobile) */
    
    .quote {
        padding: 24px;
    }

    .quote__author {
        margin-top: 24px;
    }

    .quote__author-name {
        font-size: 16px;
    }

    /* Salon Map */

    .salon-map__links {
        flex-wrap: wrap;
        gap: 2px;
        margin-bottom: 2px;
    }

    .salon-map__link {
        flex: 1 0 100%;
    }

    /* Pricing (Mobile) */

    .pricing__controls {
        flex-direction: column;
        margin-bottom: 32px;
    }

    .pricing__control {
        width: 100%;
    }

    /* Pricing Widget (Mobile) */

    .admin-bar .pricing-widget {
        padding-top: 56px;
    }

    /* Socials - Footer (Mobile) */

    .socials--footer {
        width: 100%;
    }

    .socials--footer .socials__item {
        flex: 1 0 0;
    }

    /* Contacts - Footer (Mobile) */

    .contacts--footer {
        padding-top: 40px;
        align-items: center;
        text-align: center;
    }

    /* Copyright (Mobile) */

    .copyright {
        order: 3;
    }

    /* Scroll To Top (Mobile) */

    .scroll-to-top {
        position: unset;
        order: 1;
        transform: unset;
    }

    /* Designed (Mobile) */

    .designed {
        order: 2;
    }

    /* Slider (Mobile) */

    .slider__content {
        padding-top: 56px;
        padding-bottom: 32px;
    }

    .slider__pagination {
        order: 1;
    }

    .slider__title {
        order: 3;
        padding: 0;
        font-size: 21px;
    }

    .slider__title-cursor {
        height: 24px;
        vertical-align: top;
    }

    .slider__navigation {
        order: 2;
        margin-top: auto;
        margin-bottom: 16px;
    }

    .slider__description {
        display: none;
    }

    .slider__actions {
        order: 4;
    }

    .slider__promotion {
        display: none;
    }

    /* Service Categories (Mobile) */

    .pricing-categories__list {
        grid-template-columns: repeat(2, 1fr);
        gap: 2px;
        margin: 0 -16px;
    }

    /* Advantages (Mobile) */
    
    .advantages__title {
        grid-template-columns: 1fr;
        margin-bottom: 32px;
        font-size: 16px;
    }

    .advantages__stage {
        margin: 0 -16px;
    }

    .advantages__items {
        grid-auto-rows: 1fr;
    }

    .advantages__item-counter {
        top: 16px;
        left: 16px;
    }

    .advantages__item-content {
        padding: 16px 16px 32px;
    }

    .advantages__item-title {
        margin-bottom: 8px;
        font-size: 14px;
    }

    .advantages__item-description {
        font-size: 12px;
    }

    /* Icons Grid (Mobile) */

    .icons-grid {
        grid-template-columns: 1fr;
        row-gap: 32px;
    }

    .icons-grid__content {
        gap: 24px;
    }

    /* Map (Mobile) */

    .map::before {
        display: none;
    }

    .map__title {
        text-align: center;
    }

    .map__salons {
        inset: 156px 0 0 0;
    }

    .map__salon {
        flex-direction: column;
        transform-origin: bottom center;
    }

    .map__salon-image-wrap {
        width: 100%;
    }

    /* Latest Posts (Mobile) */

    .latest-posts__items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Testimonials (Mobile) */

    .testimonials {
        margin: 0 -16px;
    }

    .testimonials__content {
        grid-template-columns: 1fr;
        grid-auto-rows: 1fr;
    }

    .testimonials__content::after {
        width: 100%;
        bottom: 50%;
    }

    .testimonials__item {
        padding: 16px;
        font-size: 14px;
    }

    /* Media (Mobile) */

    .media {
        margin: 0 -16px;
        padding: 0 16px;
    }

    /* CTA (Mobile) */

    .cta {
        gap: 56px;
    }

    .cta__left {
        padding-right: unset;
        text-align: center;
    }

    .cta__background {
        left: calc(50% - 332px / 2 );
        width: 332px;
        height: 332px;
    }

    .cta__description {
        margin-top: 26px;
    }

    /* About (Mobile) */

    .about__title {
        flex-direction: column;
        top: 32px;
        right: 16px;
        left: 16px;
        width: unset;
        transform: unset;
    }

    .about__title::before {
        margin-top: unset;
        margin-right: unset;
        margin-bottom: 16px;
    }

    .about__image {
        height: 480px;
        object-position: center right;
    }

    /* Founders (Mobile) */

    .founders {
        padding: 80px 0;
    }

    .founders::before {
        top: unset;
        bottom: 368px;
    }

    .founders__description {
        margin-bottom: 370px;
        font-size: 18px;
        text-align: center;
    }

    .founders__image {
        top: unset;
        right: unset;
        bottom: 152px;
        left: 50%;
        max-width: unset;
        height: 558px;
        transform: translateX(calc(0px - 50% + 80px));
    }

    .founders__content {
        max-width: unset;
    }

    .founders__quote {
        max-width: unset;
        font-size: 14px;
    }

    .founders__action {
        max-width: unset;
    }

    /* Franchise Calculator (Mobile) */

    .franchise-calculator__advantage {
        padding: 16px;
    }

    .franchise-calculator__advantage-title {
        margin-bottom: 24px;
        font-size: 10px;
    }

    .franchise-calculator__advantage-content {
        font-size: 18px;
    }

    .franchise-calculator__body-left {
        padding: 40px 24px;
    }

    .franchise-calculator__param {
        flex-wrap: wrap;
    }

    .franchise-calculator__param-control {
        width: 100%;
    }

    .franchise-calculator__param-label {
        margin-bottom: 12px;
    }

    .franchise-calculator__param-value {
        margin-top: 12px;
        margin-left: unset;
        font-size: 18px;
    }

    .franchise-calculator__params-description {
        text-align: center;
    }

    .franchise-calculator__summary {
        gap: 32px;
        padding: 24px;
    }

    .franchise-calculator__summary-result {
        font-size: 48px;
        text-align: center;
    }

    .franchise-calculator__summary-result-suffix {
        display: block;
        font-size: 16px;
    }

    /* FAQ (Mobile) */

    .faq__title {
        text-align: center;
    }

    .faq__item-description {
        padding: 16px;
    }

    /* Banner (Mobile) */

    .banner__action {
        margin-top: 48px;
    }

    /* Gifts (Mobile) */

    .gifts {
        margin-bottom: 120px;
    }

    .gifts__advantages {
        right: 24px;
        bottom: 0;
        left: 24px;
        transform: translateY(50%);
    }

    /* Thank You Page (Mobile) */

    .thank-you-page__image {
        height: unset;
    }

    .thank-you-page__right {
        padding: 40px 0;
    }

    .thank-you-page__header {
        align-items: center;
        padding: 0 20px;
    }

    .thank-you-page__icon {
        width: 40px;
        height: 40px;
    }

    .thank-you-page__booking-props {
        padding: 24px 16px;
    }

    .thank-you-page__action {
        min-width: 280px;
    }

    /* Thank You - Booking CTA (Mobile) */

    .thank-you--booking-cta {
        padding: 40px 24px;
    }
}