/* ==========================================================================
   Tuong Lai Restaurant - base
   ========================================================================== */

:root {
	--tl-serif: 'Times New Roman', Times, serif;
	--tl-sans: 'UTM Helve', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	--tl-red: rgb(135, 28, 20);
	--tl-red-dark: rgb(110, 12, 3);
	--tl-gold: rgb(231, 196, 122);
	--tl-gold-light: rgb(245, 228, 172);
	--tl-cream: rgb(246, 233, 218);
	--tl-brown: rgb(158, 123, 89);
	--tl-ink: rgb(58, 33, 23);
	--tl-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cg fill='none' stroke='%239e7b59' stroke-width='1'%3E%3Cpath d='M0 24 L24 0 L48 24 L24 48 Z'/%3E%3Cpath d='M24 17 C28 21 28 21 24 25 C20 21 20 21 24 17 Z' fill='%239e7b59'/%3E%3C/g%3E%3C/svg%3E");
	--tl-flourish: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90' fill='none'%3E%3Cpath d='M4 4 H40 M4 4 V40' stroke='%23E7C47A' stroke-width='1'/%3E%3Cpath d='M4 4 C20 8 24 20 22 30 M4 4 C8 20 20 24 30 22' stroke='%23E7C47A' stroke-width='0.8' fill='none'/%3E%3Ccircle cx='30' cy='30' r='2.5' fill='%23E7C47A'/%3E%3C/svg%3E");
}

* {
	box-sizing: border-box;
}

body.tl-body {
	margin: 0;
	background: var(--tl-cream);
	font-family: var(--tl-sans);
}

body.tl-body a {
	color: var(--tl-red);
	text-decoration: none;
}

body.tl-body a:hover {
	color: var(--tl-red-dark);
}

.tl-page {
	width: 100%;
	margin: 0 auto;
	overflow-x: clip;
}

/* :where() giu do uu tien bang 0 de moi class rieng deu ghi de duoc. */
:where(.tl-page) :where(img, svg) {
	max-width: 100%;
}

.tl-page nav,
.tl-page section,
.tl-page footer {
	padding-left: calc(max(24px, (100% - 1280px) / 2)) !important;
	padding-right: calc(max(24px, (100% - 1280px) / 2)) !important;
}

.tl-page section > div[style*="max-width"],
.tl-page footer > div[style*="max-width"] {
	max-width: none !important;
}

.tl-pattern {
	position: absolute;
	inset: 0;
	opacity: 0.05;
	pointer-events: none;
	background-image: var(--tl-pattern);
	background-repeat: repeat;
}

/* ==========================================================================
   Thanh dieu huong
   ========================================================================== */

.tl-nav {
	position: sticky;
	top: 0;
	height: 86px;
	background: rgb(246, 234, 218);
	display: flex;
	align-items: center;
	padding: 0 60px;
	z-index: 100;
}

.tl-nav::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: linear-gradient(90deg, rgba(212, 165, 87, 0.12), rgb(240, 213, 155) 38%, rgb(212, 165, 87) 55%, rgba(212, 165, 87, 0.1));
	pointer-events: none;
}

.tl-nav::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(231, 196, 122, 0.32) 45%, rgba(231, 196, 122, 0.26) 60%, transparent);
	pointer-events: none;
}

.tl-nav__brand {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-shrink: 0;
}

.tl-nav__logo {
	height: 54px;
	width: auto;
	display: block;
	mix-blend-mode: multiply;
}

.tl-nav__wordmark {
	display: block;
	line-height: 1;
}

.tl-nav__wordmark-top {
	display: block;
	font-family: var(--tl-sans);
	font-size: 8px;
	font-weight: 600;
	color: var(--tl-red);
	letter-spacing: 2px;
}

.tl-nav__wordmark-main {
	display: block;
	font-family: var(--tl-serif);
	font-size: 24px;
	font-weight: 700;
	color: var(--tl-red);
	line-height: 1.1;
}

.tl-nav__wordmark-sub {
	display: block;
	font-family: var(--tl-sans);
	font-size: 6px;
	font-weight: 600;
	color: var(--tl-brown);
	letter-spacing: 1px;
	margin-top: 2px;
}

.tl-nav__menu {
	display: flex;
	align-items: center;
	gap: 22px;
	margin-left: auto;
	margin-right: 22px;
	flex-wrap: nowrap;
	align-self: stretch;
}

.tl-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--tl-serif);
	font-size: 17px;
	font-weight: 500;
	color: var(--tl-ink);
	letter-spacing: 0.5px;
	text-transform: uppercase;
	white-space: nowrap;
}

.tl-nav__link:hover,
.tl-nav__link--current {
	color: var(--tl-red);
}

.tl-nav__caret {
	font-size: 9px;
	color: var(--tl-brown);
}

.tl-nav__item--dd {
	position: relative;
	display: flex;
	align-items: center;
	align-self: stretch;
}

.tl-nav__dd {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	min-width: 240px;
	background: rgb(250, 242, 231);
	border: 1px solid rgba(158, 123, 89, 0.4);
	border-top: 2px solid var(--tl-red);
	box-shadow: 0 14px 30px rgba(40, 20, 10, 0.2);
	padding: 10px 0;
	z-index: 200;
	display: none;
}

.tl-nav__item--dd:hover > .tl-nav__dd,
.tl-nav__item--dd:focus-within > .tl-nav__dd {
	display: block;
}

.tl-nav__dd-link {
	display: block;
	padding: 11px 22px;
	font-family: var(--tl-serif);
	font-size: 15px;
	color: var(--tl-ink);
	white-space: nowrap;
}

.tl-nav__dd-link:hover {
	background: var(--tl-cream);
	color: var(--tl-red);
}

.tl-nav__dd-sep {
	height: 1px;
	background: rgba(158, 123, 89, 0.35);
	margin: 8px 16px;
}

/* ==========================================================================
   Nut
   ========================================================================== */

.tl-btn-book {
	position: relative;
	display: inline-flex;
	padding: 1px;
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
	border-radius: 6px;
	flex-shrink: 0;
	transition: filter 0.25s;
}

.tl-btn-book:hover {
	filter: brightness(1.08);
}

.tl-btn-book__inner {
	display: inline-flex;
	align-items: center;
	background: var(--tl-red);
	padding: 12px 24px;
	border-radius: 5px;
	font-family: var(--tl-serif);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--tl-gold);
}

.tl-ornate-btn {
	position: relative;
	display: inline-flex;
	padding: 1px;
	border-radius: 6px;
	transition: filter 0.25s, transform 0.25s;
}

.tl-ornate-btn:hover {
	filter: brightness(1.08);
	transform: translateY(-2px);
}

.tl-ornate-btn--dark {
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
}

.tl-ornate-btn--gold {
	background: linear-gradient(135deg, var(--tl-red), var(--tl-gold));
}

.tl-ornate-btn__inner {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 12px 26px;
	border-radius: 4px;
	font-family: var(--tl-serif);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

.tl-ornate-btn--dark .tl-ornate-btn__inner {
	background: rgb(74, 48, 34);
	border: 1px solid rgba(231, 196, 122, 0.45);
	color: var(--tl-gold);
}

.tl-ornate-btn--gold .tl-ornate-btn__inner {
	background: linear-gradient(0deg, var(--tl-gold), rgb(248, 237, 215));
	border: 1px solid rgba(135, 28, 20, 0.4);
	color: var(--tl-red);
}

.tl-ornate-btn__corner {
	position: absolute;
	width: 8px;
	height: 8px;
}

.tl-ornate-btn--dark .tl-ornate-btn__corner {
	border-color: var(--tl-gold);
}

.tl-ornate-btn--gold .tl-ornate-btn__corner {
	border-color: var(--tl-red);
}

.tl-ornate-btn__corner--tl {
	top: 3px;
	left: 3px;
	border-top: 1px solid;
	border-left: 1px solid;
}

.tl-ornate-btn__corner--tr {
	top: 3px;
	right: 3px;
	border-top: 1px solid;
	border-right: 1px solid;
}

.tl-ornate-btn__corner--bl {
	bottom: 3px;
	left: 3px;
	border-bottom: 1px solid;
	border-left: 1px solid;
}

.tl-ornate-btn__corner--br {
	bottom: 3px;
	right: 3px;
	border-bottom: 1px solid;
	border-right: 1px solid;
}

.tl-inset-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 34px;
	font-family: var(--tl-serif);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	transition: filter 0.2s, background 0.2s;
}

.tl-inset-btn__frame {
	position: absolute;
	inset: 5px;
	border: 1px solid;
	pointer-events: none;
}

.tl-inset-btn__label {
	position: relative;
	z-index: 1;
}

.tl-inset-btn.tl-inset-btn--gold {
	background: linear-gradient(0deg, var(--tl-gold), rgb(248, 237, 215));
	color: rgb(74, 48, 34);
}

.tl-inset-btn.tl-inset-btn--gold:hover {
	filter: brightness(1.05);
	color: rgb(74, 48, 34);
}

.tl-inset-btn--gold .tl-inset-btn__frame {
	border-color: rgba(74, 48, 34, 0.45);
}

.tl-inset-btn.tl-inset-btn--red {
	padding: 13px 28px;
	font-size: 13px;
	background: var(--tl-red);
	color: var(--tl-gold);
}

.tl-inset-btn.tl-inset-btn--red:hover {
	background: var(--tl-red-dark);
	color: var(--tl-gold);
}

.tl-inset-btn--red .tl-inset-btn__frame {
	border-color: rgba(231, 196, 122, 0.5);
}

.tl-scroll-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 44px;
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: rgb(248, 240, 222);
	transition: filter 0.2s;
}

.tl-scroll-btn:hover {
	filter: brightness(1.15);
	color: rgb(248, 240, 222);
}

.tl-scroll-btn__frame {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.tl-scroll-btn__label {
	position: relative;
	z-index: 1;
	color:rgb(231,196,122)
}

/* ==========================================================================
   Gioi thieu
   ========================================================================== */

.tl-frame {
	position: relative;
	padding: 44px;
	background: rgb(240, 232, 220);
	box-shadow: 0 26px 54px rgba(40, 20, 10, 0.32);
}

.tl-frame__line {
	position: absolute;
	pointer-events: none;
	z-index: 2;
}

.tl-frame__line--outer {
	top: 22px;
	left: 22px;
	right: 22px;
	bottom: 22px;
	border: 2px solid rgb(213, 176, 104);
}

.tl-frame__line--inner {
	top: 28px;
	left: 28px;
	right: 28px;
	bottom: 28px;
	border: 1px solid rgb(213, 176, 104);
}

.tl-frame__corner {
	position: absolute;
	width: 30px;
	height: 30px;
	z-index: 3;
}

.tl-frame__corner--tl {
	top: 22px;
	left: 22px;
	border-top: 2px solid rgb(240, 232, 220);
	border-left: 2px solid rgb(240, 232, 220);
	border-bottom-right-radius: 14px;
	box-shadow: 3px 3px 0 0 rgb(213, 176, 104);
}

.tl-frame__corner--tr {
	top: 22px;
	right: 22px;
	border-top: 2px solid rgb(240, 232, 220);
	border-right: 2px solid rgb(240, 232, 220);
	border-bottom-left-radius: 14px;
	box-shadow: -3px 3px 0 0 rgb(213, 176, 104);
}

.tl-frame__corner--bl {
	bottom: 22px;
	left: 22px;
	border-bottom: 2px solid rgb(240, 232, 220);
	border-left: 2px solid rgb(240, 232, 220);
	border-top-right-radius: 14px;
	box-shadow: 3px -3px 0 0 rgb(213, 176, 104);
}

.tl-frame__corner--br {
	bottom: 22px;
	right: 22px;
	border-bottom: 2px solid rgb(240, 232, 220);
	border-right: 2px solid rgb(240, 232, 220);
	border-top-left-radius: 14px;
	box-shadow: -3px -3px 0 0 rgb(213, 176, 104);
}

.tl-frame__stud {
	position: absolute;
	width: 22px;
	height: 22px;
	border: 2px solid rgb(213, 176, 104);
	background: rgb(240, 232, 220);
	z-index: 4;
}

.tl-frame__stud::after {
	content: '';
	position: absolute;
	inset: 0;
	margin: auto;
	width: 6px;
	height: 6px;
	background: rgb(213, 176, 104);
}

.tl-frame__stud--tl {
	top: 6px;
	left: 6px;
}

.tl-frame__stud--tr {
	top: 6px;
	right: 6px;
}

.tl-frame__stud--bl {
	bottom: 6px;
	left: 6px;
}

.tl-frame__stud--br {
	bottom: 6px;
	right: 6px;
}

.tl-frame__photo {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 340px;
}

.tl-seal {
	position: absolute;
	right: -28px;
	top: -28px;
	width: 132px;
	height: 132px;
	border-radius: 50%;
	z-index: 5;
	background: var(--tl-red);
	border: 2px solid var(--tl-gold);
	box-shadow: 0 12px 26px rgba(0, 0, 0, 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
}

.tl-seal__inner {
	width: 110px;
	height: 110px;
	border-radius: 50%;
	border: 1px solid rgba(231, 196, 122, 0.5);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.tl-seal__label {
	font-family: var(--tl-sans);
	font-size: 7px;
	font-weight: 700;
	color: var(--tl-gold);
	letter-spacing: 2px;
}

.tl-seal__year {
	font-family: var(--tl-serif);
	font-size: 26px;
	font-weight: 700;
	color: var(--tl-gold);
	line-height: 1;
}

.tl-seal__rule {
	width: 30px;
	height: 1px;
	background: rgba(231, 196, 122, 0.6);
	margin: 3px 0;
}

.tl-seal__caption {
	font-family: var(--tl-sans);
	font-size: 6px;
	font-weight: 600;
	color: var(--tl-gold-light);
	letter-spacing: 1px;
}

.tl-about__text p {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(45, 30, 22);
	line-height: 1.85;
	margin: 0 0 14px;
	text-align: justify;
	max-width: 560px;
}

.tl-about__text p:last-child {
	margin-bottom: 28px;
}

/* ==========================================================================
   Thuc don
   ========================================================================== */

.tl-hex {
	position: absolute;
	left: -6px;
	top: -14px;
	width: 84px;
	height: 66px;
	z-index: 2;
	filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.25));
}

.tl-hex__shape {
	width: 100%;
	height: 100%;
	background: rgb(122, 21, 11);
	clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
	display: flex;
	align-items: center;
	justify-content: center;
}

.tl-hex__text {
	font-family: var(--tl-sans);
	font-size: 8.5px;
	font-weight: 700;
	color: var(--tl-gold);
	text-align: center;
	line-height: 1.25;
	letter-spacing: 0.5px;
}

.tl-dish__img {
	filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.15));
	transition: transform 0.4s ease;
	cursor: pointer;
}

