/*
Theme Name: GP Developer Child Theme
Template: generatepress
Theme URI: https://addisonhalldesign.com
Author: Addison Hall
Author URI: https://addisonhalldesign.com
Description: This is a child theme for GeneratePress for use in jumpstarting more customized development.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gpc
Tags: two-columns, three-columns, one-column, right-sidebar, left-sidebar, fluid-layout, fixed-layout, responsive-layout, flexible-header, full-width-template, buddypress, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, featured-images, theme-options, light, white, dark, black, blue, brown, gray, green, orange, pink, purple, red, silver, tan, yellow
*/

/*

CONTENTS:
1. Defaults
2. Header and Nav
3. Home Page
4. Content
5. Components
6. Widgets
7. Footer
8. Other
9. Animations

*/

/* ==========================================
=! DEFAULTS
------------------------------------------ */

/* --- KHÔNG đặt scroll-behavior:smooth trên <html> ---
   Nó làm Chrome "cuộn có hiệu ứng" khi khôi phục vị trí cuộn lúc chuyển trang
   (thấy rõ trên Chrome thường đang mở, không thấy ở tab ẩn danh) -> giật màn hình
   khi bấm link. Nút "Lên đầu trang" tự gọi scrollTo({behavior:'smooth'}) trong JS. */

ol, ul {
    margin-left: 1.75em;
}

/* ==========================================
=! HEADER AND NAV
------------------------------------------ */

/* ==========================================================================
   KHỐI GIỚI THIỆU VẦNG TRĂNG KHUYẾT VIỆT NAM (TOP PAGE)
   ========================================================================== */
/* --- CHỈNH SỬA TIÊU ĐỀ CHỮ VẦNG TRĂNG KHUYẾT 1 DÒNG --- */
.intro-moon-title {
    font-size: 2.5rem; /* Giảm nhẹ size chữ một chút để đảm bảo hiển thị trọn vẹn 1 dòng trên màn hình máy tính */
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 15px 0;
}
.intro-moon-title .title-secondary {
    color: var(--primary-color);
    display: inline-block;
    white-space: nowrap; /* Ép chữ Vầng Trăng Khuyết nằm trên 1 dòng */
}

/* --- CHỈNH SỬA HỘP XANH: CHỮ HÀNH TRÌNH CỦA THÍ SINH 1 DÒNG --- */
.badge-overlay-box.inside-image {
    position: absolute;
    bottom: 15px;
    right: 15px;
    width: 240px; /* Tăng chiều rộng lên 200px (cũ là 160px) để đủ chỗ cho chữ nằm ngang */
    padding: 12px 15px;
    background-color: rgba(44, 56, 147, 0.95);
    border-radius: 6px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.badge-overlay-box.inside-image .badge-number {
    font-size: 1.8rem; 
    margin-bottom: 2px;
}

.badge-overlay-box.inside-image .badge-text {
    display: block;
    font-size: 0.65rem;
    font-weight: bold;
    letter-spacing: 0.5px;
    line-height: 1.2;
    white-space: nowrap; /* Ép dòng chữ này luôn nằm trên 1 dòng duy nhất, không tự động xuống hàng */
}

/* Định vị lại khối hộp nhỏ gọn bên trong ảnh */
.badge-overlay-box.inside-image {
    position: absolute;
    bottom: 15px; /* Cách cạnh dưới ảnh 15px */
    right: 15px;  /* Cách cạnh phải ảnh 15px */
    width: 185px; /* Thu nhỏ độ rộng (cũ là 220px) */
    padding: 15px; /* Thu hẹp khoảng cách đệm bên trong */
    background-color: rgba(44, 56, 147, 0.95); /* Màu xanh dương có chút trong suốt nhìn rất sang */
    border-radius: 6px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* Thu nhỏ font chữ số 2025 */
.badge-overlay-box.inside-image .badge-number {
    font-size: 1.8rem; 
    margin-bottom: 3px;
}

/* Thu nhỏ text hành trình */
.badge-overlay-box.inside-image .badge-text {
    font-size: 0.65rem;
    letter-spacing: 0.5px;
    line-height: 1.3;
}
/* Chia bố cục 2 cột bằng Grid */
.intro-moon-container {
    display: grid;
    grid-template-columns: 1.1fr 1fr; /* Cột ảnh rộng hơn cột chữ một chút */
    gap: 50px;
    align-items: center;
}

/* --- CỘT TRÁI: XỬ LÝ ẢNH VÀ HỘP ĐÈ --- */
.intro-moon-left {
    position: relative;
}
.image-wrapper-box {
    position: relative;
    padding-bottom: 40px; /* Chừa khoảng trống bên dưới cho hộp đè tràn ra ngoài rìa nếu muốn */
}

/* 1. Ép bức ảnh hiển thị theo chiều dọc */
.main-stage-img {
    width: 100% !important;
    height: 480px !important; /* Đặt chiều cao cố định để kéo dọc bức ảnh bằng cột chữ */
    object-fit: cover !important; /* Giữ ảnh không bị bóp méo, tự động cắt cúp thông minh */
    object-position: center center; /* Căn trọng tâm bức ảnh vào giữa */
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* Hộp màu xanh dương góc phải */
.badge-overlay-box {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 220px;
    background-color: #2c3893; /* Màu xanh dương đậm hoàng gia */
    color: #ffffff;
    padding: 25px 20px;
    border-radius: 4px;
    box-shadow: 0 8px 25px rgba(44, 56, 147, 0.3);
    z-index: 2;
}
.badge-number {
    display: block;
    font-size: 2.5rem;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 8px;
    font-family: inherit;
}
.badge-text {
    display: block;
    font-size: 0.75rem;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1.4;
}

/* --- CỘT PHẢI: XỬ LÝ CHỮ --- */
.intro-moon-title {
    font-size: 2.6rem;
    font-weight: 800;
    color: #111538; /* Màu xanh đen thẫm trang trọng */
    line-height: 1.15;
    margin: 0 0 15px 0;
}
/* 3. Đảm bảo trên Mobile ảnh tự động quay về tỷ lệ ngang tự nhiên để không bị quá cao */
@media (max-width: 768px) {
    .main-stage-img {
        height: auto !important; /* Trả về chiều cao tự động trên điện thoại */
        aspect-ratio: 4 / 3 !important; /* Giữ tỷ lệ hơi vuông nhẹ trên mobile cho đẹp */
    }
    
    /* Hộp xanh di động: Điều chỉnh vị trí đẩy lên trên để nằm gọn trong ảnh */
    //.badge-overlay-box.inside-image {
      //  bottom: 25px !important; /* Đẩy cao lên (cũ là 10px), giúp hộp không bị tụt xuống dưới rìa ảnh */
      //  right: 15px !important;  /* Giữ khoảng cách đều với lề phải ảnh */
      //  width: auto !important;
     //   max-width: 65% !important;
      //  padding: 8px 12px !important;
      //  background-color: rgba(44, 56, 147, 0.95) !important;
   // }
	
	    .badge-overlay-box.inside-image {
        bottom: 35px !important;
        right: 15px !important;
        width: auto !important;
        max-width: 65% !important;
		padding: 8px 12px !important;
        background-color: rgba(44, 56, 147, 0.95) !important;
    }
}
/* Đường gạch ngang trang trí màu vàng gold */
.decorative-line {
    width: 60px;
    height: 4px;
    background-color: #cca43b; /* Vàng gold */
    margin-bottom: 25px;
}

.intro-paragraph-bold {
    font-size: 1.05rem;
    font-weight: 600;
    color: #444;
    line-height: 1.6;
    margin-bottom: 15px;
}
.intro-paragraph-normal {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
    margin-bottom: 25px;
}

/* Danh sách có ô vuông vàng */
.intro-feature-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 30px 0 !important;
}
.intro-feature-list li {
    position: relative;
    padding-left: 25px !important;
    margin-bottom: 12px !important;
    font-size: 0.95rem;
    color: #444;
    font-weight: 500;
}
/* Tạo ô vuông màu vàng trang trí đầu dòng */
.intro-feature-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 8px;
    height: 8px;
    background-color: #cca43b; /* Màu vàng vuông */
    border-radius: 1px;
}

/* Nút bấm Tìm hiểu góc dưới */
.btn-outline-dark {
    display: inline-block;
    padding: 12px 28px;
    border: 1px solid #111538;
    color: #111538 !important;
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: bold;
    letter-spacing: 0.5px;
    border-radius: 4px;
    background: transparent;
    transition: all 0.25s ease;
}
.btn-outline-dark:hover {
    background-color: #111538;
    color: #ffffff !important;
}

/* --- TỐI ƯU HIỂN THỊ ĐIỆN THOẠI --- */
@media (max-width: 768px) {
    .intro-moon-container {
        grid-template-columns: 1fr; /* Chuyển thành 1 cột dọc */
        gap: 35px;
    }
    .intro-moon-title {
        font-size: 2rem;
    }
    .image-wrapper-box {
        padding-bottom: 50px;
    }
    .badge-overlay-box {
        width: 180px;
        padding: 15px;
    }
    .badge-number {
        font-size: 2rem;
    }
}
/* ==========================================
=! HOME PAGE
------------------------------------------ */



/* ==========================================
=! CONTENT
------------------------------------------ */

/* --- search results --- */
.gpc-search-query-term {
    background-color: var(--highlight);
}
.gpc.search-results .site-main > .dynamic-content-template {
    margin-bottom: 0;
}

/* ==========================================
=! COMPONENTS
------------------------------------------ */

/* --- fixes potential theme css conflict --- */
.acf-map img {
    max-width: inherit !important;
}

/* --- responsive embed --- */
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.embed-container iframe, .embed-container object, .embed-container embed, .embed-container video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* --- breadcrumbs --- */
.breadcrumbs {
    font-size: 14px;
    margin-bottom: 10px;
}

/* ==========================================
=! WIDGETS
------------------------------------------ */

/* --- GPC Sub Menu Widget --- */
/* .widget_gpc_sub_menu_widget .dropdown-menu-toggle { display: none; } */
.widget_gpc_sub_menu_widget .menu-item-has-children .sub-menu { margin-left: 1.2em; }
.widget_gpc_sub_menu_widget .menu-item-has-children .sub-menu li { list-style: disc; }
.widget_gpc_sub_menu_widget .current-menu-item > a { font-weight: bold; }

/* ==========================================
=! FOOTER
------------------------------------------ */



/* ==========================================
=! OTHER
------------------------------------------ */

/* --- simple spacing utilities --- */
.m0 { margin:0 !important }
.mt0 { margin-top:0 !important }
.mr0 { margin-right:0 !important }
.mb0 { margin-bottom:0 !important }
.ml0 { margin-left:0 !important }
.p0 { padding:0 !important }
.pt0 { padding-top:0 !important }
.pr0 { padding-right:0 !important }
.pb0 { padding-bottom:0 !important }
.pl0 { padding-left:0 !important }

/* ==========================================
=! ANIMATION
------------------------------------------ */

/* --- do all the preload stuff --- */
@media (min-width: 768px) {
    .preload * {
        -webkit-transition: none !important;
        transition: none !important;
        -webkit-animation: none !important;
        animation: none !important;
    }
    /* opacity will be set back to 1 by animations below */
    .has-js .prep-animation,
    .has-js .prep-scroll-animation {
        opacity: 0;
    }
}

/* --- respect user preferences for motion --- */
@media screen and (prefers-reduced-motion: reduce) {
    body * {
        -webkit-transition: none !important;
        transition: none !important;
        -webkit-animation: none !important;
        animation: none !important;
    }
}

/* ----------------------------------------------
 * Generated by Animista
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

 @media (min-width: 768px) {
     .fade-in-left {
         -webkit-animation: fade-in-left 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                 animation: fade-in-left 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
     }
     
     .fade-in {
         -webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                 animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
     }
     
     .fade-in-bottom {
         -webkit-animation: fade-in-bottom 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                 animation: fade-in-bottom 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
     }
     
     .fade-in-right {
         -webkit-animation: fade-in-right 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                 animation: fade-in-right 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
     }
 }

/* --- animation fade-in-left --- */
@-webkit-keyframes fade-in-left {
    0% {
        -webkit-transform: translateX(-75px);
                transform: translateX(-75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
}
@keyframes fade-in-left {
    0% {
        -webkit-transform: translateX(-75px);
                transform: translateX(-75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
}

/* --- animation fade-in --- */
@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* --- animation fade-in-bottom --- */
@-webkit-keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(75px);
                transform: translateY(75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        opacity: 1;
    }
}
@keyframes fade-in-bottom {
    0% {
        -webkit-transform: translateY(75px);
                transform: translateY(75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        opacity: 1;
    }
}  

/* --- animation fade-in-right --- */
@-webkit-keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(75px);
                transform: translateX(75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
}
@keyframes fade-in-right {
    0% {
        -webkit-transform: translateX(75px);
                transform: translateX(75px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
    }
}
  
  
/* --- delay classes --- */
.delay-250 {
    -webkit-animation-delay: 250ms;
    animation-delay: 250ms;
}
.delay-500 {
    -webkit-animation-delay: 500ms;
    animation-delay: 500ms;
}
.delay-750 {
    -webkit-animation-delay: 750ms;
    animation-delay: 750ms;
}
.delay-1000 {
    -webkit-animation-delay: 1000ms;
    animation-delay: 1000ms;
}
.delay-1250 {
    -webkit-animation-delay: 1250ms;
    animation-delay: 1250ms;
}
.delay-1500 {
    -webkit-animation-delay: 1500ms;
    animation-delay: 1500ms;
}
/* ==========================================================================
   GIAO DIỆN TRANG CHỦ CUỘC THI HOA HẬU
   ========================================================================== */

:root {
    --primary-color: #d11a5b; /* Hồng ruby quý phái */
    --secondary-color: #cca43b; /* Vàng gold vương miện */
    --text-dark: #1a1a1a;
    --text-light: #ffffff;
    --bg-light: #f9f9f9;
}

/* Toàn bộ trang chủ */
.home-beauty-contest {
    font-family: inherit;
    color: var(--text-dark);
}

/* 1. Hero Banner */
.hero-banner {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.7)), url('https://unsplash.com') no-repeat center center;
    background-size: cover;
    padding: 100px 0;
    text-align: center;
    color: var(--text-light);
}
.hero-banner .sub-title {
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
}
.hero-banner h1 {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 20px;
    color: var(--text-light);
}
.hero-banner .hero-desc {
    font-size: 1.2rem;
    max-width: 600px;
    margin: 0 auto 30px;
}

/* Nút bấm (CTA Buttons) */
.btn {
    display: inline-block;
    padding: 12px 30px;
    border-radius: 4px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
    margin: 5px;
}
.btn-primary {
    background-color: var(--primary-color);
    color: var(--text-light) !important;
}
.btn-primary:hover {
    background-color: #b0124a;
}
.btn-secondary {
    border: 2px solid var(--secondary-color);
    color: var(--secondary-color) !important;
}
.btn-secondary:hover {
    background-color: var(--secondary-color);
    color: #000 !important;
}

/* 2. Sứ mệnh (Intro) */
.home-intro {
    padding: 60px 20px;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}
.home-intro h2 {
    color: var(--primary-color);
    font-size: 2rem;
    margin-bottom: 20px;
}
.home-intro p {
    font-size: 1.15rem;
    line-height: 1.8;
}

/* 3. Lộ trình (Timeline) */
.home-timeline {
    padding: 60px 20px;
    background-color: var(--bg-light);
}
.section-title {
    text-align: center;
    color: var(--primary-color);
    margin-bottom: 4px;
}
.timeline-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1-fr));
    gap: 20px;
    margin-top: 40px;
}
.timeline-item {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    border-top: 4px solid #ddd;
    position: relative;
}
.timeline-item.active {
    border-top-color: var(--primary-color);
}
.timeline-item .time-date {
    font-size: 0.9rem;
    font-weight: bold;
    color: var(--primary-color);
    display: block;
    margin-bottom: 10px;
}
.timeline-item h3 {
    margin-bottom: 10px;
    font-size: 1.3rem;
}

/* Responsive cơ bản */
@media (max-width: 768px) {
    .hero-banner h1 { font-size: 2.2rem; }
    .timeline-grid { grid-template-columns: 1fr; }
}
/* ==========================================================================
   SLIDER THÍ SINH TIÊU BIỂU
   ========================================================================== */
.home-contestants {
    padding: 60px 20px;
}
.section-desc {
    text-align: center;
    color: #666;
    margin-bottom: 30px;
}

/* Định dạng thẻ thí sinh */
.contestant-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    margin: 10px; /* Tạo khoảng cách giữa các slide */
    transition: transform 0.3s ease;
}
.contestant-card:hover {
    transform: translateY(-5px);
}
.card-thumb img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    display: block;
}
.card-info {
    padding: 20px;
}
.card-info h3 {
    margin: 0 0 5px 0;
    font-size: 1.3rem;
    color: var(--text-dark);
}
.contestant-sbd {
    display: inline-block;
    background: var(--primary-color);
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 2px 10px;
    border-radius: 20px;
    margin-bottom: 12px;
}
.contestant-story {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #555;
    height: 65px; /* Giới hạn chiều cao chữ để đều card */
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin-bottom: 15px;
}
.btn-view-profile {
    display: block;
    text-align: center;
    padding: 10px;
    background: #f5f5f5;
    color: var(--text-dark);
    text-decoration: none;
    font-weight: bold;
    border-radius: 6px;
    transition: background 0.3s;
}
.btn-view-profile:hover {
    background: var(--secondary-color);
    color: #000;
}

/* Tùy biến nút điều hướng của Splide cho hợp tone màu web */
.splide__arrow svg {
    fill: var(--primary-color) !important;
}
.splide__pagination__page.is-active {
    background: var(--primary-color) !important;
}

/* ==========================================================================
   CẤU TRÚC SLIDER THUẦN CSS (ÉP HÀNG NGANG CHẮC CHẮN CHẠY)
   ========================================================================== */
.home-contestants {
    padding: 60px 20px;
    overflow: hidden;
}

/* Khung bọc ngoài */
.contestants-slider-wrapper {
    width: 100%;
    overflow-x: auto; /* Tạo thanh cuộn ngang mượt mà */
    padding-bottom: 20px;
    -webkit-overflow-scrolling: touch;
}

/* Thanh chứa các bài viết - Ép buộc xếp hàng ngang bằng Flexbox */
.contestants-slider-track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
}

/* Định dạng kích thước từng ô bài viết trên Máy tính (Hiện 3 cột) */
.contestant-slide-item {
    flex: 0 0 calc(33.333% - 14px) !important;
    min-width: calc(33.333% - 14px) !important;
    margin-right: 20px;
    box-sizing: border-box;
}

/* Cấu trúc thẻ Card bên trong */
.contestant-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    transition: transform 0.3s ease;
}
.contestant-card:hover {
    transform: translateY(-5px);
}
.card-thumb img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    display: block;
}
.card-info {
    padding: 20px;
}
.card-info h3 {
    margin: 0 0 5px 0;
    font-size: 1.3rem;
    color: var(--text-dark);
}
.contestant-sbd {
    display: inline-block;
    background: var(--primary-color);
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 2px 10px;
    border-radius: 20px;
    margin-bottom: 12px;
}
.contestant-story {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #555;
    height: 65px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin-bottom: 15px;
}
.btn-view-profile {
    display: block;
    text-align: center;
    padding: 10px;
    background: #f5f5f5;
    color: var(--text-dark);
    text-decoration: none;
    font-weight: bold;
    border-radius: 6px;
    transition: background 0.3s;
}
.btn-view-profile:hover {
    background: var(--secondary-color);
    color: #000;
}

