.vnat-app[data-page="faqs"] {
  --vfaq-paper: #faf7f2;
  --vfaq-paper-2: #f3eee6;
  --vfaq-ink: #1e1b18;
  --vfaq-mid: #404040;
  --vfaq-muted: #625b53;
  --vfaq-sep: #8c827a;
  --vfaq-border: #e4ddd3;
  --vfaq-divider: #f4ece7;
  --vfaq-brand: #8b1d1d;
  --vfaq-brand-deep: #500e0e;
  --vfaq-serif-display: 'Noto Serif Display', Georgia, serif;
  --vfaq-serif: 'Noto Serif', Georgia, serif;
  --vfaq-sans-display: 'Noto Sans Display', Arial, sans-serif;
  --vfaq-sans: 'Noto Sans', Arial, sans-serif;
  --vfaq-gutter: max(48px, calc((100% - 1280px) / 2 + 24px));

  background: var(--vfaq-paper);
  color: var(--vfaq-ink);
  font-family: var(--vfaq-sans);
}

.vnat-app[data-page="faqs"] *,
.vnat-app[data-page="faqs"] *::before,
.vnat-app[data-page="faqs"] *::after { box-sizing: border-box; }

.vnat-app[data-page="faqs"] [hidden] { display: none !important; }

.vnat-app[data-page="faqs"] .vfaq-breadcrumb { display: flex; align-items: center; gap: 8px; padding: 14px var(--vfaq-gutter); border: 1px solid var(--vfaq-border); border-right: 0; border-left: 0; background: var(--vfaq-paper); font-family: var(--vfaq-sans-display); font-size: 12px; font-stretch: 75%; font-weight: 600; letter-spacing: 1.2px; line-height: 16px; text-transform: uppercase; white-space: nowrap; }
.vnat-app[data-page="faqs"] .vfaq-breadcrumb a { color: var(--vfaq-muted); text-decoration: none; }
.vnat-app[data-page="faqs"] .vfaq-breadcrumb a:hover { text-decoration: underline; }
.vnat-app[data-page="faqs"] .vfaq-breadcrumb__sep { color: var(--vfaq-sep); }
.vnat-app[data-page="faqs"] .vfaq-breadcrumb__current { color: var(--vfaq-brand); }

.vnat-app[data-page="faqs"] .vfaq-head { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 48px var(--vfaq-gutter) 28px; background: var(--vfaq-paper); text-align: center; }
.vnat-app[data-page="faqs"] .vfaq-head h1 { margin: 0; color: var(--vfaq-ink); font-family: var(--vfaq-serif-display); font-size: 64px; font-stretch: 75%; font-weight: 800; letter-spacing: -1.28px; line-height: 70px; }
.vnat-app[data-page="faqs"] .vfaq-head__lead { max-width: 694px; margin: 0; color: var(--vfaq-muted); font-family: var(--vfaq-serif); font-size: 18px; font-weight: 400; line-height: 30px; }

.vnat-app[data-page="faqs"] .vfaq-search { display: flex; flex-direction: column; gap: 8px; width: 440px; max-width: 100%; text-align: left; }
.vnat-app[data-page="faqs"] .vfaq-search__field { display: flex; max-width: none; margin: 0; align-items: center; gap: 10px; height: 48px; padding: 0 8px 0 18px; overflow: clip; border: 1px solid var(--vfaq-border); border-radius: 9999px; background: #fff; cursor: text; }
.vnat-app[data-page="faqs"] .vfaq-search__field:focus-within,
.vnat-app[data-page="faqs"] .vfaq-search.is-open .vfaq-search__field { border-width: 1.5px; border-color: var(--vfaq-brand); }
.vnat-app[data-page="faqs"] .vfaq-search__field img { flex: none; width: 20px; height: 20px; }
.vnat-app[data-page="faqs"] .vfaq-search__field input { flex: 1 1 0; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--vfaq-ink); font-family: var(--vfaq-sans); font-size: 14px; font-weight: 400; line-height: 20px; -webkit-appearance: none; appearance: none; }
.vnat-app[data-page="faqs"] .vfaq-search__field input::placeholder { color: var(--vfaq-muted); opacity: 1; }
.vnat-app[data-page="faqs"] .vfaq-search__field input::-webkit-search-cancel-button { display: none; }