.tl-dish__img:hover {
	transform: scale(1.08);
}

.tl-dish__placeholder {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 6px;
	background: rgba(158, 123, 89, 0.12);
	border: 1px dashed rgba(158, 123, 89, 0.35);
}

.tl-dish__name {
	font-family: var(--tl-serif);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	line-height: 1.3;
	letter-spacing: 0.6px;
	margin-bottom: 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 34px;
}

.tl-dish__name--lg {
	font-size: 15px;
	letter-spacing: 0.8px;
	margin-bottom: 8px;
	height: 40px;
	min-height: 0;
}

.tl-dish__desc {
	font-family: var(--tl-sans);
	font-size: 9.5px;
	color: var(--tl-ink);
	line-height: 1.45;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tl-dish__desc--lg {
	font-size: 10px;
	height: 44px;
}

.tl-car__viewport {
	overflow: hidden;
	scroll-behavior: smooth;
}

.tl-car__track {
	display: flex;
	gap: 22px;
}

.tl-car__item {
	flex: 0 0 calc((100% - 66px) / 4);
	text-align: center;
}

.tl-car__btn {
	position: absolute;
	top: 42%;
	z-index: 5;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid var(--tl-brown);
	background: rgba(248, 237, 215, 0.95);
	color: var(--tl-red);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.tl-car__btn:hover {
	background: var(--tl-gold);
}

.tl-car__btn--prev {
	left: -8px;
}

.tl-car__btn--next {
	right: -8px;
}

/* ==========================================================================
   Phong tiec
   ========================================================================== */

.tl-corner {
	position: absolute;
	width: 90px;
	height: 90px;
	opacity: 0.35;
	background-image: var(--tl-flourish);
	background-repeat: no-repeat;
	pointer-events: none;
}

.tl-corner--tl {
	top: 16px;
	left: 16px;
}

.tl-corner--tr {
	top: 16px;
	right: 16px;
	transform: scaleX(-1);
}

.tl-corner--bl {
	bottom: 16px;
	left: 16px;
	transform: scaleY(-1);
}

.tl-corner--br {
	bottom: 16px;
	right: 16px;
	transform: scale(-1, -1);
}

.tl-room-card {
	flex: 1;
	background: rgba(0, 0, 0, 0.2);
	border: 1px solid rgba(231, 196, 122, 0.2);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.tl-room-card__media {
	flex: 1;
	min-height: 160px;
	border-radius: 6px;
}

.tl-room-card__body {
	padding: 14px 16px;
	text-align: center;
}

.tl-room-card__title {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-gold);
	margin-bottom: 4px;
}

.tl-room-card__subtitle {
	font-family: var(--tl-sans);
	font-size: 10px;
	color: var(--tl-gold-light);
	opacity: 0.6;
}

a.tl-room-card:hover .tl-room-card__title {
	color: rgb(248, 237, 215);
}

/* ==========================================================================
   Cam nhan
   ========================================================================== */

.tl-quote {
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: 6px;
}

.tl-quote__text {
	margin: 0 0 auto;
	font-family: var(--tl-serif);
	font-style: italic;
}

.tl-quote--main {
	background: rgb(118, 14, 18);
	padding: 30px 32px 30px 38px;
}

.tl-quote--main .tl-quote__mark {
	font-family: var(--tl-serif);
	font-size: 52px;
	font-weight: 700;
	color: rgba(231, 196, 122, 0.28);
	line-height: 0.6;
	margin-bottom: 14px;
}

.tl-quote--main .tl-quote__text {
	font-size: 23px;
	font-weight: 700;
	color: rgb(255, 255, 255);
	line-height: 1.45;
}

.tl-quote__edge {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 4px;
	background: rgb(228, 31, 38);
	border-radius: 6px 0 0 6px;
}

.tl-quote__footer {
	margin-top: 22px;
	padding-top: 16px;
	border-top: 1px solid rgba(231, 196, 122, 0.25);
}

.tl-quote--main .tl-quote__name {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	margin-bottom: 4px;
}

.tl-quote__role {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgba(245, 228, 172, 0.7);
}

.tl-quote--side {
	flex: 1;
	padding: 24px;
}

.tl-quote--side .tl-quote__mark {
	font-family: var(--tl-serif);
	font-size: 34px;
	line-height: 0.7;
	margin-bottom: 10px;
}

.tl-quote--side .tl-quote__text {
	font-size: 19px;
	line-height: 1.5;
}

.tl-quote--side .tl-quote__name {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	margin-top: 18px;
	padding-top: 12px;
}

.tl-quote--light {
	background: rgb(251, 239, 230);
	border: 1px solid rgba(158, 123, 89, 0.28);
}

.tl-quote--light .tl-quote__mark {
	color: rgba(135, 28, 20, 0.2);
}

.tl-quote--light .tl-quote__text,
.tl-quote--light .tl-quote__name {
	color: var(--tl-red);
}

.tl-quote--light .tl-quote__name {
	border-top: 1px solid rgba(158, 123, 89, 0.3);
}

.tl-quote--dark {
	background: rgb(25, 21, 18);
}

.tl-quote--dark .tl-quote__mark {
	color: rgba(231, 196, 122, 0.22);
}

.tl-quote--dark .tl-quote__text,
.tl-quote--dark .tl-quote__name {
	color: var(--tl-gold);
}

.tl-quote--dark .tl-quote__name {
	border-top: 1px solid rgba(231, 196, 122, 0.22);
}

/* ==========================================================================
   Tin tuc
   ========================================================================== */

.tl-news__grid {
	display: grid;
	gap: 34px;
	position: relative;
}

.tl-news__divider {
	background-image: repeating-linear-gradient(180deg, rgba(158, 123, 89, 0.7) 0 5px, transparent 5px 10px);
	background-size: 1px 100%;
	background-repeat: no-repeat;
	background-position: center;
}

.tl-news__item {
	display: flex;
	flex-direction: column;
}

.tl-news__media {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 6px;
	margin-bottom: 14px;
}

.tl-news__title {
	font-family: var(--tl-serif);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 10px;
	font-style: italic;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 42px;
}

.tl-news__title a {
	color: rgb(0, 0, 0);
}

.tl-news__title a:hover {
	color: var(--tl-red);
}

.tl-news__excerpt {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(0, 0, 0);
	line-height: 1.5;
	margin: 0 0 12px;
	text-align: justify;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tl-news__more {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 600;
	color: var(--tl-red);
	margin-top: auto;
}

/* ==========================================================================
   Thanh dat ban
   ========================================================================== */

.tl-cta {
	position: relative;
	height: 140px;
	background: rgb(98, 2, 3);
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: 0 60px;
}

.tl-cta__badge {
	width: 90px;
	height: 90px;
	flex-shrink: 0;
	background: linear-gradient(180deg, rgba(238, 214, 162, 0.12), rgba(231, 196, 122, 0.08));
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 16px;
}

.tl-cta__main {
	margin-right: auto;
}

.tl-cta__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 500;
	color: var(--tl-gold-light);
	margin-bottom: 2px;
}

.tl-cta__phone {
	display: block;
	font-family: var(--tl-serif);
	font-size: 44px;
	font-weight: 700;
	color: var(--tl-gold) ;
	line-height: 1;
}
body.tl-body a.tl-cta__phone {
		color: var(--tl-gold) ;
}
.tl-cta__phone:hover {
	color: rgb(248, 237, 215);
}

.tl-cta__note {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(255, 247, 232);
	margin-top: 2px;
}

.tl-cta__sep {
	width: 1px;
	height: 80px;
	background: linear-gradient(180deg, transparent, var(--tl-brown) 50%, transparent);
	margin: 0 24px;
	flex-shrink: 0;
}

.tl-cta__item {
	display: flex;
	align-items: center;
	gap: 14px;
}

.tl-cta__icon {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: linear-gradient(180deg, rgb(238, 214, 162), var(--tl-gold));
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-cta__item-title {
	font-family: var(--tl-sans);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-gold-light);
}

.tl-cta__item-desc {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(255, 247, 232);
}

/* ==========================================================================
   Chan trang
   ========================================================================== */

.tl-footer {
	position: relative;
	background: rgb(247, 237, 225);
	overflow: hidden;
	padding: 28px 60px 16px;
}

.tl-footer__texture {
	position: absolute;
	inset: 0;
	opacity: 0.03;
	background: repeating-linear-gradient(45deg, var(--tl-brown) 0px, var(--tl-brown) 1px, transparent 1px, transparent 15px);
}

.tl-footer__row {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
}

.tl-footer__brand {
	width: 140px;
	flex-shrink: 0;
	text-align: center;
}

.tl-footer__logo {
	width: 100%;
	max-width: 120px;
	height: auto;
	display: block;
	margin: 0 auto 6px;
	mix-blend-mode: multiply;
}

.tl-footer__wordmark {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	color: var(--tl-red);
	line-height: 1.2;
}

.tl-footer__divider {
	width: 1px;
	align-self: stretch;
	min-height: 90px;
	background: linear-gradient(180deg, transparent, var(--tl-brown) 50%, transparent);
	margin: 0 24px;
	flex-shrink: 0;
}

.tl-footer__col {
	flex: 1;
	min-width: 0;
}

.tl-footer__heading {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	color: var(--tl-ink);
	margin-bottom: 10px;
	text-transform: uppercase;
}

.tl-footer__list {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

.tl-footer__line {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--tl-sans);
	font-size: 11px;
	color: var(--tl-ink);
}

.tl-footer__line svg {
	flex-shrink: 0;
}

.tl-footer__line a {
	color: var(--tl-ink);
}

.tl-footer__line a:hover {
	color: var(--tl-red);
}

.tl-footer__hours {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.tl-footer__hour {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
}

.tl-footer__hour-note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: var(--tl-ink);
}

.tl-footer__social {
	display: flex;
	gap: 8px;
}

.tl-social {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: filter 0.2s;
}

.tl-social:hover {
	filter: brightness(1.15);
}

.tl-social__text {
	font-family: sans-serif;
	font-size: 12px;
	font-weight: 700;
	color: var(--tl-gold);
}

.tl-footer__rule {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 1px;
	background: var(--tl-brown);
	margin: 18px 0 10px;
}

.tl-footer__bottom {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.tl-footer__copy {
	font-family: var(--tl-sans);
	font-size: 10px;
	color: var(--tl-ink);
}

.tl-footer__links,
.tl-footer__links p {
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 600;
	color: rgb(97, 16, 13);
	letter-spacing: 0.8px;
	margin: 0;
}

/* ==========================================================================
   Trang gioi thieu
   ========================================================================== */

.tl-phero {
	position: relative;
	height: 440px;
	overflow: hidden;
	background: rgb(28, 10, 2);
	margin-top: -1px;
	display: flex;
	align-items: center;
}

.tl-phero__media {
	position: absolute;
	right: 0;
	top: 0;
	width: 62%;
	height: 100%;
}

.tl-phero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgb(28, 10, 2) 34%, rgba(28, 10, 2, 0.55) 52%, rgba(28, 10, 2, 0) 70%);
}

.tl-phero__inner {
	position: relative;
	z-index: 2;
	max-width: 560px;
}

.tl-phero__title {
	font-family: var(--tl-serif);
	font-size: 54px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-gold);
	line-height: 1.05;
	margin: 18px 0;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.5);
}

.tl-phero__desc {
	font-family: var(--tl-sans);
	font-size: 15px;
	color: rgba(255, 255, 255, 0.88);
	line-height: 1.75;
	margin: 0;
	max-width: 420px;
}

.tl-intro {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 56px 0 60px;
}

.tl-intro__glow {
	position: absolute;
	left: -40px;
	bottom: 0;
	width: 460px;
	height: 320px;
	opacity: 0.09;
	pointer-events: none;
	background: radial-gradient(120% 90% at 30% 100%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-intro__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 56px;
	align-items: center;
}

.tl-intro__media {
	position: relative;
	width: 500px;
	height: 440px;
	flex-shrink: 0;
}

.tl-intro__photo {
	position: absolute;
	padding: 1.5px;
	border-radius: 6px;
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
}

.tl-intro__photo-inner {
	width: 100%;
	height: 100%;
	border-radius: 6px;
}

.tl-intro__photo--1 {
	right: 8px;
	top: 0;
	width: 300px;
	height: 210px;
	transform: rotate(2deg);
}

.tl-intro__photo--2 {
	left: 0;
	top: 150px;
	width: 290px;
	height: 200px;
	transform: rotate(-3deg);
}

.tl-intro__photo--3 {
	right: 40px;
	bottom: 0;
	width: 200px;
	height: 160px;
	transform: rotate(4deg);
}

.tl-intro__body {
	flex: 1;
}

.tl-intro__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 6px;
}

.tl-intro__title {
	font-family: var(--tl-serif);
	font-size: 46px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-red);
	line-height: 1;
	margin: 0 0 20px;
}

.tl-intro__text p {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(45, 30, 22);
	line-height: 1.85;
	margin: 0 0 14px;
	text-align: justify;
	max-width: 520px;
}

