/*
Theme Name: ITS Theme
Theme URI: https://www.itsgroup.vn
Author: Phòng R&D – Công ty CP Đầu tư và Dịch vụ Công nghệ (ITS)
Description: Theme dạng khối (Block Theme) cho website itsgroup.vn. Giao diện phương án 2 (PA2 – navy đậm, ảnh tràn viền), kế thừa nhận diện hồ sơ năng lực 2026: navy #0F2C55, xanh lá #3BA55D, font Be Vietnam Pro tự host.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 0.9.7
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: its-theme
*/

/* =========================================================
   CSS NỀN CỦA THEME ITS
   - Màu, font, cỡ chữ, khoảng cách, nút: khai báo trong theme.json
     (biến --wp--preset--*), chỉnh được trong Site Editor.
   - Tệp này chỉ chứa phần theme.json không làm được:
     bố cục đáp ứng 3 cỡ màn hình và các khối dựng sẵn (pattern).
   - Mọi lớp CSS riêng của ITS có tiền tố "its-" để không trùng WordPress.
   - Điểm chuyển: máy tính bảng từ 768 px, máy tính từ 1025 px
     (ưu tiên điện thoại – mobile-first).
   ========================================================= */

/* ---------- Nền chung ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
h1, h2, h3, h4 { text-wrap: balance; }
img { max-width: 100%; height: auto; }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--wp--preset--color--green); outline-offset: 2px; }
.its-section { padding-block: var(--wp--preset--spacing--50); }
/* Dải nền navy/tối: chữ, tiêu đề tự đổi sang màu sáng */
.has-navy-background-color :where(h1, h2, h3, h4),
.has-navy-deep-background-color :where(h1, h2, h3, h4) { color: var(--wp--preset--color--white); }
.has-navy-background-color .its-eyebrow,
.has-navy-deep-background-color .its-eyebrow { color: var(--wp--preset--color--green-on-dark); }

/* =========================================================
   B4 – HEADER, MENU, FOOTER (khối WordPress)
   ========================================================= */

/* Header dính khi cuộn; chừa chỗ thanh quản trị khi đăng nhập */
.wp-site-blocks > header.wp-block-template-part {
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 100;
}
.its-header { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.its-header__bar { min-height: var(--wp--custom--header-height--mobile); gap: 16px; }
.its-header__logo { margin: 0; flex-shrink: 0; }
.its-header__logo img { height: 34px; width: auto; display: block; }
.its-header__tools { gap: 12px; }
.its-header__cta { order: -1; }
.its-lang-slot:empty { display: none; }
@media (max-width: 1024px) {
  .its-header__tools { gap: 4px; }
  .its-header__cta .wp-block-button__link { padding: 6px 14px; font-size: var(--wp--preset--font-size--xs); white-space: nowrap; }
}
@media (min-width: 1025px) {
  .its-header__bar { min-height: var(--wp--custom--header-height--desktop); }
  .its-header__logo img { height: 42px; }
  .its-header__cta { order: 0; }
}

/* Menu chính trên máy tính */
.its-main-nav .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: var(--wp--custom--tap-target); padding-inline: 10px; color: rgba(255, 255, 255, .88); text-decoration: none; }
.its-main-nav .wp-block-navigation-item__content:hover,
.its-main-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--wp--preset--color--green-on-dark); }
@media (min-width: 1025px) {
  .its-main-nav .wp-block-navigation__submenu-container {
    background: var(--wp--preset--color--white) !important;
    color: var(--wp--preset--color--ink) !important;
    border: 0 !important;
    border-top: 3px solid var(--wp--preset--color--green) !important;
    box-shadow: var(--wp--preset--shadow--menu);
    min-width: 300px !important;
    padding-block: 8px;
  }
  .its-main-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--wp--preset--color--ink); padding: 8px 20px; min-height: 40px; width: 100%; }
  .its-main-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--mist); color: var(--wp--preset--color--green-ink); }
}

/* Khối Navigation mặc định chuyển sang nút thu gọn ở 600 px.
   ITS yêu cầu thu gọn cả trên máy tính bảng (đến 1024 px). */
@media (min-width: 600px) and (max-width: 1024px) {
  .its-main-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
  .its-main-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
}

/* Nút mở menu và lớp phủ toàn màn hình nền navy */
.its-main-nav .wp-block-navigation__responsive-container-open,
.its-main-nav .wp-block-navigation__responsive-container-close { min-width: var(--wp--custom--tap-target); min-height: var(--wp--custom--tap-target); justify-content: center; align-items: center; color: var(--wp--preset--color--white); }
.its-main-nav .wp-block-navigation__responsive-container-open svg,
.its-main-nav .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }
.its-main-nav .wp-block-navigation__responsive-container.is-menu-open {
  padding: 16px max(20px, env(safe-area-inset-right, 0px)) 32px max(20px, env(safe-area-inset-left, 0px));
}
.its-main-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 56px; gap: 0 !important; }
.its-main-nav .is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; }
.its-main-nav .is-menu-open .wp-block-navigation-item { width: 100%; }
.its-main-nav .is-menu-open .wp-block-navigation-item__content { width: 100%; min-height: 52px; padding-inline: 0; font-size: var(--wp--preset--font-size--lg); font-weight: 600; color: var(--wp--preset--color--white); border-bottom: 1px solid rgba(255, 255, 255, .12); }
/* Lớp phủ: căn trái toàn bộ mục (menu header căn phải nên WordPress mặc định đẩy menu con sang phải) */
.its-main-nav .is-menu-open .wp-block-navigation__responsive-container-content,
.its-main-nav .is-menu-open .wp-block-navigation__container,
.its-main-nav .is-menu-open .wp-block-navigation__submenu-container {
  --navigation-layout-justification-setting: flex-start;
  --navigation-layout-justify: flex-start;
  align-items: flex-start !important;
}
.its-main-nav .is-menu-open .wp-block-navigation-item { align-items: flex-start !important; }
.its-main-nav .is-menu-open .wp-block-navigation__submenu-container { padding: 0 0 8px 16px !important; width: auto !important; max-width: 100%; box-sizing: border-box; left: 0 !important; }
.its-main-nav .is-menu-open .wp-block-navigation-item__content:focus-visible { outline-offset: -3px; }
.its-main-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: var(--wp--preset--font-size--base); font-weight: 400; min-height: var(--wp--custom--tap-target); color: var(--wp--preset--color--on-dark-muted); border-bottom: 0; }

