:root {
    --w: min(100vw, calc(100vh * 9 / 16), 1080px);
    --u: calc(var(--w) / 100);
    --app-h: 100vh;
    /* fallback */
    --w: min(100vw, calc(var(--app-h) * 9 / 16), 1080px);
    --font-2: "Inter", sans-serif;
    --bg: #14100d;
    --panel: #1c1712;
    --ink: #efe6db;
    --muted: #9c8d7d;
    --light: #E1C1A8;
    --dark: #84613B;
    --line: rgba(132, 97, 59, 0.28);
}

@supports (height: 100dvh) {
    :root {
        --w: min(100vw, calc(100dvh * 9 / 16), 1080px);
    }
}

html,
body {
    margin: 0;
    margin-top: 0 !important;
    width: 100%;
    height: 100%;
    min-height: 100%;
    font-family: "Playfair Display", serif;
    font-size: clamp(12px, calc(1.481 * var(--u)), 16px);
    background-color: #000;
}

body {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

#main,
div#wrapper,
.main-section,
.banner-main,
.slider-main img {
    height: var(--app-h) !important;
}

.main-section,
.banner-main {
    padding-top: 0 !important;
}

@property --angle {
    syntax: "<angle>";
    initial-value: 0deg;
    inherits: false;
}

.button.btn-main,
.line-angle {
    position: relative;
    isolation: isolate;
}

.button.btn-main::before,
.line-angle::before {
    content: '';
    position: absolute;
    inset: -1.5px;
    border-radius: inherit;
    padding: 2px;
    z-index: -1;
    background: conic-gradient(from var(--angle),
            transparent 0deg,
            var(--dark) 6deg,
            var(--light) 14deg,
            var(--dark) 22deg,
            transparent 30deg,
            transparent 180deg,
            var(--dark) 186deg,
            var(--light) 194deg,
            var(--dark) 202deg,
            transparent 210deg,
            transparent 360deg);
    -webkit-mask: linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    animation: angle_c 4.4s linear infinite;
}

@keyframes angle_c {
    to {
        --angle: 360deg;
    }
}

.dark td,
.dark th {
    border-color: rgb(255 255 255 / 30%);
}

.slider-main .flickity-enabled.is-draggable .flickity-viewport {
    /* height: 100vh !important; */
}

.tvc-screen {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    background: #000;
    touch-action: none;
}

.tvc-screen.active {
    display: block;
}

.tvc-video {
    pointer-events: none;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ---------- Khung chÃ­nh ---------- */
#main {
    width: var(--w);
    height: calc(var(--w) * 16 / 9);
    height: 100vh;
    height: 100dvh;
    flex: none;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    container-type: inline-size;
    background-color: #000;
}

div#wrapper {
    height: 100dvh;
    height: 100vh;
    background: #000;
}

.slider-main img {
    height: 100vh;
    height: 100dvh;
    object-fit: cover;
}

/* ---------- Title ---------- */
.title h1 {
    font-size: calc(6.260 * var(--u));
    text-transform: uppercase;
    margin-bottom: 0;
    font-weight: bold;
}

.title h1 strong {
    color: var(--primary-color);
}

.title h2 {
    font-size: calc(4.305 * var(--u));
    margin: 0 0 calc(0.93 * var(--u));
}

.title p {
    font-family: var(--font-2);
    font-size: calc(2.408 * var(--u));
    text-transform: uppercase;
    letter-spacing: calc(0.37 * var(--u));
    margin: 0;
}

.desc-sm {
    margin: calc(6.481 * var(--u)) 0;
}

.desc-sm * {
    text-transform: uppercase;
    font-size: calc(1.794 * var(--u));
    margin: 0;
    letter-spacing: calc(0.37 * var(--u));
    font-family: var(--font-2);
}

.wrap-section .section-content {
    padding: calc(5.3811 * var(--u));
}

/* ---------- Button ---------- */
.button.btn-main {
    font-size: calc(3.049 * var(--u));
    border-radius: calc(1.481 * var(--u)) !important;
    line-height: calc(7.623 * var(--u));
    font-weight: 500;
    font-family: var(--font-2);
}