/* Tùy biến hiển thị trên Máy tính bảng (Hiện 2 cột) */
@media (max-width: 992px) {
    .contestant-slide-item {
        flex: 0 0 calc(50% - 10px) !important;
        min-width: calc(50% - 10px) !important;
    }
}

/* Tùy biến hiển thị trên Điện thoại (Hiện 1 cột) */
@media (max-width: 576px) {
    .contestant-slide-item {
        flex: 0 0 85% !important;
        min-width: 85% !important;
        margin-right: 15px;
    }
}

/* Ẩn thanh cuộn xấu xí trên các trình duyệt hiện đại để trông như slide xịn */
.contestants-slider-wrapper::-webkit-scrollbar {
    height: 6px;
}
.contestants-slider-wrapper::-webkit-scrollbar-thumb {
    background-color: rgba(209, 26, 91, 0.2);
    border-radius: 10px;
}

/* ==========================================================================
   TÙY BIẾN WIDGET BÀI VIẾT MỚI TRÊN SIDEBAR
   ========================================================================== */

/* Khử chấm tròn mặc định của danh sách */
.custom-recent-posts-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Từng dòng bài viết */
.recent-post-item {
    display: flex !important;
    align-items: center; /* Căn giữa ảnh và chữ theo chiều dọc */
    padding: 12px 0;
    border-bottom: 1px dashed #eee; /* Đường gạch mờ ngăn cách */
}
.recent-post-item:last-child {
    border-bottom: none; /* Khử gạch chân ở dòng cuối cùng */
}

/* Khung chứa ảnh thu nhỏ */
.post-thumb-link {
    flex: 0 0 65px; /* Ép ảnh luôn có độ rộng cố định 65px */
    margin-right: 15px;
}
.widget-post-thumb {
    width: 65px;
    height: 65px;
    object-fit: cover; /* Ép ảnh vuông không bị méo hình */
    border-radius: 6px; /* Bo góc mượt mà */
    display: block;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* Khung chứa thông tin chữ bên phải */
.post-info-right {
    flex: 1;
}

/* Tiêu đề rút gọn của bài viết */
.post-info-right h4.post-title-link {
    font-size: 0.95rem;
    line-height: 1.4;
    margin: 0 0 4px 0;
    font-weight: 600;
}
.post-info-right h4.post-title-link a {
    color: var(--text-dark);
    text-decoration: none;
    transition: color 0.2s ease;
}
.post-info-right h4.post-title-link a:hover {
    color: var(--primary-color); /* Đổi màu hồng ruby khi di chuột vào */
}

/* Ngày đăng bài viết mờ tinh tế */
.post-date-widget {
    font-size: 0.8rem;
    color: #888;
    display: block;
}

/* ==========================================================================
   TÙY BIẾN WIDGET DANH MỤC THÀNH MENU DẠNG THẺ (TABBED MENU)
   ========================================================================== */

/* 1. Reset khung chứa của WordPress Categories */
.widget_categories ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. Định dạng từng dòng chuyên mục thành một khối Menu */
.widget_categories ul li {
    position: relative;
    margin-bottom: 8px !important; /* Khoảng cách giữa các thẻ menu */
    padding: 0 !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 3. Biến đường link bên trong thành một khối Button đầy đủ */
.widget_categories ul li a {
    display: block;
    padding: 12px 20px 12px 40px; /* Chừa khoảng trống bên trái để làm icon dấu mũi tên */
    background: #ffffff; /* Nền trắng sang trọng */
    color: var(--text-dark);
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    border-radius: 8px; /* Bo góc mượt mà */
    border: 1px solid #eaeaea; /* Viền mờ định hình */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02); /* Đổ bóng nhẹ tinh tế */
    transition: all 0.25s ease;
}

/* 4. Tự động chèn icon dấu mũi tên cách điệu bằng CSS (Hỗ trợ Accessibility tốt hơn hình ảnh) */
.widget_categories ul li a::before {
    content: "→"; /* Biểu tượng mũi tên */
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--secondary-color); /* Màu vàng vương miện */
    font-weight: bold;
    font-size: 1.1rem;
    transition: all 0.25s ease;
}

/* 5. Hiệu ứng Hover (Di chuột vào) cực kỳ nổi bật */
.widget_categories ul li a:hover {
    background-color: var(--primary-color) !important; /* Đổi nền sang màu hồng Ruby */
    color: var(--text-light) !important; /* Đổi màu chữ sang trắng */
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px rgba(209, 26, 91, 0.25); /* Đổ bóng phát sáng màu hồng */
    padding-left: 45px; /* Đẩy nhẹ chữ sang phải tạo hiệu ứng chuyển động */
}

/* Khi hover thì dấu mũi tên đổi màu trắng và dịch chuyển nhẹ sang phải */
.widget_categories ul li a:hover::before {
    color: var(--text-light);
    left: 22px;
}

/* 6. Xử lý hiển thị Số lượng bài viết (Nếu bạn tích chọn "Show post counts" trong cài đặt Widget) */
.widget_categories ul li {
    /* WordPress xuất số lượng bài viết dưới dạng text thuần nằm ngoài thẻ <a>: " (5)" 
       Mẹo CSS này sẽ ép cấu trúc hiển thị sang dạng Flex để đẩy số đếm ra rìa phải */
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Biến số đếm bài viết thành một chiếc Badge (Huy hiệu) bo tròn */
.widget_categories ul li .post-count,
.widget_categories ul li:not(a) {
    /* Đoạn này bóc tách phần text số đếm của WordPress để định dạng */
    font-size: 0.8rem;
    font-weight: bold;
    background: #f0f0f0;
    color: #666;
    padding: 3px 8px;
    border-radius: 20px;
    pointer-events: none; /* Khóa tương tác chuột */
}

/* Khi người dùng di chuột vào menu, chiếc Badge số đếm cũng đổi màu tương phản */
.widget_categories ul li:hover .post-count {
    background: rgba(255, 255, 255, 0.2) !important;
    color: var(--text-light) !important;
}

/* ==========================================================================
   TỐI ƯU ĐÁP ỨNG (RESPONSIVE) TRÊN DI ĐỘNG - CĂN ĐỀU TĂM TẮP
   ========================================================================== */

@media (max-width: 768px) {
    /* 1. Đưa toàn bộ khung giới thiệu về trạng thái căn giữa */
    .intro-moon-section {
        padding: 40px 15px !important;
        text-align: center !important;
    }

    /* Chi tiết layout chuyển sang dạng 1 cột dọc */
    .intro-moon-container {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    /* 2. Căn chỉnh cột ảnh và hộp xanh bên trong */
    .intro-moon-left {
        width: 100% !important;
        max-width: 480px; /* Giới hạn độ rộng ảnh trên mobile để không bị quá to */
        margin: 0 auto !important; /* Căn giữa bức ảnh */
    }

    .image-wrapper-box {
        display: block !important;
        width: 100% !important;
    }

     /* Hộp xanh di động: Điều chỉnh vị trí đẩy lên trên để nằm gọn trong ảnh */
    //.badge-overlay-box.inside-image {
        //bottom: 25px !important; /* Đẩy cao lên (cũ là 10px), giúp hộp không bị tụt xuống dưới rìa ảnh */
        //right: 15px !important;  /* Giữ khoảng cách đều với lề phải ảnh */
       // width: auto !important;
       // max-width: 65% !important;
        //padding: 8px 12px !important;
        //background-color: rgba(44, 56, 147, 0.95) !important;
   // }
	


    .badge-overlay-box.inside-image .badge-number {
        font-size: 1.4rem !important; /* Thu nhỏ số 2025 */
        margin-bottom: 0 !important;
    }

    .badge-overlay-box.inside-image .badge-text {
        font-size: 0.55rem !important; /* Thu nhỏ chữ hành trình */
        white-space: normal !important; /* BẬT LẠI xuống dòng trên mobile để không làm lệch ảnh */
        line-height: 1.2 !important;
    }

    /* 3. Căn chỉnh cột chữ phía dưới */
    .intro-moon-right {
        text-align: left !important; /* Giữ chữ phần nội dung căn trái cho dễ đọc theo thói quen */
        width: 100% !important;
    }

    /* Tiêu đề chính căn giữa và thu nhỏ font tránh tràn viền */
    .intro-moon-title {
        font-size: 1.8rem !important; /* Thu nhỏ cỡ chữ phù hợp màn hình dọc */
        text-align: center !important; /* Căn giữa tiêu đề */
        line-height: 1.3 !important;
    }

    .intro-moon-title .title-secondary {
        white-space: normal !important; /* Cho phép chữ Vầng Trăng Khuyết tự ngắt dòng nếu màn hình quá nhỏ */
    }

    /* Căn giữa đường gạch trang trí */
    .decorative-line {
        margin: 0 auto 20px auto !important;
    }

    /* Căn giữa nút bấm hành động */
    .intro-moon-action {
        text-align: center !important;
    }
    
    .btn-outline-dark {
        width: 100% !important; /* Ép nút bấm tràn rộng ra trên điện thoại để dễ bấm bằng tay */
        max-width: 280px;
        box-sizing: border-box;
    }
}

/* ==========================================================================
   TẠO MÀU NỀN VÀ BO GÓC NỔI BẬT CHO TOÀN BỘ KHỐI GIỚI THIỆU
   ========================================================================== */
.intro-moon-section {
    background-color: #f7f6fb !important; /* Màu nền xám ánh tím hồng nhạt, giúp khối nổi bần bật trên nền trắng của web */
    padding: 60px 40px !important; /* Tăng khoảng đệm bên trong để chữ không bị sát rìa nền */
    border-radius: 16px; /* Bo tròn các góc của toàn bộ khối tạo sự mềm mại */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); /* Đổ bóng cực nhẹ để khối có độ nổi lên khỏi màn hình */
    margin-top: 0px; /* Tạo khoảng cách với phần phía trên */
    margin-bottom: 40px; /* Tạo khoảng cách với phần phía dưới */
}

/* Điều chỉnh lại khoảng cách trên Mobile để nền ôm chữ thật đẹp */
@media (max-width: 768px) {
    .intro-moon-section {
        padding: 40px 20px !important; /* Thu nhỏ khoảng đệm vừa vặn với màn hình điện thoại */
        margin-top: 15px;
        margin-bottom: 25px;
    }
}
/* ==========================================================================
   KHU VỰC LƯỚI 4 BÀI VIẾT TIN TỨC SỰ KIỆN
   ========================================================================== */
//.home-news-grid-section {
//    padding: 50px 20px;
//    background: transparent;
//}



/* Tiêu đề khu vực tin tức */
.news-header {
    text-align: center;
    margin-bottom: 40px;
}
.news-section-title {
    font-size: 2rem;
    font-weight: 800;
    color: #111538;
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}
.news-decorative-line {
    width: 50px;
    height: 3px;
    background-color: var(--primary-color); /* Hồng ruby */
    margin: 0 auto 15px auto;
}
.news-section-desc {
    font-size: 0.95rem;
    color: #666;
    max-width: 600px;
    margin: 0 auto;
}

/* Cấu trúc chia 4 cột bằng Grid trên Laptop */
.news-grid-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px; /* Khoảng cách giữa các thẻ bài viết */
}

/* Định dạng từng thẻ bài viết */
//.news-grid-item {
  //  background: #ffffff;
  //  border-radius: 8px;
  //  overflow: hidden;
  //  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
  //  border: 1px solid #eee;
  //  display: flex;
  //  flex-direction: column;
   // transition: transform 0.3s ease, box-shadow 0.3s ease;
//}
.news-grid-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.07);
}

/* Ảnh bài viết */
.news-item-thumb a {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background-color: #f0eef7;
    background-size: cover;
    background-position: center;
}
@supports not (aspect-ratio: 16 / 9) {
    .news-item-thumb a { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh giữ trọn nội dung, không bị cắt */
.news-item-thumb a.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(16px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.news-item-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    z-index: 1;
    transition: transform 0.5s ease;
}
.news-grid-item:hover .news-item-thumb img {
    transform: scale(1.05); /* Hiệu ứng phóng to nhẹ ảnh khi di chuột */
}

/* Khung chữ bên dưới ảnh */
.news-item-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Đảm bảo các nút đọc tiếp luôn thẳng hàng ở đáy */
}

/* Ngày tháng đăng bài */
.news-item-date {
    font-size: 0.8rem;
    color: #999;
    font-weight: 500;
    margin-bottom: 8px;
    display: block;
}

/* Tiêu đề bài viết */
.news-item-title {
    font-size: 1.1rem;
    line-height: 1.4;
    margin: 0 0 10px 0;
    font-weight: 700;
    /* Ép tiêu đề đúng 3 dòng -> 4 cột tin cao bằng nhau; dài quá cắt bằng "…" */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.4em * 3);
}
.news-item-title a {
    color: #111538;
    text-decoration: none;
    transition: color 0.2s ease;
}
.news-item-title a:hover {
    color: var(--primary-color);
}

/* Mô tả ngắn bài viết */
.news-item-excerpt {
    font-size: 0.9rem;
    color: #555;
    line-height: 1.5;
    margin-bottom: 15px;
    /* Mở đầu bài đúng 4 dòng; dài quá cắt bằng "…" (nút "Đọc tiếp" vẫn ghim đáy) */
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.5em * 4);
}

/* Link đọc tiếp */
.news-item-more {
    font-size: 0.85rem;
    font-weight: bold;
    color: var(--primary-color);
    text-decoration: none;
    transition: color 0.2s ease;
    display: inline-block;
    margin-top: auto; /* Đẩy xuống đáy thẻ */
}
.news-item-more:hover {
    color: #111538;
}

/* ==========================================================================
   TỐI ƯU ĐÁP ỨNG (RESPONSIVE) CHO KHU VỰC TIN TỨC
   ========================================================================== */

/* Trên màn hình Máy tính bảng (Co về 2 cột) */
@media (max-width: 992px) {
    .news-grid-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

/* Trên màn hình Điện thoại di động (Co về 1 cột dọc thẳng đều) */
@media (max-width: 576px) {
    .news-grid-container {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .news-section-title {
        font-size: 1.6rem;
    }
    .news-item-thumb a {
        aspect-ratio: 16 / 9; /* Giữ khung 16:9 đồng nhất trên mọi màn hình */
    }
}

/* ==========================================================================
   TẠO BOX VÀ MÀU NỀN CHO KHỐI LƯỚI 4 BÀI VIẾT TIN TỨC SỰ KIỆN
   ========================================================================== */
.home-news-grid-section {
    background-color: #f7f6fb !important; /* Màu nền xám ánh tím hồng nhạt đồng bộ với khối trên */
    padding: 60px 40px !important; /* Tạo khoảng đệm rộng rãi bên trong hộp */
    border-radius: 16px; /* Bo tròn các góc của toàn bộ khối tạo sự mềm mại, hiện đại */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); /* Đổ bóng cực nhẹ để khối nổi lên khỏi bề mặt */
    margin-top: 30px; /* Tạo khoảng cách vừa vặn với khối giới thiệu phía trên */
    margin-bottom: 40px; /* Tạo khoảng cách với phần phía dưới */
}

/* Tinh chỉnh màu nền của các thẻ bài viết bên trong để làm nổi bật trên nền xám */
.news-grid-item {
    background: #ffffff !important; /* Giữ các thẻ bài viết màu trắng tinh khôi để tạo độ tương phản cao */
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
    border: 1px solid #eaeaea;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* ==========================================================================
   TỐI ƯU HIỂN THỊ BOX TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 768px) {
    .home-news-grid-section {
        padding: 40px 20px !important; /* Thu nhỏ khoảng đệm bên trong để vừa vặn màn hình dọc */
        margin-top: 20px;
        margin-bottom: 25px;
    }
}

/* ==========================================================================
   ĐỒNG BỘ KHOẢNG CÁCH BOX VÀ ĐẨY NỘI DUNG LÊN CAO (TOÀN WEBSITE)
   ========================================================================== */

/* 1. Đồng bộ khoảng cách GIỮA các box ở cột chính và cột phải bằng nhau (24px) */
.site-main .intro-moon-section,
.site-main .home-news-grid-section,
.site-main article,
.sidebar .widget {
    margin-top: 0 !important;
    margin-bottom: 24px !important; /* Ép khoảng cách dọc giữa các box luôn là 24px */
}

/* Khử lề âm cũ của khối giới thiệu để chạy theo hệ thống đồng bộ mới */
.intro-moon-section {
    margin-top: 0 !important; 
}

/* 2. Đẩy nội dung bên trong các box lên sát mép trên một chút (Giảm Padding-Top) */
.intro-moon-section,
.home-news-grid-section {
    padding-top: 45px !important; /* Giảm khoảng đệm phía trên (Cũ là 60px) */
    padding-bottom: 50px !important;
}

/* Áp dụng cho các Widget ở Sidebar phải */
.sidebar .widget {
    padding-top: 25px !important; /* Đẩy nội dung widget lên cao sát tiêu đề */
    padding-bottom: 30px !important;
}

/* Áp dụng cho trang bài viết chi tiết / trang tĩnh mặc định của theme */
.separate-containers .inside-article {
    padding-top: 30px !important; /* Đẩy tiêu đề bài viết chi tiết lên sát mép box */
}

/* ==========================================================================
   ĐỒNG BỘ HIỂN THỊ KHI XEM TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 768px) {
    .site-main .intro-moon-section,
    .site-main .home-news-grid-section,
    .site-main article,
    .sidebar .widget {
        margin-bottom: 16px !important; /* Thu nhỏ khoảng cách giữa các box trên mobile còn 16px cho khít */
    }

    .intro-moon-section,
    .home-news-grid-section {
        padding-top: 30px !important; /* Mobile đẩy nội dung lên cao hơn */
        padding-bottom: 35px !important;
    }

    .sidebar .widget,
    .separate-containers .inside-article {
        padding-top: 20px !important;
    }
}
/* ==========================================================================
   TẠO BOX VÀ MÀU NỀN ĐỒNG BỘ CHO KHỐI THÍ SINH TIÊU BIỂU
   ========================================================================== */
.home-contestants-section {
    background-color: #f7f6fb !important; /* Màu nền xám ánh tím hồng nhạt thống nhất toàn trang chủ */
    padding: 45px 40px 50px 40px !important; /* Đẩy nội dung lên cao (Padding-top: 45px giống khối tin tức) */
    border-radius: 16px; /* Bo tròn các góc hộp */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); /* Đổ bóng mờ nhẹ */
    overflow: hidden;
    
    /* Đồng bộ lề khoảng cách giữa các box */
    margin-top: 0 !important;
    margin-bottom: 24px !important; 
}

