/* ===== template-parts/components/tag/assets/styles.css ===== */
/* Component: Tag / chip */
.tt-tag {
    display: inline-flex;
    align-items: center;
    font-family: var(--tt-font);
    font-weight: 400;
    font-size: 0.875rem;
    line-height: 1.05rem;
    letter-spacing: -0.0088rem;
    color: var(--Title-Orange, #FA6900);
    background: #FEEDE1;
    padding: 0.5rem 1rem;
    /* Figma Tag instance: radius 0.25rem (đo get_node_styles), không tự chế 0.375rem. */
    border-radius: 0.25rem;
    white-space: nowrap;
}

/* MOBILE (node I2348:27304;2348:26890, variant MB2):
   font 0.75rem/400/1.125rem/-0.0112rem, padding 0.375rem 0.75rem */
@media screen and (max-width: 639.98px) {
    .tt-tag {
        font-size: 0.75rem;
        line-height: 1.125rem;
        letter-spacing: -0.0112rem;
        padding: 0.375rem 0.75rem;
    }
}


/* ===== template-parts/components/button/assets/styles.css ===== */
/* Component: Button */
.tt-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--tt-font);
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.01rem;
    text-transform: uppercase;
    /* Figma node I2348:26861;2348:27241 (Size=L, Primary): KHÔNG bo góc (radius 0) — không tự chế 0.5rem. */
    border-radius: 0;
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.tt-btn__label {
    display: block;
}

.tt-btn__icon {
    display: block;
    width: 1rem;
    height: 1rem;
    margin-left: 0.5rem;
}

/* Icon đơn sắc: trên nút Primary (nền cam) phải đổi sang TRẮNG — icon gốc màu cam sẽ vô hình.
   filter brightness(0) invert(1) = trắng tinh bất kể màu nguồn. Outline giữ màu gốc (cam). */
.tt-btn--primary .tt-btn__icon {
    filter: brightness(0) invert(1);
}

.tt-btn--xl {
    padding: 1rem 4rem;
}

.tt-btn--l {
    padding: 0.75rem 1.5rem;
}

/* Figma Primary button fill = #fa6900 (orange-accent), không phải #f15a29. */
.tt-btn--primary {
    background: var(--tt-orange-accent);
    color: var(--tt-white);
}

.tt-btn--primary:hover {
    background: #FF7B1C;
}

.tt-btn--outline {
    background: transparent;
    color: var(--tt-orange-accent);
    border: 1px solid var(--tt-orange-accent);
}

.tt-btn--outline:hover {
    background: var(--tt-orange-accent);
    color: var(--tt-white);
}

@media (prefers-reduced-motion: reduce) {
    .tt-btn {
        transition: none;
    }
}

/* Mobile: button label font nhỏ hơn desktop (node I2348:27462;2348:36951 / I2348:27463;2348:36960: 14px/18.2px, ls -0.14px). */
/* Padding mobile = desktop (0.75rem 1.5rem) — không thay đổi. */
@media screen and (max-width: 639.98px) {
    .tt-btn {
        font-size: 0.875rem;
        line-height: 1.1375rem;
        letter-spacing: -0.0088rem;
        height: 2.63rem;
    }
}


/* ===== template-parts/components/card-tin-tuc/assets/styles.css ===== */
/* Component: Card tin tức (news list card) */
/* Figma node 2348:26822 "Card danh sách tin tức": fill #fff, KHÔNG bo góc (radius 0),
   shadow 0 0.25rem 1.125rem rgba(0,0,0,0.05) — đo từ get_node_styles, không tự chế. */
.tt-card {
  display: block;
  background: var(--tt-white);
  overflow: hidden;
  box-shadow: 0 0.25rem 1.125rem rgba(0, 0, 0, 0.05);
  height: 100%;
}

.tt-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.tt-card__media {
  position: relative;
  width: 100%;
  height: 13.8125rem;
  overflow: hidden;
}

.tt-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Prototype ON_HOVER → Variant2: SMART_ANIMATE 0.4s ease-out. */
  transition: transform 0.4s ease-out;
}

/* Polygon 6: tam giác cam góc trên-phải, hiện khi hover (Default: off-card → ẩn). */
.tt-card__corner {
  position: absolute;
  top: 0;
  right: 0;
  width: 3.025rem;
  height: 5.1875rem;
  background: var(--tt-orange-accent);
  clip-path: polygon(100% 0, 0 0, 100% 40%);
  opacity: 0;
  transform: translateX(0.75rem);
  transition:
    opacity 0.4s ease-out,
    transform 0.4s ease-out;
  pointer-events: none;
}

.tt-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 1rem 1rem;
}

/* Date row (node …26928): [📅 date] trái — [Xem chi tiết →] phải */
.tt-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1rem;
}

.tt-card__date {
  display: inline-flex;
  align-items: center;
  font-family: var(--tt-font);
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.05rem;
  letter-spacing: -0.0088rem;
  color: #131313;
}

.tt-card__cal {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  margin-right: 0.25rem;
}