.button.btn-main.primary {
    background: linear-gradient(180deg, #E1C1A8 0%, #84613B 100%);
    color: #000;
}

a.button.btn-main .tooltipster-base,
div#masthead,
.absolute-footer {
    display: none !important;
}

/* ---------- Header ---------- */
div#wide-nav {
    padding: calc(5.3811 * var(--u));
}

.header .flex-row {
    padding: 0;
}

.back-link {
    font-size: calc(5 * var(--u));
    color: #fff;
    width: calc(4 * var(--u));
    line-height: 1;
    display: none;
}

div#wide-nav.not-home .flex-row.container {
    width: max-content;
    margin: 0;
    margin-left: auto;
}

div#wide-nav.not-home #header-contact {
    margin-right: calc(2 * var(--u)) !important;
}

div#wide-nav.not-home .back-link {
    display: block;
}

.nav>li>a {
    padding: 0;
    font-size: clamp(12px, calc(1.481 * var(--u)), 16px);
}

.nav-dropdown {
    min-width: calc(9.26 * var(--u));
    padding: 0;
    transform: translateX(21px);
    right: unset !important;
}

/* thay gap */
.nav-dropdown>li>a {
    padding: calc(0.46 * var(--u));
    display: flex;
    align-items: center;
}

.nav-dropdown>li>a>i,
.nav-dropdown>li>a>img {
    margin-right: calc(0.93 * var(--u));
}

.nav-dropdown>li>a i.icon-image {
    top: calc(-0.28 * var(--u));
}

.header .icon-phone:before {
    width: calc(3.767 * var(--u));
    height: calc(3.767 * var(--u));
    background: url(../icons/phone.svg) center / contain no-repeat;
    display: block;
    content: "";
}

.header .nav>li>.header-language-dropdown__link {
    font-size: calc(3.057 * var(--u));
    color: #fff !important;
    font-weight: normal;
    font-family: var(--font-2);
}

.header-language-dropdown__link::before {
    content: "";
    width: calc(3.767 * var(--u));
    height: calc(3.767 * var(--u));
    background: url(../icons/global.svg) center / contain no-repeat;
    margin-right: calc(0.837 * var(--u));
}

.header-language-dropdown__link img {
    display: none;
}

.header-language-dropdown .nav-dropdown>li>a {
    font-family: var(--font-2);
    font-size: calc(3.057 * var(--u));
}

ul.nav.header-bottom-nav.nav-center.mobile-nav {
    justify-content: space-between;
}

footer {
    position: unset !important;
    z-index: 99;
    bottom: 0;
}

