/* =========================================================
   IMPORTS
   ========================================================= */
/* options */
@import "../../css/options/houses-list/houses-list-discount-tag.css";
@import "../../css/options/page-title/page-title-img.css";

/* client structure */
@import "client-radius.css";
@import "client-banner-hero-carousel.css";
@import "client-module-bg.css";
@import "client-navbar.css";
@import "client-services.css";
@import "client-about.css";
@import "client-guide.css";
@import "client-house-title.css";
@import "client-houses-list.css";
@import "client-page-title-img.css";
@import "client-terms.css";
@import "client-not-found.css";

/* fonts */
@import "../../css/structure/fonts/poppins.css";
@import "../../css/structure/fonts/poppins--title.css";

/* icons */
@import "../../css/structure/icons/hugeicons-stroke-rounded.css";

/* =========================================================
   CORES DO CLIENTE
   Não usar diretamente em nenhum css de css/structure.
   Usar somente aqui, para definir as variáveis dos componentes e módulos.
   ========================================================= */
:root {
    /* client color 1 */
    --client-color1-50: #FBF9F5;
    --client-color1-100: #F7F0E3;
    --client-color1-200: #EFE1C8;
    --client-color1-300: #E4CDA5;
    --client-color1-400: #D7B579;
    --client-color1-500: #CB9D50;
    --client-color1-600: #B28138;
    --client-color1-700: #916730;
    --client-color1-800: #73512B;
    --client-color1-900: #573D23;
    --client-color1-950: #322315;

    /* client color 2 */
    --client-color2: #2B2B3A;

    /* transparent black */
    --transp-black-100: rgba(22, 22, 29, 0.07);
    --transp-black-300: rgba(22, 22, 29, 0.2);
    --transp-black-500: rgba(22, 22, 29, 0.4);
    --transp-black-700: rgba(22, 22, 29, 0.65);
    --transp-black-900: rgba(22, 22, 29, 0.9);

    /* transparent white */
    --transp-white-100: rgba(251, 249, 245, 0.07);
    --transp-white-300: rgba(251, 249, 245, 0.2);
    --transp-white-500: rgba(251, 249, 245, 0.4);
    --transp-white-700: rgba(251, 249, 245, 0.65);
    --transp-white-900: rgba(251, 249, 245, 0.9);

    /* danger */
    --danger-100: #FDE8E8;
    --danger-300: #F5A3A3;
    --danger-500: #DC4C4C;
    --danger-700: #B83232;
    --danger-900: #7F2020;
    --transp-danger: #DC4C4C30;

    /* success */
    --success-100: #E8F6EB;
    --success-300: #9AD9A8;
    --success-500: #40B15C;
    --success-700: #2F8745;
    --success-900: #1D5C2D;
    --transp-success: #40B15C30;

    /* gray scale */
    --white: #ffffff;
    --gray-50: #F6F6F9;
    --gray-100: #E7E7EE;
    --gray-200: #D6D6E0;
    --gray-300: #C0C0CE;
    --gray-400: #9090A2;
    --gray-500: #68687D;
    --gray-600: #49495A;
    --gray-700: #363644;
    --gray-800: #22222B;
    --gray-900: #16161D;
    --gray-950: #0D0D12;

    /* shadows */
    --shadow-light-lg: 0 1px 30px rgb(8, 13, 21, 0.1);
    --shadow-light: 0 1px 15px rgb(8, 13, 21, 0.1);
    --shadow-light-sm: 0 1px 5px rgb(8, 13, 21, 0.1);
    --shadow-lg: 0 1px 30px rgb(8, 13, 21, 0.2);
    --shadow: 0 1px 15px rgb(8, 13, 21, 0.2);
    --shadow-sm: 0 1px 5px rgb(8, 13, 21, 0.2);
    --shadow-dark-lg: 0 2px 30px rgb(8, 13, 21, 0.35);
    --shadow-dark: 0 2px 15px rgb(8, 13, 21, 0.35);
    --shadow-dark-sm: 0 2px 5px rgb(8, 13, 21, 0.35);
}

/* =========================================================
   ANIMAÇÕES
   Itens das páginas exclusivas que animam ao aparecer.
   ========================================================= */
:root {
    --animate-client-items: ".client-about-aim, .client-about-values, .client-guide-feature";
    --animate-client-children: ".client-about-history, .client-guide-grid, .client-guide .tab-pane, .client-services > .container, .client-terms > .container";
}

/* =========================================================
   VARIÁVEIS BASE
   Podem ser usadas diretamente nos css de css/structure.
   ========================================================= */