.tt-card__more {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  color: var(--Title-Orange, #fa6900);
  font-family: "Lexend Deca", sans-serif;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.01313rem;
}

.tt-card__more-arrow {
  display: block;
  width: 1rem;
  height: 1rem;
  margin-left: 0.25rem;
  filter: brightness(0) saturate(100%) invert(41%) sepia(95%) saturate(1362%) hue-rotate(1deg) brightness(97%) contrast(104%);
}

.tt-card__title {
  margin-top: 0.5rem;
  font-family: var(--tt-font);
  font-weight: 600;
  font-size: 1.125rem;
  line-height: 1.6875rem;
  color: var(--tt-heading);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;

  color: var(--Body-Black-100, #131313);

  /* PC/16/16-SM-130 */
  font-family: "Lexend Deca";
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%; /* 1.3rem */
  letter-spacing: -0.01rem;
}

.tt-card__desc {
  margin-top: 0.38rem;
  font-family: var(--tt-font);
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.3125rem;
  letter-spacing: -0.0088rem;
  color: var(--tt-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--Body-Black-100, #131313);

  /* PC/Body/16/16-L-150 */
  font-family: "Lexend Deca";
  font-size: 1rem;
  font-style: normal;
  font-weight: 300;
  line-height: 150%; /* 1.5rem */
  letter-spacing: -0.02rem;
}

/* ── Variant ngang (featured) — node "Card to" 2348:31440 (993×266):
   ảnh trái 28.3125rem, body phải; thứ tự body = title → desc → "Xem chi tiết" (đáy).
   Card to: nền XÁM #f8f8f8, KHÔNG shadow (đo get_node_styles 2348:31440, chỉ fills).
   Type đo từ Figma: title 1.25rem/600 UPPERCASE; desc 1rem/300 justify; more 1rem/500;
   tất cả #131313. */
.tt-card--wide {
  background: var(--tt-section-gray, #f8f8f8);
  box-shadow: none;
}

.tt-card--wide .tt-card__link {
  flex-direction: row;
  align-items: stretch;
}

.tt-card--wide .tt-card__media {
  width: 28.3125rem;
  height: 16.625rem;
  flex-shrink: 0;
}

.tt-card--wide .tt-card__body {
  padding: 1.5rem 1.5rem 0;
  justify-content: flex-start;
}

.tt-card--wide .tt-card__meta {
  order: 3;
  margin-top: 2.5rem;
  justify-content: flex-start;
}

.tt-card--wide .tt-card__title {
  order: 1;
  margin-top: 0;
  font-size: 1.25rem;
  line-height: 1.625rem;
  letter-spacing: -0.0187rem;
  text-transform: uppercase;
}

.tt-card--wide .tt-card__desc {
  order: 2;
  margin-top: 0.75rem;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.5rem;
  letter-spacing: -0.02rem;
  color: var(--tt-heading);
  text-align: justify;
  -webkit-line-clamp: 3;
}

.tt-card--wide .tt-card__more {
  color: var(--tt-heading);
  font-size: 1rem;
  line-height: 1.3rem;
  letter-spacing: -0.02rem;
}

.tt-card--wide .tt-card__more-arrow {
  filter: brightness(0) saturate(100%);
}

/* ── Variant compact (Card nho 2 — node 2348:31442, 318×287): nền XÁM #f8f8f8, KHÔNG shadow.
   Body xếp DỌC: date (trên) → title → "Xem chi tiết" (đáy) — KHÁC card mặc định (date+more cùng hàng).
   Type đo từ Figma: date 0.875rem/300; title 1rem/600; more 1rem/500; tất cả #131313. */
.tt-card--compact {
  background: var(--tt-section-gray, #f8f8f8);
  box-shadow: none;
}

.tt-card--compact .tt-card__media {
  height: 9.5625rem;
}

.tt-card--compact .tt-card__body {
  padding: 0.75rem 0.75rem 0.875rem;
}

.tt-card--compact .tt-card__meta {
  margin-top: 0;
  justify-content: flex-start;
}

.tt-card--compact .tt-card__date {
  font-weight: 300;
  color: var(--tt-heading);
  letter-spacing: -0.0131rem;
}

.tt-card--compact .tt-card__title {
  margin-top: 0.5rem;
  font-size: 1rem;
  line-height: 1.3rem;
  letter-spacing: -0.01rem;
}

.tt-card--compact .tt-card__more {
  margin-top: 1rem;
  color: var(--tt-heading);
  font-size: 1rem;
  line-height: 1.3rem;
  letter-spacing: -0.02rem;
}

.tt-card--compact .tt-card__more-arrow {
  filter: brightness(0) saturate(100%);
}

/* Hover = prototype ON_HOVER → Variant2 (đọc get_node_reactions + diff 2 variant):
   - ảnh zoom 28.75→31.875rem = scale 1.1087 (KHÔNG nâng card, KHÔNG đổi shadow — đó là tự chế cũ)
   - tam giác cam góc trên-phải hiện ra
   SMART_ANIMATE 0.4s ease-out. */
.tt-card:hover .tt-card__img {
  transform: scale(1.1087);
}

@media (min-width: 640px) {
  .tt-card:hover .tt-card__corner {
  opacity: 1;
  transform: translateX(0);
}
}

@media (prefers-reduced-motion: reduce) {
  .tt-card__img,
  .tt-card__corner {
    transition: none;
  }
  .tt-card:hover .tt-card__img {
    transform: none;
  }
}

/* MOBILE (node 2348:27288): ảnh 11.5rem, body padding ngang 0.875rem.
   Spacing: meta 0.875rem từ top body, title 0.5rem sau meta, desc 0.375rem sau title.
   Typography: title 0.875rem (từ 1.125rem desktop); weight/lh/ls từng node theo Figma mobile. */
@media screen and (max-width: 639.98px) {
  .tt-card__media {
    height: 11.5rem;
  }
  .tt-card__body {
    padding: 0 0.875rem 0.875rem;
  }
  .tt-card__meta {
    margin-top: 0.875rem;
  }
  .tt-card__cal {
    width: 1rem;
    height: 1rem;
  }
  .tt-card__date {
    font-weight: 300;
    line-height: 1.3125rem;
    letter-spacing: -0.0175rem;
  }
  .tt-card__more {
    font-weight: 400;
    line-height: 1.3125rem;
    letter-spacing: -0.0131rem;
  }
  .tt-card__title {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    -webkit-line-clamp: 2;
    line-height: 1.1375rem;
    letter-spacing: -0.0088rem;
  }
  .tt-card__desc {
    /* MB/Body/14/14-L */
    font-family: "Lexend Deca";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 300;
    line-height: 150%; /* 1.3125rem */
    letter-spacing: -0.0175rem;
  }
  .tt-card--compact .tt-card__more {
    color: var(--Title-Orange, #fa6900);

    /* PC/Body/14/14-R-150 */
    font-family: "Lexend Deca";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 1.3125rem */
    letter-spacing: -0.01313rem;
  }
  .tt-card--compact .tt-card__more-arrow {
    filter: brightness(0) saturate(100%) invert(41%) sepia(95%) saturate(1362%) hue-rotate(1deg) brightness(97%) contrast(104%);
  }
  /* Featured ngang → xếp dọc trên mobile (ảnh trên, body dưới). */
  .tt-card--wide .tt-card__link {
    flex-direction: column;
  }
  .tt-card--wide .tt-card__media {
    width: 100%;
    height: 11.5rem;
  }
  .tt-card--wide .tt-card__body {
    padding: 0 0.875rem 0.875rem;
  }
  .tt-card--wide .tt-card__title {
    font-size: 0.875rem;
    line-height: 1.1375rem;
  }
}


/* ===== template-parts/components/filter-modal/assets/styles.css ===== */
/* Component: Filter modal (mobile-only) — node 2348:27609
   Bottom-sheet: ẩn hoàn toàn trên desktop, chỉ hoạt động ≤639.98px. */
.filter-modal {
    display: none;
}

@media screen and (max-width: 639.98px) {
    .filter-modal {
        position: fixed;
        inset: 0;
        z-index: 1000;
        display: block;
    }
    .filter-modal[hidden] {
        display: none;
    }

    .filter-modal__backdrop {
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        opacity: 0;
        transition: opacity 0.3s ease-out;
    }
    .filter-modal.is-open .filter-modal__backdrop {
        opacity: 1;
    }

    .filter-modal__sheet {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        max-height: 90vh;
        overflow-y: auto;
        /*background: var(--tt-white);*/
        font-family: var(--tt-font);
        transform: translateY(100%);
        transition: transform 0.3s ease-out;
    }
    .filter-modal.is-open .filter-modal__sheet {
        transform: translateY(0);
    }

    /* Header: "Bộ lọc" + close. (Figma để title trắng trên frame no-fill → hiển thị tối cho rõ.) */
    .filter-modal__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem;
    }
    .filter-modal__title {
        font-weight: 600;
        font-size: 1rem;
        line-height: 1.5rem;
        text-transform: uppercase;
        color: #FFF;
    }
    .filter-modal__close {
        display: flex;
        padding: 0;
        background: transparent;
        border: none;
        cursor: pointer;
    }
    .filter-modal__close img {
        display: block;
        width: 1.5rem;
        height: 1.5rem;
    }

    .filter-modal__form {
        padding-bottom: 1.25rem;
        background: #FFF;
        padding-top: 0.75rem;
    }

    .filter-modal__group {
        margin: 0;
        padding: 0.625rem 1rem;
        border: none;
        margin-top: 0.75rem;
    }
    .filter-modal__label {
        padding: 0;
        font-weight: 400;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0175rem;
        color: var(--tt-heading);
    }

    /* Mỗi option = 1 hàng radio, padding 0.75rem; hàng chọn có nền xám + radius 0.25rem */
    .filter-modal__opt {
        display: flex;
        align-items: center;
        margin-top: 0.375rem;
        padding: 0.75rem;
        border-radius: 0.25rem;
        cursor: pointer;
    }
    /* Node 2348:27617: fill rgba(174,174,174,0.2), radius 0.25rem (đo, không chế). */
    .filter-modal__opt:has(input:checked) {
        background: rgba(174, 174, 174, 0.2);
    }
    
    .filter-modal__opt input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    /* Radio: chưa chọn = viền xám #e3e3e3; chọn = viền + chấm cam #fa6900 (node 2348:27619). */
    .filter-modal__radio {
        position: relative;
        flex-shrink: 0;
        width: 1.125rem;
        height: 1.125rem;
        margin-right: 0.625rem;
        border: 1px solid #e3e3e3;
        border-radius: 50%;
    }
    .filter-modal__opt input:checked + .filter-modal__radio {
        border-color: var(--tt-orange-accent);
    }
    .filter-modal__opt input:checked + .filter-modal__radio::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 0.625rem;
        height: 0.625rem;
        transform: translate(-50%, -50%);
        border-radius: 50%;
        background: var(--tt-orange-accent);
    }

    /* Chủ đề = checkbox vuông cam (multi-select), to hơn radio; tick trắng */
    .filter-modal__opt:has(input[type="checkbox"]) .filter-modal__radio {
        width: 1.25rem;
        height: 1.25rem;
        border-radius: 0.25rem;
    }
    .filter-modal__opt input[type="checkbox"]:checked + .filter-modal__radio {
        border-color: var(--tt-orange-accent);
        background: var(--tt-orange-accent);
    }
    .filter-modal__opt input[type="checkbox"]:checked + .filter-modal__radio::after {
        width: 0.375rem;
        height: 0.6875rem;
        border: solid #fff;
        border-width: 0 0.125rem 0.125rem 0;
        border-radius: 0;
        background: none;
        transform: translate(-50%, -55%) rotate(45deg);
    }
    .filter-modal__opt-text {
        font-weight: 400;
        font-size: 0.75rem;
        line-height: 1.125rem;
        letter-spacing: -0.0112rem;
        color: var(--tt-heading);
    }

    .filter-modal__divider {
        height: 1px;
        margin: 0;
        border: none;
        background: #e3e3e3;
    }

    .filter-modal__apply {
        padding: 1.25rem 1rem 0;
    }
    .filter-modal__apply-btn {
        width: 100%;
        border: none;
        cursor: pointer;
    }
}

@media screen and (max-width: 639.98px) and (prefers-reduced-motion: reduce) {
    .filter-modal__backdrop,
    .filter-modal__sheet {
        transition: none;
    }
}


/* ===== template-parts/tin-tuc/section-banner/assets/styles.css ===== */
/* Section: Banner — Tin tức (node 2348:26797) */
.tt-banner {
  position: relative;
  width: 100%;
  height: auto; /* = chiều cao khối ảnh (đã khoá tỉ lệ ở __bg) */
  overflow: hidden;
  font-family: var(--tt-font);
}
@media (min-width: 1024px) {
  .tt-banner__content {
    padding-bottom: 5rem !important ;
  }
}

/* Ảnh nằm trong luồng thường (không absolute) → section cao đúng bằng ảnh */
.tt-banner__bg {
  position: relative;
  width: 100%;
  height: 42.25rem; /* ACF recommend 1600*676 → 676/16 */
  max-height: 100vh; /* banner không bao giờ cao quá 1 màn hình */
}

.tt-banner__overlay {
  position: absolute;
  inset: 0;
}

.tt-banner__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tt-banner__overlay {
  background: linear-gradient(
    180deg,
    rgba(19, 19, 19, 0) 30%,
    rgba(19, 19, 19, 0.85) 100%
  );
}

.tt-banner__content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 2.5rem 6.25rem;
}

.tt-banner__lead {
  display: flex;
  flex-direction: column;
}

.tt-banner__breadcrumb {
  display: flex;
  align-items: center;
}

.tt-banner__crumb {
  display: inline-block;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.5rem;
  color: rgba(255, 255, 255, 0.8);
}

.tt-banner__crumb + .tt-banner__crumb {
  margin-left: 0.625rem;
}

.tt-banner__crumb--current {
  color: var(--tt-white);
}

.tt-banner__title {
  margin-top: 1.5rem;
  font-weight: 600;
  font-size: 3.0625rem;
  line-height: 3.9812rem;
  letter-spacing: -0.0919rem;
  text-transform: uppercase;
  color: var(--tt-white);
}

.tt-banner__desc {
  width: 26.75rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
  letter-spacing: -0.02rem;
  color: rgba(255, 255, 255, 0.8);
}

/* MOBILE (node 2348:27264): KHÔNG overlay — ảnh 10rem trên, content trắng dưới, chữ tối. */
@media screen and (max-width: 639.98px) {
  .tt-banner {
    height: auto;
  }
  
  .tt-banner__img {
    object-position: center right;
  
  height: 100%;
  object-fit: cover;
}
  .tt-banner__bg {
    position: static;
    width: 100%;
    height: 10rem;
  }
  .tt-banner__overlay {
    display: none;
  }
  .tt-banner__content {
    position: static;
    flex-direction: column;
    align-items: flex-start;
    padding: 0.875rem 1rem 0;
  }
  .tt-banner__lead {
    width: 100%;
  }
  .tt-banner__crumb {
    font-size: 0.875rem;
    line-height: 1.3125rem;
    color: var(--tt-text-muted);
  }
  .tt-banner__crumb--current {
    color: var(--tt-heading);
  }
  .tt-banner__title {
    margin-top: 1.25rem;
    font-size: 1.5rem;
    line-height: 1.95rem;
    letter-spacing: -0.03rem;
    color: #131313;
  }
  .tt-banner__desc {
    width: 100%;
    margin-top: 0.625rem;
    font-weight: 300;
    font-size: 0.875rem;
    line-height: 1.3125rem;
    letter-spacing: -0.0175rem;
    color: #131313;
  }
}


/* ===== template-parts/tin-tuc/section-featured/assets/styles.css ===== */
/* Section: Khám phá hoạt động (featured) — node 2348:26805 */
.tt-featured {
    width: 100%;
    padding: 5rem 6.25rem;
    font-family: var(--tt-font);
}

.tt-featured__heading {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--tt-heading);
}

.tt-featured__row {
    display: flex;
    align-items: stretch;
    margin-top: 2.5rem;
}

/* ---- Thẻ lớn ---- */
/* Figma node 2348:26808: fill #f2f3f5, KHÔNG bo góc, KHÔNG shadow — không tự chế card style. */
.tt-featured__big {
    width: 52.1875rem;
    flex-shrink: 0;
    background: var(--tt-card-gray);
    overflow: hidden;
}

.tt-featured__big-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-bottom: 1rem;
}

.tt-featured__big-media {
    width: 100%;
    height: 24.875rem;
    overflow: hidden;
}

.tt-featured__big-body {
    margin-top: 1rem;
    padding: 0 1rem;
}

.tt-featured__big-title {
    font-weight: 600;
    font-size: 1.5625rem;
    line-height: 2.0312rem;
    text-transform: uppercase;
    color: #000;
}

.tt-featured__big-desc {
    margin-top: 0.5rem;
    font-weight: 300;
    font-size: 1rem;
    line-height: 150%;
    color: #131313;
    letter-spacing: -0.02rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.tt-featured__tags {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin-top: 1.25rem;
}

.tt-featured__tags > li {
    /*margin-top: 0.5rem;*/
}

.tt-featured .tt-tag {
    display: inline-flex;
    align-items: center;
    font-family: var(--tt-font);
    font-weight: 400;
    font-size: 0.875rem;
    line-height: 1.05rem;
    letter-spacing: -0.0088rem;
    color: #000;
    background: #FFF;
    padding: 0.5rem 1rem;
    border-radius: 0.25rem;
    white-space: nowrap;
}

.tt-featured__tags > li + li {
    margin-left: 0.5rem;
}

/* ---- Cột 3 thẻ nhỏ ---- */
.tt-featured__side {
    width: 34.0625rem;
    flex-shrink: 0;
    margin-left: 1.25rem;
    display: flex;
    flex-direction: column;
}

/* Figma node 2348:26810: fill #f2f3f5, KHÔNG bo góc, KHÔNG shadow. */
.tt-featured__small {
    background: var(--tt-card-gray);
    overflow: hidden;
}

.tt-featured__small + .tt-featured__small {
    margin-top: 1.25rem;
}

.tt-featured__small-link {
    display: flex;
    height: 10.5625rem;
}

.tt-featured__small-media {
    width: 15rem;
    height: 100%;
    flex-shrink: 0;
    overflow: hidden;
}

.tt-featured__small-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 1.125rem;
    padding-right: 1rem;
}

.tt-featured__small-date {
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    letter-spacing: -0.01313rem;
    color: #131313;
}

.tt-featured__small-date svg {
    margin-right: 0.25rem;
}

.tt-featured__small-title {
    margin-top: 0.5rem;
    font-weight: 600;
    font-size: 1.125rem;
    line-height: 1.6875rem;
    color: #000;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tt-featured__small-desc {
    margin-top: 0.625rem;
    font-weight: 300;
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.02rem;
    color: #000;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---- Ảnh + hover zoom 1.2 (annotation) ---- */
.tt-featured__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.tt-featured__big-link:hover .tt-featured__img,
.tt-featured__small-link:hover .tt-featured__img {
    transform: scale(1.2);
}

.tt-featured__heading br {
        display: none;
    }

@media (prefers-reduced-motion: reduce) {
    .tt-featured__img {
        transition: none;
    }
    .tt-featured__big-link:hover .tt-featured__img,
    .tt-featured__small-link:hover .tt-featured__img {
        transform: none;
    }
}

/* MOBILE (node 2348:27272): heading trái 1.25rem; thẻ lớn trên / list nhỏ dưới (vẫn row ảnh-trái). */
@media screen and (max-width: 639.98px) {
    .tt-featured {
        padding: 2.5rem 1rem;
    }
    .tt-featured__tags > li + li {
        margin: initial;
    }
    .tt-featured__tags {
        margin-top: 1.125rem;
        gap: 0.375rem;
    }
    .tt-featured .tt-tag {
        padding: 0.375rem 0.75rem;
    }
    .tt-featured__heading {
        font-size: 1.25rem;
        line-height: 2rem;
        letter-spacing: -0.0375rem;
        text-align: left;
    }
    .tt-featured__heading br {
        display: initial;
    }
    .tt-featured__row {
        flex-direction: column;
        margin-top: 1rem;
    }
    .tt-featured__big,
    .tt-featured__side {
        width: 100%;
    }
    .tt-featured__side {
        margin-left: 0;
        margin-top: 0.625rem;
    }
    .tt-featured__big-media {
        height: 13.0625rem;
    }
    .tt-featured__big-body {
        padding: 0 0.875rem;
    }
    /* Thẻ nhỏ: ảnh 8.875rem × cao 6.8125rem, body ml 0.625rem */
    .tt-featured__small + .tt-featured__small {
        margin-top: 0.625rem;
    }
    .tt-featured__small-link {
        height: 6.8125rem;
    }
    .tt-featured__small-media {
        width: 8.875rem;
    }
    .tt-featured__small-body {
        margin-left: 0.625rem;
    }
    /* Font CARD mobile (node 2348:27272) — thẻ featured dùng markup riêng (KHÔNG phải card-tin-tuc),
       trước đây leak size DESKTOP vì @media chỉ override layout. Giá trị từ get_node_styles node mobile. */
    .tt-featured__big-title {
        /* I2348:27275;2348:27562 */
        font-size: 1.125rem;
        line-height: 1.8rem;
        letter-spacing: -0.0338rem;
    }
    .tt-featured__big-desc {
        /* I2348:27275;2348:27563 */
        font-weight: 300;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0175rem;
        color: var(--tt-heading);
        -webkit-line-clamp: 2;
        margin-top: 0.375rem;
    }
    .tt-featured__small-date {
        /* I2348:27277;2348:27584 */
        font-weight: 300;
        font-size: 0.75rem;
        line-height: 1.125rem;
        letter-spacing: -0.0112rem;
        color: var(--tt-heading);
        display: flex;
        align-items: center;
    }
    .tt-featured__small-date svg {
        margin-right: 0.25rem;
    }
    .tt-featured__small-title {
        /* I2348:27277;2348:27585 */
        font-size: 0.875rem;
        line-height: 1.1375rem;
        letter-spacing: -0.0088rem;
    }
    .tt-featured__small-desc {
        /* I2348:27277;2348:27586 */
        font-weight: 300;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0175rem;
        color: var(--tt-heading);
        margin-top: 0.25rem;
    }
}


/* ===== template-parts/tin-tuc/section-news-grid/assets/styles.css ===== */
/* Section: Cập nhật mới nhất (news grid) — node 2348:26813 */
.tt-news {
    width: 100%;
    padding: 6.25rem 5.875rem;
    font-family: var(--tt-font);
    background:#F8F8F8;
}

.tt-news__inner {
    display: flex;
    flex-direction: column;
}

/* ---- Head: heading + filters ---- */
.tt-news__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.tt-news__heading {
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    color: var(--tt-heading);
    /*max-width: 31rem;*/
}

.tt-card__date {
    font-weight: 300;
}

.tt-news__filters {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.tt-news__filters .tt-news__dropdown + .tt-news__dropdown {
    margin-left: 1rem;
}

.tt-news__dropdown {
    position: relative;
    width: 18.75rem;
}

.tt-news .tt-card__more {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  color: var(--Title-Orange, #fa6900);
  font-family: "Lexend Deca", sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.02rem;
}

/* Figma node 2348:26818 "Drop down": fill #fff, radius 0.25rem, shadow 0 0.125rem 0.5rem rgba(0,0,0,0.04),
   KHÔNG border — không tự chế radius 0.5rem + border. */
.tt-news__dropdown-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--tt-white);
    border-radius: 0.25rem;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
    padding: 0.875rem;
    font-family: var(--tt-font);
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.3125rem;
    color: var(--tt-heading);
}

.tt-news__dropdown-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--Body-Black-100, #131313);
    text-align: center;
    font-family: "Lexend Deca";
    font-size: 0.875rem;
    font-weight: 300;
    line-height: 150%;
    letter-spacing: -0.01313rem;
}
.tt-news__dropdown-label strong {
    color: var(--Body-Black-100, #131313);
    text-align: center;
    font-family: "Lexend Deca";
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.00875rem;
    margin-left: 0.25rem;
}

.tt-news__dropdown-caret {
    display: block;
    width: 1.14844rem;
    height: 1.14844rem;
    margin-left: 0.5rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.tt-news__dropdown.is-open .tt-news__dropdown-caret {
    transform: rotate(180deg);
}

.tt-news__dropdown-menu {
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    right: 0;
    z-index: 5;
    list-style: none;
    background: var(--tt-white);
    border-radius: 0.25rem;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.1);
    padding: 0.5rem 0;
    display: none;
}

.tt-news__dropdown.is-open .tt-news__dropdown-menu {
    display: block;
}

.tt-news__dropdown-item {
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    line-height: 1.3125rem;
    font-weight: 400;
    color: #131313;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.tt-news__dropdown-item.is-active {
    color: #fa6900;
    background-color: rgba(250, 105, 0, 0.05);
    font-weight: 500;
}

.tt-news__dropdown-item:hover {
    color: #fa6900;
    background-color: rgba(250, 105, 0, 0.05);
}

/* ---- Multi-select chủ đề: ô checkbox trước nhãn ---- */
.tt-news__dropdown--multiple .tt-news__dropdown-item {
    display: flex;
    align-items: center;
}

.tt-news__dropdown--multiple .tt-news__dropdown-item::before {
    content: "";
    width: 1.125rem;
    height: 1.125rem;
    margin-right: 0.625rem;
    flex-shrink: 0;
    border: 1px solid #c7c7c7;
    border-radius: 0.25rem;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.75rem 0.75rem;
}

.tt-news__dropdown--multiple .tt-news__dropdown-item.is-active::before {
    border-color: #fa6900;
    background-color: #fa6900;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.3l2.2 2.2 4.8-5'/%3E%3C/svg%3E");
}

/* ---- Grid 3×3 (NO gap → margin) ---- */
.tt-news__grid {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin-top: 2.5rem;
}

.tt-news__cell {
    width: calc((100% - 4rem) / 3);
}

.tt-news__cell:not(:nth-child(3n + 1)) {
    margin-left: 2rem;
}

.tt-news__cell:nth-child(n + 4) {
    margin-top: 2.5rem;
}

/* ---- Pagination ---- */
.tt-news__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 3.75rem;
}

.tt-news__page + .tt-news__page {
    margin-left: 0.75rem;
}

.tt-news__page .page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.0625rem;
    height: 3.0625rem;
    border-radius: 0;
    font-family: var(--tt-font);
    font-weight: 500;
    font-size: 1rem;
    color: rgba(19, 19, 19, 0.40);
    letter-spacing: -0.02rem;
    background: var(--tt-white);
    /*border: 1px solid #e3e3e3;*/
    transition: background-color 0.2s ease, color 0.2s ease;
}