/* Footer */
.its-footer { font-size: var(--wp--preset--font-size--sm); }
.its-footer a { color: var(--wp--preset--color--on-dark-muted); text-decoration: none; }
.its-footer a:hover { color: var(--wp--preset--color--white); }
.its-footer__grid { display: grid; gap: 32px; }
@media (min-width: 768px) { .its-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; } }
@media (min-width: 1025px) { .its-footer__grid { grid-template-columns: minmax(0, 1.3fr) max-content max-content minmax(0, 1.1fr); gap: 48px clamp(48px, 6vw, 96px); } }
.its-footer__grid > * { min-width: 0; margin-block: 0 !important; }
.its-footer__logo img { height: 40px; width: auto; }
.its-footer__title { font-size: var(--wp--preset--font-size--xs) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--white) !important; margin-bottom: 8px !important; }
.its-footer__links { list-style: none; padding: 0; margin: 0; }
.its-footer__links a { display: inline-flex; align-items: center; min-height: 36px; }
/* Điện thoại: 2 cột liên kết nằm cạnh nhau cho gọn */
@media (max-width: 767px) {
  .its-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .its-footer__brand, .its-footer__contact { grid-column: 1 / -1; }
}
.its-footer__contact a { color: var(--wp--preset--color--white); }
.its-footer__company { color: var(--wp--preset--color--white); font-weight: 600; }
.its-footer .wp-block-button.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--white); border-color: rgba(255, 255, 255, .5); background: transparent; }
.its-footer .wp-block-button.is-style-outline > .wp-block-button__link:hover { border-color: var(--wp--preset--color--white); background: rgba(255, 255, 255, .08); }
.its-footer .wp-block-social-links { gap: 8px; }
.its-footer .wp-social-link a { min-width: var(--wp--custom--tap-target); min-height: var(--wp--custom--tap-target); display: inline-flex; align-items: center; justify-content: center; }
.its-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 20px; font-size: var(--wp--preset--font-size--xs); }

/* =========================================================
   B6a – KHỐI DỰNG SẴN (pattern) TRANG CHỦ, GIỚI THIỆU, GIẢI PHÁP
   Cấu trúc khối WordPress: dải toàn chiều rộng (.its-section, alignfull)
   → nội dung rộng 1200 px (alignwide) → các lưới its-*.
   ========================================================= */

/* Mẫu trang "Full width": các dải nối liền nhau, không khoảng hở */
.its-page-full .wp-block-post-content > * { margin-block: 0; }
.wp-block-post-content > .alignfull + .alignfull { margin-top: 0; }
.its-section { padding-block: var(--wp--preset--spacing--50); }

/* Lưới tự viết: bỏ khoảng cách mặc định giữa các khối con */
body :is(.its-stats, .its-about, .its-vm, .its-areas, .its-capabilities, .its-process, .its-logos, .its-partners,
  .its-cta, .its-director, .its-values, .its-team, .its-section-head, .its-section-head__text, .its-about__text,
  .its-area, .its-cap, .its-step, .its-stat, .its-partner, .its-value, .its-vm__item, .its-project, .its-project__meta,
  .its-project__facts, .its-fact, .its-news-item, .its-hero__text, .its-cta__text, .its-director__text, .its-team__text) > * { margin-block: 0; }
/* Hero: nội dung thẳng hàng khung 1200 px */
.wp-block-cover.its-hero .wp-block-cover__inner-container { width: 100% !important; max-width: calc(var(--wp--style--global--wide-size) + 32px); margin-inline: auto !important; padding-inline: var(--wp--style--root--padding-left, 16px) !important; }
@media (min-width: 1232px) { .wp-block-cover.its-hero .wp-block-cover__inner-container { max-width: var(--wp--style--global--wide-size); padding-inline: 0 !important; } }
/* Footer, header nối liền nội dung (không khoảng trắng) */
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0; }
.wp-block-cover.its-hero .its-hero__text { margin-left: 0 !important; margin-right: auto !important; }

/* Chữ nhãn nhỏ trên tiêu đề (vạch xanh như profile) */
.its-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--green-ink); }
.its-eyebrow::before { content: ""; width: 28px; height: 3px; background: var(--wp--preset--color--green); }
.its-lead { font-size: var(--wp--preset--font-size--lg); color: var(--wp--preset--color--muted); max-width: 65ch; }
.its-link-arrow a { display: inline-flex; align-items: center; gap: 6px; min-height: var(--wp--custom--tap-target); font-weight: 600; font-size: var(--wp--preset--font-size--sm); text-decoration: none; }
.its-link-arrow a::after { content: "→"; transition: transform .2s; }
.its-link-arrow a:hover::after { transform: translateX(4px); }

/* Dải nền tối: màu chữ, liên kết, nút viền */
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) { color: var(--wp--preset--color--white); }
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) :where(h1, h2, h3, h4) { color: var(--wp--preset--color--white); }
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) .its-eyebrow { color: var(--wp--preset--color--green-on-dark); }
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) .its-lead { color: var(--wp--preset--color--on-dark-muted); }
:where(.has-navy-background-color, .has-navy-deep-background-color) a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--green-on-dark); }
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) .is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--white); border-color: rgba(255, 255, 255, .7); background: transparent; }
:where(.has-navy-background-color, .has-navy-deep-background-color, .its-hero) .is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--white); color: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--white); }

/* Tiêu đề khối */
.its-section-head { display: grid; gap: 14px; margin-bottom: clamp(28px, 4vw, 48px) !important; max-width: 760px; }
.its-section-head--split { max-width: none; }
.its-section-head__text { display: grid; gap: 14px; max-width: 760px; }
@media (min-width: 1025px) { .its-section-head--split { grid-template-columns: 1fr auto; align-items: end; } }