:root {
    /* max width */
    --max-site-width: 2560px;
    --max-cont-width: 1660px;

    /* font sizes */
    --font-8: 0.5rem;
    --font-9: 0.5625rem;
    --font-10: 0.625rem;
    --font-11: 0.6875rem;
    --font-12: 0.75rem;
    --font-14: 0.875rem;
    --font-16: 1rem;
    --font-18: 1.125rem;
    --font-20: 1.25rem;
    --font-24: 1.5rem;
    --font-28: 1.75rem;
    --font-30: 1.875rem;
    --font-32: 2rem;
    --font-36: 2.25rem;
    --font-40: 2.5rem;
    --font-48: 3rem;
    --font-52: 3.25rem;
    --font-60: 3.75rem;
    --font-72: 4.5rem;
    --font-96: 6rem;

    /* borders */
    --border-radius: 8rem;
    --border-radius-input: 8rem;
    --border-radius-btn: 8rem;
    --border-w: 1px;

    /* bg */
    --bg: var(--client-color1-50);
    --bg-light: var(--client-color1-50);
    --bg-dark: var(--client-color1-200);

    /* border */
    --border: var(--gray-300);
    --border-light: var(--gray-200);
    --border-dark: var(--gray-400);

    /* fonts */
    --font: var(--gray-600);
    --font-light: var(--gray-500);
    --font-dark: var(--gray-900);

    /* text properties */
    --blockquote-border: var(--gray-200);
    --highlight-bg: var(--gray-100);
    --highlight-border: var(--gray-300);
    --mark-bg: var(--client-color1-100);
    --mark-font: var(--client-color1-700);
}

/* =========================================================
   COMPONENTES (css/structure/commons)
   ========================================================= */