.tt-news__page .page-numbers:hover {
    background: #FA6900;
    color: #FFF;
}

.tt-news__page .page-numbers:hover img {
    filter: brightness(0) invert(1);
}
.tt-news__page .page-numbers.current {
    background: var(--tt-orange-accent);
    color: var(--tt-white);
    border-color: var(--tt-orange-accent);
}

.tt-news__page .page-numbers.dots {
    border-color: transparent;
    background: transparent;
}

.tt-news__page .page-numbers img {
    display: block;
    width: 1.375rem;
    height: 1.375rem;
}

.tt-news__cell--empty {
    width: 100%;
}

.tt-news__empty {
    margin-top: 2.5rem;
    font-size: 1rem;
    color: var(--tt-text-muted);
}

/* ---- Skeleton khi AJAX filter/sort/pagination ---- */
.tt-card--skeleton {
    background: var(--tt-white);
    box-shadow: 0 0.25rem 1.125rem rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.tt-skel {
    position: relative;
    overflow: hidden;
    background: #eceef0;
}

.tt-skel::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.65), transparent);
    animation: tt-skel-shimmer 1.3s ease-in-out infinite;
}

.tt-btn--outline:hover img {
    filter: brightness(0) invert(1);
}

.tt-card--skeleton .tt-card__body > .tt-skel {
    border-radius: 0.25rem;
}