/* ---------- Hero: ảnh tràn viền, lớp phủ navy ---------- */
.wp-block-cover.its-hero { min-height: 0; padding: clamp(56px, 8vw, 128px) 0 clamp(40px, 5vw, 72px); }
/* Điện thoại, máy tính bảng: lớp phủ dọc để chữ luôn dễ đọc */
@media (max-width: 1024px) {
  .its-hero .wp-block-cover__background { background: linear-gradient(180deg, rgba(15, 44, 85, .6) 0%, rgba(15, 44, 85, .92) 70%, #0F2C55 100%) !important; }
}
.its-hero__text { display: grid; gap: 20px; max-width: 760px; }
.its-hero h1 { font-size: var(--wp--preset--font-size--heading-1); }
.its-hero--page h1 { font-size: var(--wp--preset--font-size--heading-2); }
.its-hero--page.wp-block-cover { padding-bottom: clamp(48px, 6vw, 96px); }
.its-hero__lead { font-size: var(--wp--preset--font-size--lg); color: rgba(255, 255, 255, .86); max-width: 56ch; }

/* ---------- Số liệu ---------- */
.its-stats-band.its-section { padding-top: 0; }
.its-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; border-top: 1px solid rgba(255, 255, 255, .16); padding-top: 32px; }
@media (min-width: 768px) { .its-stats--6, .its-stats--5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .its-stats--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1025px) { .its-stats--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .its-stats--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.its-stat { display: grid; gap: 6px; align-content: start; min-width: 0; }
.its-stat__value { font-size: var(--wp--preset--font-size--stat); font-weight: 700; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.its-stat__label { font-size: var(--wp--preset--font-size--sm); font-weight: 600; color: var(--wp--preset--color--green-on-dark); }
.its-stat__note { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--on-dark-muted); }

/* ---------- Giới thiệu ngắn / chi tiết giải pháp ---------- */
.its-about { display: grid; gap: 32px; }
@media (min-width: 1025px) { .its-about { grid-template-columns: 5fr 6fr; gap: 64px; align-items: center; } }
.its-about__text { display: grid; gap: 20px; min-width: 0; }
.its-about__media { margin: 0; }
.its-about__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--wp--custom--radius); }
.its-vm { display: grid; gap: 16px; }
@media (min-width: 768px) { .its-vm { grid-template-columns: 1fr 1fr; } }
.its-vm__item { display: grid; gap: 6px; padding-top: 14px; border-top: 2px solid var(--wp--preset--color--green); }
.its-vm h3 { font-size: var(--wp--preset--font-size--xs); letter-spacing: .12em; text-transform: uppercase; }
.its-vm p { font-size: var(--wp--preset--font-size--sm); }
.its-check-list { list-style: none; padding: 0; display: grid; gap: 10px; }
.its-check-list li { position: relative; padding-left: 30px; }
.its-check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--wp--preset--color--green); color: var(--wp--preset--color--navy-deep); font-size: 12px; font-weight: 700; display: grid; place-items: center; margin-top: 3px; }
@media (min-width: 768px) { .its-certs-section .its-check-list { grid-template-columns: 1fr 1fr; gap: 14px 40px; } }

/* ---------- Lĩnh vực ---------- */
.its-areas { display: grid; gap: 20px 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .its-areas { gap: 28px 24px; } }
@media (min-width: 1025px) { .its-areas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 28px; } }
.its-area { display: grid; gap: 8px; align-content: start; min-width: 0; }
.its-area__img { margin: 0 0 8px !important; overflow: hidden; border-radius: var(--wp--custom--radius); }
.its-area__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .5s; }
.its-area:hover .its-area__img img { transform: scale(1.04); }
.its-area h3 { font-size: var(--wp--preset--font-size--heading-3); }
.its-area h3 a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-area p { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-area .its-link-arrow a { min-height: 32px; }
@media (max-width: 767px) { .its-area h3 { font-size: var(--wp--preset--font-size--sm); } .its-area p:not(.its-link-arrow), .its-area .its-link-arrow { display: none; } }

/* ---------- Năng lực kỹ thuật ---------- */
.its-capabilities { display: grid; gap: 28px; }
@media (min-width: 1025px) { .its-capabilities { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; } }
.its-cap { display: grid; gap: 12px; align-content: start; min-width: 0; }
.its-cap h3 { font-size: var(--wp--preset--font-size--sm); text-transform: uppercase; letter-spacing: .1em; color: var(--wp--preset--color--green-on-dark) !important; }
.its-chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.its-chips li { margin: 0; padding: 6px 12px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 2px; font-size: var(--wp--preset--font-size--sm); font-weight: 500; }
.its-capabilities-note { margin-top: 32px !important; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .16); color: var(--wp--preset--color--on-dark-muted); font-size: var(--wp--preset--font-size--sm); max-width: 900px; }
.its-capabilities-note strong { color: var(--wp--preset--color--white); }

/* ---------- Dự án (Query Loop) ---------- */
.its-projects { list-style: none; padding: 0; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (min-width: 768px) { .its-projects { gap: 24px; } }
@media (min-width: 1025px) { .its-projects { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; } }
.its-projects > li { margin: 0; min-width: 0; }
.its-project { display: grid; gap: 6px; align-content: start; }
.its-project__media { position: relative; margin-bottom: 8px !important; }
.its-project__img { margin: 0; overflow: hidden; border-radius: var(--wp--custom--radius); }
.its-project__img img { transition: transform .5s; }
.its-project:hover .its-project__img img { transform: scale(1.04); }
.its-project__tag { position: absolute; left: 10px; top: 10px; padding: 4px 8px; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; background: var(--wp--preset--color--green); color: var(--wp--preset--color--navy-deep); border-radius: 2px; }
.its-project__tag:empty { display: none; }
.its-project__title { font-size: var(--wp--preset--font-size--base); line-height: 1.35; }
.its-project__title a { color: var(--wp--preset--color--white) !important; text-decoration: none; }
.its-project__title a:hover { color: var(--wp--preset--color--green-on-dark) !important; }
.its-project__meta { display: flex; flex-wrap: wrap; gap: 0 6px; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--on-dark-muted); }
.its-project__meta a { color: inherit !important; text-decoration: none; }
.its-project__year:not(:empty)::before { content: "· "; }
.its-project__client:empty + .its-project__year::before { content: none; }
.its-project__facts { display: none; gap: 20px; margin-top: 8px !important; }
.its-fact { display: grid; }
.its-fact:not(:has(p:not(:empty))) { display: none; }
.its-fact__value { font-size: 1.25rem; font-weight: 700; line-height: 1.2; color: var(--wp--preset--color--green-on-dark); font-variant-numeric: tabular-nums; }
.its-fact__label { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--on-dark-muted); }
:where(.its-fact__value, .its-fact__label):empty { display: none; }
@media (min-width: 768px) { .its-project__title { font-size: var(--wp--preset--font-size--heading-3); } .its-project__facts { display: flex; flex-wrap: wrap; } }
/* Dự án nổi bật đầu tiên lớn hơn (PA2) */
@media (min-width: 768px) { .its-featured-projects .its-projects > li:first-child { grid-column: 1 / -1; } .its-featured-projects .its-projects > li:first-child .its-project__img img { aspect-ratio: 21 / 9 !important; } }
@media (min-width: 1025px) {
  .its-featured-projects .its-projects > li:first-child { grid-column: span 2; grid-row: span 2; }
  .its-featured-projects .its-projects > li:first-child .its-project__img img { aspect-ratio: 4 / 3 !important; }
  .its-featured-projects .its-projects > li:first-child .its-project__title { font-size: var(--wp--preset--font-size--heading-2); }
  .its-featured-projects .its-projects > li:is(:nth-child(2), :nth-child(3)) .its-project__facts { display: none; }
}
@media (min-width: 768px) and (max-width: 1024px) { .its-featured-projects .its-projects > li:nth-child(6) { display: none; } }
@media (max-width: 767px) { .its-featured-projects .its-projects > li:nth-child(n+5) { display: none; } }
.its-more-row { justify-content: center; margin-top: 32px !important; }