.tl-intro__text p:last-child {
	margin-bottom: 30px;
}

.tl-intro__values {
	display: flex;
	align-items: flex-start;
}

.tl-intro__value {
	flex: 1;
	text-align: center;
	padding: 0 12px;
}

.tl-intro__value-sep {
	width: 1px;
	height: 70px;
	flex-shrink: 0;
	background: rgba(158, 123, 89, 0.4);
	margin-top: 6px;
}

.tl-intro__value-icon {
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 10px;
}

.tl-intro__value-icon--outline {
	background: transparent;
	border: 1.5px solid var(--tl-gold);
}

.tl-intro__value-title {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 1px;
}

.tl-intro__value-sub {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: var(--tl-ink);
}

.tl-story {
	position: relative;
	background: rgb(125, 20, 16);
	overflow: hidden;
	padding: 52px 0 56px;
}

.tl-story__glow {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 520px;
	height: 320px;
	opacity: 0.16;
	pointer-events: none;
	background: radial-gradient(120% 90% at 20% 100%, rgb(0, 0, 0) 0%, transparent 60%);
}

.tl-story__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 40px;
	align-items: flex-start;
	margin-bottom: 44px;
}

.tl-story__intro {
	width: 360px;
	flex-shrink: 0;
}

.tl-story__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-gold-light);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.tl-story__title {
	font-family: var(--tl-serif);
	font-size: 46px;
	font-weight: 700;
	letter-spacing: 3px;
	color: var(--tl-gold);
	line-height: 1;
	margin: 0 0 16px;
}

.tl-story__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: var(--tl-gold-light);
	line-height: 1.8;
	margin: 0;
	opacity: 0.9;
	max-width: 320px;
}

.tl-story__media {
	position: relative;
	flex: 1;
}

.tl-story__photo {
	width: 100%;
	height: 250px;
	padding: 2px;
	border-radius: 6px;
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
}

.tl-story__photo-inner {
	width: 100%;
	height: 100%;
	border-radius: 6px;
	filter: sepia(0.35);
}

.tl-story__seal {
	position: absolute;
	right: -18px;
	top: 78px;
	width: 116px;
	height: 116px;
	border-radius: 50%;
	background: rgb(125, 20, 16);
	border: 2px solid var(--tl-gold);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
}

.tl-story__seal-inner {
	width: 92px;
	height: 92px;
	border-radius: 50%;
	border: 1px solid rgba(231, 196, 122, 0.5);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.tl-story__seal-title {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-gold);
	line-height: 1.2;
}

.tl-story__seal-rule {
	width: 30px;
	height: 1px;
	background: rgba(231, 196, 122, 0.5);
	margin: 4px 0;
}

.tl-story__seal-caption {
	font-family: var(--tl-sans);
	font-size: 8px;
	font-weight: 600;
	letter-spacing: 1px;
	color: var(--tl-gold-light);
}

.tl-story__timeline {
	position: relative;
	z-index: 1;
}

.tl-story__timeline-line {
	position: absolute;
	top: 5px;
	left: 4%;
	right: 4%;
	height: 1px;
	background: rgba(231, 196, 122, 0.35);
}

.tl-story__steps {
	display: flex;
}

.tl-story__step {
	flex: 1;
	padding-right: 24px;
}

.tl-story__step:last-child {
	padding-right: 0;
}

.tl-story__dot {
	display: block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--tl-gold);
	margin-bottom: 14px;
}

.tl-story__year {
	font-family: var(--tl-serif);
	font-size: 22px;
	font-weight: 700;
	color: var(--tl-gold);
	margin-bottom: 6px;
}

.tl-story__note {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgba(245, 228, 172, 0.85);
	line-height: 1.6;
}

.tl-brand {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 54px 0 60px;
}

.tl-brand__glow {
	position: absolute;
	opacity: 0.08;
	pointer-events: none;
}

.tl-brand__glow--a {
	right: -40px;
	top: 40px;
	width: 420px;
	height: 340px;
	background: radial-gradient(120% 90% at 80% 20%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-brand__glow--b {
	left: -40px;
	bottom: 0;
	width: 420px;
	height: 300px;
	background: radial-gradient(120% 90% at 20% 100%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-brand__head {
	position: relative;
	z-index: 1;
	text-align: center;
}

.tl-brand__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.tl-brand__title {
	font-family: var(--tl-serif);
	font-size: 44px;
	font-weight: 700;
	letter-spacing: 3px;
	color: var(--tl-red);
	line-height: 1;
	margin: 0 0 8px;
}

.tl-brand__field {
	font-family: var(--tl-serif);
	font-size: 17px;
	font-style: italic;
	color: var(--tl-ink);
	margin-bottom: 22px;
}

.tl-brand__divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin-bottom: 22px;
}

.tl-brand__divider-line {
	width: 150px;
	height: 1px;
}

.tl-brand__divider-line--left {
	background: linear-gradient(90deg, transparent, var(--tl-brown));
}

.tl-brand__divider-line--right {
	background: linear-gradient(-90deg, transparent, var(--tl-brown));
}

.tl-brand__slogan {
	font-family: var(--tl-serif);
	font-size: 26px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
	margin-bottom: 40px;
}

.tl-brand__pillars {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 30px;
	justify-content: center;
	max-width: 1120px;
	margin: 0 auto;
}

.tl-brand__pillar {
	flex: 1;
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.tl-brand__pillar-icon {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-brand__pillar-title {
	font-family: var(--tl-serif);
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
}

.tl-brand__pillar-note {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 600;
	color: var(--tl-brown);
	margin-bottom: 8px;
}

.tl-brand__pillar-desc {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(45, 30, 22);
	line-height: 1.7;
}

.tl-spaces {
	position: relative;
	background: var(--tl-red);
	overflow: hidden;
	padding: 44px 0 48px;
}

.tl-spaces__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 50px;
	align-items: center;
}

.tl-spaces__intro {
	width: 360px;
	flex-shrink: 0;
}

.tl-spaces__title {
	font-family: var(--tl-serif);
	font-size: 34px;
	font-weight: 700;
	font-style: italic;
	color: var(--tl-gold);
	line-height: 1.2;
	margin: 0 0 14px;
}

.tl-spaces__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: var(--tl-gold-light);
	line-height: 1.7;
	margin: 0 0 24px;
	opacity: 0.9;
}

.tl-spaces__cards {
	flex: 1;
	display: flex;
	gap: 20px;
}

.tl-space-card {
	flex: 1;
	height: 190px;
	position: relative;
	border-radius: 6px;
	overflow: hidden;
}

.tl-space-card__frame {
	position: absolute;
	inset: 6px;
	border: 1px solid rgba(231, 196, 122, 0.4);
	pointer-events: none;
}

.tl-space-card__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 12px 14px;
	background: linear-gradient(0deg, rgba(30, 6, 4, 0.95), rgba(30, 6, 4, 0.6) 60%, transparent);
	text-align: center;
}

.tl-space-card__title {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	line-height: 1.25;
	min-height: 38px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.tl-space-card__subtitle {
	font-family: var(--tl-sans);
	font-size: 10px;
	color: rgba(245, 228, 172, 0.75);
	margin-top: 4px;
	min-height: 14px;
}

/* ==========================================================================
   Trang lien he
   ========================================================================== */

.tl-phero--contact {
	height: auto;
	display: block;
	padding-bottom: 44px;
}

.tl-phero__stage {
	position: relative;
	height: 500px;
	display: flex;
	align-items: center;
}

.tl-phero--contact .tl-phero__inner {
	max-width: 640px;
}

.tl-phero--contact .tl-phero__title {
	font-size: 48px;
}

.tl-cinfo {
	position: relative;
	z-index: 5;
	display: flex;
	gap: 22px;
	margin-top: -50px;
}

.tl-cinfo__card {
	flex: 1;
	position: relative;
	background: var(--tl-red);
	padding: 26px 28px;
	display: flex;
	align-items: center;
	gap: 18px;
}

.tl-cinfo__frame {
	position: absolute;
	inset: 7px;
	border: 1px solid rgba(231, 196, 122, 0.3);
	pointer-events: none;
}

.tl-cinfo__icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 1.5px solid rgba(231, 196, 122, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-cinfo__label {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-gold-light);
	margin-bottom: 4px;
}

.tl-cinfo__value {
	font-family: var(--tl-serif);
	font-weight: 700;
	color: var(--tl-gold);
	line-height: 1.15;
	word-break: break-word;
}

.tl-cinfo__card .tl-cinfo__value a {
	color: inherit;
}

.tl-cinfo__card .tl-cinfo__value a:hover {
	color: var(--tl-gold-light);
}

.tl-cinfo__value--lg {
	font-size: 25px;
}

.tl-cinfo__value--md {
	font-size: 21px;
}

.tl-cinfo__value--sm {
	font-size: 18px;
	line-height: 1.25;
}

.tl-cinfo__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgba(245, 228, 172, 0.8);
	margin-top: 4px;
}

.tl-cform {
	position: relative;
	background: rgb(250, 242, 231);
	padding: 54px 0 60px;
}

.tl-cform__row {
	display: flex;
	gap: 50px;
	align-items: flex-start;
}

.tl-cform__main {
	flex: 1;
	min-width: 0;
}

.tl-cform__eyebrow,
.tl-cmap__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgb(133, 11, 11);
	margin-bottom: 8px;
}

.tl-cmap__eyebrow {
	margin-bottom: 18px;
}

.tl-cform__title {
	font-family: var(--tl-serif);
	font-size: 38px;
	font-weight: 700;
	color: rgb(133, 11, 11);
	line-height: 1.15;
	margin: 0 0 12px;
}

.tl-cform__body {
	margin-top: 22px;
}

.tl-cform__hint {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(120, 100, 80);
	background: rgb(255, 250, 242);
	border: 1px dashed rgb(215, 178, 115);
	padding: 16px;
	margin: 0;
}

.tl-cform__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
	margin-top: 14px;
}

/* Dinh dang lai bieu mau Contact Form 7 theo phong cach trang. */
.tl-cform__body .wpcf7-form p {
	margin: 0 0 16px;
}

.tl-cform__grid {
	display: flex;
	gap: 16px;
}

.tl-cform__grid p {
	flex: 1;
	min-width: 0;
}

.tl-cform__body input[type="text"],
.tl-cform__body input[type="email"],
.tl-cform__body input[type="tel"],
.tl-cform__body input[type="url"],
.tl-cform__body input[type="number"],
.tl-cform__body input[type="date"],
.tl-cform__body select,
.tl-cform__body textarea {
	width: 100%;
	background: rgb(255, 250, 242);
	border: 1px solid rgb(215, 178, 115);
	border-radius: 0;
	padding: 14px 16px;
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(59, 42, 32);
	outline: none;
}

.tl-cform__body textarea {
	resize: vertical;
	min-height: 120px;
}

.tl-cform__body input:focus,
.tl-cform__body select:focus,
.tl-cform__body textarea:focus {
	border-color: var(--tl-red);
}

.tl-cform__body input[type="submit"] {
	width: 100%;
	background: rgb(133, 11, 11);
	color: var(--tl-gold);
	border: none;
	border-radius: 0;
	padding: 16px;
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s;
}

.tl-cform__body input[type="submit"]:hover {
	background: rgb(111, 5, 5);
}

.tl-cform__body .wpcf7-not-valid-tip {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(133, 11, 11);
	margin-top: 6px;
}

.tl-cform__body .wpcf7 form .wpcf7-response-output {
	font-family: var(--tl-sans);
	font-size: 13px;
	border-color: rgb(215, 178, 115);
	margin: 12px 0 0;
	padding: 12px 14px;
}

.tl-cmap {
	width: 500px;
	flex-shrink: 0;
}

.tl-cmap__canvas {
	position: relative;
	width: 100%;
	height: 330px;
	border: 1px solid rgba(158, 123, 89, 0.3);
	border-radius: 6px;
	overflow: hidden;
	margin-bottom: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.tl-cmap__frame {
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

.tl-cmap__grid {
	position: absolute;
	inset: 0;
	opacity: 0.5;
	background:
		repeating-linear-gradient(0deg, transparent 0, transparent 38px, rgba(150, 150, 150, 0.4) 38px, rgba(150, 150, 150, 0.4) 39px),
		repeating-linear-gradient(90deg, transparent 0, transparent 38px, rgba(150, 150, 150, 0.4) 38px, rgba(150, 150, 150, 0.4) 39px);
}

.tl-cmap__pin {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 6px;
}

.tl-cmap__pin span {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: rgb(59, 42, 32);
	background: rgba(255, 255, 255, 0.7);
	padding: 2px 6px;
}

.tl-chours {
	display: flex;
	border: 1px solid rgba(158, 123, 89, 0.3);
}

.tl-chours__photo {
	flex: 1;
	min-height: 150px;
}

.tl-chours__box {
	position: relative;
	width: 200px;
	flex-shrink: 0;
	background: var(--tl-red);
	padding: 22px;
}

.tl-chours__frame {
	position: absolute;
	inset: 6px;
	border: 1px solid rgba(231, 196, 122, 0.3);
	pointer-events: none;
}

.tl-chours__inner {
	position: relative;
	z-index: 1;
}

.tl-chours__head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.tl-chours__head span {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.5px;
	color: var(--tl-gold-light);
}

.tl-chours__time {
	font-family: var(--tl-serif);
	font-size: 19px;
	font-weight: 700;
	color: var(--tl-gold);
	line-height: 1.5;
}

.tl-chours__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgba(245, 228, 172, 0.8);
	margin-top: 8px;
}

.tl-cband {
	position: relative;
	display: flex;
	min-height: 300px;
}

.tl-cband__media {
	width: 42%;
	flex-shrink: 0;
}

.tl-cband__panel {
	flex: 1;
	position: relative;
	background: rgb(28, 15, 12);
	display: flex;
	align-items: center;
	padding: 40px 56px;
}

.tl-cband__inner {
	position: relative;
	z-index: 1;
}

.tl-cband__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgb(212, 165, 87);
	margin-bottom: 8px;
}