.tt-skel--meta  { height: 1.05rem;   width: 55%;  margin-top: 1rem; }
.tt-skel--title { height: 1.6875rem; width: 92%;  margin-top: 1rem; }
.tt-skel--text  { height: 1.3125rem; width: 100%; margin-top: 1rem; }

@keyframes tt-skel-shimmer {
    100% { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
    .tt-skel::after {
        animation: none;
    }
}

/* ---- Nút filter mobile (ẩn desktop) → mở Filter modal (node 2348:27283) ---- */
.tt-news__filter-btn {
    display: none;
}

/* MOBILE (node 2348:27280): heading + icon filter 1 hàng; ẩn dropdown; lưới 1 cột. */
@media screen and (max-width: 639.98px) {
    .tt-news {
        padding: 2.5rem 1rem;
    }
    .tt-news__page .page-numbers img {
        width: 1rem;
        height: 1rem;
    }
    .tt-news__head {
        align-items: center;
    }
    .tt-news__heading {
        flex: 1 0 0;
        font-size: 1.25rem;
        line-height: 2rem;
        letter-spacing: -0.0375rem;
        max-width: 15rem;
    }
    .tt-news__heading br {
        display: none;
    }
    
    .tt-news .tt-card__more {
        font-size: 0.875rem;
        letter-spacing: -0.01313rem;
    }
    /* Dropdown desktop → ẩn trên mobile; thay bằng nút icon mở modal */
    .tt-news__filters {
        display: none;
    }
    .tt-news__filter-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 2.5rem;
        height: 2.5rem;
        margin-left: 1.5rem;
        padding: 0;
        background: var(--Background-White, #FFF);
        box-shadow: 0 4px 32px 0 rgba(0, 0, 0, 0.10);
        border-radius: 0.5rem;
        border: none;
        cursor: pointer;
    }
    .tt-news__filter-btn img {
        display: block;
        width: 1.25rem;
        height: 1.25rem;
    }
    .tt-news__grid {
        margin-top: 1.5rem;
    }
    .tt-news__cell {
        width: 100%;
    }
    .tt-news__cell:not(:nth-child(3n + 1)) {
        margin-left: 0;
    }
    .tt-news__cell + .tt-news__cell {
        margin-top: 1rem;
    }
    .tt-news__cell:nth-child(n + 4) {
        margin-top: 1rem;
    }
    .tt-news__pagination {
        margin-top: 1.5rem;
    }
    .tt-news__page .page-numbers {
        width: 2.5rem;
        height: 2.5rem;
        font-size: 0.875rem;
        line-height: 1.05rem;
        letter-spacing: -0.0088rem;
    }
}


/* ===== template-parts/tin-tuc/section-experts/assets/styles.css ===== */
/* Section: Phân tích chuyên sâu (experts) — node 2348:26837 */
.tt-experts {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 6.25rem 6.25rem 0;
    font-family: var(--tt-font);
}

.tt-experts__text {
    width: 37.5rem;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

.tt-experts__head {
    display: flex;
    flex-direction: column;
}

.tt-experts__tagline {
    display: inline-flex;
    align-items: center;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.5rem;
    text-transform: uppercase;
    color: #131313;
}

.tt-experts__tagline::before {
    content: "";
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-right: 0.75rem;
    border-radius: 50%;
    background: var(--tt-orange);
}
.tt-experts__heading {
    margin-top: 1rem;
    font-weight: 600;
    font-size: 2.5rem;
    line-height: 3.25rem;
    letter-spacing: -0.05rem;
    text-transform: uppercase;
    color: var(--tt-heading);
}

.tt-experts__desc {
    margin-top: 1.25rem;
    width: 100%;
    max-width: 30.6875rem;
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
    color: #000;
}

.tt-experts__buttons {
    display: flex;
    align-items: center;
    margin-top: 3rem;
}

.tt-experts__buttons > .tt-btn + .tt-btn {
    margin-left: 1rem;
}

/* ---- 2 ảnh chồng (absolute từ Figma) ---- */
.tt-experts__media {
    position: relative;
    width: 46.5625rem;
    height: 32.6875rem;
    flex-shrink: 0;
    margin-left: 2.5rem;
}

/* Figma node 2348:26851/26852: ảnh VUÔNG, không bo góc — không tự chế radius 0.5rem. */
.tt-experts__img {
    position: absolute;
    overflow: hidden;
}

.tt-experts__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.tt-experts__img--main {
    left: 10.625rem;
    top: 0;
    width: 36.9375rem;
    height: 29.1875rem;
}

/* Node 2348:26852: ảnh front có stroke trắng 12px (= 0.75rem) — khung viền, KHÔNG bo góc. */
.tt-experts__img--sub {
    left: 1.9rem;
    top: 14.6125rem;
    width: 25.0625rem;
    height: 17.375rem;
    box-sizing: border-box;
}
/* MOBILE (node 2348:27451): stack — chữ trên / cụm ảnh dưới. Toạ độ ảnh giữ absolute mobile. */
@media screen and (max-width: 639.98px) {
    .tt-experts {
        flex-direction: column;
        align-items: flex-start;
        padding: 2.5rem 1rem;
    }
    .tt-experts__tagline::before {
        content: "";
        display: inline-block;
        width: 1rem;
        height: 1rem;
        margin-right: 0.625rem;
        border-radius: 50%;
        background: var(--tt-orange);
    }
    .tt-experts__text {
        width: 100%;
    }
    /* Tagline: mobile font nhỏ hơn desktop (node 2348:27458: 14px/21px, ls -0.21px) */
    .tt-experts__tagline {
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0131rem;
    }
    .tt-experts__heading {
        margin-top: 0.625rem;
        font-size: 1.25rem;
        line-height: 2rem;
        letter-spacing: -0.0375rem;
    }
    .tt-experts__desc {
        width: 100%;
        margin-top: 0.75rem;
        font-weight: 300;
        font-size: 0.875rem;
        line-height: 1.3125rem;
        letter-spacing: -0.0175rem;
    }
    .tt-experts__buttons {
        margin-top: 1.5rem;
        align-items: stretch;
    }
    /* 2 nút FILL chia đôi, 1 dòng (Figma 2348:27461) — min-width:0 + nowrap + padding ngang gọn để vừa nửa hàng */
    .tt-experts__buttons > .tt-btn {
        flex: 1;
        min-width: 0;
        justify-content: center;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .tt-experts__buttons .tt-btn__label {
        white-space: nowrap;
    }
    .tt-experts__buttons > .tt-btn + .tt-btn {
        margin-left: 0.625rem;
    }
    .tt-experts__media {
        width: 100%;
        height: 15.0494rem;
        margin-left: 0;
        margin-top: 2.5rem;
    }
    .tt-experts__img--main {
        left: 4.4314rem;
        top: 0;
        width: 17.0061rem;
        height: 13.438rem;
    }
    /* Node 2348:27466: stroke trắng 6px = 0.375rem (mobile mỏng hơn desktop 12px). */
    .tt-experts__img--sub {
        left: 0.2302rem;
        top: 6.8197rem;
        width: 11.5388rem;
        height: 7.9995rem;
        border-width: 0.375rem;
    }
}


/* ===== template-parts/tin-tuc/section-media/assets/styles.css ===== */
/* ============================================================== */
/* Section: Tài nguyên media — Tin tức (node 2348:26853)          */
/*   Clone section-sp-documents carousel: Head (heading | nav)    */
/*   + Swiper 2 card/trang.                                       */
/* ============================================================== */

.tt-media {
	box-sizing: border-box;
	width: 100%;
	padding: 6.25rem;
	font-family: var(--tt-font);
}

.tt-media__inner {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
}

/* ── Head: heading-group | nav ─────────────────────────────────── */
.tt-media__head {
	display: flex;
	flex-direction: row;
	align-items: end;
	justify-content: space-between;
}

.tt-media__heading-group {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.tt-media__title {
	margin: 0;
	font-weight: 600;
	font-size: 2.5rem;
	line-height: 3.25rem;
	letter-spacing: -0.05rem;
	text-transform: uppercase;
	color: var(--tt-heading);
}

/* ── Nav prev/next ─────────────────────────────────────────────── */
.tt-media__nav {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	margin-left: 2rem;
}

.tt-media__nav-btn + .tt-media__nav-btn {
	margin-left: 0.625rem;
}

.tt-media__counter {
	display: none;
	color: var(--tt-heading);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 150%;
}

.tt-media__nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 0;
	border-radius: 0;
	background-color: var(--Neutral-Xm, #f2f3f5);
	color: var(--tt-heading);
	cursor: pointer;
	transition: background-color 0.25s ease, color 0.25s ease;
}

.tt-media__nav-btn:focus-visible {
	outline: 0.125rem solid var(--tt-orange-accent);
	outline-offset: 0.125rem;
}

.tt-media__nav-btn svg {
	display: block;
	width: 2rem;
	height: 2rem;
}

.tt-media__nav-btn--next svg {
	transform: scaleX(-1);
}

.tt-media__nav-btn:not(.swiper-button-disabled):not(.tt-media__nav-btn--disabled):not(:disabled):hover {
	background-color: var(--tt-orange-accent);
	color: var(--tt-white);
}

.tt-media__nav-btn.swiper-button-disabled,
.tt-media__nav-btn--disabled,
.tt-media__nav-btn:disabled {
	background-color: #d9d9d9;
	color: var(--tt-text-muted);
	opacity: 0.4;
	cursor: default;
	pointer-events: none;
}

/* ── Carousel viewport ─────────────────────────────────────────── */
.tt-media__carousel {
	margin-top: 2.5rem;
	width: 100%;
}

.tt-media__swiper {
	width: 100%;
	overflow: hidden;
}

.tt-media__swiper .swiper-wrapper {
	align-items: stretch;
}

.tt-media__swiper .swiper-slide {
	height: auto;
}

.tt-media__swiper .swiper-slide.tt-media__page {
	box-sizing: border-box;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	align-items: stretch;
}

/* ── Card tài liệu (Media) ─────────────────────────────────────── */
.tt-media__card {
	box-sizing: border-box;
	display: flex;
	flex-direction: row;
	align-items: center;
	height: auto;
	padding-right: 1.875rem;
	background: var(--tt-media-gray, #f2f2f2);
	border-radius: 0.25rem;
	overflow: hidden;
}

.tt-media__card-media {
	position: relative;
	flex: 0 0 18.125rem;
	width: 18.125rem;
	height: 14.3125rem;
	overflow: hidden;
}

@media screen and (min-width: 640px) and (hover: hover) and (pointer: fine) {
	.tt-media__card:hover .tt-media__card-image {
		transform: scale(1.1);
		transition: transform 0.3s ease-in-out;
	}
}

.tt-media__card-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Body: text + nút */
.tt-media__card-body {
	flex: 1 1 auto;
	min-width: 0;
	margin-left: 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.tt-media__card-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
}

.tt-media__card-title {
	margin: 0;
	font-weight: 600;
	font-size: 1.25rem;
	line-height: 1.625rem;
	letter-spacing: -0.0187rem;
	text-transform: uppercase;
	color: var(--tt-heading);
}

.tt-media__card-desc {
	margin: 0.625rem 0 0;
	font-weight: 300;
	font-size: 1rem;
	line-height: 1.5rem;
	letter-spacing: -0.02rem;
	color: var(--tt-heading);
}

.tt-media__card-action {
	margin-top: 2.5rem;
}

/* Button size override (Figma Size=L = 0.875rem, không phải global 1rem) */
.tt-media .tt-btn--l {
	font-size: 0.875rem;
	line-height: 1.1375rem;
	letter-spacing: -0.0088rem;
}

/* ============================================================== */
/* Mobile (≤ 639.98px) — node 2348:27467                           */
/* ============================================================== */
@media screen and (max-width: 639.98px) {
	.tt-media {
		padding: 0 1rem 2.5rem;
	}

	.tt-media__head {
		display: contents;
	}

	.tt-media__heading-group {
		order: 1;
		align-items: center;
	}

	.tt-media__nav {
		order: 3;
		display: flex;
		width: 100%;
		margin-left: 0;
		margin-top: 1.5rem;
	}

	.tt-media__counter {
		display: block;
		margin-right: auto;
	}

	.tt-media__nav-btn {
		width: 2.5rem;
		height: 2.5rem;
		min-width: 2.5rem;
		flex: 0 0 2.5rem;
		line-height: 1;
	}

	.tt-media__nav-btn svg {
		width: 1.8rem;
		height: 1.8rem;
		flex-shrink: 0;
	}

	/* H2 — 1.25rem/2rem uppercase, center */
	.tt-media__title {
		font-size: 1.25rem;
		line-height: 2rem;
		letter-spacing: -0.0375rem;
		text-align: center;
	}

	.tt-media__carousel {
		order: 2;
		margin-top: 1.25rem;
	}

	.tt-media__swiper .swiper-wrapper {
		align-items: flex-start;
	}

	.tt-media__swiper .swiper-slide,
	.tt-media__card {
		height: auto !important;
	}

	.tt-media__swiper .swiper-slide.tt-media__page {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		height: auto !important;
	}

	.tt-media__card {
		flex-direction: column;
		align-items: stretch;
		padding-right: 0;
	}

	.tt-media__card-media {
		flex: 0 0 auto;
		width: 100%;
		height: 0;
		padding-top: 78.9655%;
	}

	.tt-media__card-image {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		border-radius: 0;
		border-top-left-radius: 0.25rem;
		border-bottom-right-radius: 0.25rem;
	}

	.tt-media__card-body {
		margin-left: 0;
		margin-top: 1rem;
		padding: 0 0.875rem 1rem;
	}

	.tt-media__card-title {
		font-size: 1rem;
		line-height: 1.5rem;
		letter-spacing: initial;
	}

	.tt-media__card-desc {
		margin-top: 0.5rem;
		font-weight: 300;
		font-size: 0.875rem;
		letter-spacing: -0.0175rem;
	}

	.tt-media__card-action {
		margin-top: 1.5rem;
	}
}


/* ===== template-parts/tin-tuc/assets/styles.css ===== */
/* Trang Tin tức — page tokens + section/component CSS imports (order theo PLAN.md) */
/* LƯU Ý: @import PHẢI đứng đầu file (trước mọi rule khác) — nếu không sẽ bị bỏ qua. */

/* Shared components */





/* Sections */






:root {
    --tt-orange: #f15a29;        /* Orange-300 brand */
    --tt-orange-accent: #fa6900; /* button/link accent */
    --tt-orange-600: #c14821;    /* hover đậm */
    --tt-orange-50: #feefea;     /* chip bg */
    --tt-heading: #131313;
    --tt-text: #1c1c1c;
    --tt-text-muted: #4b4a4a;
    --tt-white: #ffffff;
    --tt-card-gray: #f2f3f5;     /* featured card fill (node 2348:26808/26810) */
    --tt-media-gray: #f2f2f2;    /* media card fill (node 2348:26861) */
    --tt-font: "Lexend Deca", sans-serif;
}

.only-pc {
   display: initial;
}

.only-mb {
   display: none;
}

@media (max-width: 640px) {
      .only-mb {
            display: initial !important;
      }
      .only-pc {
            display: none !important;
      }
}