.vnat-app[data-page="faqs"] .vfaq-suggest { display: flex; flex-direction: column; gap: 10px; padding: 14px; overflow: clip; border: 1px solid var(--vfaq-border); border-radius: 16px; background: #fff; }
.vnat-app[data-page="faqs"] .vfaq-suggest__label { margin: 0; color: var(--vfaq-muted); font-family: var(--vfaq-sans-display); font-size: 12px; font-stretch: 75%; font-weight: 600; letter-spacing: 1.2px; line-height: 16px; text-transform: uppercase; }
.vnat-app[data-page="faqs"] .vfaq-suggest__list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; }
.vnat-app[data-page="faqs"] .vfaq-suggest__item { padding: 6px 12px; border: 0; border-radius: 9999px; background: var(--vfaq-paper-2); color: var(--vfaq-ink); font-family: var(--vfaq-sans); font-size: 12px; font-weight: 500; letter-spacing: .024px; line-height: 16px; text-align: left; cursor: pointer; }
.vnat-app[data-page="faqs"] .vfaq-suggest__item:hover { background: #ebe4d8; }

.vnat-app[data-page="faqs"] .vfaq-filters { display: flex; justify-content: center; padding: 12px var(--vfaq-gutter) 24px; background: var(--vfaq-paper); }
.vnat-app[data-page="faqs"] .vfaq-chips { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.vnat-app[data-page="faqs"] .vfaq-chip { position: relative; display: inline-flex; align-items: center; justify-content: center; height: 34px; padding: 0 17px; border: 1px solid var(--vfaq-brand); border-radius: 9999px; background: #fff; color: var(--vfaq-brand); font-family: var(--vfaq-sans-display); font-size: 12px; font-weight: 600; line-height: 16px; white-space: nowrap; cursor: pointer; }
.vnat-app[data-page="faqs"] .vfaq-chip:hover { background: #fdf6f4; }
.vnat-app[data-page="faqs"] .vfaq-chip.is-active { height: 32px; padding: 0 16px; overflow: hidden; border: 0; background: var(--vfaq-brand-deep); color: #fff; box-shadow: inset 0 2px 4px rgba(0, 0, 0, .05); }
.vnat-app[data-page="faqs"] .vfaq-chip.is-active::before { position: absolute; inset: 0; content: ''; background: url('../images/header-v2/btn-pattern.png') 0 0 / 77.25px 73.5px repeat; opacity: .25; pointer-events: none; }
.vnat-app[data-page="faqs"] .vfaq-chip:focus-visible,
.vnat-app[data-page="faqs"] .vfaq-item__head:focus-visible,
.vnat-app[data-page="faqs"] .vfaq-suggest__item:focus-visible { outline: 2px solid var(--vfaq-brand); outline-offset: 2px; }

.vnat-app[data-page="faqs"] .vfaq-body { padding: 8px var(--vfaq-gutter) 48px; background: var(--vfaq-paper); }
.vnat-app[data-page="faqs"] .vfaq-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; align-items: start; max-width: 1232px; margin: 0 auto; }
.vnat-app[data-page="faqs"] .vfaq-column { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.vnat-app[data-page="faqs"] .vfaq-columns.is-filtered { display: flex; flex-direction: column; align-items: stretch; gap: 32px; max-width: 880px; }
.vnat-app[data-page="faqs"] .vfaq-columns.is-filtered .vfaq-column { display: contents; }

.vnat-app[data-page="faqs"] .vfaq-group { display: flex; flex-direction: column; gap: 12px; }
.vnat-app[data-page="faqs"] .vfaq-group__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--vfaq-border); background: transparent; box-shadow: none; }
.vnat-app[data-page="faqs"] .vfaq-group__head h2 { margin: 0; color: var(--vfaq-ink); font-family: var(--vfaq-serif); font-size: 24px; font-stretch: 75%; font-weight: 600; line-height: 32px; }
.vnat-app[data-page="faqs"] .vfaq-group__head span { flex: none; color: var(--vfaq-muted); font-family: var(--vfaq-sans-display); font-size: 12px; font-stretch: 75%; font-weight: 600; letter-spacing: 1.2px; line-height: 16px; text-transform: uppercase; white-space: nowrap; }
.vnat-app[data-page="faqs"] .vfaq-group__list { display: flex; flex-direction: column; gap: 10px; }

.vnat-app[data-page="faqs"] .vfaq-item { padding: 16px 22px; border: 1px solid var(--vfaq-border); border-radius: 8px; background: #fff; }
.vnat-app[data-page="faqs"] .vfaq-item.is-open { padding-block: 18px; }
.vnat-app[data-page="faqs"] .vfaq-item__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 0; border: 0; background: transparent; color: var(--vfaq-ink); font: inherit; text-align: left; cursor: pointer; }
.vnat-app[data-page="faqs"] .vfaq-item__question { flex: 1 1 0; min-width: 0; font-family: var(--vfaq-serif); font-size: 18px; font-stretch: 75%; font-weight: 600; line-height: 24px; }
.vnat-app[data-page="faqs"] .vfaq-item__icon { flex: none; width: 10px; color: var(--vfaq-muted); font-family: var(--vfaq-sans); font-size: 16px; line-height: 24px; text-align: center; }
.vnat-app[data-page="faqs"] .vfaq-item__icon::before { content: '+'; }
.vnat-app[data-page="faqs"] .vfaq-item.is-open .vfaq-item__head,
.vnat-app[data-page="faqs"] .vfaq-item.is-open .vfaq-item__icon { color: var(--vfaq-brand); }
.vnat-app[data-page="faqs"] .vfaq-item.is-open .vfaq-item__icon::before { content: '\2212'; }

.vnat-app[data-page="faqs"] .vfaq-item__panel { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; }
.vnat-app[data-page="faqs"] .vfaq-item__panel::before { display: block; height: 1px; content: ''; background: var(--vfaq-divider); }
.vnat-app[data-page="faqs"] .vfaq-item__answer { color: var(--vfaq-mid); font-family: var(--vfaq-sans-display); font-size: 14px; font-weight: 400; line-height: 24px; overflow-wrap: anywhere; }
.vnat-app[data-page="faqs"] .vfaq-item__answer p { margin: 0; }
.vnat-app[data-page="faqs"] .vfaq-item__answer p + p { margin-top: 12px; }
.vnat-app[data-page="faqs"] .vfaq-item__answer a { color: inherit; text-decoration: underline; }
.vnat-app[data-page="faqs"] .vfaq-item__more { margin: 0; padding: 8px 12px; border-radius: 6px; background: var(--vfaq-paper-2); color: var(--vfaq-ink); font-family: var(--vfaq-sans-display); font-size: 12px; font-stretch: 75%; font-weight: 600; letter-spacing: 1.2px; line-height: 16px; text-transform: uppercase; white-space: pre-wrap; }
.vnat-app[data-page="faqs"] .vfaq-item__more a { color: inherit; text-decoration: underline; }

.vnat-app[data-page="faqs"] .vfaq-empty { max-width: 880px; margin: 0 auto; padding: 32px 0; color: var(--vfaq-muted); font-family: var(--vfaq-serif); font-size: 18px; line-height: 30px; text-align: center; }

@media (max-width: 991.98px) {
  .vnat-app[data-page="faqs"] { --vfaq-gutter: 24px; }
  .vnat-app[data-page="faqs"] .vfaq-columns { grid-template-columns: minmax(0, 1fr); max-width: 880px; }
  .vnat-app[data-page="faqs"] .vfaq-column { display: contents; }
  .vnat-app[data-page="faqs"] .vfaq-columns:not(.is-filtered) { display: flex; flex-direction: column; align-items: stretch; }
}

@media (max-width: 767.98px) {
  .vnat-app[data-page="faqs"] { --vfaq-gutter: 16px; }
  .vnat-app[data-page="faqs"] .vfaq-breadcrumb { overflow-x: auto; }
  .vnat-app[data-page="faqs"] .vfaq-head { gap: 12px; padding-top: 32px; padding-bottom: 20px; }
  .vnat-app[data-page="faqs"] .vfaq-head h1 { font-size: 44px; letter-spacing: -.88px; line-height: 50px; }
  .vnat-app[data-page="faqs"] .vfaq-head__lead { font-size: 16px; line-height: 26px; }
  .vnat-app[data-page="faqs"] .vfaq-filters { justify-content: flex-start; margin: 0; padding-bottom: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .vnat-app[data-page="faqs"] .vfaq-filters::-webkit-scrollbar { display: none; }
  .vnat-app[data-page="faqs"] .vfaq-chips { flex-wrap: nowrap; justify-content: flex-start; }
  .vnat-app[data-page="faqs"] .vfaq-group__head h2 { font-size: 22px; line-height: 30px; }
  .vnat-app[data-page="faqs"] .vfaq-item { padding: 14px 16px; }
  .vnat-app[data-page="faqs"] .vfaq-item.is-open { padding-block: 16px; }
  .vnat-app[data-page="faqs"] .vfaq-item__question { font-size: 17px; }
}