/* ---------- Quy trình ---------- */
.its-process { display: grid; }
@media (min-width: 768px) { .its-process { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; } }
@media (min-width: 1025px) { .its-process { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; } }
.its-step { display: grid; grid-template-columns: auto 1fr; align-content: start; gap: 4px 16px; padding-block: 18px; border-top: 1px solid var(--wp--preset--color--line); min-width: 0; }
.its-step__no { grid-row: span 2; font-size: 1.75rem; font-weight: 700; line-height: 1; color: var(--wp--preset--color--green-ink); font-variant-numeric: tabular-nums; }
.its-step h3 { font-size: var(--wp--preset--font-size--base); }
.its-step p:not(.its-step__no) { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
@media (min-width: 1025px) { .its-step { grid-template-columns: 1fr; border-top: 3px solid var(--wp--preset--color--line); padding-top: 20px; } .its-step:first-child { border-top-color: var(--wp--preset--color--green); } .its-step__no { grid-row: auto; } }

/* ---------- Khách hàng, đối tác ---------- */
.its-logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .its-logos { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1025px) { .its-logos { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 16px; } }
.its-logo { margin: 0; display: flex; align-items: center; justify-content: center; aspect-ratio: 3 / 2; padding: 6px; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); }
.its-logo img { max-height: 100%; max-width: 100%; width: auto !important; height: auto; object-fit: contain; filter: grayscale(1); opacity: .8; transition: filter .3s, opacity .3s; }
.its-logo:hover img { filter: none; opacity: 1; }
.its-logos__more { display: flex; align-items: center; justify-content: center; aspect-ratio: 3 / 2; font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); text-align: center; }
.its-sub-head { margin-top: 48px !important; margin-bottom: 16px !important; font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.its-partners { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 1025px) { .its-partners { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }
.its-partner { display: grid; gap: 10px; align-content: start; padding: 20px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); background: var(--wp--preset--color--white); min-width: 0; }
.its-partner__logo { margin: 0; }
.its-partner__logo img { height: 40px; width: auto !important; max-width: min(160px, 100%); object-fit: contain; object-position: left center; }
.its-partner h3 { font-size: var(--wp--preset--font-size--base); overflow-wrap: anywhere; }
.its-partner p { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
@media (max-width: 767px) { .its-partner { padding: 14px; } .its-partner h3 { font-size: var(--wp--preset--font-size--sm); } .its-partner p { display: none; } }

/* ---------- Tin tức: ẩn cả khối khi chưa có bài ---------- */
.its-news-section:not(:has(.wp-block-post)) { display: none; }
.its-news__list { list-style: none; padding: 0; display: grid !important; gap: 24px; }
.its-news__list > li { margin: 0; min-width: 0; }
@media (min-width: 768px) { .its-news__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .its-news__list > li:nth-child(3) { display: none; } }
@media (min-width: 1025px) { .its-news__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; } .its-news__list > li:nth-child(3) { display: block; } }
@media (max-width: 767px) { .its-news__list > li:nth-child(n+3) { display: none; } }
.its-news-item { display: grid; gap: 10px; }
.its-news__img { margin: 0; border-radius: var(--wp--custom--radius); overflow: hidden; }
.its-news__date { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.its-news-item h3 { font-size: var(--wp--preset--font-size--heading-3); }
.its-news-item h3 a { color: var(--wp--preset--color--navy); text-decoration: none; }

/* ---------- Kêu gọi liên hệ (nền xanh lá) ---------- */
.its-cta { display: grid; gap: 24px; }
@media (min-width: 1025px) { .its-cta { grid-template-columns: 1fr auto; align-items: center; gap: 48px; } }
.its-cta__text { display: grid; gap: 14px; max-width: 720px; }
.its-cta-section h2 { color: var(--wp--preset--color--navy-deep); }
.its-cta-section .its-eyebrow { color: var(--wp--preset--color--navy-deep); }
.its-cta-section .its-eyebrow::before { background: var(--wp--preset--color--navy-deep); }
.its-cta-section .its-lead { color: var(--wp--preset--color--navy-deep); }
.its-cta__actions .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: var(--wp--preset--color--navy-deep); border-color: var(--wp--preset--color--navy-deep); color: var(--wp--preset--color--white); }
.its-cta__actions .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover { background: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--navy); }
.its-cta__actions .is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--navy-deep); border-color: var(--wp--preset--color--navy-deep); background: transparent; }

/* ---------- Thư ngỏ Giám đốc ---------- */
.its-director { display: grid; gap: 32px; align-items: start; }
@media (min-width: 768px) { .its-director { grid-template-columns: minmax(200px, 1fr) 2fr; gap: 48px; } }
.its-director__photo { margin: 0; }
.its-director__photo img { width: 100%; max-width: 360px; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--wp--custom--radius); border-bottom: 4px solid var(--wp--preset--color--green); }
.its-director__text { display: grid; gap: 16px; max-width: 65ch; }
.its-signature { margin-top: 8px !important; }

/* ---------- Giá trị cốt lõi ---------- */
.its-values { display: grid; gap: 16px; }
@media (min-width: 768px) { .its-values { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
@media (min-width: 1025px) { .its-values { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.its-value { display: grid; gap: 8px; align-content: start; padding: 20px; background: var(--wp--preset--color--white); border-top: 3px solid var(--wp--preset--color--green); border-radius: var(--wp--custom--radius); }
.its-value h3 { font-size: var(--wp--preset--font-size--heading-3); }
.its-value p { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }

/* ---------- Đội ngũ ---------- */
.its-team { display: grid; gap: 32px; }
@media (min-width: 1025px) { .its-team { grid-template-columns: 6fr 5fr; gap: 64px; align-items: center; } }
.its-team__text { display: grid; gap: 20px; min-width: 0; }
.its-team__media { margin: 0; }
.its-team__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--wp--custom--radius); }

/* Nút lên đầu trang */
.its-to-top { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px)); width: var(--wp--custom--tap-target); height: var(--wp--custom--tap-target); border: 0; border-radius: 50%; background: var(--wp--preset--color--navy); color: #fff; font-size: 18px; cursor: pointer; box-shadow: 0 6px 16px rgba(10, 31, 61, .3); opacity: 0; pointer-events: none; transition: opacity .3s; z-index: 40; }
.its-to-top.is-visible { opacity: 1; pointer-events: auto; }

/* =========================================================
   TRANG CHI TIẾT DỰ ÁN (single-its_project) – bản tạm, hoàn thiện ở B6b
   ========================================================= */
.its-single-project .wp-block-post-content, .its-single-project > * { margin-block: 0; }
.its-single__head .its-single__head-inner { display: grid; gap: 14px; }
.its-single__head .its-single__head-inner > * { margin-block: 0 !important; }
.its-single__title { font-size: var(--wp--preset--font-size--heading-2); max-width: 900px; }
.its-single__sector a { color: var(--wp--preset--color--green-on-dark) !important; text-decoration: none; }
.its-back a::after { content: none; }
.its-back a::before { content: "←"; }
.its-single__facts { display: flex !important; gap: 32px !important; margin-top: 8px; }
.its-single__facts .its-fact__value { font-size: var(--wp--preset--font-size--heading-3); }
.its-single__grid { display: grid; gap: 40px; }
@media (min-width: 1025px) { .its-single__grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 56px; align-items: start; } }
.its-single__main > * + * { margin-top: 28px; }
.its-single__image { margin: 0; border-radius: var(--wp--custom--radius); overflow: hidden; }
.its-single__content > * + * { margin-top: 1em; }
.its-single__content .its-lead { font-size: var(--wp--preset--font-size--lg); color: var(--wp--preset--color--ink); }
.its-single__content .its-project__gallery img { width: 100%; border-radius: var(--wp--custom--radius); }
.its-single__content h2 { font-size: var(--wp--preset--font-size--heading-3); margin-top: 1.6em; }
.its-single__aside { display: grid; gap: 0; padding: 24px; background: var(--wp--preset--color--mist); border-top: 3px solid var(--wp--preset--color--green); border-radius: var(--wp--custom--radius); position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 100px); }
.its-single__aside > * { margin-block: 0 !important; }
.its-single__aside-title { font-size: var(--wp--preset--font-size--sm) !important; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 8px !important; }
.its-spec { display: grid; gap: 2px; padding-block: 12px; border-bottom: 1px solid var(--wp--preset--color--line); }
.its-spec > * { margin: 0 !important; }
.its-spec__label { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); text-transform: uppercase; letter-spacing: .08em; }
.its-spec__value { font-weight: 600; color: var(--wp--preset--color--navy); }
.its-spec:not(:has(.its-spec__value:not(:empty))) { display: none; }
.its-single__aside .wp-block-buttons { margin-top: 20px !important; }
.its-single .wp-block-post-featured-image img { border-radius: var(--wp--custom--radius); }