.tl-cband__title {
	font-family: var(--tl-serif);
	font-size: 38px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	line-height: 1.1;
	margin: 0 0 14px;
}

.tl-cband__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgba(255, 247, 232, 0.85);
	line-height: 1.75;
	margin: 14px 0 24px;
	max-width: 420px;
}

.tl-cchan {
	position: relative;
	background: rgb(250, 242, 231);
	padding: 34px 0;
	display: flex;
	gap: 30px;
	align-items: center;
}

.tl-cchan__col {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 12px;
}

.tl-cchan__col--social {
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.tl-cchan__head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.tl-cchan__icon {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-cchan__icon--outline {
	background: none;
	border: 1px solid rgb(133, 11, 11);
}

.tl-cchan__title {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1px;
	color: rgb(59, 42, 32);
}

.tl-cchan__social {
	display: flex;
	gap: 10px;
	padding-left: 52px;
}

.tl-cchan__value {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	color: rgb(133, 11, 11);
	line-height: 1.2;
	word-break: break-word;
}

.tl-cchan__value--sm {
	font-size: 16px;
}

.tl-cchan__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
}

.tl-cchan__desc {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(90, 60, 44);
	line-height: 1.5;
}

.tl-cchan__grow {
	flex: 1;
}

.tl-cchan__go {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-cchan__sep {
	width: 1px;
	height: 56px;
	background: rgba(158, 123, 89, 0.35);
}

/* ==========================================================================
   Trang thuc don
   ========================================================================== */

.tl-mhero {
	position: relative;
	height: 520px;
	overflow: hidden;
	background: rgb(28, 10, 2);
	margin-top: -1px;
	display: flex;
	align-items: center;
}

.tl-mhero__media {
	position: absolute;
	right: 0;
	top: 0;
	width: 60%;
	height: 100%;
}

.tl-mhero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgb(28, 10, 2) 32%, rgba(28, 10, 2, 0.5) 52%, rgba(28, 10, 2, 0) 72%);
}

.tl-mhero__inner {
	position: relative;
	z-index: 4;
	max-width: 560px;
}

.tl-mhero__flourish {
	margin-bottom: 16px;
}

.tl-mhero__title {
	font-family: var(--tl-serif);
	font-size: 46px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	line-height: 1.12;
	margin: 0 0 18px;
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.5);
}

.tl-mhero__desc {
	font-family: var(--tl-sans);
	font-size: 15px;
	color: rgba(255, 255, 255, 0.88);
	line-height: 1.75;
	margin: 0 0 30px;
	max-width: 430px;
}

.tl-mhero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.tl-mhead {
	position: relative;
	z-index: 1;
	text-align: center;
	margin-bottom: 40px;
}

.tl-mhead--tight {
	margin-bottom: 34px;
}

.tl-mhead__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 6px;
}

.tl-mhead__title {
	font-family: var(--tl-serif);
	font-size: 40px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
	line-height: 1;
	margin: 0 0 14px;
}

.tl-mhead__title--sm {
	font-size: 38px;
	margin-bottom: 10px;
}

.tl-mhead__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-bottom: 14px;
}

.tl-mhead__rule-line {
	width: 100px;
	height: 1px;
}

.tl-mhead__rule-line--left {
	background: linear-gradient(90deg, transparent, var(--tl-brown));
}

.tl-mhead__rule-line--right {
	background: linear-gradient(-90deg, transparent, var(--tl-brown));
}

.tl-mhead__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(45, 30, 22);
	line-height: 1.7;
	margin: 0 auto;
	max-width: 620px;
}

.tl-mcat {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 52px 0 56px;
}

.tl-mcat__glow {
	position: absolute;
	left: -40px;
	top: 40px;
	width: 420px;
	height: 420px;
	opacity: 0.09;
	pointer-events: none;
	background: radial-gradient(120% 90% at 20% 50%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-mcat__cards {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 26px;
	max-width: 1040px;
	margin: 0 auto;
}

.tl-mcat__card {
	flex: 1;
	position: relative;
	padding: 34px 28px;
	text-align: center;
	background: rgb(250, 242, 230);
	border: 1px solid rgba(158, 123, 89, 0.35);
}

.tl-mcat__card--dark {
	background: var(--tl-red);
	border-color: transparent;
}

.tl-mcat__frame {
	position: absolute;
	inset: 8px;
	border: 1px solid rgba(158, 123, 89, 0.25);
	pointer-events: none;
}

.tl-mcat__card--dark .tl-mcat__frame {
	border-color: rgba(231, 196, 122, 0.35);
}

.tl-mcat__body {
	position: relative;
	z-index: 1;
}

.tl-mcat__icon {
	width: 68px;
	height: 68px;
	border-radius: 50%;
	border: 1.5px solid var(--tl-brown);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
}

.tl-mcat__card--dark .tl-mcat__icon {
	border-color: var(--tl-gold);
}

.tl-mcat__title {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
	margin-bottom: 10px;
}

.tl-mcat__card--dark .tl-mcat__title {
	color: var(--tl-gold);
}

.tl-mcat__desc {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: var(--tl-ink);
	line-height: 1.6;
	margin-bottom: 18px;
}

.tl-mcat__card--dark .tl-mcat__desc {
	color: var(--tl-gold-light);
	opacity: 0.9;
}

.tl-mcat__link {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
}

.tl-mcat__card--dark .tl-mcat__link {
	color: var(--tl-gold);
}

.tl-mcat__card--dark .tl-mcat__link:hover {
	color: var(--tl-gold-light);
}

.tl-mspec {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 8px 0 56px;
}

.tl-mspec__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}

.tl-mspec__card {
	padding: 1.5px;
	background: rgb(215, 178, 115);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.tl-mspec__inner {
	background: rgb(250, 242, 230);
	height: 100%;
	display: flex;
	flex-direction: column;
}

.tl-mspec__photo {
	height: 150px;
	border-radius: 6px;
}

.tl-mspec__body {
	padding: 14px 14px 18px;
	text-align: center;
	flex: 1;
}

.tl-mspec__name {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.5px;
	color: var(--tl-red);
	margin-bottom: 8px;
}

.tl-mspec__desc {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: var(--tl-ink);
	line-height: 1.6;
}

.tl-mspec__more,
.tl-mocc__more {
	text-align: center;
	margin-top: 34px;
}

.tl-mocc {
	position: relative;
	background: rgb(125, 20, 16);
	overflow: hidden;
	padding: 48px 0 52px;
}

.tl-mocc__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 40px;
	align-items: center;
}

.tl-mocc__intro {
	width: 320px;
	flex-shrink: 0;
}

.tl-mocc__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-gold-light);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.tl-mocc__title {
	font-family: var(--tl-serif);
	font-size: 34px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	line-height: 1.15;
	margin: 0 0 14px;
}

.tl-mocc__desc {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: var(--tl-gold-light);
	line-height: 1.75;
	margin: 0;
	opacity: 0.9;
	max-width: 300px;
}

.tl-mocc__cards {
	flex: 1;
	display: flex;
	gap: 18px;
}

.tl-mocc__cards .tl-space-card {
	height: 260px;
	border-radius: 0;
}

.tl-mocc__more {
	position: relative;
	z-index: 1;
}

.tl-ming {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 52px 0 56px;
}

.tl-ming__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 40px;
	align-items: center;
}

.tl-ming__intro {
	width: 300px;
	flex-shrink: 0;
}

.tl-ming__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.tl-ming__title {
	font-family: var(--tl-serif);
	font-size: 36px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
	line-height: 1.1;
	margin: 0 0 16px;
}

.tl-ming__desc {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(45, 30, 22);
	line-height: 1.8;
	margin: 0 0 22px;
	text-align: justify;
	max-width: 280px;
}

.tl-ming__items {
	flex: 1;
	display: flex;
	gap: 20px;
}

.tl-ming__item {
	flex: 1;
	text-align: center;
}

.tl-ming__photo {
	position: relative;
	height: 130px;
	border-radius: 6px;
	margin-bottom: 28px;
}

.tl-ming__badge {
	position: absolute;
	left: 50%;
	bottom: -22px;
	transform: translateX(-50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--tl-cream);
	border: 1.5px solid var(--tl-gold);
	display: flex;
	align-items: center;
	justify-content: center;
}

.tl-ming__name {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-red);
	margin-bottom: 6px;
}

.tl-ming__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: var(--tl-ink);
	line-height: 1.6;
}

.tl-mcta {
	position: relative;
	background: rgb(125, 20, 16);
	overflow: hidden;
	padding: 44px 0 48px;
}

.tl-mcta__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 46px;
	align-items: center;
}

.tl-mcta__intro {
	width: 320px;
	flex-shrink: 0;
}

.tl-mcta__title {
	font-family: var(--tl-serif);
	font-size: 32px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-gold);
	line-height: 1.2;
	margin: 0 0 14px;
}

.tl-mcta__desc {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: var(--tl-gold-light);
	line-height: 1.75;
	margin: 0 0 22px;
	opacity: 0.9;
}

.tl-mcta__cards {
	flex: 1;
	display: flex;
	gap: 20px;
}

.tl-mcta__cards .tl-space-card {
	height: 200px;
	border-radius: 0;
}