/* Tiêu đề khu vực thí sinh */
.contestants-header {
    text-align: center;
    margin-bottom: 30px;
}
.contestants-section-title {
    font-size: 2rem;
    font-weight: 800;
    color: #111538;
    margin-bottom: 10px;
    letter-spacing: 0.5px;
}
.contestants-decorative-line {
    width: 50px;
    height: 3px;
    background-color: var(--primary-color); /* Hồng ruby */
    margin: 0 auto 15px auto;
}
.contestants-section-desc {
    font-size: 0.95rem;
    color: #666;
    max-width: 600px;
    margin: 0 auto;
}

/* Khung bọc ngoài chứa thanh cuộn */
.contestants-slider-wrapper {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
}

/* Ép các card thí sinh nằm ngang */
.contestants-slider-track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
}

/* Giữ các thẻ card thí sinh màu trắng tinh khôi tương phản nổi bật trên nền xám */
.contestant-card {
    background: #ffffff !important; 
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
    border: 1px solid #eaeaea;
    transition: transform 0.3s ease;
}

/* ==========================================================================
   TỐI ƯU BOX THÍ SINH TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 768px) {
    .home-contestants-section {
        padding: 30px 20px 35px 20px !important; /* Đẩy nội dung lên cao hơn trên điện thoại */
        margin-bottom: 16px !important;
    }
    .contestants-section-title {
        font-size: 1.6rem;
    }
}

/* ==========================================================================
   SỬA LỖI XUNG ĐỘT LAYOUT ĐẨY SIDEBAR (FIX VỠ KHUNG CHUẨN GENERATEPRESS)
   ========================================================================== */

/* Ép buộc khối nhà tài trợ luôn được giới hạn hiển thị trong vùng nội dung chính */
.home-partners-section {
    max-width: 100% !important;
    box-sizing: border-box !important;
    display: block !important; /* Đảm bảo khối bọc ngoài hoạt động theo dạng khối Block tiêu chuẩn */
    overflow: hidden !important; /* Cắt bỏ phần chuyển động thừa tràn ra ngoài */
}

/* Khung bọc giới hạn - Đóng vai trò là chốt chặn không cho phần tử con đẩy rộng Sidebar */
.partners-slider-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    position: relative;
    display: block !important;
}

/* CHỈNH SỬA QUAN TRỌNG: Đường ray chứa logo */
.partners-slider-track:has(.duplicate) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    
    /* Thay đổi từ width: max-content sang chiều rộng tính toán tự động */
    width: fit-content !important; 
    
    /* Kích hoạt lại chuyển động lướt ngang mượt mà */
    animation: marqueeAnimation 25s linear infinite !important; 
}

/* Định nghĩa lại hiệu ứng trượt tịnh tiến chuẩn, không làm phình màn hình */
@keyframes marqueeAnimation {
    0% { 
        transform: translate3d(0, 0, 0); 
    }
    100% { 
        /* Trượt chuẩn xác phân nửa đường ray mà không tác động đến lề của theme */
        transform: translate3d(-50%, 0, 0); 
    }
}
/* ==========================================================================
   KHỐI ĐƠN VỊ ĐỒNG HÀNH & NHÀ TÀI TRỢ CHẠY NGANG THUẦN CSS
   ========================================================================== */
.home-partners-section {
    background-color: #f7f6fb !important; /* Màu nền xám ánh hồng thống nhất hệ thống */
    padding: 45px 40px 50px 40px !important; /* Đẩy nội dung lên cao sát mép */
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
    overflow: hidden;
    margin-bottom: 24px !important; /* Cân bằng khoảng cách 24px với các box khác */
}

/* Tiêu đề trang trọng tinh tế */
.partners-header {
    text-align: center;
    margin-bottom: 35px;
}
.partners-section-title {
    font-size: 1.5rem; /* Cỡ chữ vừa phải, thanh lịch tạo sự trang trọng kính cẩn */
    font-weight: 700;
    color: #2c3893; /* Màu xanh dương hoàng gia */
    letter-spacing: 1px;
    margin-bottom: 12px;
}
.partners-decorative-line {
    width: 60px;
    height: 3px;
    background-color: #cca43b; /* Màu vàng gold vương miện tôn vinh đối tác */
    margin: 0 auto;
}

/* Khung bọc giới hạn hiển thị */
.partners-slider-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 10px 0;
}

/* Đường ray chứa các Logo - Mặc định chia 4 cột cố định */
.partners-slider-track {
    display: flex;
    align-items: center;
    justify-content: space-around; /* Căn đều khoảng cách */
    width: 100%;
}

/* Khung bọc của từng Logo */
.partner-logo-item {
    flex: 0 0 calc(25% - 30px); /* Chia chuẩn 4 cột trên màn hình máy tính */
    max-width: 200px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* Định dạng hình ảnh logo: Sử dụng bộ lọc Grayscale để sang trọng hóa, di chuột vào hiện màu gốc */
.partner-logo-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; /* Giữ nguyên tỷ lệ logo không bị méo */
    filter: grayscale(100%); /* Biến logo thành màu đen trắng đơn sắc để giao diện trang trọng, đồng bộ */
    opacity: 0.6;
    transition: all 0.3s ease;
}

/* Hiệu ứng khi di chuột vào từng logo đối tác */
.partner-logo-item img:hover {
    filter: grayscale(0%); /* Trả lại màu sắc nguyên bản của nhà tài trợ */
    opacity: 1;
    transform: scale(1.05); /* Phóng to nhẹ */
}

/* ==========================================================================
   SỬA LỖI MOBILE: HIỂN THỊ ĐỀU 2 BANNER VÀ CẶP MŨI TÊN ĐIỀU HƯỚNG
   ========================================================================== */
@media (max-width: 768px) {
    /* Khung bọc bên ngoài cùng để định vị nút mũi tên */
    .partners-slider-outer {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        padding: 0 30px; /* Tạo khoảng trống 2 cấp bên lề để đặt nút mũi tên */
        box-sizing: border-box;
    }

    /* Khung chứa thanh cuộn */
    .partners-slider-wrapper {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        width: 100% !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        padding: 5px 0 !important;
    }

    /* Đường ray chứa logo: Xếp hàng ngang Flexbox mở rộng tự nhiên */
    .partners-slider-track {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        gap: 12px !important; /* Khoảng cách giữa 2 ô banner */
        width: max-content !important;
    }

    /* ĐỊNH DẠNG Ô LOGO CHUẨN: Luôn hiện đúng 2 ô song song lấp đầy khoảng trắng */
    .partner-logo-item {
        /* Phép tính toán chuẩn: Lấy một nửa chiều rộng màn hình trừ đi khoảng cách Gap */
        flex: 0 0 calc(50% - 6px) !important;
        width: calc(50% - 6px) !important;
        min-width: calc(50% - 6px) !important;
        height: 75px !important;
        background: #ffffff;
        padding: 6px !important;
        border-radius: 6px;
        border: 1px solid #f0f0f0;
        box-sizing: border-box !important;
        scroll-snap-align: start;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .partner-logo-item img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: 100% !important;
        object-fit: contain !important;
    }

    /* ĐỊNH DẠNG CẶP NÚT MŨI TÊN NHẮC NHỞ NGƯỜI DÙNG */
    .partner-nav-btn {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 26px;
        height: 26px;
        background: #ffffff; /* Nền trắng tròn nổi bật */
        border: 1px solid #eaeaea;
        color: var(--primary-color); /* Mũi tên màu hồng ruby */
        border-radius: 50%;
        font-size: 1.3rem;
        line-height: 22px;
        text-align: center;
        z-index: 10;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1);
        padding: 0;
        cursor: pointer;
    }
    .partner-nav-btn:active {
        background: var(--primary-color);
        color: #fff;
    }
    /* Đặt vị trí nút trái và nút phải ôm sát viền hộp */
    .btn-prev { left: 2px; }
    .btn-next { right: 2px; }

    /* Ẩn thanh cuộn mặc định hệ thống để giữ thẩm mỹ cao cấp */
    .partners-slider-wrapper::-webkit-scrollbar { display: none !important; }
    .partners-slider-wrapper { -ms-overflow-style: none; scrollbar-width: none; }
}
/* ==========================================================================
   ĐỒNG BỘ BỐ CỤC CHUẨN 2 CỘT SONG SONG & HIỆU ỨNG CAO CẤP
   ========================================================================== */
.contestant-profile-card {
    background-color: #ffffff !important;
    padding: 45px !important;
    border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid #eaeaea;
}

/* Ép 2 cột luôn hiển thị song song hàng ngang */
.profile-upper-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.42fr) !important;
    gap: 40px !important;
    margin-bottom: 40px;
    align-items: stretch !important; /* Đảm bảo chiều cao ảnh trái bằng khối chữ phải */
}

/* Cột trái chứa ảnh dọc */
.profile-avatar-block-vertical {
    width: 100%;
    height: auto;
}
.contestant-large-avatar-vertical {
    display: block;
    width: 100% !important;
    aspect-ratio: 3 / 4;
    height: auto !important;
    object-fit: cover !important;
    object-position: top center !important; /* giữ đầu thí sinh, không cắt phần trên */
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
}
.vtk-avatar-noimg {
    align-items: center;
    justify-content: center;
    display: flex !important;
    font-size: 3rem;
    background: #f0eef7;
}

/* Cột phải chứa thông tin tự động kéo giãn */
.profile-info-table-block {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important; /* Kéo Tên lên đỉnh, đẩy box vote xuống sát đáy ảnh */
    height: 100%;
}

.contestant-name {
    font-size: clamp(1.8rem, 2.5vw, 2.35rem);
    font-weight: 800;
    color: #111538;
    margin: 0 0 6px 0;
    line-height: 1.18;
}
.contestant-badge-sbd {
    display: inline-block;
    align-self: flex-start;
    background: linear-gradient(135deg, #2c3893, #1a237e);
    color: #ffffff !important;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 6px;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
    box-shadow: 0 4px 12px rgba(44, 56, 147, 0.15);
}

/* Bảng thông tin xám hồng nổi khối nhã nhặn */
.contestant-meta-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background-color: #f8f7fc !important;
    border-radius: 12px;
    border: 1px solid #e6e4f0;
    overflow: hidden;
    margin-bottom: 20px;
}
.contestant-meta-table tr { border-bottom: 1px solid #edeaf6; }
.contestant-meta-table tr:last-child { border-bottom: none; }
.contestant-meta-table th {
    text-align: left;
    color: #555e7b;
    font-weight: 600;
    font-size: 0.94rem;
    padding: 12px 14px;
    min-width: 0;
    white-space: nowrap;
    border-bottom: 1px solid #edeaf6;
}
.contestant-meta-table tr:last-child th { border-bottom: none; }
.contestant-meta-table td {
    color: #111538;
    font-weight: 700;
    font-size: 0.94rem;
    padding: 12px 14px;
    white-space: nowrap; /* nghề nghiệp & các giá trị luôn gọn trên 1 dòng */
    border-bottom: 1px solid #edeaf6;
}
.contestant-meta-table tr:last-child td { border-bottom: none; }

/* Box bình chọn độc lập */
.contestant-vote-box {
    background: #ffffff !important;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #e6e4f0;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.02);
}
.vote-guide-text {
    font-size: 0.9rem;
    color: #444c63;
    font-weight: 500;
    margin-top: 0;
    margin-bottom: 12px;
}
.vote-action-row {
    display: flex;
    align-items: center;
    gap: 15px;
}
.btn-vote-submit {
    background: linear-gradient(135deg, #d11a5b, #b0124a) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(209, 26, 91, 0.25) !important;
    transition: all 0.2s ease;
}
.btn-vote-submit:hover {
    background: linear-gradient(135deg, #b0124a, #8e0b3a) !important;
    transform: translateY(-2px);
}
.btn-vote-submit.voted {
    background: #e0dfeb !important;
    color: #7a7893 !important;
    box-shadow: none !important;
    cursor: not-allowed;
    border: 1px solid #d1cfe2 !important;
    transform: none !important;
}
.vote-counter-display {
    font-size: 1rem;
    font-weight: 600;
    color: #444c63;
    background-color: #f8f7fc;
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid #edeaf6;
}
#vote-count-number {
    color: #d11a5b !important;
    font-size: 1.25rem;
    font-weight: 800;
}

@media (max-width: 768px) {
    /* minmax(0,1fr): cột phải có bảng/box chữ "nowrap" min-content ~321px, rộng hơn
       khung thẻ -> kéo giãn cả cột -> ảnh bìa 100% bị lòi ra mép phải ("lệch").
       minmax(0,1fr) khoá sàn track = 0 nên ảnh khớp đúng lề nội dung bên dưới. */
    .profile-upper-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 24px !important; }
    .profile-avatar-block-vertical { width: 100%; height: auto; }
    .contestant-large-avatar-vertical { aspect-ratio: 4 / 5; height: auto !important; }
    .contestant-meta-table td { white-space: normal !important; }
    .vote-action-row { flex-direction: column; align-items: stretch; }
    .btn-vote-submit, .vote-counter-display { text-align: center; width: 100%; }
}
/* ==========================================================================
   ĐÓNG KHỐI (BOX) CHO CÂU CHUYỆN & ALBUM ẢNH THÍ SINH
   ========================================================================== */

/* 1. KHỐI CÂU CHUYỆN TRUYỀN CẢM HỨNG */
.profile-story-content {
    background-color: #f8f7fc !important; /* Phủ màu nền xám ánh hồng nhạt cao cấp thống nhất */
    padding: 35px 40px !important; /* Tạo khoảng đệm rộng rãi thoáng đãng bên trong khối */
    border-radius: 12px; /* Bo tròn mượt mà các góc hộp */
    border: 1px solid #e6e4f0; /* Viền mờ định hình */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02); /* Đổ bóng nhẹ tạo độ nổi khối */
    
    /* Đồng bộ khoảng cách lề giữa các khối (24px) */
    border-top: none !important; /* Khử đường gạch ngang mảnh cũ */
    margin-top: 0 !important;
    margin-bottom: 24px !important; 
}

/* Tinh chỉnh phần văn bản chữ bên trong khối câu chuyện */
.profile-story-content .entry-content {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #333d57; /* Màu chữ xanh đen nhẹ nhàng, dễ đọc */
}

/* 2. KHỐI ALBUM ẢNH + CÁC BÀI VIẾT VỀ THÍ SINH + LIÊN HỆ VỚI THÍ SINH */
.profile-album-gallery,
.profile-hanhtrinh-block,
.profile-contact-block {
    background-color: #f8f7fc !important; /* Đồng bộ màu nền xám ánh hồng nhạt */
    padding: 35px 40px !important;
    border-radius: 12px;
    border: 1px solid #e6e4f0;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);

    border-top: none !important; /* Khử đường gạch ngang mảnh cũ */
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}
.profile-hanhtrinh-block .editorial-related-grid { margin-top: 4px; }

/* Nút liên hệ mạng xã hội của thí sinh */
.profile-contact-links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
}
.profile-contact-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 0.9rem;
    color: #fff !important;
    text-decoration: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.profile-contact-btn:hover { opacity: 0.9; transform: translateY(-1px); }
.profile-contact-btn.is-fb     { background: #1877f2; }
.profile-contact-btn.is-tiktok { background: #010101; }
.profile-contact-btn.is-ig     { background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888); }
.profile-contact-btn.is-yt     { background: #ff0000; }
@media (max-width: 768px) {
    .profile-contact-btn { flex: 1 1 calc(50% - 6px); justify-content: center; }
}

/* Tiêu đề của từng khối chữ */
.content-block-title {
    font-size: 1.3rem !important;
    color: #2c3893 !important; /* Màu xanh dương Hoàng gia trang trọng */
    font-weight: 700 !important;
    margin-top: 0 !important; /* Đẩy nội dung chữ lên sát mép trên theo hệ thống chung */
    margin-bottom: 20px !important;
    letter-spacing: 0.5px;
    position: relative;
    padding-bottom: 8px;
}

/* Đường gạch nhỏ tinh tế dưới tiêu đề khối */
.content-block-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 35px;
    height: 3px;
    background-color: var(--primary-color); /* Đường gạch màu hồng ruby tạo điểm nhấn */
    border-radius: 2px;
}

/* 3. TINH CHỈNH HỆ THỐNG LƯỚI ALBUM ẢNH BÊN TRONG KHỐI */
.contestant-photo-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* Chia đều 3 cột ảnh trên máy tính */
    gap: 16px !important; /* Khoảng cách giữa các bức ảnh */
    margin-top: 10px;
}

.gallery-photo-item {
    overflow: hidden;
    border-radius: 8px; /* Bo góc ảnh mượt mà */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
    background: #ffffff;
    padding: 6px; /* Tạo viền trắng bao quanh từng tấm ảnh như khung tranh */
    border: 1px solid #edeaf6;
}

.gallery-photo-item img {
    width: 100% !important;
    height: 240px !important; /* Chiều cao ảnh vuông vắn, đều nhau */
    object-fit: cover !important; /* Cắt ảnh thông minh chống méo hình */
    display: block;
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Hiệu ứng phóng to mượt nhẹ khi di chuột vào ảnh */
.gallery-photo-item:hover img {
    transform: scale(1.04);
}

/* ==========================================================================
   TỐI ƯU HIỂN THỊ TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 768px) {
    .profile-story-content,
    .profile-album-gallery {
        padding: 25px 20px !important; /* Thu nhỏ khoảng đệm trên màn hình hẹp */
        margin-bottom: 16px !important; /* Thu hẹp khoảng cách các khối còn 16px */
    }
    
    .contestant-photo-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* Co về 2 cột ảnh trên điện thoại */
        gap: 12px !important;
    }
    
    .gallery-photo-item img {
        height: 160px !important; /* Giảm chiều cao ảnh trên di động để vừa vặn tầm mắt */
    }
}
/* ==========================================================================
   KHỐI MỤC ĐÍCH CUỘC THI TRANG TRỌNG NỔI BẬT ĐÁY TRANG HỒ SƠ
   ========================================================================== */