/* ---------- Menu dÆ°á»›i ---------- */
.menu_bottom {
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    left: 0;
    right: 0;
    z-index: 99;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    padding: calc(3.587 * var(--u)) calc(10.762 * var(--u));
    padding-bottom: calc(3.587 * var(--u) + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #fff;
}

.menu_bottom a {
    display: flex;
    align-items: center;
    color: #fff;
    flex-direction: column;
    font-size: clamp(12px, calc(2.153 * var(--u)), 23.25px);
    text-transform: uppercase;
    font-family: var(--font-2);
}

.menu_bottom a img {
    width: clamp(20px, calc(4.305 * var(--u)), 46.49px);
    height: clamp(20px, calc(4.305 * var(--u)), 46.49px);
}

.home .menu_bottom {
    padding: calc(5.3811 * var(--u));
    border: 0;
    bottom: calc(13.8889 * var(--u));
}

.home .menu_bottom .item {
    flex: 1;
}

.home .menu_bottom .item+.item {
    margin-left: calc(2.153 * var(--u));
}

.home .menu_bottom a {
    flex-direction: row;
    font-size: clamp(12px, calc(2.511 * var(--u)), 27.12px);
    border: 1.2px solid #C09B78;
    flex: 1;
    width: 100%;
    height: calc(12.287 * var(--u));
    justify-content: center;
    border-radius: calc(1.481 * var(--u));
    position: relative;
}

.home .menu_bottom a img {
    margin-right: calc(1.481 * var(--u));
}

body:not(.home) .menu_bottom .active a img {
    filter: brightness(0) saturate(100%) invert(68%) sepia(19%) saturate(560%) hue-rotate(349deg) brightness(87%) contrast(88%);
}

body:not(.home) .menu_bottom .active a {
    color: var(--primary-color);
}

body:not(.home) .menu_bottom a::before {
    display: none;
}

.home .menu_bottom .active a {
    background: url(../images/bg-menu.png) center / cover no-repeat;
}

/* ---------- Banner / main section ---------- */
.main-section {
    width: 100%;
    padding: 0 !important;
    padding-top: 177.7778% !important;
    /* % theo bá» rá»™ng wrapper -> luÃ´n Ä‘Ãºng 9:16 */
    box-sizing: border-box;
    overflow: hidden;
    height: 100vh;
}

.main-section .section-content {
    height: 100%;
    width: 100%;
    position: absolute !important;
    top: 0;
    left: 0;
}

.slider-main {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.banner-main-desc {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    padding: 0 calc(5.4 * var(--u));
    text-transform: uppercase;
}

.banner-main-desc h1 {
    font-size: calc(9.59 * var(--u));
    font-weight: 800;
    padding-bottom: calc(1.852 * var(--u));
    margin-bottom: calc(1.852 * var(--u));
    position: relative;
    text-transform: uppercase;
}

.banner-main-desc h1::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30.19%;
    height: 1px;
    background-color: #fff;
}

.banner-main .title h1,
.banner-main .title h2 {
    font-weight: bold;
}

.banner-main-desc p {
    margin: 0;
    font-size: calc(3.767 * var(--u));
    font-family: var(--font-2);
}

.banner-main-desc em {
    background: linear-gradient(91.22deg, #ECC591 9.3%, #FAE2B8 25.39%, #FEEDC1 42.52%, #F9EED1 60.67%, #F4D7AE 80.72%, #ECCE91 95.83%);
    -webkit-background-clip: text;
    font-family: "Playfair Display", serif;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    display: inline-block;
    text-transform: none;
    font-weight: 500;
}

.banner-main {
    min-height: 0;
}

.banner-main .overlay {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    background-color: transparent !important;
    height: 70%;
    bottom: 0;
    top: auto;
}

.banner-main .text-box {
    padding: calc(5.3811 * var(--u));
    bottom: calc(44.815 * var(--u)) !important;
    top: auto !important;
}

.banner-main .title p {
    text-transform: none;
    letter-spacing: 0.25px;
}

/* thay gap */
.action-main {
    position: absolute;
    bottom: calc(30 * var(--u));
    z-index: 99;
    right: 0;
    left: 0;
    margin: 0 auto;
    justify-content: center;
}

.action-main>*+* {
    margin-left: calc(3.22 * var(--u)) !important;
}

/* ---------- Slider ---------- */
.cus-slider .previous {
    display: none;
}

.cus-slider .next {
    display: block !important;
}

.slide-counter,
.cus-slider .flickity-page-dots,
.cus-slider .flickity-button {
    top: auto;
    bottom: calc(43 * var(--u));
    transform: none !important;
    opacity: 1;
}

.cus-slider .flickity-page-dots {
    margin-bottom: calc(1 * var(--u));
}

.slide-counter {
    position: absolute;
    left: calc(5.3811 * var(--u));
    font-size: calc(2.511 * var(--u));
    color: #fff;
    z-index: 2;
    font-family: var(--font-2);
}

.cus-slider li.dot {
    border: 0;
    background-color: #8E8E93;
    width: calc(2.331 * var(--u)) !important;
    height: calc(0.463 * var(--u)) !important;
    border-radius: 30px !important;
    opacity: 1;
}

.cus-slider li.dot.is-selected {
    background: #C09B78 !important;
    opacity: 1;
    border: 0;
}

.banner-layers.container {
    margin: 0;
    padding: 0 !important;
}

/* ---------- Product detail ---------- */
.product-detail {
    background-color: #000;
    position: relative;
    height: 100%;
}

.product-gallery {
    position: relative;
}

.product-gallery-item img {
    width: 100%;
}

.product-gallery-silder button.flickity-button.flickity-prev-next-button {
    z-index: 99;
    opacity: 1;
    transform: translateY(calc(-18.5 * var(--u))) !important;
}

.slider-main button.flickity-button.flickity-prev-next-button svg,
.product-gallery-silder button.flickity-button.flickity-prev-next-button svg {
    width: calc(3.767 * var(--u));
    height: calc(3.767 * var(--u));
    padding: 0;
}

.product-gallery-silder::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgb(0 0 0) 0, rgba(255, 255, 255, 0) 71%);
}