.tl-mcta__cards .tl-space-card__title {
	min-height: 0;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

/* Submenu mo bang caret khi khong co hover. */
.tl-nav__item--dd.is-open > .tl-nav__dd {
	display: block;
}

@media (max-width: 1240px) {
	.tl-nav__menu {
		gap: 16px;
		margin-right: 16px;
	}

	.tl-nav__link {
		font-size: 15px;
	}

	.tl-hero__image {
		width: 44% !important;
		top: 130px !important;
	}
}

@media (max-width: 1080px) {
	.tl-nav {
		padding: 0 20px;
	}

	.tl-about__row {
		gap: 34px !important;
	}

	.tl-about__media {
		width: 400px !important;
	}

	.tl-party__intro {
		width: 300px !important;
	}

	.tl-menu__grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	.tl-car__item {
		flex-basis: calc((100% - 44px) / 3);
	}
}

/* Chuyen sang bo cuc mot cot. */
@media (max-width: 900px) {
	.tl-nav {
		height: auto;
		flex-wrap: wrap;
		padding: 12px 20px;
		row-gap: 10px;
	}

	.tl-nav__menu {
		order: 3;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		flex-wrap: wrap;
		row-gap: 8px;
		column-gap: 18px;
	}

	.tl-btn-book {
		margin-left: auto;
	}

	.tl-nav__item--dd {
		align-self: auto;
	}

	.tl-nav__caret {
		padding: 6px;
		margin: -6px;
		font-size: 11px;
	}

	.tl-nav__dd {
		position: absolute;
		left: 0;
		transform: none;
		min-width: 220px;
	}

	.tl-nav__item--dd:hover > .tl-nav__dd {
		display: none;
	}

	.tl-nav__item--dd.is-open > .tl-nav__dd {
		display: block;
	}

	.tl-page section,
	.tl-page footer {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	.tl-page h1 {
		font-size: 32px !important;
	}

	.tl-page h2 {
		font-size: 26px !important;
	}

	/* Hero xep doc: noi dung, anh, huy hieu, dai diem nhan. */
	.tl-hero {
		height: auto !important;
		overflow: visible !important;
		display: flex;
		flex-direction: column;
		padding-bottom: 0 !important;
	}

	.tl-hero__content {
		order: 1;
		padding: 48px 0 0 !important;
	}

	.tl-hero__image {
		order: 2;
		position: relative !important;
		z-index: 2;
		width: 100% !important;
		max-width: 380px;
		margin: 24px auto 0 !important;
		display: block;
	}

	.tl-hero__badge {
		order: 3;
		position: relative !important;
		z-index: 2;
		width: 100% !important;
		max-width: 320px;
		margin: 18px auto 0 !important;
	}

	.tl-hero__strip {
		order: 4;
		position: relative !important;
		z-index: 2;
		height: auto !important;
		margin: 28px -20px 0;
	}

	.tl-hero__strip-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px !important;
		padding: 20px !important;
	}

	.tl-hero__strip-sep {
		display: none;
	}

	.tl-about__row {
		flex-direction: column;
		align-items: stretch;
		gap: 28px !important;
	}

	.tl-about__media {
		width: 100% !important;
		max-width: 470px;
		margin: 0 auto;
	}

	.tl-about__text p {
		max-width: none;
	}

	.tl-party__row {
		flex-direction: column;
	}

	.tl-party__intro {
		width: 100% !important;
	}

	.tl-party__cards {
		flex-wrap: wrap;
	}

	.tl-party__cards > * {
		flex: 1 1 220px;
	}

	.tl-gb__grid {
		grid-template-columns: 1fr !important;
	}

	.tl-news__grid {
		grid-template-columns: 1fr !important;
	}

	.tl-news__divider {
		display: none;
	}

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

	.tl-cta {
		height: auto;
		padding: 24px 20px;
		flex-wrap: wrap;
		row-gap: 18px;
	}

	.tl-cta__main {
		margin-right: 0;
		flex: 1 1 200px;
	}

	.tl-cta__sep {
		display: none;
	}

	.tl-cta__item {
		flex: 1 1 200px;
	}

	.tl-footer {
		padding: 28px 20px 16px;
	}

	.tl-footer__row {
		flex-wrap: wrap;
		row-gap: 22px;
	}

	.tl-footer__divider {
		display: none;
	}

	.tl-footer__brand {
		width: 100%;
		text-align: left;
	}

	.tl-footer__logo {
		margin: 0 0 6px;
	}

	.tl-footer__col {
		flex: 1 1 220px;
	}
}

@media (max-width: 640px) {
	.tl-page section,
	.tl-page footer {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	.tl-page h1 {
		font-size: 26px !important;
	}

	.tl-page h2 {
		font-size: 22px !important;
	}

	.tl-nav__logo {
		height: 44px;
	}

	.tl-btn-book__inner {
		padding: 10px 16px;
		font-size: 12px;
		letter-spacing: 1px;
	}

	.tl-hero__strip {
		margin-left: -16px;
		margin-right: -16px;
	}

	.tl-ornate-btn__inner {
		padding: 11px 18px;
		font-size: 12px;
		letter-spacing: 1.5px;
	}

	.tl-frame {
		padding: 26px;
	}

	.tl-frame__line--outer {
		top: 14px;
		left: 14px;
		right: 14px;
		bottom: 14px;
	}

	.tl-frame__line--inner {
		top: 19px;
		left: 19px;
		right: 19px;
		bottom: 19px;
	}

	.tl-frame__corner {
		width: 22px;
		height: 22px;
		top: auto;
		bottom: auto;
	}

	.tl-frame__corner--tl,
	.tl-frame__corner--tr {
		top: 14px;
	}

	.tl-frame__corner--bl,
	.tl-frame__corner--br {
		bottom: 14px;
	}

	.tl-frame__corner--tl,
	.tl-frame__corner--bl {
		left: 14px;
	}

	.tl-frame__corner--tr,
	.tl-frame__corner--br {
		right: 14px;
	}

	.tl-frame__photo {
		height: 230px;
	}

	.tl-seal {
		right: -6px;
		top: -16px;
		width: 96px;
		height: 96px;
	}

	.tl-seal__inner {
		width: 80px;
		height: 80px;
	}

	.tl-seal__year {
		font-size: 20px;
	}

	.tl-about__stats {
		flex-wrap: wrap;
		row-gap: 16px;
	}

	.tl-about__stat {
		flex: 1 1 30% !important;
		border-right: none !important;
	}

	.tl-about__stat-value {
		font-size: 24px !important;
	}

	.tl-car__item {
		flex-basis: calc((100% - 22px) / 2);
	}

	.tl-quote--main {
		padding: 24px 20px 24px 26px;
	}

	.tl-quote--main .tl-quote__text {
		font-size: 19px;
	}

	.tl-cta__phone {
		font-size: 32px;
	}

	.tl-scroll-btn {
		padding: 14px 26px;
		font-size: 13px;
		letter-spacing: 2px;
	}

	.tl-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}
}

@media (max-width: 460px) {
	.tl-menu__grid {
		gap: 16px !important;
	}

	.tl-hex {
		left: -2px;
		top: -10px;
		width: 66px;
		height: 52px;
	}

	.tl-hex__text {
		font-size: 7px;
	}

	.tl-car__item {
		flex-basis: 100%;
	}

	.tl-car__btn--prev {
		left: 0;
	}

	.tl-car__btn--next {
		right: 0;
	}

	.tl-dish__name--lg {
		height: auto;
		min-height: 34px;
	}

	.tl-dish__desc--lg {
		height: auto;
	}
}

/* Trang gioi thieu. */
@media (max-width: 1080px) {
	.tl-intro__row {
		gap: 34px;
	}

	.tl-intro__media {
		width: 420px;
		height: 400px;
	}

	.tl-intro__photo--1 {
		width: 260px;
		height: 180px;
	}

	.tl-intro__photo--2 {
		top: 140px;
		width: 250px;
		height: 175px;
	}

	.tl-intro__photo--3 {
		width: 175px;
		height: 140px;
	}

	.tl-story__intro {
		width: 300px;
	}

	.tl-brand__pillars {
		gap: 20px;
	}

	.tl-brand__pillar-icon {
		width: 68px;
		height: 68px;
	}

	.tl-spaces__row {
		gap: 30px;
	}

	.tl-spaces__intro {
		width: 300px;
	}
}

@media (max-width: 900px) {
	.tl-phero {
		height: auto;
		padding-top: 44px;
		padding-bottom: 44px;
	}

	.tl-phero__media {
		width: 100%;
	}

	.tl-phero__veil {
		background: linear-gradient(90deg, rgb(28, 10, 2) 30%, rgba(28, 10, 2, 0.78));
	}

	.tl-phero__title {
		font-size: 34px;
	}

	.tl-intro__row,
	.tl-story__row,
	.tl-spaces__row {
		flex-direction: column;
		align-items: stretch;
	}

	.tl-intro__media {
		width: 100%;
	}

	.tl-intro__title {
		font-size: 34px;
	}

	.tl-story__intro,
	.tl-spaces__intro {
		width: 100%;
	}

	.tl-story__desc {
		max-width: none;
	}

	.tl-story__seal {
		right: 10px;
		top: auto;
		bottom: -26px;
		width: 96px;
		height: 96px;
	}

	.tl-story__seal-inner {
		width: 76px;
		height: 76px;
	}

	.tl-story__timeline {
		margin-top: 30px;
	}

	.tl-story__timeline-line {
		display: none;
	}

	.tl-story__steps {
		flex-wrap: wrap;
		row-gap: 24px;
	}

	.tl-story__step {
		flex: 1 1 45%;
		padding-right: 16px;
	}

	.tl-brand__title {
		font-size: 32px;
	}

	.tl-brand__divider-line {
		width: 60px;
	}

	.tl-brand__pillars {
		flex-direction: column;
		gap: 22px;
	}

	.tl-spaces__cards {
		flex-wrap: wrap;
	}

	.tl-space-card {
		flex: 1 1 45%;
	}
}

@media (max-width: 640px) {
	.tl-phero__title {
		font-size: 26px;
	}

	.tl-intro__media {
		height: 340px;
	}

	.tl-intro__photo--1 {
		width: 200px;
		height: 140px;
	}

	.tl-intro__photo--2 {
		top: 120px;
		width: 190px;
		height: 135px;
	}

	.tl-intro__photo--3 {
		right: 20px;
		width: 140px;
		height: 110px;
	}

	.tl-intro__title {
		font-size: 28px;
	}

	.tl-intro__values {
		flex-wrap: wrap;
		row-gap: 18px;
	}

	.tl-intro__value {
		flex: 1 1 40%;
	}

	.tl-intro__value-sep {
		display: none;
	}

	.tl-story__title {
		font-size: 32px;
	}

	.tl-story__step {
		flex: 1 1 100%;
		padding-right: 0;
	}

	.tl-brand__title {
		font-size: 24px;
	}

	.tl-brand__slogan {
		font-size: 18px;
	}

	.tl-brand__pillar {
		gap: 14px;
	}

	.tl-brand__pillar-icon {
		width: 60px;
		height: 60px;
	}

	.tl-spaces__title {
		font-size: 24px;
	}

	.tl-space-card {
		flex: 1 1 100%;
	}
}

@media (max-width: 1080px) {
	.tl-cmap {
		width: 400px;
	}

	.tl-cband__panel {
		padding: 34px 30px;
	}
}

@media (max-width: 900px) {
	.tl-phero__stage {
		height: 420px;
	}

	.tl-cinfo {
		flex-wrap: wrap;
		row-gap: 14px;
		margin-top: -30px;
	}

	.tl-cinfo__card {
		flex: 1 1 100%;
	}

	.tl-cform__row {
		flex-wrap: wrap;
		gap: 34px;
	}

	.tl-cmap {
		width: 100%;
	}

	.tl-cband {
		flex-wrap: wrap;
	}

	.tl-cband__media {
		width: 100%;
		height: 220px;
	}

	.tl-cband__panel {
		padding: 30px 24px;
	}

	.tl-cchan {
		flex-wrap: wrap;
		row-gap: 24px;
	}

	.tl-cchan__col {
		flex: 1 1 45%;
	}

	.tl-cchan__sep {
		display: none;
	}
}

@media (max-width: 640px) {
	.tl-cform__title,
	.tl-cband__title {
		font-size: 26px;
	}

	.tl-chours {
		flex-wrap: wrap;
	}

	.tl-chours__box {
		width: 100%;
	}

	.tl-cchan__col {
		flex: 1 1 100%;
	}

	.tl-cchan__social {
		padding-left: 0;
	}

	.tl-cform__grid {
		flex-wrap: wrap;
		gap: 0;
	}

	.tl-cform__grid p {
		flex: 1 1 100%;
	}
}

@media (max-width: 1080px) {
	.tl-mhero__title {
		font-size: 40px;
	}

	.tl-mocc__row,
	.tl-ming__row,
	.tl-mcta__row {
		gap: 30px;
	}

	.tl-mocc__intro,
	.tl-mcta__intro {
		width: 280px;
	}

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

@media (max-width: 900px) {
	.tl-mhero {
		height: auto;
		padding-top: 44px;
		padding-bottom: 44px;
	}

	.tl-mhero__media {
		width: 100%;
	}

	.tl-mhero__veil {
		background: linear-gradient(90deg, rgb(28, 10, 2) 30%, rgba(28, 10, 2, 0.78));
	}

	.tl-mhero__title {
		font-size: 32px;
	}

	.tl-mhead__title {
		font-size: 30px;
	}

	.tl-mcat__cards,
	.tl-mocc__cards,
	.tl-ming__items,
	.tl-mcta__cards {
		flex-wrap: wrap;
		row-gap: 20px;
	}

	.tl-mcat__card,
	.tl-ming__item {
		flex: 1 1 45%;
	}

	.tl-mocc__cards .tl-space-card,
	.tl-mcta__cards .tl-space-card {
		flex: 1 1 45%;
	}

	.tl-mocc__row,
	.tl-ming__row,
	.tl-mcta__row {
		flex-direction: column;
		align-items: stretch;
	}

	.tl-mocc__intro,
	.tl-ming__intro,
	.tl-mcta__intro {
		width: 100%;
	}

	.tl-mocc__desc,
	.tl-ming__desc {
		max-width: none;
	}

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

@media (max-width: 640px) {
	.tl-mhero__title {
		font-size: 26px;
	}

	.tl-mhero__actions {
		gap: 12px;
	}

	.tl-mhead__title,
	.tl-mhead__title--sm {
		font-size: 24px;
	}

	.tl-mhead__rule-line {
		width: 60px;
	}

	.tl-mcat__card,
	.tl-ming__item {
		flex: 1 1 100%;
	}

	.tl-mocc__cards .tl-space-card,
	.tl-mcta__cards .tl-space-card {
		flex: 1 1 100%;
	}

	.tl-mocc__title,
	.tl-ming__title,
	.tl-mcta__title {
		font-size: 24px;
	}

	.tl-mspec__grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Trang thuc don dac san
   ========================================================================== */

.tl-shero {
	position: relative;
	background: rgb(28, 10, 2);
	overflow: hidden;
	padding: 44px 0 56px;
	margin-top: -1px;
}

.tl-shero__media {
	position: absolute;
	inset: 0;
	opacity: 0.28;
}

.tl-shero__veil {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(28, 10, 2, 0.7), rgba(28, 10, 2, 0.88));
}

.tl-shero__inner {
	position: relative;
	z-index: 4;
	text-align: center;
	padding-top: 30px;
}

.tl-shero__crumb {
	font-family: var(--tl-sans);
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgba(231, 196, 122, 0.7);
	margin-bottom: 14px;
}

.tl-shero__crumb .tl-shero__crumb-link {
	color: rgba(231, 196, 122, 0.7);
}

.tl-shero__crumb .tl-shero__crumb-link:hover {
	color: var(--tl-gold);
}

.tl-shero__crumb-sep {
	margin: 0 8px;
}

.tl-shero__flourish {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	margin-bottom: 12px;
}

.tl-shero__rule {
	width: 90px;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgb(212, 165, 87));
}

.tl-shero__rule--rev {
	background: linear-gradient(-90deg, transparent, rgb(212, 165, 87));
}

.tl-shero__title {
	font-family: var(--tl-serif);
	font-size: 46px;
	font-weight: 700;
	letter-spacing: 2px;
	color: rgb(231, 201, 133);
	line-height: 1.1;
	margin: 0 0 12px;
}

.tl-shero__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgba(255, 247, 232, 0.85);
	line-height: 1.7;
	margin: 0 auto;
	max-width: 560px;
}

.tl-dishes {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 56px 0 64px;
}

.tl-dishes__bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
  opacity: 0.08;
	pointer-events: none;
}

.tl-dishes__grid {
	position: relative;
	z-index: 1;
	max-width: 980px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px 56px;
}

.tl-dish-col__title {
	font-family: var(--tl-serif);
	font-size: 24px;
	font-weight: 700;
	color: var(--tl-red);
	margin: 0 0 4px;
}

.tl-dish-col__rule {
	display: block;
	width: 60px;
	height: 2px;
	background: linear-gradient(90deg, var(--tl-gold), var(--tl-red));
	margin-bottom: 20px;
}

.tl-dish {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px dashed rgba(158, 123, 89, 0.4);
}

.tl-dish:last-child {
	border-bottom: 0;
}

.tl-dish__name {
	font-family: var(--tl-serif);
	font-size: 16px;
	font-weight: 700;
	color: rgb(45, 30, 22);
}

.tl-dish__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
}

.tl-dish__price {
	font-family: var(--tl-serif);
	font-size: 16px;
	font-weight: 700;
	color: var(--tl-red);
	white-space: nowrap;
}

.tl-dishes__actions {
	position: relative;
	z-index: 1;
	text-align: center;
	margin-top: 46px;
}

.tl-btn-book--lg .tl-btn-book__inner {
	padding: 14px 34px;
	font-size: 15px;
	letter-spacing: 2.5px;
}

@media (max-width: 900px) {
	.tl-shero__title {
		font-size: 34px;
	}

	.tl-dishes__grid {
		gap: 32px 32px;
	}
}