/* =========================================================
   B6b – DANH SÁCH, CHI TIẾT, LIÊN HỆ, 404, TÌM KIẾM
   ========================================================= */
.its-archive > *, .its-single > * { margin-block: 0; }
/* Đầu trang (dải navy) */
.its-page-head.its-section { padding-block: clamp(48px, 6vw, 96px) clamp(40px, 5vw, 72px); }
.its-page-head__inner { display: grid; gap: 16px; }
.its-page-head__inner > * { margin-block: 0 !important; max-width: 820px; }
.its-page-head h1 { font-size: var(--wp--preset--font-size--heading-2); }
.its-page-head .its-lead { color: var(--wp--preset--color--on-dark-muted); }
.its-page-head .its-search { max-width: 520px; }

/* Bảng "All contracts" */
.its-filter { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: end; margin-bottom: 20px !important; padding: 16px; background: var(--wp--preset--color--mist); border-radius: var(--wp--custom--radius); }
.its-filter__note { margin: 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--sm); }
.its-filter__field { display: grid; gap: 4px; font-size: var(--wp--preset--font-size--xs); font-weight: 600; color: var(--wp--preset--color--muted); text-transform: uppercase; letter-spacing: .06em; flex: 1 1 120px; min-width: 0; }
.its-filter__field--search { flex: 2 1 260px; }
.its-filter__field input, .its-filter__field select { font: inherit; font-size: var(--wp--preset--font-size--sm); text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--wp--preset--color--ink); min-height: var(--wp--custom--tap-target); padding: 8px 12px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); background: #fff; width: 100%; }
.its-filter__count { flex-basis: 100%; margin: 0; font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-contracts__list { list-style: none; padding: 0; margin: 0; }
.its-contracts__list > li { margin: 0; }
.its-contract { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 4px 16px; padding-block: 14px; border-bottom: 1px solid var(--wp--preset--color--line); }
.its-contract > * { margin: 0 !important; }
.its-contract__year { font-weight: 700; color: var(--wp--preset--color--green-ink); font-variant-numeric: tabular-nums; grid-row: span 2; }
.its-contract__year a, .its-contract__client a { color: inherit; text-decoration: none; }
.its-contract__title { font-size: var(--wp--preset--font-size--sm) !important; font-weight: 500; line-height: 1.5; color: var(--wp--preset--color--ink); }
.its-contract__client { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.its-contract--head { display: none; }
@media (min-width: 768px) {
  .its-contract { grid-template-columns: 72px minmax(0, 1fr) 220px; align-items: baseline; }
  .its-contract__year { grid-row: auto; }
  .its-contract__client { font-size: var(--wp--preset--font-size--sm); }
  .its-contract--head { display: grid; padding-block: 10px; border-bottom: 2px solid var(--wp--preset--color--navy); }
  .its-contract--head p { font-size: var(--wp--preset--font-size--xs) !important; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--wp--preset--color--muted); }
}

/* Sản phẩm */
.its-single__image--contain { background: var(--wp--preset--color--mist); }
.its-single__image--contain img { padding: 24px; }

/* Tuyển dụng */

/* Tài liệu */
.its-docs__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.its-docs__list > li { margin: 0; }
.its-doc { display: grid; gap: 16px; padding: 24px; border: 1px solid var(--wp--preset--color--line); border-left: 4px solid var(--wp--preset--color--green); border-radius: var(--wp--custom--radius); }
@media (min-width: 768px) { .its-doc { grid-template-columns: 1fr auto; align-items: center; } }
.its-doc > *, .its-doc__main > * { margin: 0 !important; }
.its-doc__main { display: grid; gap: 6px; }
.its-doc__type a { font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--green-ink); text-decoration: none; }
.its-doc h3 { font-size: var(--wp--preset--font-size--heading-3); }
.its-doc__meta { display: flex; gap: 6px; font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-doc__meta > * { margin: 0 !important; }
.its-doc__meta:not(:has(.its-doc__version:not(:empty))) { display: none; }
/* Nút tải chưa có tệp (không có href) thì ẩn */
.wp-block-button__link:not([href]) { display: none; }
.its-download:not(:has(a[href])) { display: none; }

/* Tin tức (trang danh sách) */
.its-news-section--archive:not(:has(.wp-block-post)) { display: block; }
.its-news .its-news__list > li:nth-child(n) { display: block; }
.its-news__meta { display: flex; flex-wrap: wrap; gap: 0 8px; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.its-news__meta > * { margin: 0 !important; }
.its-news__cat a { color: var(--wp--preset--color--green-ink); font-weight: 600; text-decoration: none; text-transform: uppercase; letter-spacing: .08em; }
.its-news__excerpt { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-news__excerpt .wp-block-post-excerpt__more-text { display: none; }
.its-pagination { margin-top: 40px; gap: 8px; justify-content: center; }
.its-pagination a, .its-pagination .current { display: inline-flex; min-width: var(--wp--custom--tap-target); min-height: var(--wp--custom--tap-target); align-items: center; justify-content: center; padding: 0 12px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); text-decoration: none; }
.its-pagination .current { background: var(--wp--preset--color--navy); color: #fff; border-color: var(--wp--preset--color--navy); }
.wp-block-post-content .its-lead { color: var(--wp--preset--color--ink); }

/* Liên hệ */
.its-contact { display: grid; gap: 32px; }
@media (min-width: 1025px) { .its-contact { grid-template-columns: 5fr 6fr; gap: 64px; align-items: start; } }
.its-contact > *, .its-contact__text > * { margin-block: 0 !important; }
.its-contact__text { display: grid; gap: 20px; }
.its-contact__list { display: grid; gap: 0; }
.its-contact__item { display: grid; gap: 4px; padding-block: 16px; border-top: 1px solid var(--wp--preset--color--line); }
.its-contact__item > * { margin: 0 !important; }
.its-contact__label { font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--green-ink); }
.its-contact__value { font-size: 1.0625rem; line-height: 1.6; color: var(--wp--preset--color--navy); }
.its-contact__value a { color: var(--wp--preset--color--navy); text-decoration: none; font-weight: 600; }
.its-map { position: relative; aspect-ratio: 4 / 3; border-radius: var(--wp--custom--radius); overflow: hidden; background: var(--wp--preset--color--mist); }
.its-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* 404, tìm kiếm */
.its-404.its-section { padding-block: clamp(80px, 12vw, 160px); }
.its-404__inner { display: grid; gap: 20px; max-width: 760px; }
.its-404__inner > * { margin: 0 !important; }
.its-search .wp-block-search__input { min-height: var(--wp--custom--tap-target); border-radius: var(--wp--custom--radius); }
.its-search-results__list { list-style: none; padding: 0; display: grid; gap: 24px; }
.its-result { display: grid; gap: 6px; padding-bottom: 20px; border-bottom: 1px solid var(--wp--preset--color--line); }
.its-result > * { margin: 0 !important; }
.its-result h3 a { color: var(--wp--preset--color--navy); text-decoration: none; }

/* ---------- 0.5.0 ---------- */
/* Đoạn dẫn trên nền navy nằm trong nội dung trang (vd: khối Team ở About): giữ màu chữ phụ trên nền navy. */
.wp-block-post-content :is(.has-navy-background-color, .has-navy-deep-background-color) .its-lead { color: var(--wp--preset--color--on-dark-muted); }

/* Quy trình triển khai – máy tính có chuột: chỉ hiện số và tên bước; rê chuột/Tab vào bước thì hiện mô tả.
   Mô tả vẫn giữ chỗ (ẩn bằng độ trong suốt) để trang không bị giật khi hiện ra. */
@media (min-width: 1025px) and (hover: hover) {
  .its-step { cursor: default; padding-inline: 12px; margin-inline: -12px; border-radius: 0 0 var(--wp--custom--radius) var(--wp--custom--radius); transition: background-color .2s ease, border-color .2s ease; outline: none; }
  .its-step p:not(.its-step__no) { opacity: 0; transform: translateY(-6px); transition: opacity .2s ease, transform .2s ease; }
  .its-step:hover, .its-step:focus-visible, .its-step:focus-within { background: var(--wp--preset--color--mist); border-top-color: var(--wp--preset--color--green); }
  .its-step:hover p:not(.its-step__no), .its-step:focus-visible p:not(.its-step__no), .its-step:focus-within p:not(.its-step__no) { opacity: 1; transform: none; }
  .its-step:focus-visible { box-shadow: inset 0 0 0 2px var(--wp--preset--color--green); }
  /* Bước 01 mở sẵn làm gợi ý; khi rê/Tab sang bước khác thì bước 01 thu lại. */
  .its-step:first-child { background: var(--wp--preset--color--mist); }
  .its-step:first-child p:not(.its-step__no) { opacity: 1; transform: none; }
  .its-process:is(:hover, :focus-within) .its-step:first-child:not(:hover, :focus-within) { background: transparent; border-top-color: var(--wp--preset--color--line); }
  .its-process:is(:hover, :focus-within) .its-step:first-child:not(:hover, :focus-within) p:not(.its-step__no) { opacity: 0; transform: translateY(-6px); }
}
@media (prefers-reduced-motion: reduce) { .its-step, .its-step p { transition: none !important; } }

/* Số liệu đếm tăng: giữ bề rộng cố định khi đang đếm. */
.its-stat__value { font-variant-numeric: tabular-nums; }

/* Trang bài viết tin tức: nội dung bên trái, cột "Recent news" bên phải – nhẹ, không nền riêng, cố định khi cuộn. */
.its-single-post .its-single__meta { display: flex !important; flex-wrap: wrap; gap: 4px 16px; align-items: center; font-size: var(--wp--preset--font-size--sm); }
.its-single-post .its-single__meta > * { margin: 0 !important; }
.its-single-post .its-single__meta .wp-block-post-date { color: var(--wp--preset--color--on-dark-muted); font-size: inherit; }
.its-single-post .its-single__content { max-width: 760px; }
.its-single-post .its-single__content img { max-width: 100%; height: auto; border-radius: var(--wp--custom--radius); }
.its-recent { display: grid; gap: 4px; min-width: 0; }
.its-recent > * { margin: 0 !important; }
@media (min-width: 1025px) { .its-recent { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 100px); } }
.its-recent__title { font-size: var(--wp--preset--font-size--xs) !important; text-transform: uppercase; letter-spacing: .12em; color: var(--wp--preset--color--muted); padding-bottom: 10px; border-bottom: 1px solid var(--wp--preset--color--line); }
.its-recent__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.its-recent__list > li { margin: 0; padding-block: 14px; border-bottom: 1px solid var(--wp--preset--color--line); }
.its-recent__item { display: grid !important; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: start; }
.its-recent__item > * { margin: 0 !important; }
.its-recent__item .wp-block-post-featured-image { margin: 0; width: 64px !important; height: 64px !important; }
.its-recent__item .wp-block-post-featured-image img { width: 64px !important; height: 64px !important; object-fit: cover; border-radius: var(--wp--custom--radius); }
.its-recent__text { display: grid; gap: 4px; min-width: 0; }
.its-recent__text > * { margin: 0 !important; }
.its-recent__text .wp-block-post-title { font-size: var(--wp--preset--font-size--sm); line-height: 1.4; font-weight: 600; }
.its-recent__text .wp-block-post-title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-recent__text .wp-block-post-title a:hover { color: var(--wp--preset--color--green-ink); text-decoration: underline; }

/* ---------- 0.6.0 ---------- */
/* Dòng phụ (Scope line) dưới tên dự án/hợp đồng */
.its-project__scope { font-size: var(--wp--preset--font-size--sm); line-height: 1.5; color: var(--wp--preset--color--on-dark-muted); }
.its-project__scope:empty, .its-contract__scope:empty { display: none; }
/* Hợp đồng "List only" ở trang Solution: chỉ chữ (không ảnh, không khung, không liên kết) */
.its-list-only .its-project__media, .its-list-only .its-project__facts { display: none !important; }
.its-list-only .its-project__title { font-size: var(--wp--preset--font-size--lg) !important; }
.its-list-only .its-project__title a { pointer-events: none; cursor: default; }
.its-contract__name { display: grid; gap: 2px; min-width: 0; }
.its-contract__name > * { margin: 0 !important; }
.its-contract__title { font-weight: 600 !important; }
.its-contract__scope { font-size: var(--wp--preset--font-size--xs); line-height: 1.5; color: var(--wp--preset--color--muted); }

/* Hiệu ứng xuất hiện khi cuộn tới (kiểu khối Reveal – chọn ở Styles; main.js gắn class).
   Không có JavaScript hoặc trong trình soạn thảo: hiện bình thường.
   Vẫn chạy khi máy bật "giảm chuyển động" (theo yêu cầu) vì chỉ là hiện dần + dịch 12px. */
.its-reveal-item { opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease !important; transition-delay: calc(var(--its-i, 0) * var(--its-step, 0s)) !important; }
.its-reveal.is-in .its-reveal-item, .its-reveal-item.is-in { opacity: 1; transform: none; }

/* Bảng All contracts: chia trang 20 dòng (project-filter.js) */
.its-filter { scroll-margin-top: calc(var(--wp-admin--admin-bar--height, 0px) + 96px); }
.its-pager { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; align-items: center; margin-top: 28px; }
.its-pager[hidden] { display: none; }
.its-pager button { font: inherit; font-size: var(--wp--preset--font-size--sm); min-width: var(--wp--custom--tap-target); min-height: var(--wp--custom--tap-target); padding: 0 12px; border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); background: #fff; color: var(--wp--preset--color--navy); cursor: pointer; }
.its-pager button:hover:not([disabled]):not([aria-current]) { border-color: var(--wp--preset--color--navy); }
.its-pager button[aria-current] { background: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--navy); color: #fff; font-weight: 600; cursor: default; }
.its-pager button[disabled] { opacity: .4; cursor: default; }
.its-pager__gap { padding: 0 4px; color: var(--wp--preset--color--muted); }

/* Khối "Our logo" (About): ký hiệu "its" lớn, 3 chú thích nối bằng đường mảnh (máy tính); xếp dọc trên điện thoại.
   Màu điểm nhấn lấy đúng 4 màu của logo – chỉ dùng trong khối này. */
.its-brand { --its-red: #EE3B33; --its-yellow: #F7D417; --its-green: #5DBB5B; --its-blue: #2E78BE;
  display: grid; gap: 28px; grid-template-areas: "head" "mark" "people" "quality" "colours"; }
.its-brand > * { margin: 0 !important; min-width: 0; }
.its-brand__head { grid-area: head; display: grid; gap: 10px; }
.its-brand__head > * { margin: 0 !important; }
.its-brand__mark { grid-area: mark; margin: 0; justify-self: center; width: min(240px, 60vw); }
.its-brand__mark img { width: 100%; height: auto; display: block; }
.its-brand__note { display: grid; gap: 2px; padding-left: 22px; position: relative; }
.its-brand__note > * { margin: 0 !important; }
.its-brand__note::before { content: ""; position: absolute; left: 0; top: .45em; width: 10px; height: 10px; border-radius: 50%; background: var(--its-dot); }
.its-brand__note--people { grid-area: people; --its-dot: var(--its-red); }
.its-brand__note--quality { grid-area: quality; --its-dot: var(--its-green); }
.its-brand__note--colours { grid-area: colours; --its-dot: conic-gradient(var(--its-red) 0 25%, var(--its-yellow) 0 50%, var(--its-green) 0 75%, var(--its-blue) 0); }
.its-brand__key { font-weight: 700; color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--lg); }
.its-brand__txt { color: var(--wp--preset--color--muted); }
@media (min-width: 1025px) {
  .its-brand { column-gap: 0; row-gap: 20px; align-items: center;
    grid-template-columns: minmax(0, 1fr) 340px minmax(0, 1fr);
    grid-template-areas: "head head head" "people mark quality" "people mark colours"; }
  .its-brand__head { text-align: center; justify-items: center; margin-bottom: 24px !important; }
  .its-brand__mark { width: 100%; padding-inline: 40px; }
  /* Chú thích bên trái: chữ căn phải, đường nối kéo về phía ký hiệu */
  .its-brand__note { padding: 0; max-width: 300px; }
  .its-brand__note::before { top: 50%; width: 64px; height: 2px; border-radius: 0; }
  .its-brand__note::after { content: ""; position: absolute; top: calc(50% - 4px); width: 10px; height: 10px; border-radius: 50%; background: var(--its-dot); }
  .its-brand__note--people { justify-self: end; text-align: right; padding-right: 84px; align-self: center; }
  .its-brand__note--people::before { left: auto; right: 12px; }
  .its-brand__note--people::after { right: 2px; }
  .its-brand__note--quality, .its-brand__note--colours { justify-self: start; padding-left: 84px; }
  .its-brand__note--quality { align-self: end; }
  .its-brand__note--colours { align-self: start; }
  .its-brand__note--quality::before, .its-brand__note--colours::before { left: 12px; }
  .its-brand__note--quality::after, .its-brand__note--colours::after { left: 2px; }
  .its-brand__note--colours::before { background: linear-gradient(90deg, var(--its-red) 0 25%, var(--its-yellow) 0 50%, var(--its-green) 0 75%, var(--its-blue) 0); }
}