.product-info {
    position: absolute;
    z-index: 2;
    bottom: calc(13.889 * var(--u));
    left: 0;
    width: 100%;
    padding: calc(5.3811 * var(--u));
    overflow: hidden;
    font-family: var(--font-2);
    font-size: calc(2.331 * var(--u));
}

.product-info-cat {
    font-size: calc(1.794 * var(--u));
    text-transform: uppercase;
    letter-spacing: calc(0.37 * var(--u));
    font-weight: 600;
}

.product-info h1 {
    font-size: calc(5.92 * var(--u));
    color: #C09B78;
    margin: 0;
}

.product-info .entry-content {
    padding: 0;
}

.product-action {
    justify-content: center;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-top: calc(6.481 * var(--u));
}

.flickity-slider>div:not(.col).product-thumb-item,
.product-thumb-item {
    margin-right: calc(0.718 * var(--u));
    width: calc(6.481 * var(--u)) !important;
    height: calc(6.481 * var(--u));
    border-radius: calc(0.55 * var(--u));
    overflow: hidden;
    border: calc(0.185 * var(--u)) solid transparent;
}

.product-thumb-item::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, .4);
    border: calc(0.185 * var(--u)) solid transparent;
    opacity: 0;
}

.product-thumb-item img {
    width: 100%;
    height: 100%;
    border-radius: calc(0.55 * var(--u));
    object-fit: cover;
}

.product-thumb-item.is-selected {
    border-color: var(--primary-color) !important;
}

.product-thumb-item.is-selected::after {
    opacity: 1;
    border-color: var(--primary-color) !important;
}

.product-gallery-thumb {
    margin-bottom: calc(4.259 * var(--u));
}

/* ---------- Collection ---------- */
.collection-section .section-content {
    padding: calc(5.3811 * var(--u));
    background: #000;
}

.collection-section-title {
    padding-top: calc(16 * var(--u));
    padding-bottom: calc(6 * var(--u));
}

.product-cat-item {
    display: block;
    background-color: #000;
    border: 1px solid #EED6B0;
    border-radius: calc(1.481 * var(--u));
    padding: calc(6.759 * var(--u)) calc(4.036 * var(--u));
    height: calc(35 * var(--u));
    overflow: hidden;
}

.product-cat-item h3 {
    font-size: calc(5.686 * var(--u));
    font-weight: normal;
    margin: 0 0 calc(0.37 * var(--u));
    white-space: normal;
    text-transform: uppercase;
    max-width: 1px;
    line-height: 1.1;
}

[lang="vi"] .product-cat-item h3 {
    max-width: 100%;
}

.product-cat-item p {
    font-size: calc(1.794 * var(--u));
    margin-bottom: calc(2.153 * var(--u));
    font-family: var(--font-2);
    text-transform: uppercase;
}

.product-item span,
.product-cat-item span {
    width: calc(4.306 * var(--u));
    height: calc(4.306 * var(--u));
    background: url(../icons/circle-arrow-up-right.svg) center / contain no-repeat;
    display: block;
}

.product-cat-list {
    display: grid;
    grid-gap: calc(2.153 * var(--u));
    gap: calc(2.153 * var(--u));
    grid-template-columns: repeat(2, 1fr);
}

.product-cat-item:nth-child(1),
.product-cat-item:nth-child(2) {
    grid-column: 1/3;
}

.product-wrap {
    overflow: hidden;
    height: calc(100% - 49 * var(--u));
}

.product-wrap::after {
    content: "";
    position: absolute;
    width: 100%;
    height: calc(28.611 * var(--u));
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(47, 40, 32, 0) 0%, #14110E 100%);
}

.product-list-scroll {
    height: 100%;
    width: 100%;
    overflow-y: scroll;
}