@media (max-width: 640px) {
	.tl-shero {
		padding: 32px 0 40px;
	}

	.tl-shero__inner {
		padding-top: 16px;
	}

	.tl-shero__rule {
		width: 46px;
	}

	.tl-shero__title {
		font-size: 26px;
	}

	.tl-dishes__grid {
		grid-template-columns: 1fr;
	}

	.tl-dish-col__title {
		font-size: 20px;
	}
}

/* ==========================================================================
   Trang phong tiec
   ========================================================================== */

.tl-rooms {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 52px 0 56px;
}

.tl-rooms__glow {
	position: absolute;
	left: -40px;
	top: 40px;
	width: 420px;
	height: 420px;
	opacity: 0.09;
	pointer-events: none;
	background: radial-gradient(120% 90% at 20% 50%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-rooms__cards {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 24px;
}

.tl-proom {
	flex: 1;
	padding: 1.5px;
	background: linear-gradient(160deg, var(--tl-gold), var(--tl-red));
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

.tl-proom__inner {
	height: 100%;
	background: rgb(250, 242, 230);
}

.tl-proom__media {
	height: 200px;
	border-radius: 6px;
}

.tl-proom__body {
	padding: 22px 22px 26px;
	text-align: center;
}

.tl-proom__title {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-red);
	margin-bottom: 4px;
}

.tl-proom__badge {
	display: inline-block;
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	color: var(--tl-brown);
	border: 1px solid rgba(158, 123, 89, 0.4);
	border-radius: 20px;
	padding: 3px 12px;
	margin-bottom: 12px;
}

.tl-proom__desc {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(45, 30, 22);
	line-height: 1.7;
}

.tl-proom__link {
	display: inline-block;
	margin-top: 14px;
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.tl-ptypes {
	position: relative;
	background: rgb(125, 20, 16);
	overflow: hidden;
	padding: 48px 0 52px;
}

.tl-mhead--gold .tl-mhead__eyebrow {
	color: var(--tl-gold-light);
}

.tl-mhead--gold .tl-mhead__title {
	color: var(--tl-gold);
}

.tl-ptypes__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

.tl-ptype {
	position: relative;
	height: 240px;
	overflow: hidden;
}

.tl-ptype__frame {
	position: absolute;
	inset: 7px;
	border: 1px solid rgba(231, 196, 122, 0.35);
	pointer-events: none;
}

.tl-ptype__body {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 16px;
	background: linear-gradient(0deg, rgba(30, 6, 4, 0.95), transparent);
	text-align: center;
}

.tl-ptype__title {
	font-family: var(--tl-serif);
	font-size: 18px;
	font-weight: 700;
	color: var(--tl-gold);
	margin-bottom: 4px;
}

.tl-ptype__desc {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgba(245, 228, 172, 0.8);
	line-height: 1.5;
}

/* Selector 2 class de thang mau mac dinh cua the a. */
.tl-ptype .tl-ptype__link {
	display: inline-block;
	margin-top: 10px;
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--tl-gold);
}

.tl-ptype .tl-ptype__link:hover {
	color: var(--tl-gold-light);
}

.tl-serv {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 52px 0 56px;
}

.tl-serv__glow {
	position: absolute;
	right: -40px;
	bottom: 0;
	width: 420px;
	height: 340px;
	opacity: 0.08;
	pointer-events: none;
	background: radial-gradient(120% 90% at 80% 100%, rgb(70, 70, 70) 0%, transparent 60%);
}

.tl-serv__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	max-width: 1120px;
	margin: 0 auto;
}

.tl-serv__item {
	text-align: center;
	padding: 0 8px;
}

.tl-serv__icon {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 14px;
}

.tl-serv__title {
	font-family: var(--tl-serif);
	font-size: 17px;
	font-weight: 700;
	color: var(--tl-red);
	margin-bottom: 6px;
}

.tl-serv__desc {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: var(--tl-ink);
	line-height: 1.6;
}

.tl-mcta__title--italic {
	font-style: italic;
	line-height: 1.25;
}

@media (max-width: 1080px) {
	.tl-ptypes__grid,
	.tl-serv__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 900px) {
	.tl-rooms__cards {
		flex-wrap: wrap;
		row-gap: 24px;
	}

	.tl-proom {
		flex: 1 1 45%;
	}
}

@media (max-width: 640px) {
	.tl-proom {
		flex: 1 1 100%;
	}

	.tl-ptypes__grid,
	.tl-serv__grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   Trang tiec thoi noi - sinh nhat
   ========================================================================== */

.tl-shero__badge {
	display: inline-block;
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-gold);
	border: 1px solid rgba(231, 196, 122, 0.45);
	border-radius: 20px;
	padding: 7px 18px;
	margin-bottom: 14px;
}

.tl-wed {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 54px 0 60px;
}

.tl-wed__bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 55%;
	opacity: 0.09;
	pointer-events: none;
}

.tl-wed__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 50px;
	align-items: center;
}

.tl-wed__media {
	width: 52%;
	flex-shrink: 0;
}

.tl-wed__frame {
	padding: 8px;
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
	border-radius: 8px;
	box-shadow: 0 22px 46px rgba(40, 20, 10, 0.28);
}

.tl-wed__photo {
	width: 100%;
	height: 340px;
	border-radius: 5px;
}

.tl-wed__thumbs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-top: 14px;
}

.tl-wed__thumb {
	height: 92px;
	border-radius: 6px;
	border: 1px solid rgba(158, 123, 89, 0.35);
}

.tl-wed__body {
	flex: 1;
}

.tl-wed__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	color: var(--tl-red);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.tl-wed__title {
	font-family: var(--tl-serif);
	font-size: 34px;
	font-weight: 700;
	font-style: italic;
	color: var(--tl-red);
	line-height: 1.2;
	margin: 0 0 16px;
}

.tl-wed__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(45, 30, 22);
	line-height: 1.85;
	margin: 0 0 14px;
	text-align: justify;
}

.tl-wed__desc:last-of-type {
	margin-bottom: 26px;
}

.tl-wed__facts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px 20px;
	margin-bottom: 28px;
}

.tl-wed__fact {
	display: flex;
	align-items: center;
	gap: 12px;
}

.tl-wed__fact-icon {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--tl-red);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-wed__fact-title {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-red);
}

.tl-wed__fact-note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(90, 70, 54);
}

.tl-wed__actions {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

.tl-other {
	position: relative;
	background: var(--tl-cream);
	overflow: hidden;
	padding: 46px 0 54px;
}

.tl-other .tl-mhead__eyebrow {
	font-size: 12px;
	color: var(--tl-brown);
	letter-spacing: 4px;
}

.tl-other .tl-mhead__title {
	font-size: 28px;
	font-weight: 600;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 0;
}

.tl-other__cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 24px;
	max-width: 900px;
	margin: 0 auto;
}

.tl-proom--link {
	display: block;
	border-radius: 8px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tl-proom--link:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 38px rgba(40, 20, 10, 0.24);
}

.tl-proom--link .tl-proom__inner {
	border-radius: 7px;
	overflow: hidden;
	background: rgb(250, 242, 230);
}

.tl-proom__media--sm {
	height: 170px;
	border-radius: 0;
}

.tl-proom__title--sm {
	font-size: 19px;
	margin-bottom: 6px;
}

.tl-proom__desc--sm {
	font-size: 11.5px;
	color: rgb(90, 70, 54);
	line-height: 1.6;
}

@media (max-width: 900px) {
	.tl-wed__row {
		flex-wrap: wrap;
		gap: 28px;
	}

	.tl-wed__media {
		width: 100%;
	}

	.tl-wed__title {
		font-size: 26px;
	}
}

@media (max-width: 640px) {
	.tl-wed__facts,
	.tl-other__cards {
		grid-template-columns: 1fr;
	}

	.tl-wed__photo {
		height: 240px;
	}
}

/* ==========================================================================
   Trang tin tuc
   ========================================================================== */

.tl-tt {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 34px 0 56px;
}

.tl-tt__backdrop {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 55%;
	opacity: 0.09;
	pointer-events: none;
}

.tl-chips {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 34px;
}

.tl-chips .tl-chip {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: rgb(90, 60, 44);
	border: 1px solid rgba(158, 123, 89, 0.5);
	border-radius: 20px;
	padding: 9px 20px;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.tl-chips .tl-chip:hover,
.tl-chips .tl-chip--on {
	background: var(--tl-red);
	border-color: var(--tl-red);
	color: var(--tl-gold);
	font-weight: 700;
}

.tl-tt .tl-feat {
	position: relative;
	z-index: 1;
	display: flex;
	margin: 0 0 44px;
	background: rgb(255, 248, 237);
	border: 1px solid rgba(158, 123, 89, 0.35);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 14px 32px rgba(40, 20, 10, 0.12);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tl-tt .tl-feat:hover {
	transform: translateY(-3px);
	box-shadow: 0 22px 44px rgba(40, 20, 10, 0.2);
}

.tl-feat__media {
	width: 52%;
	flex-shrink: 0;
	min-height: 320px;
}

.tl-feat__body {
	flex: 1;
	padding: 36px 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.tl-feat__meta {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 14px;
}

.tl-feat__badge {
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--tl-gold);
	background: var(--tl-red);
	border-radius: 6px;
	padding: 6px 12px;
}

.tl-feat__date {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(120, 100, 80);
}

.tl-feat__cat {
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--tl-red);
}

.tl-feat__title {
	display: block;
	font-family: var(--tl-serif);
	font-size: 34px;
	font-weight: 700;
	color: var(--tl-red);
	line-height: 1.2;
	margin-bottom: 14px;
}

.tl-feat__excerpt {
	display: block;
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(58, 42, 32);
	line-height: 1.8;
	margin-bottom: 20px;
	text-align: justify;
}

.tl-feat__more {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--tl-red);
}

.tl-tt__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
}

.tl-tt .tl-ncard {
	display: flex;
	flex-direction: column;
	background: rgb(255, 248, 237);
	border: 1px solid rgba(158, 123, 89, 0.32);
	border-radius: 8px;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tl-tt .tl-ncard:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(40, 20, 10, 0.18);
}

.tl-ncard__media {
	height: 190px;
	flex-shrink: 0;
}

.tl-ncard__body {
	padding: 22px 24px 26px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.tl-ncard__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
}

.tl-ncard__cat {
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--tl-red);
}

.tl-ncard__dot {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: rgba(158, 123, 89, 0.7);
}

.tl-ncard__date {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
}

.tl-ncard__title {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	color: var(--tl-red);
	line-height: 1.3;
	margin-bottom: 10px;
}

.tl-ncard__excerpt {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(58, 42, 32);
	line-height: 1.75;
	margin-bottom: 16px;
	text-align: justify;
}

.tl-ncard__more {
	margin-top: auto;
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--tl-red);
}

.tl-tt__empty {
	position: relative;
	z-index: 1;
	text-align: center;
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgb(90, 60, 44);
	padding: 40px 0;
}

.tl-pag {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 40px;
	flex-wrap: wrap;
}

.tl-pag .page-numbers {
	width: 38px;
	height: 38px;
	border-radius: 6px;
	border: 1px solid rgba(158, 123, 89, 0.4);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 600;
	color: rgb(90, 60, 44);
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.tl-pag .prev,
.tl-pag .next {
	font-family: var(--tl-sans);
	font-size: 13px;
}

.tl-pag .dots {
	border-color: transparent;
}

.tl-pag a.page-numbers:hover,
.tl-pag .page-numbers.current {
	background: var(--tl-red);
	border-color: var(--tl-red);
	color: var(--tl-gold);
	font-weight: 700;
}

.tl-ncta {
	position: relative;
	background: rgb(125, 20, 16);
	overflow: hidden;
	padding: 40px 0;
}

.tl-ncta__row {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 40px;
}

.tl-ncta__intro {
	flex: 1;
}

.tl-ncta__title {
	font-family: var(--tl-serif);
	font-size: 30px;
	font-weight: 700;
	font-style: italic;
	color: rgb(231, 201, 133);
	line-height: 1.25;
	margin: 0 0 10px;
}

.tl-ncta__desc {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgba(245, 228, 172, 0.9);
	line-height: 1.7;
	margin: 0;
}

/* ==========================================================================
   Trang chi tiet bai viet
   ========================================================================== */

.tl-ahero {
	position: relative;
	background: rgb(28, 21, 14);
	overflow: hidden;
	padding: 44px 0 70px;
	margin-top: -1px;
}

.tl-ahero__row {
	display: flex;
	gap: 44px;
	align-items: center;
}

.tl-ahero__left {
	width: 48%;
}

.tl-ahero__crumb {
	font-family: var(--tl-sans);
	font-size: 12px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: rgba(231, 196, 122, 0.7);
	margin-bottom: 18px;
}

.tl-ahero__crumb .tl-ahero__crumb-link {
	color: rgba(231, 196, 122, 0.7);
}

.tl-ahero__crumb .tl-ahero__crumb-link:hover {
	color: var(--tl-gold);
}

.tl-ahero__crumb-sep {
	margin: 0 8px;
}

.tl-ahero .tl-ahero__badge {
	display: inline-block;
	background: rgb(133, 11, 11);
	color: rgb(245, 228, 172);
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	padding: 8px 15px;
	border-radius: 8px;
	margin-bottom: 18px;
}

.tl-ahero .tl-ahero__badge:hover {
	background: var(--tl-red);
	color: var(--tl-gold);
}

.tl-ahero__title {
	font-family: var(--tl-serif);
	font-size: 50px;
	font-weight: 600;
	color: rgb(231, 201, 133);
	line-height: 1.12;
	margin: 0 0 16px;
}

.tl-ahero__meta {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.tl-ahero__meta-item {
	display: flex;
	align-items: center;
	gap: 7px;
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgba(231, 196, 122, 0.8);
}

.tl-ahero__meta-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: rgba(212, 165, 87, 0.6);
}

.tl-ahero__desc {
	font-family: var(--tl-sans);
	font-size: 14px;
	color: rgba(255, 247, 232, 0.85);
	line-height: 1.8;
	margin: 0;
	max-width: 500px;
}

.tl-ahero__right {
	width: 52%;
}

.tl-ahero__frame {
	position: relative;
	padding: 11px;
	border: 1.5px solid rgb(213, 170, 98);
}

.tl-ahero__corner {
	position: absolute;
	width: 22px;
	height: 22px;
}

.tl-ahero__corner--tl {
	top: -1.5px;
	left: -1.5px;
	border-top: 3px solid rgb(231, 201, 133);
	border-left: 3px solid rgb(231, 201, 133);
}

.tl-ahero__corner--tr {
	top: -1.5px;
	right: -1.5px;
	border-top: 3px solid rgb(231, 201, 133);
	border-right: 3px solid rgb(231, 201, 133);
}

.tl-ahero__corner--bl {
	bottom: -1.5px;
	left: -1.5px;
	border-bottom: 3px solid rgb(231, 201, 133);
	border-left: 3px solid rgb(231, 201, 133);
}

.tl-ahero__corner--br {
	bottom: -1.5px;
	right: -1.5px;
	border-bottom: 3px solid rgb(231, 201, 133);
	border-right: 3px solid rgb(231, 201, 133);
}

.tl-ahero__media {
	width: 100%;
	height: 380px;
	border-radius: 6px;
}

.tl-ahero__curve {
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	pointer-events: none;
}

.tl-ahero__curve svg {
	display: block;
}

.tl-abody {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 56px 0 64px;
}

.tl-abody__glow {
	position: absolute;
	top: 60px;
	width: 300px;
	height: 520px;
	opacity: 0.05;
	pointer-events: none;
}

.tl-abody__glow--left {
	left: -30px;
	background: radial-gradient(80% 60% at 20% 30%, rgb(60, 60, 60) 0%, transparent 65%);
}

.tl-abody__glow--right {
	right: -30px;
	top: 200px;
	background: radial-gradient(80% 60% at 80% 30%, rgb(60, 60, 60) 0%, transparent 65%);
}

.tl-abody__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 50px;
	align-items: flex-start;
}

