/* Hallmark · khung chung toàn site v2 (14/10/2026) — đồng bộ với trang chủ mới (css/home-v2.css).
 * Gồm: token màu/chữ, footer tối, thanh "Nhận tư vấn" cố định đáy (điện thoại), đánh dấu mục menu đang xem.
 * Nạp ở MỌI trang (trừ 2 trang đích chạy quảng cáo có khung riêng). Tiền tố hv- giữ chung với trang chủ.
 * Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V4 */

:root {
    --hv-red: oklch(53% 0.207 22.3);            /* #C8102E */
    --hv-red-strong: oklch(45.5% 0.18 22.3);    /* #9B0D22 */
    --hv-red-deep: oklch(36% 0.14 21);
    --hv-red-light: oklch(74% 0.14 22);         /* chữ đỏ trên nền tối */
    --hv-on-red: oklch(98.5% 0.006 25);
    --hv-on-red-2: oklch(95% 0.02 22.3);        /* chữ phụ trên nền đỏ: 5,06:1 */
    --hv-ink: oklch(19% .012 20);
    --hv-ink-2: oklch(41% .012 20);
    --hv-muted: oklch(50% .01 25);
    --hv-rule: oklch(88% .012 25);
    --hv-paper: oklch(100% 0 0);
    --hv-paper-2: oklch(97.2% .008 25);
    --hv-wash: oklch(96.5% .018 22.3);          /* nền thẻ kiến thức */
    --hv-wash-2: oklch(94% .03 22.3);
    --hv-chip: oklch(100% 0 0 / .12);           /* nút dịch vụ trên nền đỏ */
    --hv-chip-2: oklch(100% 0 0 / .22);
    --hv-dark: oklch(16% .01 20);
    --hv-dark-2: oklch(26% .012 20);
    --hv-on-dark: oklch(97% .005 25);
    --hv-on-dark-2: oklch(80% .01 25);
    --hv-dark-rule: oklch(100% 0 0 / .1);
    --hv-shadow: oklch(20% .03 20 / .14);
    --hv-shadow-red: oklch(45.5% .18 22.3 / .32);
    --hv-font-d: 'Plus Jakarta Sans', 'Be Vietnam Pro', sans-serif;
    --hv-font-b: 'Be Vietnam Pro', 'Plus Jakarta Sans', sans-serif;
    --hv-ease: cubic-bezier(.22, 1, .36, 1);
    --hv-pop: cubic-bezier(.34, 1.56, .64, 1); /* nảy nhẹ khi thẻ hiện ra */
    /* KHÔNG dùng hoạ tiết logo lặp lại (chủ nhân chê "spam logo, xấu" 14/10/2026). Chữ A chỉ xuất hiện có chủ đích:
     * màn đầu 3D, đỉnh biểu đồ case, 1 chữ A lớn chìm ở footer. */
    --hv-mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 588 558'%3E%3Cpath d='M294 0L588 558H360V444L434 458L294 172L153 458L229 444V558H0Z'/%3E%3C/svg%3E");
}

/* Mục menu đang xem: aria-current="page" trên chính trang; aria-current="true" trên "Dịch vụ" khi đang ở trang con của nó */
.nav-links a[aria-current] { color: var(--cyan); }
.nav-links a[aria-current]::after { width: 100%; }
.hv-foot a:focus-visible, .hv-mbar a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

.marquee-wrap:hover .marquee-track { animation-play-state: paused; }

/* ════ 6 · Footer tối: hoạ tiết + chữ A lớn chìm ════ */
.hv-foot { position: relative; isolation: isolate; overflow: hidden; padding: 4.5rem 0 2rem; text-align: left; border-top: 0; background: linear-gradient(180deg, var(--hv-dark), var(--hv-dark) 45%, var(--hv-dark-2)); color: var(--hv-on-dark-2); }
.hv-foot__mark { position: absolute; z-index: -1; right: -6rem; bottom: -9rem; width: 34rem; aspect-ratio: 588 / 558; background: var(--hv-on-dark); opacity: .05; -webkit-mask: var(--hv-mark) center / contain no-repeat; mask: var(--hv-mark) center / contain no-repeat; pointer-events: none; }
.hv-foot__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.hv-foot__brand img { height: 30px; width: auto; }
.hv-foot p, .hv-foot li { color: var(--hv-on-dark-2); }
.hv-foot__brand p { margin: 1.1rem 0 0; max-width: 30ch; font-size: .92rem; line-height: 1.65; color: var(--hv-on-dark-2); }
.hv-foot__badges { margin-top: 1.1rem !important; font: 600 .82rem/1.5 var(--hv-font-d) !important; color: var(--hv-on-dark) !important; }
.hv-foot h4 { margin: 0 0 1.1rem; font: 700 1rem/1.3 var(--hv-font-d); color: var(--hv-on-dark); }
.hv-foot ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
.hv-foot li { font-size: .9rem; line-height: 1.55; }
.hv-foot a { color: var(--hv-on-dark-2); text-decoration: none; transition: color .25s, padding-left .25s var(--hv-ease); }
.hv-foot ul a:hover { color: var(--hv-red-light); padding-left: 4px; }
.hv-foot__lbl { display: block; font-size: .78rem; color: var(--hv-on-dark); font-weight: 600; }
.hv-foot__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem 1.5rem; margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--hv-dark-rule); font-size: .82rem; }
.hv-foot__bar p { margin: 0; }
.hv-foot__bar p + p { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.hv-foot__bar a { white-space: nowrap; }
.hv-foot__bar a:hover { color: var(--hv-on-dark); }


/* ════ Thanh nút đáy (điện thoại; chừa góc phải cho nút chat khach.me ở right 16px) ════ */
.hv-mbar { display: none; }
@media (max-width: 991px) {
    .hv-mbar { position: fixed; z-index: 90; left: 12px; right: 88px; bottom: calc(14px + env(safe-area-inset-bottom)); display: flex; align-items: center; gap: .5rem; padding: .4rem; border-radius: 999px; background: oklch(100% 0 0 / .94); border: 1px solid var(--hv-rule); box-shadow: 0 14px 34px -14px var(--hv-shadow); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transform: translateY(150%); transition: transform .45s var(--hv-ease); }
    .hv-mbar.is-on { transform: none; }
    .hv-mbar__call { flex: none; display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; background: var(--hv-wash); color: var(--hv-red-strong); }
    .hv-mbar__call svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
    .hv-mbar__cta { flex: 1; display: grid; place-items: center; min-height: 2.9rem; padding: 0 1rem; border-radius: 999px; background: var(--hv-red); color: var(--hv-on-red); font: 700 .95rem/1 var(--hv-font-d); white-space: nowrap; text-decoration: none; }
    body.has-mbar { padding-bottom: 84px; }
    .hv-foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hv-foot__brand { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
    .hv-foot__grid { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
}
@media (prefers-reduced-motion: reduce) { .hv-mbar { transition: none; } }