.product-list-scroll::-webkit-scrollbar {
    width: 0px;
}

.product-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: calc(1.435 * var(--u));
    gap: calc(1.435 * var(--u));
    position: relative;
    overflow-y: scroll;
    padding-bottom: calc(28.611 * var(--u));
}

.product-list::-webkit-scrollbar {
    width: 0px;
}

.product-item {
    position: relative;
    padding-top: 72.47%;
    border: 1px solid #EED6B0;
    border-radius: calc(0.74 * var(--u));
    overflow: hidden;
    font-family: var(--font-2);
    display: block;
}

.product-item::before {
    position: absolute;
}

.product-item-desc {
    position: absolute;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
    bottom: 0;
    left: 0;
    padding: calc(2.153 * var(--u));
    color: #fff;
    height: 50%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.product-item h3 {
    font-size: calc(2.869 * var(--u));
    margin: 0;
}

.product-item p {
    margin: 0;
    font-size: calc(2.037 * var(--u));
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.product-item span {
    position: absolute;
    top: calc(1.389 * var(--u));
    right: calc(1.389 * var(--u));
}

/* ---------- Offer / popup ---------- */
/* thay gap báº±ng margin cho .offer-main-count */
.offer-main {
    position: absolute;
    top: calc(18 * var(--u));
    z-index: 2;
    display: flex;
    align-items: center;
    width: calc(89.236 * var(--u));
    height: calc(15.8 * var(--u));
    background: url(../images/bg-box.png) left / contain no-repeat;
    left: 0;
    right: 0;
    margin: 0 auto;
    padding-left: calc(16 * var(--u));
    justify-content: space-between;
    padding-right: 0;
    font-size: calc(1.874 * var(--u));
}

.offer-main>.offer-main-count {
    margin-left: calc(2 * var(--u));
}

/* popup: fixed -> absolute Ä‘á»ƒ náº±m trong khung wrapper */
.offer-main-2 {
    position: absolute;
    z-index: 999;
    width: calc(73.704 * var(--u));
    height: calc(48.008 * var(--u));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url(../images/bg-box-2.png) left / contain no-repeat;
    color: #fff;
    padding: calc(2.963 * var(--u));
    display: none;
}

.form-note-close,
.offer-main-close {
    cursor: pointer;
    position: absolute;
    right: calc(2.869 * var(--u));
    top: calc(6 * var(--u));
    background: url(../icons/close.svg) center / contain no-repeat;
    width: calc(2.869 * var(--u));
    height: calc(2.869 * var(--u));
}

.offer-main-desc,
.offer-main-count {
    width: 46%;
}

.offer-main-desc * {
    margin: 0;
}

.offer-main-desc strong {
    color: #FEEDC1;
    font-size: calc(2.869 * var(--u));
    line-height: 1;
}

.offer-main-desc {
    margin: 0;
    font-size: calc(1.794 * var(--u));
    font-family: var(--font-2);
}

.offer-main-2 .offer-main-count {
    margin-top: calc(5 * var(--u));
}

.offer-main-count span {
    font-weight: bold;
}

.offer-main-2 .offer-main-desc {
    margin-top: calc(2 * var(--u));
    width: 100%;
    font-size: calc(2.966 * var(--u));
}

.offer-main-2 .offer-main-desc strong {
    font-size: calc(4.664 * var(--u));
}

a.offer-main-btn {
    width: 100%;
    display: block;
    background: linear-gradient(180deg, #E1C1A8 0%, #84613B 100%);
    line-height: calc(7.623 * var(--u));
    text-align: center;
    color: #000;
    border-radius: calc(1.85 * var(--u));
    font-size: calc(3.408 * var(--u));
    margin-top: calc(1 * var(--u));
    text-transform: uppercase;
    font-weight: 500;
    font-family: var(--font-2);
}

.offer-main-bg {
    position: absolute;
    /* trÆ°á»›c: fixed */
    background: rgb(0 0 0 / 65%);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 99;
}

/* ---------- Äá»“ng há»“ Ä‘áº¿m ngÆ°á»£c ---------- */
.date-label {
    font-size: calc(1.2 * var(--u));
    color: #7a6a50;
    letter-spacing: 0.1em;
    margin-bottom: calc(1.5 * var(--u));
    text-transform: uppercase;
}

.flip-clock {
    display: flex;
    align-items: center;
    border-radius: calc(1.85 * var(--u));
    margin-top: calc(0.55 * var(--u)) !important;
}

/* thay gap */
.flip-unit {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.flip-unit>*+* {
    margin-top: calc(0.74 * var(--u));
}

.flip-label {
    font-size: calc(1 * var(--u));
    color: #7a6a50;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.flip-pair {
    display: flex;
}

.flip-pair>*+* {
    margin-left: calc(0.37 * var(--u));
}

.card {
    position: relative;
    width: calc(4.352 * var(--u));
    height: calc(5.463 * var(--u));
    perspective: calc(37 * var(--u));
}

.card-face {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: calc(0.65 * var(--u));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(3.136 * var(--u));
    font-weight: 700;
    font-family: 'Courier New', monospace;
    color: #f0e6d0;
    background: #2a1f10;
    box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.6), 0 3px 10px rgba(0, 0, 0, 0.5);
    -webkit-user-select: none;
    user-select: none;
    overflow: hidden;
    border: 1.12px solid #C09B78;
    line-height: 0;
}

.card-face::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
}

.card-face::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: rgba(255, 255, 255, 0.03);
    border-radius: calc(0.65 * var(--u)) calc(0.65 * var(--u)) 0 0;
    pointer-events: none;
}

.card.flip .card-face {
    animation: flipAnim 0.4s ease-in-out;
}

.sep {
    font-size: calc(1.85 * var(--u));
    font-weight: 700;
    color: #7a5a2a;
    margin-top: calc(-0.74 * var(--u));
    line-height: 1;
    font-family: 'Courier New', monospace;
}

.countdown span {
    font-family: var(--font-2);
    font-size: clamp(10px, calc(1.7 * var(--u)), 18px);
}

/* ---------- Form ---------- */
.form-section .section-content {
    padding: calc(5.3811 * var(--u));
}

.form-section .title {
    margin-top: calc(14 * var(--u));
}

.form-section .title p {
    font-size: calc(2.869 * var(--u));
    letter-spacing: normal;
}

.form-section .title p strong {
    color: #FAE2B8;
    text-transform: none;
}

.form-main {
    border: 0.97px solid #EED6B0;
    -webkit-backdrop-filter: blur(96.85924530029297px);
    backdrop-filter: blur(96.85924530029297px);
    padding: calc(5.741 * var(--u));
    border-radius: calc(2.153 * var(--u));
    margin-top: calc(10 * var(--u));
}

.form-main h2::before {
    content: "";
    border-top: 0.97px solid #FFFFFF;
    width: calc(12.197 * var(--u));
    display: block;
    margin-bottom: calc(2.153 * var(--u));
}

.form-main h2 {
    font-size: calc(4.843 * var(--u));
    font-weight: 600;
    margin: 0;
    text-transform: uppercase;
    margin-top: calc(6 * var(--u));
}

.form-main h3 {
    font-size: calc(2.869 * var(--u));
    margin: 0 0 calc(3 * var(--u));
    font-family: var(--font-2);
    font-weight: normal;
}

.form-main label {
    font-size: calc(2.869 * var(--u));
    font-family: var(--font-2);
    font-weight: normal;
}

.form-main label span {
    color: #FF383C;
}

.form-main input.wpcf7-form-control {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #fff;
    padding: 0 calc(2.153 * var(--u));
    font-family: var(--font-2);
    color: #fff;
    font-size: calc(2.511 * var(--u));
    box-shadow: unset !important;
}

/* thay gap */
.form-main .action-form {
    margin-top: calc(3 * var(--u));
    display: flex;
    align-items: center;
    justify-content: center;
}

.form-main .action-form>*+* {
    margin-left: calc(3 * var(--u)) !important;
}

.form-main .action-form .button.btn-main {
    flex: 1;
    margin: 0;
}

.form-note {
    position: absolute;
    /* trÆ°á»›c: fixed */
    display: none;
    z-index: 999;
    width: calc(73.704 * var(--u));
    height: calc(48.008 * var(--u));
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    padding: calc(2.963 * var(--u));
    background: url(../images/bg-sss.png) center / cover no-repeat;
    border-radius: calc(2.153 * var(--u));
    border: 0.97px solid #C09B78;
    text-align: center;
}

.form-note-icon {
    background: url(../icons/tick-circle.svg) center / cover no-repeat;
    width: calc(8.431 * var(--u));
    height: calc(8.431 * var(--u));
    margin: 0 auto calc(2 * var(--u));
}

.form-note-title {
    font-size: calc(4.843 * var(--u));
    text-transform: uppercase;
    line-height: normal;
}

.form-note-action {
    font-size: calc(4.843 * var(--u));
    color: #C09B78;
    text-transform: uppercase;
    font-weight: 600;
}

.form-note-desc {
    font-size: calc(2.331 * var(--u));
    max-width: 57%;
    margin: 0 auto;
    font-family: var(--font-2);
}

.form-note a {
    display: block;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)),
        linear-gradient(180deg, #E1C1A8 0%, #84613B 100%);
    line-height: calc(7.623 * var(--u));
    border-radius: calc(1.977 * var(--u));
    margin-top: calc(2 * var(--u));
    color: #000;
    text-transform: uppercase;
    font-family: var(--font-2);
    font-size: calc(3.049 * var(--u));
}