.tl-article {
	flex: 1;
	min-width: 0;
}

.tl-article p {
	font-family: var(--tl-sans);
	font-size: 15px;
	color: rgb(45, 30, 22);
	line-height: 1.8;
	margin: 0 0 16px;
	text-align: justify;
}

.tl-article h2 {
	font-family: var(--tl-serif);
	font-size: 29px;
	font-weight: 700;
	color: rgb(133, 11, 11);
	margin: 34px 0 14px;
}

.tl-article h3 {
	font-family: var(--tl-serif);
	font-size: 22px;
	font-weight: 700;
	color: rgb(133, 11, 11);
	margin: 28px 0 12px;
}

.tl-article > h2:first-child,
.tl-article > h3:first-child {
	margin-top: 0;
}

.tl-article img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 5px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.tl-article figure {
	margin: 0 0 34px;
}

.tl-article figcaption {
	font-family: var(--tl-serif);
	font-size: 14px;
	font-style: italic;
	color: rgb(90, 60, 44);
	margin-top: 10px;
	text-align: center;
}

.tl-article ul,
.tl-article ol {
	font-family: var(--tl-sans);
	font-size: 15px;
	color: rgb(45, 30, 22);
	line-height: 1.8;
	margin: 0 0 20px;
	padding-left: 22px;
}

.tl-article blockquote {
	position: relative;
	background: rgb(255, 246, 233);
	border: 1px solid rgb(221, 185, 119);
	padding: 28px 35px 28px 60px;
	margin: 0 0 34px;
}

.tl-article blockquote::before {
	content: "\201C";
	position: absolute;
	left: 22px;
	top: 12px;
	font-family: var(--tl-serif);
	font-size: 60px;
	font-weight: 700;
	color: rgba(133, 11, 11, 0.25);
	line-height: 1;
}

.tl-article blockquote p {
	font-family: var(--tl-serif);
	font-size: 18px;
	font-style: italic;
	color: rgb(90, 30, 24);
	line-height: 1.6;
	margin: 0;
	text-align: left;
}

.tl-article .tl-note {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-style: italic;
	color: rgb(90, 60, 44);
	line-height: 1.7;
	text-align: left;
	margin-bottom: 0;
}

.tl-share {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	border-top: 1px solid rgba(158, 123, 89, 0.3);
	padding-top: 22px;
	margin-top: 36px;
}

.tl-share__label {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 600;
	color: rgb(59, 42, 32);
}

.tl-share .tl-share__btn {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgb(133, 11, 11);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}

.tl-share .tl-share__btn:hover {
	background: rgb(212, 165, 87);
}

.tl-share__text {
	font-family: var(--tl-sans);
	font-size: 10px;
	font-weight: 700;
	color: var(--tl-gold);
}

.tl-aside {
	width: 320px;
	flex-shrink: 0;
}

.tl-card {
	position: relative;
	background: rgb(255, 248, 237);
	border: 1px solid rgb(215, 178, 115);
	padding: 22px 20px;
	margin-bottom: 26px;
}

.tl-card--dark {
	background: rgb(28, 21, 14);
	border-color: rgb(160, 120, 60);
	padding: 24px 22px;
}

.tl-card__corner {
	position: absolute;
	width: 14px;
	height: 14px;
}

.tl-card__corner--tl {
	top: 6px;
	left: 6px;
	border-top: 2px solid rgb(212, 165, 87);
	border-left: 2px solid rgb(212, 165, 87);
}

.tl-card__corner--tr {
	top: 6px;
	right: 6px;
	border-top: 2px solid rgb(212, 165, 87);
	border-right: 2px solid rgb(212, 165, 87);
}

.tl-card__corner--bl {
	bottom: 6px;
	left: 6px;
	border-bottom: 2px solid rgb(212, 165, 87);
	border-left: 2px solid rgb(212, 165, 87);
}

.tl-card__corner--br {
	bottom: 6px;
	right: 6px;
	border-bottom: 2px solid rgb(212, 165, 87);
	border-right: 2px solid rgb(212, 165, 87);
}

.tl-card__title {
	text-align: center;
	font-family: var(--tl-serif);
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 1px;
	color: rgb(133, 11, 11);
	margin-bottom: 18px;
}

.tl-card--dark .tl-card__title {
	color: rgb(231, 201, 133);
}

.tl-card .tl-arel {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid rgba(158, 123, 89, 0.25);
}

.tl-card .tl-arel:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.tl-arel__media {
	width: 90px;
	height: 72px;
	flex-shrink: 0;
	border-radius: 6px;
}

.tl-arel__title {
	display: block;
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: rgb(90, 30, 24);
	line-height: 1.3;
	margin-bottom: 6px;
}

.tl-arel__date {
	display: block;
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
}

.tl-card .tl-topic {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 0;
	border-bottom: 1px solid rgba(160, 120, 60, 0.3);
}

.tl-card .tl-topic:last-of-type {
	border-bottom: 0;
}

.tl-topic__icon {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 1px solid rgba(212, 165, 87, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tl-topic__name {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: rgb(245, 228, 172);
}

.tl-card__foot {
	text-align: center;
	margin-top: 18px;
}

.tl-card .tl-card__all {
	display: inline-block;
	background: linear-gradient(0deg, rgb(231, 196, 122), rgb(248, 237, 215));
	padding: 10px 26px;
	font-family: var(--tl-serif);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	color: rgb(133, 11, 11);
}

.tl-card .tl-card__all:hover {
	filter: brightness(1.05);
	color: rgb(133, 11, 11);
}

.tl-bookcard {
	position: relative;
	border: 1px solid rgb(215, 178, 115);
	overflow: hidden;
}

.tl-bookcard__media {
	height: 140px;
}

.tl-bookcard__body {
	background: rgb(133, 11, 11);
	padding: 24px 22px 26px;
	text-align: center;
}

.tl-bookcard__title {
	font-family: var(--tl-serif);
	font-size: 22px;
	font-weight: 700;
	color: rgb(231, 201, 133);
	line-height: 1.25;
	margin-bottom: 12px;
}

.tl-bookcard__desc {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgba(245, 228, 172, 0.85);
	line-height: 1.6;
	margin-bottom: 18px;
}

.tl-bookcard .tl-bookcard__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(0deg, rgb(231, 196, 122), rgb(248, 237, 215));
	padding: 11px 26px;
	font-family: var(--tl-serif);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 1.5px;
	color: rgb(133, 11, 11);
}

.tl-bookcard .tl-bookcard__btn:hover {
	filter: brightness(1.05);
	color: rgb(133, 11, 11);
}

.tl-arelated {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 8px 0 60px;
}

.tl-arelated .tl-mhead__title {
	font-size: 30px;
	letter-spacing: 2px;
}

.tl-arelated .tl-mhead__rule-line {
	width: 180px;
}

.tl-arelated .tl-mhead__rule-line--left {
	background: linear-gradient(90deg, transparent, rgb(212, 165, 87));
}

.tl-arelated .tl-mhead__rule-line--right {
	background: linear-gradient(-90deg, transparent, rgb(212, 165, 87));
}

.tl-rcards {
	display: flex;
	gap: 26px;
}

.tl-rcards .tl-rcard {
	flex: 1;
	display: flex;
	flex-direction: column;
	background: rgb(255, 248, 237);
	border: 1px solid rgb(215, 177, 112);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tl-rcards .tl-rcard:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 36px rgba(40, 20, 10, 0.18);
}

.tl-rcard__media {
	height: 210px;
	flex-shrink: 0;
}

.tl-rcard__body {
	padding: 22px 24px 26px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.tl-rcard__title {
	font-family: var(--tl-serif);
	font-size: 20px;
	font-weight: 700;
	color: rgb(133, 11, 11);
	line-height: 1.3;
	margin-bottom: 10px;
}

.tl-rcard__excerpt {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(58, 42, 32);
	line-height: 1.7;
	margin-bottom: 14px;
}

.tl-rcard__more {
	margin-top: auto;
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	color: rgb(133, 11, 11);
}

.tl-disc {
	position: relative;
	background: linear-gradient(100deg, rgb(111, 5, 5), rgb(133, 11, 11));
	overflow: hidden;
	padding: 40px 0;
}

.tl-disc__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 40px;
	align-items: center;
}

.tl-disc__gallery {
	display: flex;
	gap: 14px;
	flex-shrink: 0;
}

.tl-disc__thumb {
	width: 170px;
	height: 130px;
	border-radius: 6px;
	border: 1px solid rgba(231, 196, 122, 0.4);
}

.tl-disc__intro {
	flex: 1;
}

.tl-disc__title {
	font-family: var(--tl-serif);
	font-size: 30px;
	font-weight: 700;
	color: rgb(231, 201, 133);
	line-height: 1.2;
	margin: 0 0 8px;
}

.tl-disc__desc {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgba(245, 228, 172, 0.9);
	margin: 0 0 18px;
}

@media (max-width: 1000px) {
	.tl-tt__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.tl-abody__row {
		flex-direction: column;
	}

	.tl-aside {
		width: 100%;
	}
}

@media (max-width: 900px) {
	.tl-ahero__row {
		flex-direction: column;
	}

	.tl-ahero__left,
	.tl-ahero__right {
		width: 100%;
	}

	.tl-ahero__title {
		font-size: 34px;
	}

	.tl-ahero__media {
		height: 280px;
	}

	.tl-tt .tl-feat {
		flex-direction: column;
	}

	.tl-feat__media {
		width: 100%;
		min-height: 220px;
	}

	.tl-feat__body {
		padding: 26px 24px;
	}

	.tl-feat__title {
		font-size: 26px;
	}

	.tl-rcards {
		flex-wrap: wrap;
	}

	.tl-rcards .tl-rcard {
		flex: 1 1 260px;
	}

	.tl-ncta__row,
	.tl-disc__row {
		flex-direction: column;
		align-items: flex-start;
		gap: 22px;
	}
}

@media (max-width: 640px) {
	.tl-tt__grid {
		grid-template-columns: 1fr;
	}

	.tl-ahero__title {
		font-size: 26px;
	}

	.tl-article h2 {
		font-size: 22px;
	}

	.tl-arelated .tl-mhead__title {
		font-size: 22px;
	}

	.tl-arelated .tl-mhead__rule-line {
		width: 50px;
	}

	.tl-disc__thumb {
		width: 140px;
		height: 110px;
	}
}

/* ==========================================================================
   Trang dat ban
   ========================================================================== */

.tl-bsteps {
	background: var(--tl-cream);
	padding: 26px 0;
}

.tl-bsteps__row {
	display: flex;
	align-items: center;
	max-width: 900px;
	margin: 0 auto;
}

.tl-bsteps__line {
	flex: 1;
	height: 1px;
	background: rgba(158, 123, 89, 0.5);
	margin: 0 20px;
}

.tl-bstep {
	display: flex;
	align-items: center;
	gap: 12px;
}

.tl-bstep__num {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1.5px solid rgba(158, 123, 89, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--tl-serif);
	font-size: 16px;
	font-weight: 700;
	color: var(--tl-red);
	flex-shrink: 0;
}

.tl-bstep__num--on {
	background: var(--tl-red);
	border-color: var(--tl-red);
	color: var(--tl-gold);
}

.tl-bstep__title {
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--tl-red);
}

.tl-bstep__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(90, 70, 54);
}

.tl-bform {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 50px 0 60px;
}

.tl-bform__bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 55%;
	opacity: 0.09;
	pointer-events: none;
}

.tl-bform__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 44px;
	align-items: flex-start;
}

.tl-bform__main {
	flex: 1;
	min-width: 0;
}

.tl-bform__eyebrow {
	font-family: var(--tl-sans);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--tl-red);
	margin-bottom: 8px;
}

.tl-bform__title {
	font-family: var(--tl-serif);
	font-size: 32px;
	font-weight: 700;
	font-style: italic;
	color: var(--tl-red);
	line-height: 1.2;
	margin: 0 0 24px;
}

