@font-face {
    font-family: 'BeautiqueDisplay';
    /* Tên tự đặt */
    src: url('../fonts/BeautiqueDisplayv1.0/BeautiqueDisplay/BeautiqueDisplay-Regular.otf') format('woff2'),
        url('../fonts/BeautiqueDisplayv1.0/BeautiqueDisplay/BeautiqueDisplay-Regular.otf') format('woff');
    /* Fallback */
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    /* Quan trọng: Giúp text hiện ra ngay lập tức, không bị ẩn khi chờ font load */
}

/* 2. Khai báo Font đậm (Bold - 700) */
@font-face {
    font-family: 'BeautiqueDisplay';
    /* Vẫn dùng tên cũ để gom nhóm */
    src: url('../fonts/BeautiqueDisplayv1.0/BeautiqueDisplay/BeautiqueDisplay-Bold.otf') format('woff2');
    font-weight: 700;
    /* Đánh dấu đây là bản bold */
    font-style: normal;
    font-display: swap;
}

* {
  font-family: "Montserrat", sans-serif;
}

header,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'BeautiqueDisplay', serif;
    /* Sử dụng font mới cho toàn trang */
}

.nav-spacing-medium>li {
    margin: 0 20px !important;
}

.header-nav>li a {
    font-family: 'BeautiqueDisplay', serif;
    /* Sử dụng font mới cho menu */
    font-weight: 700;
    /* Đặt menu thành đậm */
    text-transform: none !important;
    /* Chuyển chữ thành in hoa */
    position: relative;
}

.header-nav>li:first-child::after,
.header-nav>li:nth-child(2):after {
    content: "";
    background-image: url('../images/pattern-blink-ecochic.svg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-flex;
    width: 22px;
    height: 22px;
    position: absolute;
    top: -10px;
    right: -20px;
}

.text-star {
    font-family: 'BeautiqueDisplay', serif;

}

.text-star h2::after {
    content: "";
    background-image: url('../images/pattern-blink-ecochic.svg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-flex;
    width: 30px;
    height: 30px;
    position: absolute;
    top: -5px;
    right: -36px;
}

.text-star h2 {
    position: relative;
    width: fit-content;
    display: flex;
    margin: auto;
    margin-bottom: 30px;
}