:root {
    /* ---------- accessibility ---------- */
    --focus-ring: var(--client-color1-700);
    --skip-link-bg: var(--white);
    --skip-link-font: var(--font-dark);
    --skip-link-shadow: var(--shadow);

    /* ---------- buttons ---------- */
    /* --btn-uppercase: uppercase; */
    /* --btn-weight: bold; */
    --btn-primary: var(--client-color1-500);
    --btn-primary-font: var(--white);
    --btn-primary-hover: var(--client-color1-700);
    --btn-primary-font-hover: var(--white);
    --btn-secondary: var(--client-color2);
    --btn-secondary-font: var(--white);
    --btn-secondary-hover: var(--gray-900);
    --btn-secondary-font-hover: var(--white);
    --btn-action: var(--gray-100);
    --btn-action-hover: var(--gray-200);
    --btn-danger: var(--danger-500);
    --btn-danger-font: var(--white);
    --btn-danger-hover: var(--danger-700);
    --btn-success: var(--success-500);
    --btn-success-font: var(--white);
    --btn-success-hover: var(--success-700);

    /* ---------- dropdown ---------- */
    --dropdown: var(--white);
    --dropdown-font: var(--font);
    --dropdown-hover: var(--white);
    --dropdown-font-hover: var(--client-color1-500);
    --dropdown-title: var(--font-light);
    --dropdown-border: var(--border-light);
    --dropdown-shadow: var(--shadow);

    /* ---------- form ---------- */
    --form-required: var(--danger-500);
    --form-valid: var(--success-500);
    --form-invalid: var(--danger-500);

    /* ---------- input ---------- */
    --input-bg: var(--white);
    --input-border: var(--gray-300);
    --input-font: var(--gray-600);
    --input-placeholder: var(--gray-400);
    --input-focus-outline: var(--client-color1-200);
    --input-disabled-bg: var(--gray-50);
    --input-icon: var(--gray-400);
    --input-text-bg: var(--input-bg);
    --input-text-bg-hover: var(--gray-200);
    --input-text-font-hover: var(--client-color1-500);

    /* ---------- checkbox ---------- */
    --checkbox-bg: var(--white);
    --checkbox-border: var(--gray-300);
    --checkbox-checked-bg: var(--client-color1-500);
    --checkbox-checked-border: var(--client-color1-500);
    --checkbox-checked-icon: var(--white);
    --checkbox-indeterminate: var(--gray-500);

    /* ---------- multiselect ---------- */
    --multiselect-menu-bg: var(--dropdown);
    --multiselect-menu-shadow: var(--dropdown-shadow);
    --multiselect-option-font: var(--dropdown-font);
    --multiselect-option-font-hover: var(--dropdown-font-hover);
    --multiselect-option-hover: var(--dropdown-hover);
    --multiselect-option-selected: var(--client-color1-200);
    --multiselect-option-selected-font: var(--client-color1-700);
    --multiselect-tag-bg: var(--client-color1-200);
    --multiselect-tag-font: var(--client-color1-700);
    --multiselect-tag-remove-hover: var(--client-color1-200);
    --multiselect-empty: var(--font-light);

    /* ---------- phone ---------- */
    --phone-option-font: var(--input-font);
    --phone-option-font-hover: var(--client-color1-500);
    --phone-option-selected-font: var(--client-color1-500);
    --phone-dial-font: var(--font-light);
    --phone-empty: var(--font-light);
    --phone-toggle-active-bg: var(--client-color1-100);
    --phone-toggle-active-font: var(--client-color1-700);

    /* ---------- range ---------- */
    --range-slider-track: var(--gray-200);
    --range-slider-fill: var(--client-color1-500);
    --range-slider-thumb: var(--white);
    --range-slider-thumb-border: var(--client-color1-500);
    --range-slider-thumb-shadow: var(--shadow-sm);
    --range-slider-thumb-shadow-focus: var(--shadow-dark-sm);
    --range-slider-label: var(--font-dark);

    /* ---------- datepicker ---------- */
    --datepicker-bg: var(--white);
    --datepicker-shadow: var(--shadow);
    --datepicker-font: var(--font);
    --datepicker-title: var(--font-dark);
    --datepicker-nav: transparent;
    --datepicker-nav-font: var(--font);
    --datepicker-nav-hover: var(--gray-200);
    --datepicker-nav-font-hover: var(--font-dark);
    --datepicker-price: var(--font-light);
    --datepicker-disabled-font: var(--gray-300);
    --datepicker-today: var(--client-color1-500);
    --datepicker-today-border: var(--gray-100);
    --datepicker-day-hover: var(--gray-100);
    --datepicker-day-font-hover: var(--font-dark);
    --datepicker-range: var(--gray-100);
    --datepicker-range-font: var(--font);
    --datepicker-range-hover: var(--gray-300);
    --datepicker-range-font-hover: var(--font-dark);
    --datepicker-selected: var(--client-color1-500);
    --datepicker-selected-hover: var(--client-color1-700);
    --datepicker-selected-font: var(--white);
    --datepicker-min-stay: var(--font-light);
    --datepicker-min-stay-font: var(--gray-300);
    --datepicker-min-stay-icon: var(--gray-200);

    /* ---------- tooltip ---------- */
    --tooltip-bg: var(--gray-700);
    --tooltip-font: var(--white);
    --tooltip-shadow: var(--shadow-light);

    /* ---------- accordion ---------- */
    --accordion-border: var(--border-light);
    --accordion-font: var(--font-dark);
    --accordion-font-hover: var(--client-color1-500);
    --accordion-font-active: var(--client-color1-500);
    --accordion-icon: var(--client-color1-500);
    --accordion-body-font: var(--font);

    /* ---------- more options ---------- */
    --more-option-font: var(--font);
    --more-option-btn: var(--client-color1-500);
    --more-option-btn-hover: var(--client-color1-700);

    /* ---------- tabs ---------- */
    --tabs-link-bg: var(--white);
    --tabs-link-font: var(--font-dark);
    --tabs-link-icon: var(--client-color1-500);
    --tabs-link-shadow: var(--shadow-light);
    --tabs-link-hover-bg: var(--white);
    --tabs-link-hover-font: var(--client-color1-500);
    --tabs-link-active-bg: var(--client-color1-500);
    --tabs-link-active-font: var(--white);
    --tabs-scroll-track: var(--gray-100);
    --tabs-scroll-thumb: var(--gray-300);

    /* ---------- gallery ---------- */
    --gallery-title: var(--font-dark);
    --gallery-caption-bg: var(--transp-black-700);
    --gallery-caption-font: var(--white);
    --gallery-modal-bg: var(--transp-black-900);
    --gallery-modal-font: var(--white);
    --gallery-modal-counter: var(--transp-white-700);
    --gallery-modal-btn: var(--transp-black-700);
    --gallery-modal-btn-font: var(--white);
    --gallery-modal-btn-hover: var(--white);
    --gallery-modal-btn-hover-font: var(--font-dark);
    --gallery-modal-group-title: var(--white);
    --gallery-modal-divider: var(--transp-white-300);
    --gallery-modal-thumb-hover: var(--transp-white-500);
    --gallery-modal-thumb-active: var(--client-color1-500);

    /* ---------- modal ---------- */
    --modal-bg-transparent: var(--transp-black-700);
    --modal-content-bg: var(--white);
    --modal-close-font: var(--gray-300);
    --modal-close-font-hover: var(--gray-700);
    --modal-error: var(--danger-500);
    --modal-success: var(--success-500);
    --modal-shadow: var(--shadow-dark);

    /* ---------- alert ---------- */
    --alert-bg: var(--gray-100);
    --alert-danger-bg: var(--danger-100);
    --alert-danger-font: var(--danger-700);
    --alert-danger-border: var(--danger-700);
    --alert-success-bg: var(--success-100);
    --alert-success-font: var(--success-700);
    --alert-success-border: var(--success-700);
}