/* ---------- Showroom / Contact ---------- */
.showroom-section .section-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-bottom: calc(26 * var(--u));
}

.showroom-section .title {
    z-index: 99;
    position: relative;
    margin-top: calc(10 * var(--u));
}

.showroom-section .title h1 {
    font-size: calc(8.704 * var(--u));
}

/* thay gap (row-reverse) */
.box-contact {
    display: flex;
    flex-direction: row-reverse;
    font-family: var(--font-2);
}

.box-contact>*+* {
    margin-right: calc(1.2 * var(--u));
}

.box-contact .box-image {
    width: calc(19.444 * var(--u)) !important;
}

.box-contact .box-text {
    flex: 1;
    background: #00000059;
    -webkit-backdrop-filter: blur(48.429622650146484px);
    backdrop-filter: blur(48.429622650146484px);
    border: 0.97px solid #C09B78;
    border-radius: calc(2.153 * var(--u));
    padding: calc(2 * var(--u)) calc(3.333 * var(--u));
    line-height: normal;
}

.box-contact .box-text-inner {
    display: grid;
    font-size: calc(2.511 * var(--u));
    grid-gap: calc(2.153 * var(--u));
    gap: calc(1.667 * var(--u));
    grid-template-columns: repeat(2, 1fr);
}

.box-contact .icon-box:nth-child(1) {
    grid-column: 1/3;
    border-bottom: 1px solid #fff;
    padding-bottom: calc(1.667 * var(--u));
    margin-bottom: 0;
}