.profile-contest-purpose-box {
    background: linear-gradient(135deg, #111538, #1a2056) !important; /* Phủ màu nền Xanh Navy Hoàng gia sâu thẳm */
    color: #ffffff !important;
    padding: 40px 45px !important; /* Khoảng đệm bên trong rộng rãi, thoáng đãng */
    border-radius: 12px; /* Bo góc mượt mà đồng bộ hệ thống hộp */
    box-shadow: 0 10px 30px rgba(17, 21, 56, 0.15) !important; /* Đổ bóng diện rộng tạo độ nổi khối mạnh mẽ */
    border-left: 5px solid #cca43b; /* Viền nhấn dọc bên trái màu Vàng Gold vương miện tôn vinh */
    
    /* Đồng bộ khoảng cách 24px với các khối phía trên */
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    box-sizing: border-box;
}

/* Tiêu đề của khối mục đích */
.purpose-block-title {
    font-size: 1.3rem !important;
    color: #ffffff !important; /* Chữ tiêu đề màu trắng tinh khôi rực sáng */
    font-weight: 800 !important;
    letter-spacing: 1px;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    text-transform: uppercase;
}

/* Đường gạch nhỏ trang trí màu Vàng Gold dưới tiêu đề */
.purpose-decorative-line {
    width: 45px;
    height: 3px;
    background-color: #cca43b; /* Vàng gold */
    margin-bottom: 25px;
    border-radius: 2px;
}

/* Danh sách nội dung */
.purpose-content-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.purpose-content-list li {
    display: flex !important;
    align-items: flex-start; /* Giữ icon và chữ luôn thẳng hàng ở đỉnh dòng */
    margin-bottom: 18px !important; /* Khoảng cách thoáng giữa các điều khoản mục đích */
    padding: 0 !important;
    background: transparent !important;
}
.purpose-content-list li:last-child {
    margin-bottom: 0 !important; /* Khử lề dòng cuối cùng */
}

/* Biểu tượng dấu ngôi sao lấp lánh đầu dòng thay cho dấu gạch ngang thô sơ */
.purpose-icon {
    color: #cca43b; /* Ngôi sao màu vàng gold quý phái */
    font-size: 1rem;
    margin-right: 15px;
    line-height: 1.6;
    flex-shrink: 0; /* Không cho icon bị bóp méo khi chữ dài */
}

/* Phần văn bản mục đích */
.purpose-content-list li p {
    color: #e2e5f8 !important; /* Chữ màu xám trắng ánh xanh dịu mắt, tương phản cao, cực kỳ dễ đọc */
    font-size: 1.05rem;
    line-height: 1.65;
    margin: 0 !important;
    font-weight: 500;
    text-align: justify; /* Căn đều hai bên phẳng phiu theo đúng thói quen văn bản trang trọng */
}

/* ==========================================================================
   TỐI ƯU ĐÁP ỨNG TRÊN DI ĐỘNG (MOBILE)
   ========================================================================== */
@media (max-width: 768px) {
    .profile-contest-purpose-box {
        padding: 30px 20px !important; /* Thu nhỏ khoảng đệm trên màn hình điện thoại dọc */
        margin-bottom: 16px !important;
        border-left-width: 4px; /* Thu nhỏ viền vàng */
    }
    .purpose-block-title {
        font-size: 1.15rem !important;
    }
    .purpose-content-list li p {
        font-size: 0.95rem; /* Hạ nhẹ size chữ trên mobile cho vừa mắt */
        line-height: 1.6;
    }
}
.contestants-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

@media (max-width: 768px) {
    .contestants-grid {
        grid-template-columns: 1fr;
    }
}

<!-- SECTION 3: ĐỂ LẠI LỜi YÊU THƯƠNG -->		
			.profile-love-messages-box {
    margin-top: 40px;
}
.love-messages-list {
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.love-message-item {
    background: #f9f9f9;
    border-radius: 10px;
    padding: 16px 20px;
}
.love-message-author {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.love-message-author img {
    border-radius: 50%;
}
.love-message-name {
    font-weight: 600;
}
.love-message-date {
    font-size: 0.85em;
    color: #888;
}
.love-message-textarea {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #ddd;
}
/* ============================================================
   TRANG HỒ SƠ THÍ SINH — BẢNG PHỐI MÀU & BỐ CỤC
   ============================================================ */
:root {
    --vtk-ink: #2c2560;
    --vtk-rose: #c2185b;
    --vtk-rose-soft: #f4d7e3;
    --vtk-gold: #d9a84e;
    --vtk-cream: #fbf7f2;
    --vtk-box-bg: linear-gradient(160deg, #fdf9f4 0%, #f6eef8 60%, #f3ecf9 100%);
}

/* ---------- TAB CHUYỂN MÙA GIẢI ---------- */
.year-tabs {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 30px auto 50px;
    padding: 18px 24px;
    max-width: 900px;
    background: var(--vtk-box-bg);
    border-radius: 60px;
    box-shadow: 0 8px 24px rgba(44, 37, 96, 0.08);
    border: 1px solid rgba(217, 168, 78, 0.25);
}
.year-tab-item {
    padding: 9px 20px;
    border-radius: 30px;
    background: #fff;
    text-decoration: none;
    color: var(--vtk-ink);
    font-weight: 600;
    font-size: 0.92em;
    transition: all 0.25s ease;
    border: 1px solid transparent;
}
.year-tab-item:hover {
    border-color: var(--vtk-rose);
    color: var(--vtk-rose);
}
.year-tab-item.active {
    background: linear-gradient(135deg, var(--vtk-rose) 0%, #8e2a68 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(194, 24, 91, 0.35);
}

/* ---------- KHUNG BOX CHO TỪNG KHỐI ---------- */
.archive-block {
    position: relative;
    max-width: 1200px;
    margin: 0 auto 50px;
    padding: 55px 40px 50px;
    background: var(--vtk-box-bg);
    border-radius: 28px;
    box-shadow: 0 10px 34px rgba(44, 37, 96, 0.07);
    overflow: hidden;
}

/* Ánh trăng mờ ở góc box — chi tiết nhận diện riêng của trang */
.archive-block::after {
    content: "";
    position: absolute;
    top: -60px;
    right: -60px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(217, 168, 78, 0.22) 0%, rgba(217, 168, 78, 0) 70%);
    pointer-events: none;
}

.archive-block-title {
    position: relative;
    text-align: center;
    font-size: 1.7em;
    color: var(--vtk-ink);
    letter-spacing: 0.5px;
    margin-bottom: 6px;
    z-index: 1;
    text-transform: uppercase; /* Thống nhất mọi tiêu đề vòng ở dạng chữ hoa */
}

/* Biểu tượng vầng trăng khuyết (chuyên mục Hành trình) lật quay sang phải */
.cat-icon-flip {
    display: inline-block;
    transform: scaleX(-1);
}
/* Icon trăng lưỡi liềm cạnh tiêu đề — gợi nhắc tên cuộc thi */
.archive-block-title::before {
    content: "☾";
    color: var(--vtk-gold);
    margin-right: 10px;
    font-size: 0.85em;
}

.archive-block-desc {
    text-align: center;
    color: #7a7590;
    font-size: 0.95em;
    margin-bottom: 10px;
}

.contestants-decorative-line {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--vtk-gold), var(--vtk-rose));
    margin: 0 auto 40px;
    border-radius: 3px;
}

/* ---------- KHỐI TOP 5 ---------- */
.top5-row-hero {
    display: flex;
    justify-content: center;
    margin-bottom: 34px;
    position: relative;
    z-index: 1;
}
.top5-row-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    position: relative;
    z-index: 1;
}

.title-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(44, 37, 96, 0.1);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.title-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(194, 24, 91, 0.16);
}
.title-card-hero {
    max-width: 320px;
    border: 2px solid var(--vtk-gold);
}
.title-card-thumb img { width: 100%; display: block; aspect-ratio: 3/4; object-fit: cover; }
.title-card-info { padding: 18px; text-align: center; }
.title-card-info h3 { margin: 4px 0; color: var(--vtk-ink); }
.title-card-sbd {
    display: inline-block;
    font-size: 0.8em;
    color: var(--vtk-rose);
    background: var(--vtk-rose-soft);
    padding: 2px 10px;
    border-radius: 12px;
}
.title-card-danhhieu { list-style: none; padding: 0; margin: 12px 0; }
.title-card-danhhieu li {
    font-size: 0.88em;
    color: #8e2a68;
    font-weight: 600;
    padding: 3px 0;
}

/* ---------- GRID XẾP HẠNG (TOP 10 / 20 / SƠ KHẢO) ---------- */
.ranking-grid-5col {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 22px;
    position: relative;
    z-index: 1;
}
.ranking-card {
    position: relative;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 5px 16px rgba(44, 37, 96, 0.08);
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ranking-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(194, 24, 91, 0.14);
}
.ranking-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--vtk-ink);
    color: #fff;
    padding: 3px 11px;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 700;
    z-index: 2;
}
.ranking-thumb img { width: 100%; display: block; aspect-ratio: 3/4; object-fit: cover; }
.ranking-info { padding: 14px; }

/* ---------- CARD RÚT GỌN: chỉ ảnh + tag thứ tự (Vòng bán kết / Top 20) ---------- */
.ranking-grid-photo { gap: 14px; }
.ranking-card-photo {
    display: block;
    text-decoration: none;
    text-align: left;
}
.ranking-card-photo .ranking-thumb img { aspect-ratio: 3 / 4; }
.ranking-card-photo .ranking-badge {
    background: rgba(44, 37, 96, 0.92);
    font-size: 0.82em;
    padding: 4px 12px;
}
.ranking-card-photo:hover {
    box-shadow: 0 12px 26px rgba(194, 24, 91, 0.2);
}
@media (max-width: 600px) {
    .ranking-grid-photo { grid-template-columns: repeat(2, 1fr) !important; gap: 10px; }
}
.ranking-info h4 { margin: 2px 0; color: var(--vtk-ink); font-size: 1em; }
.ranking-sbd { font-size: 0.78em; color: var(--vtk-rose); }
.ranking-votes {
    display: block;
    font-size: 0.82em;
    color: var(--vtk-gold);
    font-weight: 600;
    margin: 6px 0;
}