/* =========================================================
   MÓDULOS (css/structure/modules)
   ========================================================= */
:root {
    /* ---------- navbar ---------- */
    --logo-max-width: 200px;

    /* --navbar-uppercase: uppercase; */
    /* --navbar-weight: bold; */
    --navbar-bg: var(--client-color1-100);
    --navbar-link-font: var(--font-dark);
    --navbar-link-hover: var(--client-color1-500);
    --navbar-link-font-hover: var(--client-color1-500);
    --navbar-action: transparent;
    --navbar-action-hover: var(--client-color1-100);
    --navbar-action-font: var(--font-dark);
    --navbar-action-font-hover: var(--client-color1-900);
    --navbar-dropdown-divider: var(--gray-100);
    --navbar-nav-mobile-bg: var(--white);
    --navbar-nav-mobile-shadow: var(--shadow-light-lg);
    --navbar-nav-mobile-divider: var(--gray-300);
    --navbar-nav-mobile-dropdown-bg: var(--client-color1-100);
    --navbar-nav-mobile-backdrop: var(--transp-white-700);

    /* ---------- navbar small ---------- */
    --navbar-small-bg: var(--navbar-bg);
    --navbar-small-shadow: var(--shadow-dark-lg);
    --navbar-small-search-border-w: 1px;
    --navbar-small-search-bg: var(--transp-black-100);
    --navbar-small-search-border: var(--transp-white-700);
    --navbar-small-search-shadow: none;

    /* ---------- search ---------- */
    --search-border-w: 2px;
    --search-bg: var(--transp-white-100);
    --search-border: var(--white);
    --search-shadow: 0 1rem 2rem rgb(8, 13, 21, 0.08);
    --search-font: var(--font-dark);
    --search-input-bg: transparent;
    --search-input-border: transparent;
    --search-input-border-mobile: var(--border-light);
    --search-input-text-bg: transparent;
    --search-more-font-hover: var(--client-color1-500);
    --search-more-btn-active: var(--white);
    --search-more-btn-active-font: var(--client-color1-700);
    --search-more-bg: var(--white);
    --search-more-shadow: var(--shadow-light-lg);
    --search-more-border: var(--border-light);
    --search-more-input-border: var(--border);
    --search-more-label: var(--font-dark);
    --search-more-badge: var(--client-color1-500);
    --search-more-badge-font: var(--white);
    --search-more-multiselect-bg: var(--client-color1-100);
    --search-more-multiselect-input-bg: var(--white);

    /* ---------- banner hero ---------- */
    --banner-hero-gradient: var(--bg);
    --banner-hero-title: var(--font-dark);
    --banner-hero-font: var(--font-dark);
    --banner-hero-indicator: var(--transp-black-300);
    --banner-hero-indicator-active: var(--gray-800);

    /* ---------- house hero ---------- */
    --house-hero-carousel-control: var(--transp-white-700);
    --house-hero-carousel-control-font: var(--font-dark);
    --house-hero-carousel-control-hover: var(--white);
    --house-hero-carousel-control-hover-font: var(--client-color1-500);
    --house-hero-carousel-indicator: var(--transp-black-300);
    --house-hero-carousel-indicator-active: var(--gray-800);
    --house-hero-carousel-btn: var(--client-color1-500);
    --house-hero-carousel-btn-font: var(--white);
    --house-hero-carousel-btn-hover: var(--client-color1-700);
    --house-hero-carousel-btn-hover-font: var(--white);
    --house-hero-carousel-btn-shadow: var(--shadow-light);

    /* ---------- house title ---------- */
    --house-title-resort: var(--client-color1-500);
    --house-title-title: var(--font-dark);
    --house-title-line: var(--client-color1-500);
    --house-title-reviews: var(--font-light);
    --house-title-star: var(--client-color1-500);
    --house-title-address: var(--font);
    --house-title-address-icon: var(--client-color1-500);
    --house-title-amenity-border: var(--border-light);
    --house-title-amenity-font: var(--font);
    --house-title-amenity-icon: var(--client-color1-500);
    --house-title-amenity-strong: var(--font-dark);

    /* ---------- house content ---------- */
    --house-content-text: var(--font);
    --house-content-title: var(--font-dark);
    --house-content-title-strong: var(--font-dark);
    --house-content-title-line: var(--client-color1-500);
    --house-content-divider: var(--border-light);
    --house-content-subtitle: var(--font-dark);
    --house-content-amenity-title: var(--client-color1-500);
    --house-content-bedroom-border: var(--border-light);
    --house-content-bedroom-bed: var(--font);
    --house-content-bedroom-icon: var(--client-color1-500);
    --house-content-bedroom-title: var(--font-dark);
    --house-content-bedroom-tag: var(--client-color1-500);
    --house-content-feature-font: var(--font);
    --house-content-feature-icon: var(--client-color1-500);
    --house-content-distance-divider: var(--border-light);
    --house-content-distance-strong: var(--font-dark);
    --house-content-review-border: var(--border-light);
    --house-content-review-name: var(--font-dark);
    --house-content-review-date: var(--font-light);
    --house-content-review-star: var(--client-color1-500);

    /* ---------- house price ---------- */
    --house-price-bg: var(--white);
    --house-price-shadow: var(--shadow-light-lg);
    --house-price-font: var(--font);
    --house-price-title: var(--font-dark);
    --house-price-value: var(--font-dark);
    --house-price-item-detail: var(--gray-400);
    --house-price-discount: var(--success-500);
    --house-price-divider: var(--border-light);
    --house-price-summary-bg: var(--client-color1-100);
    --house-price-total: var(--font-dark);
    --house-price-down: var(--font);
    --house-price-down-strong: var(--client-color1-500);
    --house-price-btn-shadow: var(--shadow-light);
    --house-price-toggle: var(--white);
    --house-price-toggle-hover: var(--gray-50);
    --house-price-toggle-font: var(--font-dark);
    --house-price-toggle-book: var(--client-color1-500);
    --house-price-toggle-shadow: var(--shadow-dark);
    --house-price-floating-shadow: var(--shadow-dark-lg);
    --house-price-empty: var(--font-light);
    --house-price-help: var(--font-light);
    --house-price-help-link: var(--font-light);
    --house-price-help-link-hover: var(--client-color1-500);
    --house-price-help-icon: var(--font-light);

    /* ---------- page title ---------- */
    --page-title-img-gradient: var(--bg);
    --page-title-title: var(--font-dark);
    --page-title-strong: var(--font-dark);
    --page-title-line: var(--client-color1-500);
    --page-title-font: var(--font-dark);

    /* ---------- module title ---------- */
    --module-title-font: var(--font-dark);
    --module-title-strong: var(--font-dark);
    --module-title-line: var(--client-color1-500);

    /* ---------- houses list ---------- */
    --houses-list-bg: var(--white);
    --houses-list-inner-bg: var(--bg);
    --houses-list-shadow: var(--shadow-light);
    --houses-list-shadow-hover: var(--shadow-light-lg);
    --houses-list-font-light: var(--font-light);
    --houses-list-title: var(--font-dark);
    --houses-list-divider: var(--client-color1-500);
    --houses-list-price-total: var(--font-dark);
    --houses-list-price-nights: var(--font-light);
    --houses-list-price-per-night: var(--font-light);
    --houses-list-price-old: var(--font-light);
    --houses-list-price-discount: var(--client-color1-500);
    --houses-list-discount-bg: var(--client-color1-500);
    --houses-list-discount-font: var(--white);
    --houses-list-discount-shadow: 0 3px 6px rgb(8, 13, 21, 0.3);
    --houses-list-discount-string: var(--gray-500);
    --houses-list-img-indicator: var(--white);
    --houses-list-img-indicator-track: var(--transp-white-500);
    --houses-list-img-control-bg: var(--white);
    --houses-list-img-control-font: var(--font-dark);
    --houses-list-img-control-font-hover: var(--client-color1-500);
    --houses-list-img-control-shadow: var(--shadow-light);
    --houses-list-link: var(--client-color1-700);
    --houses-list-link-hover: var(--client-color1-900);
    --houses-list-link-icon-bg: var(--client-color1-200);
    --houses-list-link-icon-bg-hover: var(--client-color1-500);

    /* ---------- houses list carousel ---------- */
    --houses-list-carousel-control: var(--client-color1-700);
    --houses-list-carousel-control-hover: var(--client-color1-900);
    --houses-list-carousel-progress: var(--client-color1-200);
    --houses-list-carousel-progress-active: var(--client-color1-700);

    /* ---------- houses list tab ---------- */
    --houses-list-tab-link-bg: transparent;
    --houses-list-tab-link-border: var(--border-light);
    --houses-list-tab-link-icon: var(--font-dark);
    --houses-list-tab-link-label: var(--font);
    --houses-list-tab-link-title: var(--font-dark);
    --houses-list-tab-link-title-hover: var(--client-color1-500);
    --houses-list-tab-link-active-bg: var(--white);
    --houses-list-tab-link-active-border: var(--client-color1-500);
    --houses-list-tab-link-active-icon: var(--client-color1-500);
    --houses-list-tab-link-active-title: var(--client-color1-500);

    /* ---------- houses list big ---------- */
    --houses-list-header-divider: var(--border-light);
    --houses-list-header-count: var(--font-dark);
    --houses-list-header-count-strong: var(--client-color1-500);
    --houses-list-header-filter-bg: transparent;
    --houses-list-header-filter-font: var(--font);
    --houses-list-header-filter-icon: var(--client-color1-500);
    --houses-list-empty-icon: var(--client-color1-500);
    --houses-list-empty-icon-bg: var(--client-color1-50);
    --houses-list-empty-title: var(--font-dark);
    --houses-list-empty-text: var(--font-light);
    --houses-list-header-filter-border: var(--border);
    --houses-list-header-sort-bg: var(--white);
    --houses-list-header-sort-font: var(--font-dark);
    --houses-list-header-sort-label: var(--font-light);
    --houses-list-header-sort-bg-hover: var(--white);
    --houses-list-header-sort-font-hover: var(--client-color1-500);
    --houses-list-header-sort-shadow: var(--shadow-light-sm);
    --houses-list-view-bg: var(--btn-primary);
    --houses-list-view-font: var(--btn-primary-font);
    --houses-list-view-bg-hover: var(--btn-primary-hover);
    --houses-list-view-font-hover: var(--btn-primary-font-hover);
    --houses-list-map-bg: var(--gray-50);
    --houses-list-map-shadow: var(--shadow-light-sm);
    --houses-list-map-preview-line: var(--white);
    --houses-list-map-note-bg: var(--white);
    --houses-list-map-note-font: var(--font-light);
    --houses-list-map-pin-bg: var(--client-color1-500);
    --houses-list-map-pin-font: var(--white);
    --houses-list-map-pin-active-bg: var(--font-dark);
    --houses-list-map-pin-active-font: var(--white);
    --houses-list-map-pin-shadow: var(--shadow-light);
    --houses-list-map-card-shadow: var(--shadow-light-lg);
    --houses-list-map-card-close-bg: var(--white);
    --houses-list-map-card-close-font: var(--font-dark);

    /* ---------- resorts list ---------- */
    --resorts-list-header-border: var(--border-light);
    --resorts-list-count: var(--font-dark);
    --resorts-list-count-strong: var(--client-color1-500);
    --resorts-list-filter-bg: transparent;
    --resorts-list-filter-font: var(--font);
    --resorts-list-filter-icon: var(--client-color1-500);
    --resorts-list-filter-border: var(--border);
    --resorts-list-sort-bg: var(--white);
    --resorts-list-sort-font: var(--font-dark);
    --resorts-list-sort-label: var(--font-light);
    --resorts-list-sort-bg-hover: var(--white);
    --resorts-list-sort-font-hover: var(--client-color1-500);
    --resorts-list-sort-shadow: var(--shadow-light-sm);
    --resorts-list-bg: var(--white);
    --resorts-list-inner-bg: var(--bg);
    --resorts-list-shadow: var(--shadow-light);
    --resorts-list-shadow-hover: var(--shadow-light-lg);
    --resorts-list-stars: var(--client-color1-500);
    --resorts-list-title: var(--font-dark);
    --resorts-list-divider: var(--client-color1-500);
    --resorts-list-homes: var(--font-light);
    --resorts-list-homes-strong: var(--font-dark);

    /* ---------- pagination ---------- */
    --pagination-bg: transparent;
    --pagination-font: var(--font);
    --pagination-border: var(--border);
    --pagination-hover: var(--border);
    --pagination-font-hover: var(--font);
    --pagination-hover-border: var(--border);
    --pagination-active: var(--client-color1-500);
    --pagination-active-font: var(--white);

    /* ---------- resorts ---------- */
    --resorts-bg: var(--white);
    --resorts-inner-bg: var(--bg);
    --resorts-shadow: var(--shadow-light);
    --resorts-shadow-hover: var(--shadow-light-lg);
    --resorts-stars: var(--client-color1-500);
    --resorts-title: var(--font-dark);
    --resorts-count: var(--font-light);
    --resorts-count-icon: var(--client-color1-500);
    --resorts-text: var(--font);
    --resorts-amenities-font: var(--font);
    --resorts-amenities-icon: var(--client-color1-500);
    --resorts-divider: var(--client-color1-500);
    --resorts-link: var(--client-color1-700);
    --resorts-link-hover: var(--client-color1-900);
    --resorts-link-icon-bg: var(--client-color1-200);
    --resorts-link-icon-bg-hover: var(--client-color1-500);

    /* ---------- booking steps ---------- */
    --booking-steps-icon: var(--client-color1-500);
    --booking-steps-icon-bg: var(--white);
    --booking-steps-icon-shadow: var(--shadow-light);
    --booking-steps-number: var(--client-color1-700);
    --booking-steps-title: var(--font-dark);
    --booking-steps-text: var(--font);
    --booking-steps-arrow: var(--client-color1-500);
    --booking-steps-link: var(--client-color1-700);
    --booking-steps-link-hover: var(--client-color1-900);
    --booking-steps-link-icon-bg: var(--client-color1-200);
    --booking-steps-link-icon-bg-hover: var(--client-color1-500);

    /* ---------- contact ---------- */
    --contact-title: var(--font-dark);
    --contact-title-strong: var(--font-dark);
    --contact-divider: var(--client-color1-500);
    --contact-text: var(--font);
    --contact-item-icon: var(--client-color1-500);
    --contact-item-icon-bg: var(--white);
    --contact-item-icon-shadow: var(--shadow-light);
    --contact-item-icon-hover: var(--white);
    --contact-item-icon-bg-hover: var(--client-color1-500);
    --contact-item-label: var(--font-light);
    --contact-item-value: var(--font-dark);
    --contact-social: var(--client-color1-500);
    --contact-social-border: var(--client-color1-200);
    --contact-social-hover: var(--white);
    --contact-social-bg-hover: var(--client-color1-500);
    --contact-form-bg: var(--white);
    --contact-form-shadow: var(--shadow-light-lg);
    --contact-consent: var(--font);
    --contact-consent-link: var(--client-color1-700);
    --checkout-box-bg: var(--white);
    --checkout-box-shadow: var(--shadow-light-lg);
    --checkout-title: var(--font-dark);
    --checkout-divider: var(--border-light);
    --checkout-consent: var(--font);
    --checkout-consent-link: var(--client-color1-700);
    --checkout-policy-link: var(--font);
    --checkout-policy-link-hover: var(--client-color1-500);
    --checkout-extra-border: var(--border-light);
    --checkout-extra-active-border: var(--client-color1-500);
    --checkout-extra-active-bg: var(--client-color1-50);
    --checkout-extra-title: var(--font-dark);
    --checkout-extra-text: var(--font-light);
    --checkout-extra-price: var(--font-dark);
    --checkout-house-title: var(--font-dark);
    --checkout-house-feature: var(--font);
    --checkout-house-icon: var(--client-color1-500);
    --checkout-stay-label: var(--font-light);
    --checkout-stay-value: var(--font-dark);

    /* ---------- checkout success ---------- */
    --checkout-success-bg: var(--white);
    --checkout-success-shadow: var(--shadow-light-lg);
    --checkout-success-icon: var(--white);
    --checkout-success-icon-bg: var(--success-500);
    --checkout-success-title: var(--font-dark);
    --checkout-success-title-strong: var(--client-color1-500);
    --checkout-success-text: var(--font);
    --checkout-success-text-strong: var(--font-dark);
    --checkout-success-code-border: var(--gray-300);
    --checkout-success-code-label: var(--font-light);
    --checkout-success-code: var(--font-dark);
    --checkout-success-divider: var(--border-light);
    --checkout-success-house-title: var(--font-dark);
    --checkout-success-stay-label: var(--font-light);
    --checkout-success-stay-value: var(--font-dark);
    --checkout-success-list-font: var(--font);
    --checkout-success-list-detail: var(--gray-400);
    --checkout-success-list-value: var(--font-dark);
    --checkout-success-discount: var(--success-500);
    --checkout-success-summary-bg: var(--client-color1-100);
    --checkout-success-summary-font: var(--font);
    --checkout-success-summary-value: var(--font-dark);

    --quote-summary-border: var(--border-light);
    --quote-summary-font: var(--font);
    --quote-summary-icon: var(--client-color1-500);
    --quote-summary-arrow: var(--font-light);
    --quote-summary-strong: var(--font-dark);

    --quote-note-font: var(--font);
    --quote-note-alert-bg: var(--client-color1-100);
    --quote-note-alert-font: var(--font-dark);
    --quote-note-alert-icon: var(--client-color1-500);
    --quote-note-sign: var(--font-dark);

    /* ---------- not found ---------- */
    --not-found-code-size: 10rem;
    --not-found-code-size-sm: var(--font-72);
    --not-found-code: var(--client-color1-200);
    --not-found-house-bg: var(--client-color1-500);
    --not-found-house-icon: var(--white);
    --not-found-house-shadow: var(--shadow-light-lg);
    --not-found-title: var(--font-dark);
    --not-found-title-strong: var(--client-color1-500);
    --not-found-text: var(--font);

    /* ---------- newsletter ---------- */
    --newsletter-bg: transparent;
    --newsletter-border: var(--white);
    --newsletter-shadow: var(--shadow-light-lg);
    --newsletter-line: var(--client-color1-500);
    --newsletter-title: var(--font-dark);
    --newsletter-text: var(--font);
    --newsletter-icon: var(--client-color1-500);
    --newsletter-input-border: var(--gray-100);
    --newsletter-success: var(--client-color1-500);
    --newsletter-success-icon: var(--client-color1-500);

    /* ---------- footer ---------- */
    --footer-bg-gradient: #E9E2D7;
    --footer-font: var(--font);
    --footer-contact: var(--font);
    --footer-contact-hover: var(--client-color1-500);
    --footer-social: var(--client-color1-500);
    --footer-social-hover: var(--client-color1-700);
    --footer-divider: var(--border);
    --footer-copyright: var(--font-light);
    --footer-link: var(--font);
    --footer-link-hover: var(--client-color1-500);

    /* ---------- whatsapp pop ---------- */
    --whatsapp-pop-bg: var(--white);
    --whatsapp-pop-bg-hover: var(--success-100);
    --whatsapp-pop-font: var(--success-500);
    --whatsapp-pop-icon: var(--success-500);
    --whatsapp-pop-shadow: var(--shadow-light);

    /* ---------- client services ---------- */
    --client-services-img-bg: var(--white);
    --client-services-shadow: var(--shadow-light);
    --client-services-number: var(--client-color1-500);
    --client-services-title: var(--font-dark);
    --client-services-divider: var(--client-color1-500);
    --client-services-text: var(--font);

    /* ---------- client about ---------- */
    --client-about-line: var(--client-color1-500);
    --client-about-dot: var(--client-color1-500);
    --client-about-dot-border: var(--bg);
    --client-about-year: var(--client-color1-500);
    --client-about-text: var(--font);
    --client-about-lead: var(--font-dark);
    --client-about-img-bg: var(--white);
    --client-about-shadow: var(--shadow-light);
    --client-about-aim: var(--font-dark);
    --client-about-aim-strong: var(--client-color1-500);
    --client-about-quote: var(--client-color1-500);
    --client-terms-font: var(--font);
    --client-terms-title: var(--font-dark);

    /* ---------- famous guests ---------- */
    --famous-guests-bg: var(--white);
    --famous-guests-shadow: var(--shadow-light);
    --famous-guests-img-bg: transparent;
    --famous-guests-name: var(--font-dark);
    --famous-guests-role: var(--font-light);

    /* ---------- client guide ---------- */
    --client-guide-card-bg: var(--white);
    --client-guide-img-bg: var(--white);
    --client-guide-shadow: var(--shadow-light);
    --client-guide-tag: var(--client-color1-500);
    --client-guide-title: var(--font-dark);
    --client-guide-divider: var(--client-color1-500);
    --client-guide-text: var(--font);
    --client-guide-tab-bg: var(--white);
    --client-guide-tab-font: var(--font-dark);
    --client-guide-tab-hover: var(--client-color1-500);
    --client-guide-tab-border: var(--border-light);
    --client-guide-tab-shadow: none;
    --client-guide-tab-number: var(--client-color1-500);
    --client-guide-tab-active: var(--client-color1-500);
    --client-guide-tab-active-font: var(--white);
    --client-guide-tab-divider: var(--border-light);
    --client-guide-tab-title: var(--client-color1-500);
}

/* =========================================================
   REFERÊNCIA (não usar)
   ========================================================= */
/* rem to px (only for reference, not use):
                1px
    0.125rem    2px
    0.25rem     4px
    0.375rem    6px
    0.5rem      8px
    0.625rem    10px
    0.75rem     12px
    0.875rem    14px
    1rem        16px
    1.25rem     20px
    1.5rem      24px
    1.75rem     28px
    2rem        32px
    2.25rem     36px
    2.5rem      40px
    2.75rem     44px
    3rem        48px
    3.5rem      56px
    4rem        64px
    4.5rem      72px
    5rem        80px
    6rem        96px
    7rem        112px
    8rem        128px
    9rem        144px
    10rem       160px
    11rem       176px
    12rem       192px
    13rem       208px
    14rem       224px
    15rem       240px
    16rem       256px
    18rem       288px
    20rem       320px
    24rem       384px */
/* -- for reference
@container (max-width: 640px) {
@container (max-width: 768px) {
@container (max-width: 1024px) {
@container (max-width: 1280px) {
@container (max-width: 1540px) {
-- */

/* módulos que este cliente não usa */
.partners,
.review-home,
.banner-small,
.house-hero-mosaic {
    display: none;
}