/* Tin tuyển dụng đã hết hạn (its-core gắn class its-job-closed) */
/* Ẩn dòng thông tin trống (vd: Department chưa nhập) */
.its-spec:has(.its-spec__value:empty) { display: none; }
/* Hai dải liền nhau cùng nền trắng: bỏ khoảng đệm trên của dải sau để không bị hở gấp đôi */
.its-section:not(.has-background) + .its-section:not(.has-background) { padding-top: 0; }
/* Tin tuyển dụng không có hạn nộp: hiện "Ongoing" ở danh sách */

/* Lưới ảnh "Working at ITS" (Careers) và ảnh hiện trường ở trang Solution */
.its-photo-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1025px) { .its-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.its-photo-grid > * { margin: 0 !important; }
.its-photo img, .its-site-gallery img, .its-careers-gallery img { width: 100%; height: 100% !important; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--wp--custom--radius); display: block; }
.its-site-section .its-section-head { margin-bottom: 24px !important; }
.its-site-gallery, .its-careers-gallery { gap: 12px !important; }
@media (min-width: 1025px) { .its-site-gallery, .its-careers-gallery { gap: 16px !important; } }


/* ---------- 0.9.0 ---------- */
/* Tuyển dụng: lưới thẻ 3 cột – Chức danh / Phòng ban – Nơi làm việc / Hạn – Trạng thái */
.its-jobs__list { list-style: none; padding: 0; margin: 0; display: grid !important; gap: 20px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .its-jobs__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1025px) { .its-jobs__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
.its-jobs__list > li { margin: 0; min-width: 0; }
.its-job { position: relative; height: 100%; display: flex; flex-direction: column; gap: 10px; padding: 24px; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); border-top: 3px solid var(--wp--preset--color--green); border-radius: var(--wp--custom--radius); transition: box-shadow .2s ease, transform .2s ease; }
.its-job:hover { box-shadow: var(--wp--preset--shadow--menu); transform: translateY(-2px); }
.its-job > * { margin: 0 !important; }
.its-job__title { font-size: var(--wp--preset--font-size--heading-3); line-height: 1.3; }
.its-job__title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-job__title a::after { content: ""; position: absolute; inset: 0; } /* cả thẻ bấm được */
.its-job__title a:focus-visible { outline: none; }
.its-job:has(:focus-visible) { outline: 3px solid var(--wp--preset--color--green); outline-offset: 2px; }
.its-job__meta, .its-job__when { display: flex; flex-wrap: wrap; gap: 0 6px; font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-job__meta > *, .its-job__when > * { margin: 0 !important; }
.its-job__meta > :empty { display: none; }
.its-job__dept:not(:empty) + .its-job__loc:not(:empty)::before { content: "– "; }
.its-job__when { margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--wp--preset--color--line); align-items: center; }
.its-job__deadline { font-weight: 600; color: var(--wp--preset--color--navy); }
.its-job__deadline:empty::before { content: "Ongoing"; }
.its-job__status::before { content: "– Open"; font-weight: 600; color: var(--wp--preset--color--green-ink); }
.its-job-closed .its-job__status::before { content: "– Closed"; color: #B4531B; }
.its-job__more { font-size: var(--wp--preset--font-size--sm); font-weight: 600; color: var(--wp--preset--color--green-ink); }
.its-job__more::after { content: " →"; }

/* Sản phẩm – nhóm 1: giải pháp ITS (thẻ ảnh tràn, 3 cột) */
.its-solution-cards__list { list-style: none; padding: 0; margin: 0; display: grid !important; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .its-solution-cards__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; } }
@media (min-width: 1025px) { .its-solution-cards__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.its-solution-cards__list > li { margin: 0; min-width: 0; }
.its-solution-card { position: relative; height: 100%; display: flex; flex-direction: column; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); overflow: hidden; transition: box-shadow .2s ease, transform .2s ease; }
.its-solution-card:hover { box-shadow: var(--wp--preset--shadow--menu); transform: translateY(-3px); }
.its-solution-card > * { margin: 0 !important; }
.its-solution-card__img { margin: 0; overflow: hidden; }
.its-solution-card__img img { transition: transform .5s ease; }
.its-solution-card:hover .its-solution-card__img img { transform: scale(1.04); }
.its-solution-card__body { display: flex; flex-direction: column; gap: 10px; padding: 24px 28px 28px; flex: 1; }
.its-solution-card__body > * { margin: 0 !important; }
.its-solution-card__title { font-size: var(--wp--preset--font-size--heading-3); }
.its-solution-card__title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-solution-card__title a::after { content: ""; position: absolute; inset: 0; }
.its-solution-card__text { color: var(--wp--preset--color--muted); }
.its-solution-card__text .wp-block-post-excerpt__more-text { display: none; }
.its-solution-card__more { margin-top: auto !important; font-weight: 600; font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--green-ink); }
.its-solution-card__more::after { content: " →"; }