.box-contact .icon-box:nth-child(1) .icon-box-img {
    width: calc(4.723 * var(--u)) !important;
}

.box-contact .box-text-inner .icon-box {
    align-items: center;
}

.box-contact .icon-box .icon-box-img {
    width: calc(2.511 * var(--u)) !important;
}

.box-contact .icon-box .icon-box-img img {
    padding: 0
}

.box-contact .icon-box-text {
    padding-left: calc(0.93 * var(--u)) !important;
    font-size: calc(2.315 * var(--u));
}

.box-contact .icon-box-text h3 {
    font-size: calc(3.587 * var(--u));
    margin: 0;
}

/* thay gap (column) */
.contact-section .box-contact {
    flex-direction: column;
    margin-bottom: calc(20 * var(--u));
}

.contact-section .box-contact>*+* {
    margin-right: 0;
    margin-top: calc(6 * var(--u));
}

.contact-section .box-contact .box-image {
    width: calc(42.778 * var(--u)) !important;
}

/* ---------- Keyframes ---------- */
@keyframes flipAnim {
    0% {
        transform: rotateX(0deg);
    }

    49% {
        transform: rotateX(-90deg);
    }

    50% {
        transform: rotateX(90deg);
    }

    100% {
        transform: rotateX(0deg);
    }
}