.sokhao-grid { transition: opacity 0.25s ease; }
.sokhao-grid.is-loading { opacity: 0.3; pointer-events: none; }
.sokhao-grid.just-loaded { animation: vtk-sokhao-fade 0.5s ease; }
@keyframes vtk-sokhao-fade {
    from { opacity: 0.25; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .sokhao-grid, .sokhao-grid.just-loaded { transition: none; animation: none; }
}

.sokhao-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 36px;
    position: relative;
    z-index: 1;
}
.sokhao-pagination button {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(44, 37, 96, 0.15);
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
    font-weight: 600;
    color: var(--vtk-ink);
    transition: all 0.2s ease;
}
.sokhao-pagination button:hover { border-color: var(--vtk-rose); color: var(--vtk-rose); }
.sokhao-pagination button.active {
    background: linear-gradient(135deg, var(--vtk-rose) 0%, #8e2a68 100%);
    color: #fff;
    border-color: transparent;
}

/* ---------- BOX MỤC ĐÍCH CUỘC THI ---------- */
.profile-contest-purpose-box {
    max-width: 1200px;
    margin: 0 auto 60px;
    padding: 50px 40px;
    background: linear-gradient(160deg, #2c2560 0%, #4a2e6e 100%);
    border-radius: 28px;
    color: #fff;
}
.purpose-block-title { text-align: center; color: #fff; }
.purpose-decorative-line {
    width: 60px;
    height: 3px;
    background: var(--vtk-gold);
    margin: 10px auto 30px;
    border-radius: 3px;
}
.purpose-content-list { list-style: none; padding: 0; max-width: 800px; margin: 0 auto; }
.purpose-content-list li {
    display: flex;
    gap: 14px;
    margin-bottom: 20px;
    line-height: 1.6;
    color: #e8e2f4;
}
.purpose-icon { color: var(--vtk-gold); flex-shrink: 0; font-size: 1.1em; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 992px) {
    .top5-row-grid,
    .ranking-grid-5col { grid-template-columns: repeat(2, 1fr); }
    .archive-block { padding: 40px 24px; }
}
@media (max-width: 600px) {
    .top5-row-grid,
    .ranking-grid-5col { grid-template-columns: 1fr; }
    .year-tabs { border-radius: 20px; }
    .archive-block { border-radius: 20px; padding: 32px 18px; }
    .profile-contest-purpose-box { padding: 34px 22px; border-radius: 20px; }
}

/* ==========================================================================
   TRANG BÀI VIẾT BIÊN TẬP (Tin tức • Hành trình • Cộng đồng • Cơ hội hợp tác)
   File: single-bai-viet.php — màu nhấn --accent đặt inline theo chuyên mục
   ========================================================================== */
.editorial-single {
    --accent: var(--primary-color);
}
.editorial-article {
    background: #ffffff;
    padding: 44px 48px !important;
    border-radius: 14px;
    border: 1px solid #e9e6f1;
    box-shadow: 0 6px 22px rgba(44, 37, 96, 0.06);
    box-sizing: border-box;
    max-width: 100%;
    overflow: hidden;
}

/* ---------- ĐẦU BÀI ---------- */
.editorial-header { margin-bottom: 26px; }
.editorial-cat-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 15px;
    border-radius: 30px;
    background: color-mix(in srgb, var(--accent) 12%, #fff);
    color: var(--accent);
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    text-decoration: none;
    border: 1px solid color-mix(in srgb, var(--accent) 30%, #fff);
}
.editorial-cat-badge:hover { background: color-mix(in srgb, var(--accent) 20%, #fff); }
.editorial-cat-icon { font-size: 1em; }

.editorial-title {
    margin: 16px 0 14px;
    font-size: 2rem;
    line-height: 1.28;
    font-weight: 800;
    color: var(--vtk-ink, #2c2560);
}
.editorial-title::after {
    content: "";
    display: block;
    width: 60px;
    height: 4px;
    margin-top: 16px;
    border-radius: 3px;
    background: var(--accent);
}
.editorial-meta {
    margin-top: 14px;
    color: #7a768c;
    font-size: 0.92rem;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.editorial-meta .sep { color: #c9c5d6; }
.editorial-byline .editorial-author { white-space: nowrap; }
.vtk-verified-badge {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 3px;
    vertical-align: -0.18em;
    flex-shrink: 0;
    outline: none;
}
.vtk-verified-badge svg { display: block; width: 1.05em; height: 1.05em; }
.vtk-verified-badge .vtk-vb-seal  { fill: #1877f2; }          /* xanh Facebook */
.vtk-verified-badge .vtk-vb-check { fill: #fff; }
.vtk-verified-badge.is-member .vtk-vb-seal { fill: #9aa0a6; } /* xám cho tài khoản thường */

/* Chú thích hiện NGAY khi trỏ chuột / focus (không dùng title mặc định) */
.vtk-verified-badge::after {
    content: attr(data-tip);
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    transform: translateX(-42%);
    z-index: 60;
    width: max-content;
    max-width: min(300px, 78vw);
    white-space: normal;
    text-align: left;
    font-size: 0.8rem;
    line-height: 1.45;
    font-weight: 400;
    color: #fff;
    background: #1c2b46;
    padding: 8px 11px;
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .06s linear;
}
.vtk-verified-badge::before {
    content: "";
    position: absolute;
    top: calc(100% + 3px);
    left: 6px;
    z-index: 61;
    border: 6px solid transparent;
    border-bottom-color: #1c2b46;
    opacity: 0;
    visibility: hidden;
    transition: opacity .06s linear;
}
.vtk-verified-badge:hover::after,
.vtk-verified-badge:focus-visible::after,
.vtk-verified-badge:hover::before,
.vtk-verified-badge:focus-visible::before {
    opacity: 1;
    visibility: visible;
}
@media (max-width: 600px) {
    .vtk-verified-badge::after { transform: translateX(-50%); left: 50%; }
    .vtk-verified-badge::before { left: 50%; margin-left: -6px; }
}

/* ---------- THẺ SỰ KIỆN (Cộng đồng) ---------- */
.editorial-event-card {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 28px;
    margin: 0 0 26px;
    padding: 18px 22px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--accent) 8%, #fff);
    border-left: 4px solid var(--accent);
}
.editorial-event-item {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #3a3550;
    font-size: 0.98rem;
}
.editorial-event-ico { font-size: 1.1em; }

/* ---------- ẢNH BÌA (cưỡng bức khung 16:9 thống nhất) ---------- */
.editorial-featured {
    margin: 0 0 28px;
}
.editorial-featured-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    background-color: #f0eef7;
    background-size: cover;
    background-position: center;
}
/* Dự phòng cho trình duyệt cũ không hỗ trợ aspect-ratio */
@supports not (aspect-ratio: 16 / 9) {
    .editorial-featured-frame { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh bìa giữ trọn nội dung, không bị cắt */
.editorial-featured-frame.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(20px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.editorial-featured-frame img,
.editorial-featured-frame .wp-post-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    object-position: center;
    display: block;
    border-radius: 0;
    margin: 0;
    z-index: 1;
}
.editorial-featured figcaption {
    margin-top: 8px;
    font-size: 0.85rem;
    color: #8b8798;
    font-style: italic;
    text-align: center;
}

/* ---------- NỘI DUNG ---------- */
.editorial-content.entry-content {
    font-size: 1.06rem;
    line-height: 1.78;
    color: #333d57;
}
.editorial-content.entry-content > * { margin-bottom: 1.25em; }
.editorial-content.entry-content h2,
.editorial-content.entry-content h3 {
    color: var(--vtk-ink, #2c2560);
    line-height: 1.4;
    margin-top: 1.6em;
}
.editorial-content.entry-content h2 { font-size: 1.4rem; }
.editorial-content.entry-content h3 { font-size: 1.18rem; }
.editorial-content.entry-content img { border-radius: 10px; height: auto; }
.editorial-content.entry-content a { color: var(--accent); text-decoration: underline; }
.editorial-content.entry-content blockquote {
    margin: 1.5em 0;
    padding: 4px 22px;
    border-left: 4px solid var(--accent);
    background: #faf8fc;
    color: #4a4560;
    font-style: italic;
}
.editorial-content.entry-content ul,
.editorial-content.entry-content ol { padding-left: 1.4em; }
.editorial-content.entry-content li { margin-bottom: 0.5em; }
.editorial-page-links { margin-top: 1.5em; font-weight: 600; }

/* ---------- THẺ / TỪ KHOÁ ---------- */
.editorial-tags {
    margin: 24px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.editorial-tags a {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    background: #f1eff7;
    color: #5b5670;
    font-size: 0.82rem;
    text-decoration: none;
}
.editorial-tags a:hover { background: #e6e2f2; }

/* ---------- NHỊP DỌC ĐỒNG ĐỀU GIỮA CÁC KHỐI TRONG BÀI ---------- */
.editorial-article > .editorial-header { margin: 0 0 26px; }
.editorial-article > .editorial-event-card,
.editorial-article > .editorial-featured,
.editorial-article > .editorial-content,
.editorial-article > .editorial-tags,
.editorial-article > .editorial-share,
.editorial-article > .editorial-gallery,
.editorial-article > .editorial-related-contestant,
.editorial-article > .editorial-partner-cta,
.editorial-article > .editorial-contact-box,
.editorial-article > .editorial-related {
    margin-top: 0 !important;
    margin-bottom: 30px !important;
}
.editorial-article > .profile-contest-purpose-box,
.editorial-article > .contest-intro {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ---------- CHIA SẺ ---------- */
.editorial-share {
    padding-top: 22px;
    border-top: 1px solid #ece9f3;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.editorial-share-label { font-weight: 700; color: var(--vtk-ink, #2c2560); margin-right: 4px; }
.editorial-share-btn {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 24px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    transition: opacity 0.2s ease;
}
.editorial-share-btn:hover { opacity: 0.88; }
.editorial-share-btn.is-fb { background: #1877f2; }

/* ---------- THƯ VIỆN ẢNH (dùng lại .contestant-photo-grid, ép 16:9) ---------- */
.editorial-gallery .contestant-photo-grid { margin-top: 0; }
.editorial-gallery .gallery-photo-item img {
    height: auto !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
@supports not (aspect-ratio: 16 / 9) {
    .editorial-gallery .gallery-photo-item img { height: 200px !important; }
}

/* ---------- THÍ SINH TRONG BÀI (Hành trình) — thẻ nằm ngang, gọn ---------- */
.editorial-related-contestant .ranking-grid-5col {
    display: block;
}
.editorial-related-contestant .ranking-card {
    display: flex;
    align-items: stretch;
    width: 100%;
    text-align: left;
}
.editorial-related-contestant .ranking-thumb {
    position: relative;
    flex: 0 0 160px;
    min-height: 190px;
}
.editorial-related-contestant .ranking-thumb img {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    object-fit: cover;
}
.editorial-related-contestant .ranking-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 5px;
    padding: 16px 20px;
}
.editorial-related-contestant .ranking-badge { display: none; }
@media (max-width: 480px) {
    .editorial-related-contestant .ranking-thumb { flex-basis: 120px; min-height: 160px; }
    .editorial-related-contestant .ranking-info { padding: 14px 16px; }
}

/* ---------- CTA MỜI ĐỒNG HÀNH (Cơ hội hợp tác) ---------- */
.editorial-partner-cta {
    padding: 34px 38px;
    border-radius: 14px;
    background: linear-gradient(135deg, #111538, #23285f);
    color: #fff;
    text-align: center;
}
.editorial-partner-title {
    color: #fff !important;
    font-size: 1.35rem;
    font-weight: 800;
    margin: 0 0 12px;
}
.editorial-partner-cta p {
    color: #d9d5ec;
    max-width: 560px;
    margin: 0 auto 22px;
    line-height: 1.7;
}
.editorial-partner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}
.btn-partner-primary,
.btn-partner-ghost {
    display: inline-block;
    padding: 12px 26px;
    border-radius: 30px;
    font-weight: 700;
    text-decoration: none;
    font-size: 0.95rem;
}
.btn-partner-primary { background: var(--secondary-color, #cca43b); color: #1a1636; }
.btn-partner-primary:hover { background: #dbb659; }
.btn-partner-ghost { border: 2px solid rgba(255,255,255,0.5); color: #fff; }
.btn-partner-ghost:hover { border-color: #fff; background: rgba(255,255,255,0.08); }

/* ---------- BÀI VIẾT CÙNG CHUYÊN MỤC ---------- */
.editorial-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.editorial-related-card {
    background: #fff;
    border: 1px solid #e9e6f1;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(44, 37, 96, 0.05);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
    margin-bottom: 0 !important;
}
.editorial-related-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(44, 37, 96, 0.12);
}
.editorial-related-thumb {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: #f3f1f9;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
@supports not (aspect-ratio: 16 / 9) {
    .editorial-related-thumb { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh giữ trọn nội dung, không bị cắt */
.editorial-related-thumb.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(16px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.editorial-related-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 1;
}
.editorial-related-noimg {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2rem;
    opacity: 0.5;
    z-index: 1;
}
.editorial-related-body { padding: 14px 16px 18px; }
.editorial-related-date { font-size: 0.8rem; color: #9793a6; }
.editorial-related-body h3 {
    margin: 6px 0 0;
    font-size: 1rem;
    line-height: 1.45;
    /* Tiêu đề đúng 3 dòng cho đều các thẻ */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.45em * 3);
}
.editorial-related-body h3 a { color: var(--vtk-ink, #2c2560); text-decoration: none; }
.editorial-related-body h3 a:hover { color: var(--accent); }
.editorial-related-all {
    display: inline-block;
    margin-top: 18px;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--accent);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.editorial-related-all:hover { border-bottom-color: currentColor; }

/* ---------- KHUNG LIÊN HỆ / HỎI ĐÁP VỚI BAN TỔ CHỨC ---------- */
.editorial-contact-box {
    background: #f8f7fc;
    border: 1px solid #e6e4f0;
    border-radius: 14px;
    padding: 32px 34px;
}
.editorial-contact-intro {
    margin: -4px 0 22px;
    color: #5a5570;
    line-height: 1.7;
}
.editorial-contact-list {
    list-style: none;
    margin: 0 0 26px;
    padding: 0;
}
.editorial-contact-thread {
    padding: 0 0 18px;
    margin-bottom: 18px;
    border-bottom: 1px dashed #ded9ec;
}
.editorial-contact-thread:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.editorial-contact-msg {
    background: #fff;
    border: 1px solid #ece9f3;
    border-radius: 10px;
    padding: 14px 16px;
}
.editorial-contact-msg + .editorial-contact-msg { margin-top: 10px; }
.editorial-contact-msg.is-answer {
    margin-left: 28px;
    background: #fbfaff;
}
.editorial-contact-msg.is-org {
    border-color: var(--accent, #d11a5b);
    background: color-mix(in srgb, var(--accent, #d11a5b) 6%, #fff);
}
.editorial-contact-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 5px;
}
.editorial-contact-author {
    font-weight: 700;
    color: var(--vtk-ink, #2c2560);
    font-size: 0.95rem;
}
.editorial-contact-msg.is-org .editorial-contact-author { color: var(--accent, #d11a5b); }
.editorial-contact-date { font-size: 0.8rem; color: #9793a6; }
.editorial-contact-msg p { margin: 0; line-height: 1.65; color: #3a3550; }
.editorial-contact-empty { color: #8b8798; font-style: italic; margin: 0 0 22px; }

/* Form gửi tin nhắn */
.editorial-contact-box #respond { margin-top: 4px; }
.editorial-contact-box .comment-reply-title {
    font-size: 1.1rem;
    color: var(--vtk-ink, #2c2560);
    margin: 0 0 10px;
}
.editorial-contact-note {
    font-size: 0.85rem;
    color: #8b8798;
    font-style: italic;
    margin: 0 0 16px;
}
.editorial-contact-box .comment-form label {
    display: block;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 5px;
    color: #4a4560;
}
.editorial-contact-box .comment-form input[type="text"],
.editorial-contact-box .comment-form input[type="email"],
.editorial-contact-box .comment-form textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d9d4e6;
    border-radius: 8px;
    background: #fff;
    font: inherit;
}
.editorial-contact-box .comment-form-author,
.editorial-contact-box .comment-form-email {
    display: inline-block;
    width: calc(50% - 8px);
    vertical-align: top;
}
.editorial-contact-box .comment-form-author { margin-right: 14px; }
.editorial-contact-box .comment-form-comment { margin-top: 14px; }
.editorial-contact-box .form-submit { margin-top: 6px; }
.editorial-contact-box .required { color: #d11a5b; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 992px) {
    .editorial-related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .editorial-article { padding: 30px 22px !important; }
    .editorial-title { font-size: 1.55rem; }
    .editorial-partner-cta { padding: 28px 22px; }
    .editorial-related-grid { grid-template-columns: 1fr; }
    .editorial-contact-box { padding: 24px 20px; }
    .editorial-contact-msg.is-answer { margin-left: 14px; }
    .editorial-contact-box .comment-form-author,
    .editorial-contact-box .comment-form-email {
        display: block;
        width: 100%;
        margin-right: 0;
    }
    .editorial-contact-box .comment-form-email { margin-top: 14px; }
}

/* Dự phòng cho trình duyệt cũ không hỗ trợ color-mix() */
@supports not (background: color-mix(in srgb, red 10%, white)) {
    .editorial-cat-badge {
        background: #f4eef6;
        border-color: #e4d7ea;
    }
    .editorial-event-card { background: #f7f4fb; }
    .editorial-contact-msg.is-org { background: #fbf1f4; }
}


/* ==========================================================================
   TRANG LƯU TRỮ CHUYÊN MỤC BIÊN TẬP (category-editorial.php)
   ========================================================================== */
.editorial-archive {
    --accent: var(--primary-color);
    min-width: 0; /* cho phép co lại cạnh sidebar (GP dùng flex, không vỡ trang) */
}
.editorial-archive * { min-width: 0; }

/* Nhịp dọc giữa các khối lớn của trang */
.editorial-archive > .editorial-hero,
.editorial-archive > .editorial-archive-grid,
.editorial-archive > .editorial-archive-pagination,
.editorial-archive > .pagination,
.editorial-archive > .editorial-archive-subtitle,
.editorial-archive > .editorial-archive-empty,
.editorial-archive > .editorial-archive-notice {
    margin-bottom: 34px;
}
.editorial-archive > .profile-contest-purpose-box,
.editorial-archive > .contest-intro {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ---------- TIÊU ĐỀ CHUYÊN MỤC ---------- */
.editorial-archive-header {
    text-align: left;
    margin: 4px 0 30px;
}
.editorial-archive-title {
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    font-size: 1.9rem;
    font-weight: 800;
    color: var(--vtk-ink, #2c2560);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0;
    padding-bottom: 12px;
}
.editorial-archive-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 64px;
    height: 4px;
    background: var(--accent);
    border-radius: 3px;
}
.editorial-archive-icon {
    font-size: 1.55rem;
    line-height: 1;
    flex-shrink: 0;
}
.editorial-archive-season {
    margin: 12px 0 0;
    font-size: 0.92rem;
    color: #7a768c;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.editorial-archive-season .sep { color: #c9c5d6; }
.editorial-archive-season a { color: var(--accent); }

.editorial-archive-subtitle {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--vtk-ink, #2c2560);
    margin: 0 0 18px;
}

/* ---------- BÀI NỔI BẬT ---------- */
.editorial-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    align-items: stretch;
    background: #fff;
    border: 1px solid #e9e6f1;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 26px rgba(44, 37, 96, 0.08);
    text-decoration: none;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.editorial-hero:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(44, 37, 96, 0.14);
}
.editorial-hero-frame {
    position: relative;
    width: 100%;
    align-self: center;      /* không giãn theo cột chữ -> khung luôn đúng 16:9 */
    aspect-ratio: 16 / 9;
    background-color: #f0eef7;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
@supports not (aspect-ratio: 16 / 9) {
    .editorial-hero-frame { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh bài nổi bật giữ trọn nội dung, không bị cắt */
.editorial-hero-frame.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(20px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.editorial-hero-frame img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 1;
}
.editorial-hero-noimg {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3rem;
    opacity: 0.45;
    z-index: 1;
}
.editorial-hero-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 2;
    background: var(--accent);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    padding: 5px 12px;
    border-radius: 20px;
}
.editorial-hero-body {
    padding: 24px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.editorial-hero-date {
    font-size: 0.82rem;
    color: #9793a6;
    margin-bottom: 8px;
}
.editorial-hero-title {
    font-size: 1.5rem;
    line-height: 1.34;
    font-weight: 800;
    color: var(--vtk-ink, #2c2560);
    margin: 0 0 10px;
    /* Giới hạn 2 dòng -> cột chữ không kéo khung ảnh cao quá 16:9 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.editorial-hero:hover .editorial-hero-title { color: var(--accent); }
.editorial-hero-excerpt {
    color: #4a4560;
    line-height: 1.65;
    margin: 0 0 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.editorial-hero-more {
    font-weight: 700;
    color: var(--accent);
    font-size: 0.92rem;
}

/* ---------- LƯỚI BÀI VIẾT ---------- */
.editorial-archive-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.editorial-archive-grid .editorial-archive-card {
    margin: 0 !important;
    min-width: 0;
    background: #fff;
    border: 1px solid #e9e6f1;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 14px rgba(44, 37, 96, 0.05);
    display: flex;
    flex-direction: column;
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.editorial-archive-grid .editorial-archive-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(44, 37, 96, 0.13);
}
.editorial-archive-thumb {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: #f3f1f9;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
@supports not (aspect-ratio: 16 / 9) {
    .editorial-archive-thumb { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh giữ trọn nội dung (người / chữ không bị cắt) */
.editorial-archive-thumb.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(16px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.editorial-archive-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 1;
}
.editorial-archive-noimg {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2rem;
    opacity: 0.4;
    z-index: 1;
}
.editorial-archive-card-body {
    padding: 16px 18px 20px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.editorial-archive-date {
    font-size: 0.78rem;
    color: #9793a6;
    margin-bottom: 6px;
}
.editorial-archive-card-body h3 {
    font-size: 1.02rem;
    line-height: 1.45;
    margin: 0 0 8px;
    /* Tiêu đề đúng 3 dòng cho đều các thẻ */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.45em * 3);
}
.editorial-archive-card-body h3 a {
    color: var(--vtk-ink, #2c2560);
    text-decoration: none;
}
.editorial-archive-card-body h3 a:hover { color: var(--accent); }
.editorial-archive-card-body p {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #5a5570;
    margin: 0 0 12px;
    /* Mở đầu bài đúng 3 dòng cho đều các thẻ; dài quá cắt bằng "…" */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.6em * 3);
}
.editorial-archive-more {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--accent);
    margin-top: auto; /* ghim "Đọc tiếp" xuống đáy thẻ */
}

.editorial-archive-empty {
    text-align: center;
    color: #8b8798;
    font-style: italic;
    padding: 20px 0;
}

/* ---------- PHÂN TRANG ---------- */
.editorial-archive .nav-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
.editorial-archive .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border-radius: 10px;
    border: 1px solid #e2def0;
    background: #fff;
    color: var(--vtk-ink, #2c2560);
    font-weight: 600;
    text-decoration: none;
}
.editorial-archive .page-numbers:hover {
    border-color: var(--accent);
    color: var(--accent);
}
.editorial-archive .page-numbers.current {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.editorial-archive .page-numbers.dots {
    border-color: transparent;
    background: transparent;
}

/* ---------- KHỐI THÔNG BÁO CHUYÊN MỤC ---------- */
.editorial-archive-notice {
    background: var(--vtk-cream, #fbf7f2);
    border: 1px solid #ece4d8;
    border-left: 5px solid var(--accent);
    border-radius: 12px;
    padding: 28px 32px;
}
.editorial-archive-notice-body {
    color: #4a4560;
    line-height: 1.75;
}
.editorial-archive-notice-body p { margin: 0 0 12px; }
.editorial-archive-notice-body p:last-child { margin-bottom: 0; }
.editorial-archive-notice-body a {
    color: var(--accent);
    text-decoration: underline;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 992px) {
    .editorial-archive-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .editorial-hero { grid-template-columns: minmax(0, 1fr); }
    .editorial-hero-frame { min-height: 0; aspect-ratio: 16 / 9; }
}
@media (max-width: 768px) {
    .editorial-archive-title { font-size: 1.55rem; }
    .editorial-hero-body { padding: 22px 22px 26px; }
    .editorial-hero-title { font-size: 1.25rem; }
    .editorial-archive-notice { padding: 22px 20px; }
}
@media (max-width: 560px) {
    .editorial-archive-grid { grid-template-columns: minmax(0, 1fr); }
}


/* ==========================================================================
   VƯƠNG MIỆN QUÁN QUÂN TOP 5 (thí sinh có thi_sinh_xep_hang_top5 = 1)
   ========================================================================== */
.vtk-crown {
    font-style: normal;
    line-height: 1;
    white-space: nowrap;
}
.vtk-crown-inline {
    display: inline-block;
    margin-left: 0.3em;
    font-size: 0.7em;
    vertical-align: 0.12em;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.18));
}
/* Tên thí sinh trên trang hồ sơ chi tiết (h1 rất lớn) -> thu nhỏ vương miện lại */
.contestant-name .vtk-crown-inline { font-size: 0.5em; vertical-align: 0.18em; }
/* Thẻ Top 5 nổi bật */
.title-card-champion .title-card-info h3 { color: var(--vtk-rose, #c2185b); }


/* ==========================================================================
   KHỐI 4 BOX "NỘI DUNG MÙA GIẢI" (trang Hồ sơ thí sinh)
   ========================================================================== */
.season-sections {
    max-width: 1200px;
    margin: 0 auto 50px;
    padding: 46px 40px 44px;
    background: var(--vtk-box-bg);
    border-radius: 28px;
    box-shadow: 0 10px 34px rgba(44, 37, 96, 0.07);
}
.season-sections-title {
    text-align: center;
    font-size: 1.5em;
    color: var(--vtk-ink, #2c2560);
    letter-spacing: 0.4px;
    margin: 0 0 28px;
}
.season-sections-title::before {
    content: "☾";
    color: var(--vtk-gold, #d9a84e);
    margin-right: 10px;
    font-size: 0.85em;
}
.season-sections-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}
.season-box {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #eae7f2;
    border-top: 4px solid var(--box, #d11a5b);
    border-radius: 14px;
    padding: 20px 20px 18px;
    box-shadow: 0 5px 16px rgba(44, 37, 96, 0.05);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.season-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(44, 37, 96, 0.12);
}
.season-box-head {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 6px;
}
.season-box-icon { font-size: 1.15rem; line-height: 1; }
.season-box-title {
    margin: 0;
    font-size: 1.02rem;
    font-weight: 800;
    color: var(--box, #d11a5b);
    line-height: 1.3;
    /* Tối đa 2 dòng cho đều đầu các box */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.season-box-count {
    font-size: 0.8rem;
    color: #9793a6;
    margin-bottom: 12px;
}
.season-box-list {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    flex: 1;
}
.season-box-list li {
    padding: 7px 0;
    border-top: 1px dashed #ece9f3;
    font-size: 0.9rem;
    line-height: 1.5;
}
.season-box-list li:first-child { border-top: none; padding-top: 0; }
.season-box-list li a {
    color: #3a3550;
    text-decoration: none;
    /* Mỗi tiêu đề bài đúng 3 dòng cho đều các box; dài quá cắt bằng "…" */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.5em * 3);
}
.season-box-list li a:hover { color: var(--box, #d11a5b); }
.season-box-empty {
    flex: 1;
    font-size: 0.88rem;
    font-style: italic;
    color: #9793a6;
    margin: 0 0 14px;
}
.season-box-more {
    align-self: flex-start;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--box, #d11a5b);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.season-box-more:hover { border-bottom-color: currentColor; }

@media (max-width: 992px) {
    .season-sections-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .season-sections { padding: 34px 20px 30px; border-radius: 20px; }
    .season-sections-grid { grid-template-columns: minmax(0, 1fr); }
}


/* ==========================================================================
   BOX "GIỚI THIỆU CUỘC THI" (thay cho box Mục đích) + menu chuyên mục theo năm
   ========================================================================== */
.contest-intro {
    /* Màu mặc định (bị ghi đè bằng biến inline theo từng năm) */
    --ci-bg: #fdeef2;
    --ci-soft: #f8dbe4;
    --ci-accent: #e26a8d;

    max-width: 1200px;
    margin: 0 auto 24px;
    padding: 42px 44px 38px;
    background: var(--ci-bg);
    border: 1px solid var(--ci-soft);
    border-left: 5px solid var(--ci-accent);
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(44, 37, 96, 0.07);
    box-sizing: border-box;
}
.contest-intro-title {
    text-align: center;
    color: var(--vtk-ink, #2c2560) !important;
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0 0 12px !important;
}
.contest-intro-line {
    width: 60px;
    height: 3px;
    background: var(--ci-accent);
    border-radius: 3px;
    margin: 0 auto 26px;
}

/* Thẻ bài viết giới thiệu */
.contest-intro-card {
    display: grid;
    grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
    align-items: center;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(44, 37, 96, 0.1);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.contest-intro-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(44, 37, 96, 0.16);
}
/* Cột ảnh: khung 16:9 cố định, không giãn theo cột chữ */
.contest-intro-thumb {
    position: relative;
    align-self: center;
    aspect-ratio: 16 / 9;
    background-color: var(--ci-soft);
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
@supports not (aspect-ratio: 16 / 9) {
    .contest-intro-thumb { height: 0; padding-bottom: 56.25%; }
}
/* Nền mờ lấp đầy phần trống -> ảnh giữ trọn nội dung, không bị cắt */
.contest-intro-thumb.has-img::before {
    content: "";
    position: absolute;
    inset: -8%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(20px) brightness(0.9) saturate(1.08);
    transform: scale(1.1);
}
.contest-intro-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    z-index: 1;
}
.contest-intro-noimg {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.4rem;
    color: var(--ci-accent);
    opacity: 0.55;
    z-index: 1;
}
.contest-intro-body {
    padding: 24px 26px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.contest-intro-body h3 {
    margin: 0 0 10px;
    font-size: 1.22rem;
    line-height: 1.35;
    font-weight: 800;
    color: var(--vtk-ink, #2c2560);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.contest-intro-card:hover .contest-intro-body h3 { color: var(--ci-accent); }
.contest-intro-body p {
    margin: 0 0 14px;
    color: #4a4560;
    line-height: 1.65;
    font-size: 0.96rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.contest-intro-more {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--ci-accent);
}
.contest-intro-fallback {
    text-align: center;
    color: #6a6580;
    font-style: italic;
    margin: 0;
}

/* Menu chuyên mục theo năm */
.contest-intro-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 26px;
}
.contest-intro-menu a {
    --m: var(--ci-accent);
    display: inline-block;
    padding: 9px 18px;
    border-radius: 30px;
    background: #fff;
    border: 1px solid var(--ci-soft);
    color: var(--vtk-ink, #2c2560);
    font-weight: 600;
    font-size: 0.88rem;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.contest-intro-menu a:hover {
    background: var(--m);
    border-color: var(--m);
    color: #fff;
}

/* Nút bấm (dùng ở biến thể trang chủ) */
.contest-intro-btn {
    align-self: flex-start;
    display: inline-block;
    padding: 12px 28px;
    border-radius: 30px;
    background: var(--ci-accent);
    color: #fff !important;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none;
    transition: filter 0.2s ease, transform 0.2s ease;
}
.contest-intro-card:hover .contest-intro-btn,
.contest-intro-btn:hover { filter: brightness(1.08); }

/* ---------- BIẾN THỂ TRANG CHỦ: bố cục lớn, trang trọng hơn ---------- */
.contest-intro-home {
    margin: 22px auto 24px;
    padding: 50px 50px 44px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--ci-bg), var(--ci-soft));
    border-left-width: 6px;
}
.contest-intro-home .contest-intro-title { font-size: 1.55rem; }
.contest-intro-home .contest-intro-line { margin-bottom: 30px; }
.contest-intro-home .contest-intro-card {
    position: relative;
    grid-template-columns: minmax(0, 48%) minmax(0, 1fr);
    align-items: center;
    gap: 34px;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}
.contest-intro-home .contest-intro-card:hover {
    transform: none;
    box-shadow: none;
}

/* ---------- THUMBNAIL: KHUNG ẢNH TINH TẾ, TÔNG THEO MÀU MÙA GIẢI ---------- */
.contest-intro-home .contest-intro-thumb {
    align-self: center;
    aspect-ratio: 16 / 9;
    min-height: 0;
    padding: 12px;                    /* độ dày viền (passe-partout) */
    border-radius: 16px;
    background: var(--ci-bg);         /* mặt khung = tông nhạt nhất của mùa giải */
    overflow: hidden;
    box-shadow:
        inset 0 0 0 1px var(--ci-soft),
        0 20px 44px -18px rgba(44, 37, 96, 0.30);
}
/* Nền lấp phần trống = ảnh chính làm nền mờ, hoà tông mùa giải */
.contest-intro-home .contest-intro-thumb::before {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 6px;
    background-color: var(--ci-soft);
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(16px) brightness(1.04) saturate(1.05);
    transform: none;
    clip-path: inset(0 round 6px);
    z-index: 0;
}
/* Viền mảnh + bóng lõm nhẹ quanh ảnh -> tạo chiều sâu, không phải "màn hình" */
.contest-intro-home .contest-intro-thumb::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 6px;
    box-shadow:
        inset 0 0 0 1px rgba(20, 16, 45, 0.10),
        inset 0 2px 10px rgba(20, 16, 45, 0.10);
    pointer-events: none;
    z-index: 2;
}
.contest-intro-home .contest-intro-thumb img {
    position: absolute;
    inset: 12px;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 6px;
    z-index: 1;
}
.contest-intro-home .contest-intro-thumb .contest-intro-noimg {
    color: var(--ci-accent);
    opacity: 0.5;
    z-index: 2;
}
/* Quầng sáng rất nhẹ tông mùa giải phía sau khung */
.contest-intro-home .contest-intro-card::before {
    content: "";
    position: absolute;
    left: -4%;
    top: 50%;
    width: 56%;
    height: 86%;
    transform: translateY(-50%);
    background: radial-gradient(ellipse at center, var(--ci-accent), transparent 72%);
    opacity: 0.16;
    filter: blur(30px);
    z-index: 0;
    pointer-events: none;
}
.contest-intro-home .contest-intro-thumb,
.contest-intro-home .contest-intro-body { position: relative; z-index: 1; }

.contest-intro-home .contest-intro-body {
    padding: 6px 2px;
    gap: 4px;
}
.contest-intro-home .contest-intro-body h3 {
    font-size: 1.6rem;
    line-height: 1.3;
    margin-bottom: 14px;
}
.contest-intro-home .contest-intro-body p {
    font-size: 1.02rem;
    line-height: 1.72;
    margin-bottom: 20px;
    -webkit-line-clamp: 3;
}
.contest-intro-home .contest-intro-menu { margin-top: 30px; }
.contest-intro-fallback--home {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
}
.contest-intro-fallback--home p {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #3a3550;
    font-style: normal;
    margin: 0 0 22px;
}

@media (max-width: 768px) {
    .contest-intro { padding: 32px 22px 28px; border-radius: 14px; }
    .contest-intro-home { padding: 34px 22px 30px; }
    .contest-intro-card { grid-template-columns: minmax(0, 1fr); }
    .contest-intro-home .contest-intro-card { grid-template-columns: minmax(0, 1fr); }
    .contest-intro-thumb {
        height: auto;
        aspect-ratio: 16 / 9;
    }
    .contest-intro-home .contest-intro-thumb { min-height: 0; padding: 9px; }
    .contest-intro-home .contest-intro-thumb::before,
    .contest-intro-home .contest-intro-thumb::after,
    .contest-intro-home .contest-intro-thumb img { inset: 9px; }
    .contest-intro-home .contest-intro-card { gap: 22px; }
    .contest-intro-home .contest-intro-card::before { display: none; }
    .contest-intro-body { padding: 20px 20px 22px; }
    .contest-intro-home .contest-intro-body { padding: 22px 20px 24px; }
    .contest-intro-home .contest-intro-body h3 { font-size: 1.3rem; }
}
@supports not (aspect-ratio: 16 / 9) {
    @media (max-width: 768px) {
        .contest-intro-thumb { height: 0; padding-bottom: 56.25%; }
    }
}


/* ==========================================================================
   SLIDE ĐẦU TRANG CHỦ (bài viết ghim trang chủ)
   ========================================================================== */
.home-slider {
    position: relative;
    max-width: 1200px;
    margin: 22px auto 24px;
    border-radius: 20px;
    overflow: hidden;
    background: #17132f;
    box-shadow: 0 14px 38px rgba(44, 37, 96, 0.14);
}
/* 16:9 để ảnh bìa 1600x900 lấp đầy khung, không viền mờ trên máy tính */
.home-slider-viewport {
    overflow: hidden;
    aspect-ratio: 16 / 9;
    min-height: 340px;
    max-height: 700px;
}
@supports not (aspect-ratio: 16 / 9) {
    .home-slider-viewport { height: 520px; }
}
.home-slider-track {
    display: flex;
    height: 100%;
    transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: transform;
}
.home-slide {
    position: relative;
    flex: 0 0 100%;
    height: 100%;
    display: block;
    text-decoration: none;
    overflow: hidden;
    isolation: isolate;
}
.home-slide-media {
    position: absolute;
    inset: 0;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #17132f;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}
/* Nền mờ lấp đầy phần trống -> ảnh slide giữ trọn nội dung, không bị cắt */
/* Khối hero: ảnh slide lấp đầy khung (không còn viền mờ) */
.home-slide-media.has-img::before { display: none; }
.home-slide-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    z-index: 1;
}
.home-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 2;
    background: linear-gradient(180deg, rgba(12, 10, 30, 0) 34%, rgba(12, 10, 30, 0.18) 54%, rgba(12, 10, 30, 0.82) 100%);
}
.home-slide-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    max-width: 100%;
    padding: 26px 28px 40px;
    color: #fff;
}
.home-slide-title {
    color: #fff !important;
    font-size: 1.16rem;
    line-height: 1.32;
    font-weight: 700;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.home-slide-excerpt {
    color: #e7e3f3;
    line-height: 1.6;
    font-size: 0.98rem;
    margin: 0 0 20px;
}
.home-slide-btn {
    display: inline-block;
    padding: 11px 26px;
    border-radius: 30px;
    background: #fff;
    color: #17132f;
    font-weight: 700;
    font-size: 0.88rem;
    transition: background 0.2s ease, color 0.2s ease;
}
.home-slide:hover .home-slide-btn {
    background: var(--slide-accent, #d11a5b);
    color: #fff;
}

/* Mũi tên + chấm điều hướng */
.home-slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    color: #17132f;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.home-slider-arrow:hover { background: #fff; }
.home-slider-arrow.is-prev { left: 14px; }
.home-slider-arrow.is-next { right: 14px; }
.home-slider-dots {
    position: absolute;
    right: 24px;
    bottom: 22px;
    z-index: 3;
    display: flex;
    gap: 8px;
}
.home-slider-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    transition: background 0.2s ease, width 0.2s ease;
}
.home-slider-dot.is-active {
    background: #fff;
    width: 26px;
    border-radius: 5px;
}

@media (max-width: 768px) {
    .home-slider { border-radius: 14px; margin: 16px auto 20px; }
    .home-slider-viewport { aspect-ratio: 4 / 3; min-height: 0; max-height: none; }
    .home-slide::after {
        background: linear-gradient(0deg, rgba(12, 10, 30, 0.92) 12%, rgba(12, 10, 30, 0.35) 58%, rgba(12, 10, 30, 0.05) 100%);
    }
    .home-slide-caption { max-width: 100%; padding: 22px 20px 40px; }
    .home-slide-title { font-size: 1.12rem; }
    .home-slider-dots { right: 20px; left: auto; bottom: 14px; }
}
@supports not (aspect-ratio: 4 / 3) {
    @media (max-width: 768px) {
        .home-slider-viewport { height: 75vw; }
    }
}


/* ==========================================================================
   TRANG CHỦ — BỐ CỤC LIỀN LẠC, BỎ TIÊU ĐỀ CÁC KHỐI
   ========================================================================== */

/* Mọi khối cấp 1 cùng chiều rộng, cùng nhịp dọc */
.home-beauty-contest > .home-slider,
.home-beauty-contest > .home-section,
.home-beauty-contest > .contest-intro {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}
.home-beauty-contest > .home-slider {
    margin-top: 24px !important;
    margin-bottom: 46px !important;
}
.home-beauty-contest > .home-section {
    margin-top: 0 !important;
    margin-bottom: 46px !important;
}
.home-beauty-contest > .contest-intro {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}
/* Bảng vinh danh trên trang chủ — cùng chiều rộng & nhịp dọc với các khối cấp 1 */
.home-beauty-contest > .vtk-honor-roll {
    max-width: 1200px;
    margin: 0 auto 46px;
    box-sizing: border-box;
}

/* Bỏ nền hộp xám rời rạc — nội dung chảy liền trên nền trang */
.home-beauty-contest .home-news-grid-section,
.home-beauty-contest .home-contestants-section,
.home-beauty-contest .home-partners-section {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}
.home-beauty-contest .home-news-grid-section,
.home-beauty-contest .home-contestants-section {
    overflow: visible !important;
}

/* Link "Xem tất cả" — phần tử điều hướng duy nhất, đồng nhất mọi khối */
.home-sec-all {
    display: block;
    text-align: right;
    margin-top: 20px;
    padding-top: 14px;
    border-top: 1px solid #ece9f3;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--primary-color, #d11a5b);
    text-decoration: none;
}
.home-sec-all:hover { text-decoration: underline; }

/* Tiêu đề các khối trang chủ — đồng bộ với .widget-title ở sidebar
   (xanh #2c3893, đậm, gạch chân hồng 40×3, chữ thường, căn trái) */
.home-section-title {
    margin: 0 0 18px !important;
    padding-bottom: 10px;
    position: relative;
    color: #2c3893;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.2px;
    text-align: left;
    text-transform: none;
}
.home-section-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background: var(--primary-color, #d11a5b);
}

/* ==========================================================================
   KHỐI "ĐƠN VỊ ĐỒNG HÀNH" — BẢNG VINH DANH TRANG TRỌNG (tôn vinh đối tác)
   Ghi đè quy tắc "bỏ nền hộp" ở trên -> chỉ khối này được làm nổi.
   ========================================================================== */
.home-beauty-contest .home-partners-section.is-honor {
    background: linear-gradient(180deg, #fffdf6 0%, #fbf5e7 100%) !important;
    background-color: #fffdf6 !important;
    border: 1px solid #ecdcae !important;
    border-radius: 20px !important;
    padding: 34px 42px 40px !important;
    box-shadow:
        0 20px 46px -22px rgba(120, 92, 20, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
    position: relative;
    overflow: hidden !important;
}
/* Vạch vàng mảnh chạy dọc đỉnh khối */
.home-partners-section.is-honor::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: linear-gradient(90deg, rgba(204,164,59,0) 0%, #cca43b 22%, #e7c96f 50%, #cca43b 78%, rgba(204,164,59,0) 100%);
}
/* Ngôi sao mờ trang trí ở góc */
.home-partners-section.is-honor::after {
    content: "✦";
    position: absolute;
    right: 26px;
    top: 18px;
    font-size: 2.4rem;
    line-height: 1;
    color: #cca43b;
    opacity: 0.14;
    pointer-events: none;
}
/* Tiêu đề khối này: căn giữa, tông vàng gold, gạch chân vàng */
.home-partners-section.is-honor .home-section-title {
    text-align: center;
    color: #8a6c1e;
    margin-bottom: 12px !important;
}
.home-partners-section.is-honor .home-section-title::after {
    left: 50%;
    transform: translateX(-50%);
    width: 56px;
    background: #cca43b;
}
.home-partners-note {
    max-width: 640px;
    margin: 0 auto 28px;
    text-align: center;
    color: #6d5c31;
    font-size: 0.92rem;
    line-height: 1.65;
    font-style: italic;
}
/* Mỗi logo = một tấm bảng trắng bo góc, như bảng vinh danh */
/* Ít logo -> gom vào giữa cho gọn gàng; nhiều logo (>4) vẫn giữ marquee chạy ngang */
.home-partners-section.is-honor .partners-slider-track:not(:has(.duplicate)) {
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
}
.home-partners-section.is-honor .partner-logo-item {
    background: #fff;
    border: 1px solid #efe4c6;
    border-radius: 14px;
    box-shadow: 0 8px 20px -12px rgba(120, 92, 20, 0.28);
    padding: 14px 20px;
    height: 106px;
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease;
}
.home-partners-section.is-honor .partner-logo-item:hover {
    border-color: #cca43b;
    box-shadow: 0 16px 32px -14px rgba(120, 92, 20, 0.42);
    transform: translateY(-3px);
}
.home-partners-section.is-honor .partner-logo-item img {
    filter: grayscale(100%);
    opacity: 0.7;
}
.home-partners-section.is-honor .partner-logo-item:hover img {
    filter: none;
    opacity: 1;
    transform: none;
}
@media (max-width: 768px) {
    .home-beauty-contest .home-partners-section.is-honor {
        padding: 24px 18px 28px !important;
        border-radius: 16px !important;
    }
    .home-partners-section.is-honor::after { font-size: 1.8rem; right: 16px; top: 14px; }
    .home-partners-note { font-size: 0.86rem; margin-bottom: 20px; }
}

/* Bỏ tiêu đề "GIỚI THIỆU CUỘC THI" ở box trang chủ (giữ trên các trang khác) */
.contest-intro-home .contest-intro-title,
.contest-intro-home .contest-intro-line {
    display: none;
}
.contest-intro-home { padding-top: 40px; }

@media (max-width: 768px) {
    .home-beauty-contest > .home-slider { margin-bottom: 30px !important; }
    .home-beauty-contest > .home-section { margin-bottom: 30px !important; }
}

/* ==========================================================================
   LIGHTBOX ALBUM ẢNH (js/photo-lightbox.js) — dùng chung mọi bài viết
   ========================================================================== */
.gallery-photo-item a.vtk-lightbox-link {
    display: block;
    cursor: zoom-in;
    position: relative;
}
.gallery-photo-item a.vtk-lightbox-link::after {
    content: "\2922";
    position: absolute;
    right: 8px;
    bottom: 8px;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    font-size: 15px;
    color: #fff;
    background: rgba(20, 16, 45, 0.55);
    border-radius: 6px;
    opacity: 0;
    transition: opacity 0.25s ease;
    pointer-events: none;
}
.gallery-photo-item:hover a.vtk-lightbox-link::after { opacity: 1; }

.vtk-lightbox-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 4vh 4vw;
    background: rgba(15, 12, 30, 0.92);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.vtk-lightbox-overlay.is-open { display: flex; }

.vtk-lb-figure {
    margin: 0;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.vtk-lb-stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 60px;
    min-height: 60px;
}
.vtk-lb-img {
    display: block;
    max-width: 88vw;
    max-height: 78vh;
    width: auto;
    height: auto;
    border-radius: 6px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    background: #1c1830;
    animation: vtkLbIn 0.28s ease;
}
.vtk-lightbox-overlay.no-anim .vtk-lb-img { animation: none; }
@keyframes vtkLbIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.vtk-lb-stage.is-loading .vtk-lb-img { opacity: 0.25; }

/* Bọc sát ảnh để neo dấu chìm đúng vào góc ảnh (không lệ thuộc letterbox của stage) */
.vtk-lb-imgbox {
    position: relative;
    display: inline-flex;
    line-height: 0;
}

/* Dấu chìm tên miền — nhãn nhỏ ở góc phải-dưới của ảnh xem chi tiết */
.vtk-lb-watermark {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 4;
    pointer-events: none;
    padding: 3px 10px;
    border-radius: 6px;
    background: rgba(14, 11, 28, 0.4);
    color: rgba(255, 255, 255, 0.9);
    font-family: Helvetica, Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    line-height: 1.5;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    transition: opacity 0.2s ease;
}
.vtk-lb-stage.is-loading .vtk-lb-watermark { opacity: 0; }
@media (max-width: 600px) {
    .vtk-lb-watermark { right: 8px; bottom: 8px; font-size: 0.66rem; padding: 2px 8px; }
}

.vtk-lb-spinner {
    position: absolute;
    width: 34px;
    height: 34px;
    border: 3px solid rgba(255, 255, 255, 0.25);
    border-top-color: #fff;
    border-radius: 50%;
    opacity: 0;
    animation: vtkLbSpin 0.8s linear infinite;
}
.vtk-lb-stage.is-loading .vtk-lb-spinner { opacity: 1; }
@keyframes vtkLbSpin { to { transform: rotate(360deg); } }

.vtk-lb-caption {
    color: #f3f0ff;
    font-size: 0.95rem;
    line-height: 1.5;
    text-align: center;
    max-width: 760px;
    padding: 0 10px;
}
.vtk-lb-count {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.82rem;
    letter-spacing: 0.03em;
}

.vtk-lb-close,
.vtk-lb-nav {
    position: absolute;
    border: 0;
    cursor: pointer;
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}
.vtk-lb-close:hover,
.vtk-lb-nav:hover { background: rgba(255, 255, 255, 0.28); }
.vtk-lb-close:focus-visible,
.vtk-lb-nav:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.vtk-lb-close {
    top: 18px;
    right: 20px;
    width: 44px;
    height: 44px;
    font-size: 28px;
}
.vtk-lb-nav {
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    font-size: 30px;
}
.vtk-lb-prev { left: 16px; }
.vtk-lb-next { right: 16px; }

@media (max-width: 600px) {
    .vtk-lb-img { max-width: 94vw; max-height: 70vh; }
    .vtk-lb-nav { width: 40px; height: 40px; font-size: 24px; }
    .vtk-lb-prev { left: 6px; }
    .vtk-lb-next { right: 6px; }
    .vtk-lb-close { top: 10px; right: 10px; }
}

/* ==========================================================================
   TỶ LỆ 2 CỘT THỐNG NHẤT TOÀN WEBSITE  (nội dung + sidebar)
   Các template tuỳ biến render <main id="primary" class="site-main"> KHÔNG bọc
   trong .content-area nên quy tắc chiều rộng của GeneratePress không áp -> mỗi
   trang cột rộng một kiểu. Ép flex cố định: sidebar 300px, nội dung phần còn lại.
   ========================================================================== */
@media (min-width: 769px) {
    body.right-sidebar .site-content,
    body.left-sidebar  .site-content {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
        gap: 30px !important;
    }
    body.right-sidebar .site-content > .content-area,
    body.right-sidebar .site-content > #primary.site-main,
    body.left-sidebar  .site-content > .content-area,
    body.left-sidebar  .site-content > #primary.site-main {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    body.right-sidebar .site-content > .sidebar.is-right-sidebar,
    body.left-sidebar  .site-content > .sidebar.is-left-sidebar {
        flex: 0 0 300px !important;
        width: 300px !important;
        min-width: 300px !important;
        max-width: 300px !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    body.left-sidebar .site-content > .sidebar.is-left-sidebar { order: -1; }
}

/* Khoảng cách trên/dưới của cột nội dung ở các template tuỳ biến
   (trang chuyên mục, trang Hồ sơ thí sinh, bài viết chi tiết, hồ sơ thí sinh chi tiết)
   -> đồng bộ 24px trên & dưới như trang chủ. Trước đây khối bài viết bị sát mép trên
   vì CSS 2 cột đã xoá margin của #primary. */
#primary.editorial-archive > :first-child,
#primary.contestant-archive-page > :first-child,
#primary.editorial-single > :first-child,
#primary.contestant-profile-page > :first-child {
    margin-top: 24px !important;
}
#primary.editorial-archive > :last-child,
#primary.contestant-archive-page > :last-child,
#primary.editorial-single > :last-child,
#primary.contestant-profile-page > :last-child {
    margin-bottom: 24px !important;
}

/* ==========================================================================
   SIDEBAR: ĐỒNG BỘ THIẾT KẾ VỚI CỘT NỘI DUNG
   (thẻ trắng bo góc + viền mảnh + bóng nhẹ + tiêu đề như .content-block-title)
   ========================================================================== */
.sidebar .widget,
#right-sidebar .widget,
#left-sidebar .widget {
    background: #fff !important;
    border: 1px solid #ece9f3 !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 16px rgba(44, 37, 96, 0.05) !important;
    padding: 22px 22px 24px !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}
.sidebar .widget:last-child,
#right-sidebar .widget:last-child,
#left-sidebar .widget:last-child { margin-bottom: 0 !important; }

.sidebar .widget .widget-title,
.sidebar .widget .widgettitle,
#right-sidebar .widget .widget-title,
#left-sidebar .widget .widget-title {
    font-size: 1.12rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #2c3893 !important;
    text-transform: none !important;
    text-align: left !important;
    letter-spacing: 0.2px !important;
    margin: 0 0 16px !important;
    padding-bottom: 10px !important;
    position: relative;
}
.sidebar .widget .widget-title::after,
.sidebar .widget .widgettitle::after,
#right-sidebar .widget .widget-title::after,
#left-sidebar .widget .widget-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 3px;
    border-radius: 2px;
    background: var(--primary-color, #d11a5b);
}

/* Widget "bài viết mới" — gọn gàng trong cột hẹp */
.sidebar .recent-post-item,
#right-sidebar .recent-post-item { padding: 11px 0; }
.sidebar .post-info-right h4.post-title-link,
#right-sidebar .post-info-right h4.post-title-link {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Widget menu chuyên mục — danh sách sạch, đồng bộ tông màu */
.sidebar .widget_nav_menu ul,
#right-sidebar .widget_nav_menu ul { list-style: none; margin: 0; padding: 0; }
.sidebar .widget_nav_menu li,
#right-sidebar .widget_nav_menu li { margin: 2px 0; }
.sidebar .widget_nav_menu li a,
#right-sidebar .widget_nav_menu li a {
    display: block;
    padding: 9px 12px;
    border-radius: 9px;
    color: var(--vtk-ink, #2c2560);
    font-size: 0.92rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.18s ease, color 0.18s ease, padding-left 0.18s ease;
}
.sidebar .widget_nav_menu li a:hover,
#right-sidebar .widget_nav_menu li a:hover {
    background: #f5f2fb;
    color: var(--primary-color, #d11a5b);
    padding-left: 16px;
}
.sidebar .widget_nav_menu .sub-menu,
#right-sidebar .widget_nav_menu .sub-menu { margin-left: 12px; }
.sidebar .widget_nav_menu .current-menu-item > a,
#right-sidebar .widget_nav_menu .current-menu-item > a {
    background: var(--primary-color, #d11a5b);
    color: #fff;
}

/* Widget "danh mục" mặc định của WP (nếu dùng) — bỏ bóng thẻ lồng nhau */
.sidebar .widget_categories ul li a,
#right-sidebar .widget_categories ul li a {
    box-shadow: none;
    border-color: #eee7f2;
}

/* ==========================================================================
   FOOTER — đồng bộ tông màu & phong cách với 2 cột nội dung
   ========================================================================== */
.site-footer {
    position: relative;
    background: linear-gradient(180deg, #f7f5fc 0%, #f2ecf7 100%);
    border-top: 1px solid #e7e2f0;
}
/* Vạch nhấn 3 màu thương hiệu ở mép trên footer — rộng đúng bằng thân trang
   (1200px, căn giữa), khớp với vạch ở đáy header */
.site-footer::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1200px;
    height: 3px;
    background: linear-gradient(90deg,
        var(--primary-color, #d11a5b) 0%,
        var(--secondary-color, #cca43b) 52%,
        #2c3893 100%);
}
@media (max-width: 768px) {
    .site-footer::before { width: calc(100% - 32px); max-width: none; }
}
.site-footer .site-info {
    background: transparent;
    color: #514c66;
}
.site-footer .inside-site-info {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 30px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
}

/* Đã bỏ dòng bản quyền mặc định của GeneratePress */
.site-footer .copyright-bar { display: none !important; }

/* Vùng widget "Footer Bar" — chữ hoà tông, bỏ khung thẻ */
.site-footer .footer-bar {
    width: 100%;
    text-align: center;
}
.site-footer .footer-bar .widget {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.site-footer .footer-bar .widget + .widget { margin-top: 14px !important; }
.site-footer .footer-bar .widget-title {
    color: #2c3893 !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin: 0 0 8px !important;
    padding-bottom: 0 !important;
}
.site-footer .footer-bar .widget-title::after { display: none !important; }
.site-footer .footer-bar,
.site-footer .footer-bar p,
.site-footer .footer-bar li,
.site-footer .footer-bar span {
    color: #514c66;
    font-size: 0.92rem;
    line-height: 1.7;
}
.site-footer .footer-bar p { margin: 0 0 6px; }
.site-footer .footer-bar p:last-child { margin-bottom: 0; }
.site-footer .footer-bar a {
    color: var(--primary-color, #d11a5b);
    font-weight: 600;
    text-decoration: none;
}
.site-footer .footer-bar a:hover { text-decoration: underline; }
.site-footer .footer-bar ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 22px;
    justify-content: center;
}

@media (max-width: 768px) {
    .site-footer .inside-site-info { padding: 24px 20px !important; }
}

/* ==========================================================================
   NÚT "LÊN ĐẦU TRANG" (góc phải dưới)
   ========================================================================== */
.vtk-to-top {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 999;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, #d11a5b 0%, #b3164d 100%);
    color: #fff;
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(209, 26, 91, 0.35);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease, filter 0.2s ease;
}
.vtk-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.vtk-to-top:hover { filter: brightness(1.08); }
.vtk-to-top:focus-visible {
    outline: 3px solid rgba(44, 56, 147, 0.5);
    outline-offset: 2px;
}
@media (max-width: 768px) {
    .vtk-to-top { right: 14px; bottom: 14px; width: 42px; height: 42px; font-size: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
    .vtk-to-top { transition: opacity 0.2s ease, visibility 0.2s ease; transform: none; }
    .vtk-to-top.is-visible { transform: none; }
}

/* Hạn chế kéo ảnh ra khỏi trang (hỗ trợ cho chặn chuột phải trong functions.php) */
img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    user-drag: none;
}

/* ==========================================================================
   CĂN ĐỀU HAI BÊN — MẶC ĐỊNH CHO NỘI DUNG BÀI VIẾT
   Áp cho hồ sơ thí sinh + bài viết mọi chuyên mục, khỏi phải bấm nút Justify.
   (Vẫn tôn trọng nếu tự căn trái/giữa cho 1 đoạn cụ thể — inline style thắng.)
   ========================================================================== */
.editorial-content p,
.editorial-content li,
.profile-story-content .entry-content p,
.profile-story-content .entry-content li {
    text-align: justify;
    text-justify: inter-word;
}

/* ==========================================================================
   TRANG CHỦ — KHỐI HERO 3 CỘT (full-width, trên nội dung + sidebar)
   render qua hook generate_after_header -> nằm ngoài #page (container 1200)
   Cột 1: slide | Cột 2: 3 bài ghim | Cột 3: tab Xu hướng / Phổ biến
   ========================================================================== */
.home-hero-outer {
    background: transparent;
}
.home-hero {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px 0 0;
    box-sizing: border-box;
}
.home-hero-grid {
    display: grid;
    /* Căn theo lưới bên dưới: cột SLIDE = bề rộng 3 cột "tin mới"; cột GHIM = 1 cột
       "tin mới" (cột thứ 4); cột XẾP HẠNG = cột right-sidebar (300px).
       402px = 300 (sidebar) + 30 (gap nội dung↔sidebar) + 72 (3 gap 24px của lưới tin).
       Một cột "tin mới" = (100% - 402px) / 4. */
    grid-template-columns:
        calc((100% - 402px) / 4 * 3 + 48px)  /* slide  = 3 cột + 2 gap 24px */
        24px                                  /* gap như lưới tin */
        calc((100% - 402px) / 4)              /* ghim   = cột thứ 4 */
        30px                                  /* gap như nội dung↔sidebar */
        300px;                                /* xếp hạng = right sidebar */
    gap: 0;
    align-items: stretch;
}
.home-hero-slider { grid-column: 1; }
.home-hero-pins   { grid-column: 3; }
.home-hero-ranks  { grid-column: 5; }
@media (min-width: 993px) {
    .home-hero-grid { height: clamp(384px, 30vw, 444px); }
}
.home-hero-slider,
.home-hero-pins,
.home-hero-ranks { min-width: 0; min-height: 0; }

/* --- Cột 1: slide (ghi đè kích thước mặc định của .home-slider) --- */
.home-hero .home-slider {
    max-width: none !important;
    margin: 0 !important;
    height: 100%;
    border-radius: 16px;
}
.home-hero .home-slider-viewport {
    aspect-ratio: auto !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
}

/* --- Cột 2: 3 ảnh bìa bài ghim, thư mục góc trên-trái, tiêu đề căn phải --- */
.home-hero-pins {
    display: grid;
    grid-template-rows: repeat(3, 1fr);
    gap: 12px;
}
.home-pin {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 12px;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    background-color: #17132f;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 104px;
}
.home-pin::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 8, 25, 0.05) 0%, rgba(10, 8, 25, 0.12) 38%, rgba(10, 8, 25, 0.8) 100%);
    z-index: 1;
}
.home-pin > * { position: relative; z-index: 2; }
.home-pin-cat {
    align-self: flex-start;
    max-width: 100%;
    background: var(--pin-accent, #d11a5b);
    color: #fff;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.45;
    padding: 2px 7px;
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.home-pin-title {
    color: #fff;
    text-align: left;
    font-weight: 600;
    font-size: 0.8rem;
    line-height: 1.32;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.home-pin:hover .home-pin-title { text-decoration: underline; }

/* --- Cột 3: 2 tab Xu hướng / Phổ biến --- */
.home-hero-ranks { display: flex; }
.home-ranks {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #fff;
    border: 1px solid #ece9f3;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(44, 37, 96, 0.05);
    padding: 4px 16px 12px;
    box-sizing: border-box;
}
.home-ranks-tabs {
    display: flex;
    gap: 4px;
    margin: 0 -16px 8px;
    padding: 0 12px;
    border-bottom: 1px solid #ece9f3;
}
.home-rank-tab {
    flex: 1;
    background: transparent !important;
    border: 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    padding: 12px 4px 11px;
    font: inherit;
    font-weight: 700;
    font-size: 0.85rem;
    color: #8b86a5;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.home-rank-tab:hover { color: #2c3893; }
.home-rank-tab.is-active {
    color: #2c3893;
    border-bottom-color: var(--primary-color, #d11a5b);
}
.home-rank-tab:focus-visible { outline: 2px solid var(--primary-color, #d11a5b); outline-offset: -2px; }
.home-ranks-panels { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.home-rank-list { list-style: none; margin: 0; padding: 0; display: none; }
/* Danh sách active giãn đều 5 hàng cho hết chiều cao cột -> không còn khoảng trắng dưới chân */
.home-rank-list.is-active { display: flex; flex-direction: column; flex: 1; }
.home-rank-empty {
    color: #8b86a5;
    font-size: 0.84rem;
    line-height: 1.5;
    padding: 18px 4px;
    text-align: center;
}
.home-rank-item { flex: 1; display: flex; }
.home-rank-item a {
    flex: 1;
    display: grid;
    grid-template-columns: 15px 74px 1fr;
    gap: 11px;
    align-items: center;
    padding: 7px 0;
    text-decoration: none;
    border-top: 1px solid #ece9f3;
}
.home-rank-item:first-child a { border-top: 0; }
.home-rank-num {
    font-weight: 700;
    font-size: 0.74rem;
    color: #a49fbb;
    text-align: center;
}
.home-rank-thumb {
    width: 74px;
    height: 50px;
    border-radius: 8px;
    background: #eceaf3 center / cover no-repeat;
    flex-shrink: 0;
}
.home-rank-title {
    text-align: left;
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1.32;
    color: #2c2560;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.home-rank-item a:hover .home-rank-title { text-decoration: underline; }

/* --- Khoảng cách hero -> khối "tin mới" bên dưới --- */
.home-beauty-contest > .home-news-grid-section:first-child { margin-top: 44px !important; }

/* --- Tablet (769–992px): slide hết hàng trên; ghim (3 ô ngang) + xếp hạng hàng dưới,
       cột xếp hạng vẫn khớp sidebar 300px --- */
@media (max-width: 992px) and (min-width: 769px) {
    .home-hero-grid {
        grid-template-columns: minmax(0, 1fr) 300px;
        gap: 20px;
        height: auto;
    }
    .home-hero-grid { align-items: start; }
    .home-hero-slider { grid-column: 1 / -1; }
    .home-hero-pins   { grid-column: 1; grid-template-rows: none; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .home-hero-ranks  { grid-column: 2; }
    .home-pin { min-height: 148px; }
    .home-rank-item { flex: 0 0 auto; }
    .home-hero .home-slider-viewport { aspect-ratio: 16 / 9 !important; height: auto !important; }
}

/* --- Mobile: xếp dọc --- */
@media (max-width: 768px) {
    .home-hero { padding: 14px 0 0; }
    .home-hero-grid { grid-template-columns: 1fr; gap: 16px; height: auto; }
    .home-hero-slider,
    .home-hero-pins,
    .home-hero-ranks { grid-column: auto; }
    .home-hero .home-slider { border-radius: 0; }
    .home-hero .home-slider-viewport { aspect-ratio: 4 / 3 !important; height: auto !important; }
    .home-hero-pins { grid-template-rows: none; grid-auto-rows: 124px; }
    .home-rank-item { flex: 0 0 auto; }
    .home-beauty-contest > .home-news-grid-section:first-child { margin-top: 30px !important; }
}

/* ==========================================================================
   BẢNG VINH DANH — khối tri ân đơn vị đồng hành & nhà tài trợ
   Dùng chung: trang chủ, lưu trữ chuyên mục, chi tiết bài viết, chi tiết hồ sơ.
   Render bởi vtk_render_honor_roll() trong functions.php.
   ========================================================================== */
.vtk-honor-roll {
    margin: 40px 0 24px;
    background: linear-gradient(180deg, #fffdf6 0%, #fbf5e7 100%);
    background-color: #fffdf6;
    border: 1px solid #ecdcae;
    border-radius: 20px;
    padding: 36px 42px 42px;
    box-shadow:
        0 20px 46px -22px rgba(120, 92, 20, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
    position: relative;
    overflow: hidden;
}
/* Vạch vàng mảnh chạy dọc đỉnh khối */
.vtk-honor-roll::before {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 3px;
    background: linear-gradient(90deg, rgba(204,164,59,0) 0%, #cca43b 22%, #e7c96f 50%, #cca43b 78%, rgba(204,164,59,0) 100%);
}
.vtk-honor-inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}
/* Tiêu đề khối = "✦ TRÂN TRỌNG TRI ÂN ✦" (in hoa, giãn chữ, gạch chân vàng) */
.vtk-honor-title {
    margin: 0 0 16px;
    color: #8a6c1e;
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: 2.5px;
    line-height: 1.35;
    text-transform: uppercase;
    position: relative;
    padding-bottom: 14px;
}
.vtk-honor-title::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 56px;
    height: 3px;
    border-radius: 2px;
    background: #cca43b;
}
.vtk-honor-note {
    max-width: 620px;
    margin: 0 auto 24px;
    color: #6d5c31;
    font-size: 0.92rem;
    line-height: 1.65;
    font-style: italic;
}

/* Đường ray logo trong Bảng vinh danh */
.vtk-honor-wrapper { padding: 4px 0; }
.vtk-honor-roll .vtk-honor-track {
    justify-content: center;
    flex-wrap: wrap;
    gap: 22px;
    width: 100%;
}
/* Nhiều đơn vị (>4): chạy marquee — quy tắc animation dùng lại
   .partners-slider-track:has(.duplicate) đã khai báo ở phần trên */
.vtk-honor-roll.has-marquee .vtk-honor-track {
    flex-wrap: nowrap;
    justify-content: flex-start;
}

/* Mỗi logo = tấm bảng trắng bo góc, như bảng vinh danh */
.vtk-honor-roll .partner-logo-item {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    max-width: 220px;
    height: 108px;
    padding: 14px 22px;
    background: #fff;
    border: 1px solid #efe4c6;
    border-radius: 14px;
    box-shadow: 0 8px 20px -12px rgba(120, 92, 20, 0.28);
    box-sizing: border-box;
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.3s ease;
}
.vtk-honor-roll.has-marquee .partner-logo-item {
    width: 200px;
    margin-right: 22px;
}
.vtk-honor-roll .partner-logo-link {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.vtk-honor-roll .partner-logo-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}
.vtk-honor-roll .partner-logo-item:hover {
    border-color: #cca43b;
    box-shadow: 0 16px 32px -14px rgba(120, 92, 20, 0.42);
    transform: translateY(-3px);
}
.vtk-honor-roll .partner-logo-item:hover img {
    filter: none;
    opacity: 1;
    transform: none;
}

@media (max-width: 768px) {
    .vtk-honor-roll {
        margin: 28px 0 20px;
        padding: 26px 16px 30px;
        border-radius: 16px;
    }
    .vtk-honor-title { font-size: 1rem; letter-spacing: 2px; }
    .vtk-honor-note { font-size: 0.86rem; }
    .vtk-honor-roll .vtk-honor-track { gap: 14px; }
    .vtk-honor-roll .partner-logo-item {
        flex: 0 0 calc(50% - 7px);
        width: calc(50% - 7px);
        max-width: none;
        height: 86px;
        padding: 10px 14px;
    }
    /* Trên mobile: bỏ marquee, xếp lưới 2 cột cho dễ xem
       (ghi đè quy tắc .partners-slider-track:has(.duplicate) có !important) */
    .vtk-honor-roll.has-marquee .vtk-honor-track {
        flex-wrap: wrap !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: stretch;
        gap: 14px;
        animation: none !important;
        width: 100% !important;
        transform: none !important;
    }
    .vtk-honor-roll.has-marquee .partner-logo-item {
        flex: 0 0 calc(50% - 7px);
        width: calc(50% - 7px);
        margin-right: 0;
    }
    .vtk-honor-roll.has-marquee .partner-logo-item.duplicate { display: none !important; }
}

/* ==========================================================================
   HEADER 3 HÀNG — đồng bộ tông màu với thân trang / sidebar / footer
   Hàng 1: thanh thông tin (thấp nhất)
   Hàng 2: logo (trái) + khung quảng cáo 728×90 (phải)
   Hàng 3: menu chính (chữ HOA, ngăn bằng "|", CĂN PHẢI)
   Kỹ thuật: giữ nguyên vị trí menu "Float Right" của GP; cho .inside-header
   flex-wrap để #site-navigation rớt xuống thành hàng 3 (desktop). Mobile:
   logo + nút menu chung 1 hàng, khung quảng cáo rớt xuống hàng cuối.
   ========================================================================== */

/* ---------- HÀNG 1 — thanh thông tin ---------- */
.vtk-topbar {
    background: #f4f2fa;
    font-size: 0.8rem;
    line-height: 1.5;
    color: #6a6685;
}
.vtk-topbar-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 7px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px 20px;
    flex-wrap: wrap;
    box-sizing: border-box;
}
.vtk-topbar a { color: inherit; text-decoration: none; }
.vtk-topbar .vtk-ico { width: 15px; height: 15px; flex: 0 0 auto; }
.vtk-topbar-date {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 600;
    color: #2c3893;
}
.vtk-topbar-date.is-weekend { color: #d81f4a; }
.vtk-topbar-links { display: inline-flex; align-items: center; gap: 20px; }
.vtk-topbar-hotline,
.vtk-topbar-fb {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    transition: color 0.2s ease;
}
.vtk-topbar-hotline .vtk-ico { color: #d11a5b; }
.vtk-topbar-hotline strong { color: #2c3893; font-weight: 700; letter-spacing: 0.3px; }
.vtk-topbar-hotline:hover strong,
.vtk-topbar-hotline:hover { color: #d11a5b; }
.vtk-topbar-fb .vtk-ico { color: #2c6fd6; }
.vtk-topbar-fb:hover { color: #2c6fd6; }

/* ---------- HÀNG 2 + 3 — trong .inside-header (flex-wrap) ---------- */
#masthead.site-header { background: #ffffff; }
.site-header .inside-header {
    max-width: 1200px;
    padding: 14px 40px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 4px;
    column-gap: 30px;
    box-sizing: border-box;
    position: relative;
}
/* vạch nhấn 3 màu ở đáy header — rộng đúng bằng thân trang (1200px), căn giữa.
   Đặt trên .inside-header (::after) + z-index cao để KHÔNG bị nền trắng của
   #site-navigation (GP cho z-index:100) che mất khúc giữa. display:block để
   ghi đè clearfix display:table sẵn có của GP. */
.site-header .inside-header::after {
    content: "";
    display: block !important;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: 3px;
    z-index: 300;
    background: linear-gradient(90deg, #d11a5b 0%, #cca43b 50%, #2c3893 100%);
    pointer-events: none;
}
.site-header .site-logo {
    margin: 0;
    order: 1;
    flex: 0 0 auto;
    line-height: 0;
    align-self: center;
    /* giữ chiều cao hàng 2 ổn định kể cả khi tiện ích chặn quảng cáo ẩn .vtk-hslot */
    display: flex;
    align-items: center;
    min-height: 90px;
}
.site-header .site-logo img {
    height: 58px;
    width: auto;
    max-width: 100%;
    display: block;
}
/* GP header-widget mặc định — không dùng, thay bằng .vtk-hslot */
.site-header .header-widget { display: none !important; }

/* Khung quảng cáo 728×90 — LUÔN hiển thị; trống thì hiện khung mờ minh hoạ */
.site-header .inside-header .vtk-hslot {
    order: 2;
    margin-left: auto;               /* đẩy sát mép phải hàng 2 */
    flex: 0 1 728px;
    max-width: 728px;
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.vtk-hslot.is-empty {
    border: 1px dashed #d3cce6;
    border-radius: 8px;
    background:
        repeating-linear-gradient(-45deg, rgba(44,56,147,0.04) 0 10px, rgba(44,56,147,0) 10px 20px),
        #faf9fe;
}
.vtk-hslot-ghost {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #a79fc2;
}
.vtk-hslot .vtk-hslot-widget { width: 100%; display: flex; justify-content: center; }
.vtk-hslot ins,
.vtk-hslot iframe,
.vtk-hslot img { max-width: 100%; height: auto; display: block; }

/* ---------- HÀNG 3 — menu chính (rớt xuống nhờ flex-wrap) ---------- */
.site-header .inside-header #site-navigation,
.main-navigation#site-navigation {
    order: 4 !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    margin: 0 !important;
    background: transparent !important;   /* nền trắng lấy từ #masthead -> không che vạch gradient */
    z-index: 1;
}
.site-header #site-navigation .inside-navigation,
.site-header #site-navigation .main-nav { background: transparent; }
#site-navigation .inside-navigation {
    max-width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
#site-navigation .main-nav { width: 100%; }
#site-navigation .main-nav > ul > li { position: relative; }
#site-navigation .main-nav > ul > li > a {
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #2c3893;
    padding: 12px 16px;
}
/* Icon Home ở đầu menu */
#site-navigation .main-nav > ul > li.vtk-home-item > a { padding-left: 2px; padding-right: 16px; }
.vtk-home-ico { width: 17px; height: 17px; display: block; }
/* Bỏ icon Home trong menu bản mobile */
@media (max-width: 768px) {
    #site-navigation .main-nav > ul > li.vtk-home-item { display: none !important; }
}

/* Desktop: menu là dải 3 cao đúng 45px, CĂN TRÁI — mobile để GP tự đóng/mở */
@media (min-width: 769px) {
    .site-header .inside-header #site-navigation,
    .main-navigation#site-navigation {
        min-height: 45px;
        /* kéo menu ra sát mép trái của vạch gradient (bù 40px padding của .inside-header) */
        margin-left: -40px !important;
        margin-right: -40px !important;
    }
    #site-navigation .main-nav > ul {
        display: flex;
        justify-content: flex-start;     /* CĂN TRÁI */
        align-items: center;
        flex-wrap: wrap;
        width: 100%;
    }
    #site-navigation .main-nav > ul > li > a {
        min-height: 45px;
        line-height: 1;
        padding-top: 0;
        padding-bottom: 0;
    }
}
/* Ký tự "|" ngăn giữa các mục menu (không đặt trước icon Home) */
#site-navigation .main-nav > ul > li:not(:first-child)::before {
    content: "|";
    position: absolute;
    left: -2px;
    top: 50%;
    transform: translateY(-50%);
    color: #d7d2e6;
    font-weight: 400;
    pointer-events: none;
}
#site-navigation .main-nav > ul > li > a:hover,
#site-navigation .main-nav > ul > li.sfHover > a,
#site-navigation .main-nav > ul > li[class*="current-menu"] > a,
#site-navigation .main-nav > ul > li[class*="current_page"] > a {
    color: #d11a5b;
    background: transparent;
}
/* Dropdown giữ chữ thường */
#site-navigation .main-nav ul ul { border-top: 2px solid #d11a5b; }
#site-navigation .main-nav ul ul li a { text-transform: none; letter-spacing: 0; font-size: 0.85rem; }

/* ---------- HEADER trên mobile: logo + nút menu (hàng 2) · quảng cáo (hàng 3) ---------- */
@media (max-width: 768px) {
    .site-header .inside-header { padding: 10px 16px; column-gap: 12px; }
    .site-header .site-logo { min-height: 0; }
    .site-header .site-logo img { height: 42px; }

    /* nút menu (hamburger) của GP nằm cùng hàng với logo */
    .site-header .inside-header #mobile-menu-control-wrapper,
    .site-header .inside-header .menu-toggle { order: 2; margin-left: auto; }

    /* menu bung ra ngay dưới logo */
    .site-header .inside-header #site-navigation,
    .main-navigation#site-navigation { order: 3 !important; }
    #site-navigation .main-nav > ul { justify-content: flex-start; }
    #site-navigation .main-nav > ul > li:not(:first-child)::before { display: none; }
    #site-navigation .main-nav > ul > li > a { padding: 12px 16px; }

    /* khung quảng cáo xuống hàng cuối, full bề ngang, giữ khung mờ khi trống */
    .site-header .inside-header .vtk-hslot {
        order: 4;
        flex: 1 1 100%;
        max-width: 100%;
        min-height: 56px;
        margin: 10px 0 0;
    }
    .vtk-hslot-ghost { font-size: 0.72rem; letter-spacing: 0.5px; }

    /* vạch nhấn khớp mép nội dung 16px trên mobile */
    .site-header .inside-header::after { left: 16px; right: 16px; }
}
@media (max-width: 600px) {
    .vtk-topbar { font-size: 0.72rem; }
    .vtk-topbar-inner { padding: 6px 16px; gap: 6px 14px; justify-content: center; }
    .vtk-topbar-links { gap: 14px; }
    .vtk-topbar-fb span { display: none; }
}

/* ==========================================================================
   MOBILE — CHUẨN HOÁ KHUNG TOÀN WEBSITE (≤768px)
   Nguồn gốc lộn xộn: các template tuỳ biến render <main id="primary"> với
   margin mặc định của GeneratePress = 20px 20px 20px 0  -> nội dung lệch trái,
   chừa 20px bên phải, còn khối HERO (render ngoài #primary) lại full-width.
   Khối dưới đây ép MỌI trang: #primary full-width, lề 2 bên đều 16px, panel
   con không thụt lề nhiều tầng. Đặt CUỐI FILE để thắng mọi rule cũ.
   ========================================================================== */
@media (max-width: 768px) {

    /* --- 1. Khung chính + sidebar --- */
    body.right-sidebar #content.site-content,
    body.left-sidebar  #content.site-content { display: block !important; }

    #primary.site-main {
        margin: 0 !important;
        padding: 0 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        box-sizing: border-box !important;
    }
    #right-sidebar,
    #left-sidebar,
    .sidebar.is-right-sidebar,
    .sidebar.is-left-sidebar {
        margin: 0 !important;
        padding: 26px 16px 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        box-sizing: border-box !important;
    }
    .sidebar .widget,
    #right-sidebar .widget,
    #left-sidebar .widget { margin-bottom: 16px !important; }

    /* --- 2. Trang chủ --- */
    /* HERO (ngoài #primary) canh cùng mốc 16px như nội dung bên dưới */
    .home-hero { padding: 14px 16px 0 !important; }
    .home-hero .home-slider { border-radius: 14px !important; }
    .home-ranks {
        border-radius: 16px !important;
        border: 1px solid #ece9f3 !important;
    }
    /* #primary.site-main đã lo lề 16px -> khối con chạy full bề rộng trong đó */
    .home-beauty-contest > .home-section,
    .home-beauty-contest > .vtk-honor-roll,
    .home-beauty-contest > .contest-intro {
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
    }
    .home-beauty-contest > .vtk-honor-roll { margin-bottom: 30px !important; }
    .home-beauty-contest > .contest-intro-home { padding: 26px 16px 24px !important; }
    .contest-intro-home .contest-intro-body { padding: 20px 16px 22px !important; }

    /* --- 3. Trang chuyên mục (editorial-archive) --- */
    .editorial-archive-notice { padding: 20px 18px !important; }
    .editorial-archive-header { margin: 20px 0 26px !important; }

    /* --- 4. Trang Hồ sơ thí sinh --- */
    .year-tabs { padding: 16px 16px !important; margin: 20px 0 32px !important; }
    .season-box { padding: 20px 16px !important; }
    .archive-block { padding: 24px 16px !important; }

    /* --- 5. Chi tiết bài viết --- */
    .editorial-article { padding: 24px 16px !important; margin: 20px 0 !important; }

    /* --- 6. Chi tiết hồ sơ thí sinh --- */
    .contestant-profile-card { padding: 22px 14px !important; margin: 20px 0 !important; }
    .profile-story-content,
    .profile-album-gallery { padding: 20px 16px !important; }
    .profile-upper-grid { margin-bottom: 28px !important; }

    /* --- 7. Chống tràn ngang phát sinh --- */
    #primary img,
    #primary table,
    #primary iframe,
    #primary pre { max-width: 100% !important; }
    #primary table { display: block; overflow-x: auto; }
}

/* ==========================================================================
   KHUNG TRANG TRÍ ẢNH THÍ SINH  (.vtk-frame)  — xem inc/contestant-frame.php
   Bao ảnh bìa 9:16 trong khung 4:5, ảnh neo đỉnh nên không mất đầu; khung SVG
   che 4 cạnh: vương miện trên, rèm sân khấu hai bên, khán giả + "VTK <năm>".
   Màu đổi theo vòng thi hiện tại của mùa giải.
   ========================================================================== */
.vtk-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    container-type: inline-size;
    /* Bảng màu mặc định = Vòng Sơ khảo — hồng đào ấm, tươi */
    --vf-main: #ee9f9a;
    --vf-dark: #d2756f;
    --vf-light: #fbd8d3;
    --vf-accent: #f3b9b4;
    --vf-text: #6a2723;
}
.vtk-frame__window {
    position: absolute;
    top: 12%;
    left: 6%;
    right: 6%;
    bottom: 12%;
    border-radius: 10px;
    overflow: hidden;
    background: var(--vf-dark);
}
/* Chữ "VTK <năm>" căn chính giữa dải ruy băng (ruy băng vẽ trong SVG) */
.vtk-frame__sign {
    position: absolute;
    left: 50%;
    bottom: 6%;
    transform: translateX(-50%);
    z-index: 2;
    color: var(--vf-text);
    font-family: 'Be Vietnam Pro', 'Roboto', Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(5px, 3.4cqw, 14px);
    letter-spacing: 0.02em;
    line-height: 1;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), 0 1px 0 rgba(255, 255, 255, 0.35);
    pointer-events: none;
}
.vtk-frame__window img {
    width: 100% !important;
    height: 100% !important;
    display: block;
    object-fit: cover !important;
    object-position: top center !important; /* GIỮ ĐẦU THÍ SINH — không cắt phần trên */
    aspect-ratio: auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
}
.vtk-frame__noimg {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    background: linear-gradient(160deg, var(--vf-light), var(--vf-dark));
}
.vtk-frame__deco {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: visible;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.14));
}

/* ---------- Biến thể màu theo vòng thi ---------- */
/* Tông ấm nóng, tươi vui, sang trọng — không dùng màu xỉn/tối/lạnh */
.vtk-frame--ban-ket   { --vf-main: #f2925f; --vf-dark: #d2692f; --vf-light: #fbd7bf; --vf-accent: #f5ac83; --vf-text: #6a2f0f; } /* cam san hô */
.vtk-frame--chung-ket { --vf-main: #e86b9c; --vf-dark: #c4457a; --vf-light: #f9c9df; --vf-accent: #ee8db4; --vf-text: #5e1a40; } /* hồng magenta */
.vtk-frame--gala      { --vf-main: #e34d52; --vf-dark: #c03439; --vf-light: #f8c4c5; --vf-accent: #ef9ba0; --vf-text: #5a1418; } /* đỏ ruby tươi */
.vtk-frame--hoa-khoi  { --vf-main: #edb733; --vf-dark: #c8911c; --vf-light: #fff0bd; --vf-accent: #e8ad2e; --vf-text: #493305; } /* vàng kim rực rỡ */

/* ---------- Ngữ cảnh ---------- */
.vtk-frame--profile {
    max-width: 430px;
    margin-inline: auto;
}

/* Làm mờ khung trang trí đi 70% (KHÔNG làm mờ ảnh thí sinh — ảnh nằm trong
   .vtk-frame__window, tách riêng khỏi lớp SVG khung .vtk-frame__deco):
   áp dụng ở trang Hồ sơ thí sinh (theo vòng + theo năm), khối "Thí sinh tiêu biểu"
   trang chủ, và khối "Thí sinh liên quan" trong bài viết. */
.contestant-archive-page .vtk-frame__deco,
.contestant-archive-page .vtk-frame__sign,
.home-contestants-section .vtk-frame__deco,
.home-contestants-section .vtk-frame__sign,
.editorial-related-contestant .vtk-frame__deco,
.editorial-related-contestant .vtk-frame__sign {
    opacity: 0.3;
}

/* Trang hồ sơ: cột ảnh trái thôi kéo giãn bằng cột thông tin phải */
.contestant-profile-page .profile-upper-grid { align-items: start !important; }
.contestant-profile-page .profile-avatar-block-vertical { height: auto !important; }

@media (max-width: 768px) {
    .vtk-frame--profile { max-width: 340px; }
}