/* Sản phẩm – nhóm 2: thiết bị phân phối (thẻ logo hãng, 4 cột) */
.its-brand-cards__list { list-style: none; padding: 0; margin: 0; display: grid !important; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1025px) { .its-brand-cards__list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }
.its-brand-cards__list > li { margin: 0; min-width: 0; }
.its-brand-card { position: relative; height: 100%; display: flex; flex-direction: column; gap: 8px; padding: 20px; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.its-brand-card:hover { border-color: var(--wp--preset--color--green); box-shadow: var(--wp--preset--shadow--menu); transform: translateY(-2px); }
.its-brand-card > * { margin: 0 !important; }
.its-brand-card__logo { margin: 0 0 6px !important; }
.its-brand-card__logo img { padding: 8px 12px; }
.its-brand-card__brand { font-size: var(--wp--preset--font-size--xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--green-ink); }
.its-brand-card__brand:empty { display: none; }
.its-brand-card__title { font-size: var(--wp--preset--font-size--base); line-height: 1.35; }
.its-brand-card__title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-brand-card__title a::after { content: ""; position: absolute; inset: 0; }
.its-brand-card__text { font-size: var(--wp--preset--font-size--sm); color: var(--wp--preset--color--muted); }
.its-brand-card__text .wp-block-post-excerpt__more-text { display: none; }
@media (max-width: 767px) { .its-brand-card { padding: 14px; } .its-brand-card__text { display: none; } }
@media (prefers-reduced-motion: reduce) { .its-job, .its-solution-card, .its-brand-card, .its-solution-card__img img { transition: none !important; transform: none !important; } }
.its-job-closed-note { padding: 14px 18px; border-left: 4px solid #B4531B; background: var(--wp--preset--color--mist); color: var(--wp--preset--color--ink); }
/* Bảng thông số sản phẩm (its-core) */
.its-specs { margin: 0; }
.its-specs table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--sm); }
.its-specs th, .its-specs td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--wp--preset--color--line); vertical-align: top; }
.its-specs th { width: 40%; font-weight: 600; color: var(--wp--preset--color--navy); background: var(--wp--preset--color--mist); }

/* ---------- 0.9.3 ---------- */
/* Liên kết trên nền tối (đầu trang navy, dải navy, ảnh phủ navy, footer): khi rê chuột dùng #A9B8CC (chữ phụ trên nền navy) thay vì navy – tránh chìm vào nền. */
:is(.has-navy-background-color, .has-navy-deep-background-color, .wp-block-cover, .its-page-head, .its-hero, .its-footer) a:not(.wp-element-button):not(.wp-block-navigation__submenu-container a):is(:hover, :focus-visible) { color: var(--wp--preset--color--on-dark-muted) !important; }
/* Danh mục trong "Product details" */
.its-spec__terms a { color: var(--wp--preset--color--navy); text-decoration: none; }
.its-spec__terms a:hover { color: var(--wp--preset--color--green-ink); text-decoration: underline; }

/* ---------- 0.9.7 ---------- */
/* Viền focus chỉ hiện khi điều hướng bằng bàn phím; bấm chuột hoặc chạm không hiện khung. */
:where(a, button, .wp-element-button, .wp-block-button__link, [tabindex]):focus:not(:focus-visible) { outline: none; }