.tl-bform__hint {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(120, 100, 80);
	background: rgb(255, 250, 242);
	border: 1px dashed rgb(215, 178, 115);
	padding: 16px;
	margin: 0;
}

.tl-bform__note {
	font-family: var(--tl-sans);
	font-size: 11px;
	color: rgb(120, 100, 80);
	margin-top: 12px;
	text-align: center;
}

/* Dinh dang lai bieu mau Contact Form 7 theo thiet ke trang dat ban. */
.tl-bform__body .wpcf7-form p {
	margin: 0 0 16px;
}

.tl-bform__grid {
	display: flex;
	gap: 16px;
	margin-bottom: 16px;
}

.tl-bform__body .wpcf7-form .tl-bform__grid p {
	flex: 1;
	min-width: 0;
	margin: 0;
}

.tl-bform__label {
	display: block;
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: rgb(90, 60, 44);
	margin-bottom: 7px;
}

.tl-bform__body input[type="text"],
.tl-bform__body input[type="email"],
.tl-bform__body input[type="tel"],
.tl-bform__body input[type="number"],
.tl-bform__body input[type="date"],
.tl-bform__body select,
.tl-bform__body textarea {
	width: 100%;
	background: rgb(255, 250, 242);
	border: 1px solid rgb(215, 178, 115);
	border-radius: 6px;
	padding: 13px 15px;
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(59, 42, 32);
	outline: none;
}

.tl-bform__body textarea {
	resize: vertical;
	min-height: 96px;
}

.tl-bform__body input:focus,
.tl-bform__body select:focus,
.tl-bform__body textarea:focus {
	border-color: var(--tl-red);
}

.tl-bform__chips {
	margin-bottom: 18px;
}

.tl-bform__body .wpcf7-form .tl-bform__chips p {
	margin: 0;
}

.tl-bform__chips br {
	display: none;
}

.tl-bform__chips .wpcf7-radio {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.tl-bform__chips .wpcf7-list-item {
	margin: 0;
}

.tl-bform__chips .wpcf7-list-item label {
	display: inline-flex;
	cursor: pointer;
}

.tl-bform__chips input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.tl-bform__chips .wpcf7-list-item-label {
	display: inline-block;
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 1px;
	color: rgb(90, 60, 44);
	border: 1px solid rgba(158, 123, 89, 0.5);
	border-radius: 20px;
	padding: 9px 18px;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.tl-bform__chips label:hover .wpcf7-list-item-label,
.tl-bform__chips input[type="radio"]:checked + .wpcf7-list-item-label {
	background: var(--tl-red);
	border-color: var(--tl-red);
	color: var(--tl-gold);
	font-weight: 700;
}

.tl-bform__chips input[type="radio"]:focus-visible + .wpcf7-list-item-label {
	outline: 2px solid var(--tl-red);
	outline-offset: 2px;
}

.tl-bform__submit {
	position: relative;
	display: block;
	padding: 1px;
	background: linear-gradient(135deg, var(--tl-gold), var(--tl-red));
	border-radius: 6px;
	transition: filter 0.2s;
}

.tl-bform__submit:hover {
	filter: brightness(1.08);
}

.tl-bform__submit input[type="submit"] {
	display: block;
	width: 100%;
	background: var(--tl-red);
	color: var(--tl-gold);
	border: none;
	border-radius: 5px;
	padding: 16px;
	font-family: var(--tl-serif);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	cursor: pointer;
}

.tl-bform__submit .wpcf7-spinner {
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}

.tl-bform__body .wpcf7-not-valid-tip {
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(133, 11, 11);
	margin-top: 6px;
}

.tl-bform__body .wpcf7 form .wpcf7-response-output {
	font-family: var(--tl-sans);
	font-size: 13px;
	border-color: rgb(215, 178, 115);
	margin: 12px 0 0;
	padding: 12px 14px;
}

.tl-bside {
	width: 360px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.tl-bside--sm {
	width: 350px;
}

.tl-bhot {
	position: relative;
	background: var(--tl-red);
	border-radius: 8px;
	padding: 26px 24px;
	overflow: hidden;
	text-align: center;
}

.tl-bhot__frame {
	position: absolute;
	inset: 8px;
	border: 1px solid rgba(231, 196, 122, 0.3);
	border-radius: 5px;
	pointer-events: none;
}

.tl-bhot__inner {
	position: relative;
	z-index: 1;
}

.tl-bhot__label {
	font-family: var(--tl-sans);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-gold-light);
	margin-bottom: 8px;
}

.tl-bhot .tl-bhot__phone {
	display: block;
	font-family: var(--tl-serif);
	font-size: 32px;
	font-weight: 700;
	color: rgb(231, 201, 133);
	line-height: 1.1;
	margin-bottom: 6px;
}

.tl-bhot .tl-bhot__phone:hover {
	color: var(--tl-gold-light);
}

.tl-bhot__note {
	font-family: var(--tl-sans);
	font-size: 11.5px;
	color: rgba(245, 228, 172, 0.8);
}

.tl-bcard {
	background: rgb(255, 248, 237);
	border: 1px solid rgba(158, 123, 89, 0.35);
	border-radius: 8px;
	padding: 24px;
}

.tl-bcard__title {
	font-family: var(--tl-serif);
	font-size: 18px;
	font-weight: 700;
	color: var(--tl-red);
	margin-bottom: 14px;
}

.tl-brow {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px dashed rgba(158, 123, 89, 0.4);
}

.tl-brow__label {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(58, 42, 32);
}

.tl-brow__value {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	font-weight: 700;
	color: var(--tl-red);
}

.tl-bcard__note {
	font-family: var(--tl-sans);
	font-size: 11.5px;
	color: rgb(120, 100, 80);
	margin-top: 10px;
}

.tl-bnotes {
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.tl-bnotes__item {
	display: flex;
	gap: 10px;
	font-family: var(--tl-sans);
	font-size: 12px;
	color: rgb(58, 42, 32);
	line-height: 1.65;
}

.tl-bnotes__mark {
	color: var(--tl-brown);
	flex-shrink: 0;
}

.tl-bteaser {
	display: block;
	border: 1px solid rgba(158, 123, 89, 0.35);
	border-radius: 8px;
	overflow: hidden;
	transition: filter 0.25s;
}

.tl-bteaser:hover {
	filter: brightness(1.04);
}

.tl-bteaser__media {
	height: 130px;
}

.tl-bteaser__body {
	background: rgb(255, 248, 237);
	padding: 18px 22px;
	text-align: center;
}

.tl-bteaser__title {
	font-family: var(--tl-serif);
	font-size: 17px;
	font-weight: 700;
	color: var(--tl-red);
	margin-bottom: 4px;
}

.tl-bteaser__desc {
	font-family: var(--tl-sans);
	font-size: 11.5px;
	color: rgb(90, 70, 54);
}

/* ==========================================================================
   Trang dat ban thanh cong
   ========================================================================== */

.tl-shero--done {
	background: rgb(28, 12, 8);
	padding: 60px 0 74px;
}

.tl-shero--done .tl-shero__media {
	opacity: 0.2;
}

.tl-shero--done .tl-shero__veil {
	background: linear-gradient(180deg, rgba(28, 12, 8, 0.82), rgba(28, 12, 8, 0.94));
}

.tl-shero--done .tl-shero__inner {
	padding-top: 26px;
}

.tl-shero--done .tl-shero__flourish {
	animation: tl-fade-up 0.5s 0.1s ease-out both;
}

.tl-shero--done .tl-shero__title {
	font-size: 42px;
	line-height: 1.15;
	margin-bottom: 14px;
	animation: tl-fade-up 0.5s 0.16s ease-out both;
}

.tl-shero--done .tl-shero__desc {
	font-size: 14.5px;
	line-height: 1.8;
	max-width: 600px;
	animation: tl-fade-up 0.5s 0.22s ease-out both;
}

.tl-shero--done .tl-shero__desc strong {
	color: rgb(231, 201, 133);
}

.tl-bseal {
	width: 118px;
	height: 118px;
	border-radius: 50%;
	background: var(--tl-red);
	border: 2px solid var(--tl-gold);
	box-shadow: 0 14px 32px rgba(0, 0, 0, 0.42);
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 22px;
	animation: tl-seal-in 0.55s ease-out both;
}

.tl-bseal__ring {
	width: 96px;
	height: 96px;
	border-radius: 50%;
	border: 1px solid rgba(231, 196, 122, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
}

@keyframes tl-seal-in {
	0% {
		transform: scale(0.6);
		opacity: 0;
	}

	60% {
		transform: scale(1.06);
		opacity: 1;
	}

	100% {
		transform: scale(1);
		opacity: 1;
	}
}

@keyframes tl-fade-up {
	0% {
		transform: translateY(14px);
		opacity: 0;
	}

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

@media (prefers-reduced-motion: reduce) {
	.tl-bseal,
	.tl-shero--done .tl-shero__flourish,
	.tl-shero--done .tl-shero__title,
	.tl-shero--done .tl-shero__desc {
		animation: none;
	}
}

.tl-bsum {
	position: relative;
	background: rgb(250, 242, 231);
	overflow: hidden;
	padding: 50px 0 58px;
}

.tl-bsum__bg {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 60%;
	opacity: 0.09;
	pointer-events: none;
}

.tl-bsum__row {
	position: relative;
	z-index: 1;
	display: flex;
	gap: 40px;
	align-items: flex-start;
}

.tl-bticket {
	flex: 1;
	min-width: 0;
	padding: 1.5px;
	background: linear-gradient(160deg, var(--tl-gold), var(--tl-red));
	border-radius: 10px;
	box-shadow: 0 18px 40px rgba(40, 20, 10, 0.16);
}

.tl-bticket__inner {
	background: rgb(255, 250, 242);
	border-radius: 9px;
	padding: 30px 34px 32px;
}

.tl-bticket__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 18px;
	border-bottom: 1px dashed rgba(158, 123, 89, 0.5);
}

.tl-bticket__code-label,
.tl-bticket__label {
	font-family: var(--tl-sans);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--tl-brown);
	margin-bottom: 6px;
}

.tl-bticket__code {
	font-family: var(--tl-serif);
	font-size: 27px;
	font-weight: 700;
	letter-spacing: 2px;
	color: var(--tl-red);
	line-height: 1;
	white-space: nowrap;
}

.tl-bticket__status {
	font-family: var(--tl-sans);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--tl-gold);
	background: var(--tl-red);
	border-radius: 20px;
	padding: 8px 15px;
	white-space: nowrap;
}

.tl-bticket__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px 28px;
	padding: 22px 0;
}

.tl-bticket__value {
	font-family: var(--tl-serif);
	font-size: 17px;
	font-weight: 700;
	color: rgb(45, 30, 22);
	overflow-wrap: anywhere;
}

.tl-bticket__note {
	padding-top: 18px;
	border-top: 1px dashed rgba(158, 123, 89, 0.5);
}

.tl-bticket__note-text {
	font-family: var(--tl-sans);
	font-size: 13px;
	color: rgb(58, 42, 32);
	line-height: 1.75;
}

.tl-bticket__actions {
	display: flex;
	gap: 14px;
	margin-top: 26px;
	flex-wrap: wrap;
}

.tl-btn-book--gold {
	background: linear-gradient(135deg, var(--tl-red), var(--tl-gold));
}

.tl-btn-book--gold .tl-btn-book__inner {
	background: linear-gradient(0deg, var(--tl-gold), rgb(248, 237, 215));
	color: var(--tl-red);
}

.tl-bmini {
	display: flex;
	gap: 12px;
	padding: 14px 0;
	border-bottom: 1px dashed rgba(158, 123, 89, 0.4);
}

.tl-bcard__title + .tl-bmini {
	padding-top: 0;
}

.tl-bmini:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

.tl-bmini__num {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 1.5px solid rgba(158, 123, 89, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-family: var(--tl-serif);
	font-size: 14px;
	font-weight: 700;
	color: var(--tl-red);
}

.tl-bmini__num--on {
	background: var(--tl-red);
	border-color: var(--tl-red);
	color: var(--tl-gold);
}

.tl-bmini__text {
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(58, 42, 32);
	line-height: 1.7;
}

.tl-bline {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin-bottom: 10px;
	font-family: var(--tl-sans);
	font-size: 12.5px;
	color: rgb(58, 42, 32);
	line-height: 1.7;
}

.tl-bline:last-child {
	margin-bottom: 0;
}

.tl-bline svg {
	flex-shrink: 0;
	margin-top: 3px;
}

.tl-bsug {
	background: var(--tl-cream);
	padding: 46px 0 54px;
}

.tl-bsug__cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	max-width: 1100px;
	margin: 0 auto;
}

.tl-bsug__back {
	text-align: center;
	margin-top: 32px;
}

.tl-bsug__back a {
	font-family: var(--tl-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}

@media (max-width: 1000px) {
	.tl-bform__row,
	.tl-bsum__row {
		flex-direction: column;
	}

	.tl-bside,
	.tl-bside--sm {
		width: 100%;
	}
}

@media (max-width: 900px) {
	.tl-bsteps__row {
		flex-wrap: wrap;
		justify-content: center;
		gap: 16px 26px;
	}

	.tl-bsteps__line {
		display: none;
	}

	.tl-bform__title {
		font-size: 26px;
	}

	.tl-shero--done .tl-shero__title {
		font-size: 30px;
	}

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

@media (max-width: 640px) {
	.tl-bform__grid {
		flex-direction: column;
		gap: 16px;
	}

	.tl-bticket__inner {
		padding: 24px 20px 26px;
	}

	.tl-bticket__grid {
		grid-template-columns: 1fr;
	}

	.tl-bticket__head {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.tl-bticket__code {
		font-size: 23px;
	}

	.tl-bsug__cards {
		grid-template-columns: 1fr;
	}

	.tl-shero--done .tl-shero__title {
		font-size: 24px;
	}
}