.htai-article {
  --htai-a-bg: #05080b;
  --htai-a-surface: #0b141b;
  --htai-a-surface-2: #111c24;
  --htai-a-text: #ffffff;
  --htai-a-text-soft: #d8e0e6;
  --htai-a-muted: #a9b5bf;
  --htai-a-copper: #d4af37;
  --htai-a-copper-soft: #f0d47b;
  --htai-a-line: #293844;
  max-width: none;
  margin: 0 auto;
  border: 1px solid rgba(212, 175, 55, .18);
  border-radius: 16px;
  padding: clamp(24px, 4vw, 52px);
  background: linear-gradient(150deg, #05080b 0%, #0a1117 58%, #0d1820 100%);
  color: var(--htai-a-text) !important;
  font-family: "Be Vietnam Pro", Inter, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.72;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}
.htai-article *,
.htai-article *::before,
.htai-article *::after { box-sizing: border-box; }
.htai-article :where(p, li, td, blockquote, figcaption, summary, span, strong, em) { color: inherit; }
.htai-article__hero {
  margin: 0 0 42px;
  border: 1px solid rgba(212, 175, 55, .32);
  border-left: 5px solid var(--htai-a-copper);
  border-radius: 0 14px 14px 0;
  padding: 28px 32px;
  background: linear-gradient(135deg, #111c24, #091117);
  color: var(--htai-a-text) !important;
}
.htai-article__lead {
  max-width: 820px;
  margin: 0;
  color: var(--htai-a-text-soft) !important;
  font-size: 21px;
  line-height: 1.55;
}
.htai-article__toc {
  max-width: 920px;
  margin: 30px 0 46px;
  border: 1px solid var(--htai-a-line);
  border-radius: 12px;
  padding: 22px 26px;
  background: var(--htai-a-surface);
  color: var(--htai-a-text-soft) !important;
}
.htai-article__toc strong { display: block; margin-bottom: 8px; color: var(--htai-a-copper-soft) !important; }
.htai-article__toc ol,
.htai-article__toc ul { margin: 0; }
.htai-article__section { max-width: 920px; margin: 0 0 64px; }
.htai-article h2 {
  margin: 0 0 20px;
  color: var(--htai-a-text) !important;
  font-size: 36px;
  line-height: 1.25;
}
.htai-article h3 {
  margin: 30px 0 14px;
  color: var(--htai-a-copper-soft) !important;
  font-size: 27px;
  line-height: 1.35;
}
.htai-article h4 { color: var(--htai-a-text) !important; }
.htai-article p { margin: 0 0 20px; color: var(--htai-a-text-soft) !important; }
.htai-article ul,
.htai-article ol { margin: 0 0 24px; padding-left: 26px; color: var(--htai-a-text-soft) !important; }
.htai-article li { margin: 8px 0; }
.htai-article__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin: 24px 0;
}
.htai-article__card,
.htai-article__facts > div {
  border: 1px solid var(--htai-a-line);
  border-radius: 12px;
  padding: 24px;
  background: var(--htai-a-surface);
  color: var(--htai-a-text-soft) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .14);
}
.htai-article__card h3 { margin-top: 0; font-size: 23px; }
.htai-article__note {
  margin: 28px 0;
  border: 1px solid rgba(212, 175, 55, .28);
  border-left: 4px solid var(--htai-a-copper);
  border-radius: 0 10px 10px 0;
  padding: 18px 22px;
  background: rgba(212, 175, 55, .09);
  color: var(--htai-a-text-soft) !important;
}
.htai-article__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0 34px;
}
.htai-article__media { max-width: 920px; margin: 34px 0 52px; }
.htai-article__media img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(212, 175, 55, .22);
  border-radius: 12px;
  background: #0a0f13;
}
.htai-article__media figcaption { margin-top: 8px; color: var(--htai-a-muted) !important; font-size: 14px; line-height: 1.5; }
.htai-article table,
.htai-article__specs {
  width: 100%;
  margin: 24px 0;
  border-collapse: collapse;
  border: 1px solid var(--htai-a-line);
  background: var(--htai-a-surface);
  color: var(--htai-a-text-soft) !important;
  font-size: 16px;
}
.htai-article th,
.htai-article td { border: 1px solid var(--htai-a-line); padding: 12px 14px; text-align: left; vertical-align: top; color: inherit !important; }
.htai-article th { background: #122430; color: var(--htai-a-text) !important; }
.htai-article tr:nth-child(even) td { background: rgba(255, 255, 255, .02); }
.htai-article__faq details {
  margin-bottom: 12px;
  border: 1px solid var(--htai-a-line);
  border-radius: 10px;
  padding: 0 18px;
  background: var(--htai-a-surface);
  color: var(--htai-a-text-soft) !important;
}
.htai-article__faq summary {
  min-height: 54px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: var(--htai-a-text) !important;
  font-weight: 700;
}
.htai-article__faq details > *:not(summary) { margin-left: 0; margin-right: 0; }
.htai-article__cta {
  max-width: 960px;
  margin: 64px 0 10px;
  border: 1px solid rgba(212, 175, 55, .38);
  border-radius: 14px;
  padding: 34px;
  background: linear-gradient(135deg, #101c24, #071116);
  color: var(--htai-a-text) !important;
}
.htai-article__cta h2,
.htai-article__cta h3,
.htai-article__cta p { color: var(--htai-a-text) !important; }
.htai-article__cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}
.htai-article__cta a {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 12px 20px;
  background: var(--htai-a-copper);
  color: #071116 !important;
  font-weight: 750;
  text-decoration: none !important;
}
.htai-article__cta a + a {
  border: 1px solid rgba(240, 212, 123, .72);
  background: transparent;
  color: var(--htai-a-copper-soft) !important;
}
.htai-article a { color: var(--htai-a-copper-soft) !important; text-underline-offset: 3px; }
.htai-article a:hover { color: #fff2b6 !important; }
.htai-article blockquote { border-left: 4px solid var(--htai-a-copper); margin-left: 0; padding-left: 20px; color: var(--htai-a-text-soft) !important; }

@media (max-width: 767px) {
  .htai-article { border-radius: 10px; padding: 22px 18px; font-size: 17px; line-height: 1.65; }
  .htai-article__hero { margin-bottom: 32px; padding: 22px 20px; }
  .htai-article__lead { font-size: 19px; }
  .htai-article h2 { font-size: 28px; line-height: 1.3; }
  .htai-article h3 { font-size: 23px; }
  .htai-article__section { margin-bottom: 48px; }
  .htai-article__grid,
  .htai-article__facts { grid-template-columns: 1fr; }
  .htai-article__card { padding: 20px; }
  .htai-article table { display: block; overflow-x: auto; }
  .htai-article__cta { padding: 26px 20px; }
  .htai-article__cta-actions { display: grid; grid-template-columns: 1fr; }
  .htai-article__cta a { width: 100%; }
}


/* Multi-image groups generated by AI Sales Support 1.5.4 */
.htai-article__gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 22px 0;
}
.htai-article__gallery figure {
  margin: 0;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(214, 170, 109, .24);
  border-radius: 12px;
  background: #111f26;
}
.htai-article__gallery img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.htai-article__gallery figcaption {
  padding: 9px 12px;
  color: #eaeaea;
  font-size: 14px;
  line-height: 1.45;
}
@media (max-width: 640px) {
  .htai-article__gallery { grid-template-columns: 1fr; }
}

/*
 * Hà Tiên AI Website Author — HTML contract v3 / 2026.
 * Legacy articles keep their original presentation. Only new output carrying
 * .ht-ai-contract-v3 receives the 2026 reading-width and accessibility system.
 */
.ht-ai-contract-v3.htai-article {
  --ht26-ink: #172026;
  --ht26-muted: #4b5b63;
  --ht26-navy: #0b2a4a;
  --ht26-dark: #071116;
  --ht26-bronze: #c4975c;
  --ht26-gold: #d7ad72;
  --ht26-surface: #f4f6f7;
  --ht26-border: #d5dde1;
  --ht26-reading: 800px;
  --ht26-form: 960px;
  --ht26-container: 100%;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin-inline: auto;
  border: 0;
  border-radius: 0;
  padding: clamp(48px, 6vw, 96px) clamp(20px, 3vw, 32px);
  background: #fff;
  color: var(--ht26-ink) !important;
  font-family: "Be Vietnam Pro", Inter, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.67;
  box-shadow: none;
}

.ht-ai-contract-v3.htai-article :where(p, li, td, th, blockquote, summary, span, strong, em) {
  color: inherit;
}

.ht-ai-contract-v3 .htai-article__hero {
  max-width: var(--ht26-form);
  margin: 0 auto 64px;
  border: 1px solid var(--ht26-border);
  border-left: 5px solid var(--ht26-bronze);
  border-radius: 8px;
  padding: clamp(28px, 4vw, 48px);
  background: var(--ht26-surface);
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3 .htai-article__eyebrow,
.ht-ai-contract-v3 .htai-article__section-label {
  display: block;
  margin: 0 0 12px;
  color: var(--ht26-navy) !important;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.ht-ai-contract-v3 .htai-article__lead {
  max-width: var(--ht26-reading);
  margin: 0;
  color: var(--ht26-ink) !important;
  font-size: 20px;
  line-height: 1.6;
  font-weight: 450;
}

.ht-ai-contract-v3 .htai-article__reading,
.ht-ai-contract-v3 .htai-article__toc {
  width: min(100%, var(--ht26-reading));
  max-width: var(--ht26-reading);
  margin-inline: auto;
}

.ht-ai-contract-v3 .htai-article__toc {
  margin-top: 0;
  margin-bottom: 64px;
  border: 1px solid var(--ht26-border);
  border-radius: 8px;
  padding: 24px 28px;
  background: var(--ht26-surface);
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3 .htai-article__toc strong {
  color: var(--ht26-navy) !important;
}

.ht-ai-contract-v3 .htai-article__section {
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 0 auto 96px;
}

.ht-ai-contract-v3 .htai-article__wide {
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin-inline: auto;
}

/* Long-form text is deterministic: it cannot stretch across the full page. */
.ht-ai-contract-v3 .htai-article__section > p,
.ht-ai-contract-v3 .htai-article__section > h2,
.ht-ai-contract-v3 .htai-article__section > h3,
.ht-ai-contract-v3 .htai-article__section > h4,
.ht-ai-contract-v3 .htai-article__section > ul,
.ht-ai-contract-v3 .htai-article__section > ol,
.ht-ai-contract-v3 .htai-article__section > blockquote,
.ht-ai-contract-v3 .htai-article__section > .htai-article__note,
.ht-ai-contract-v3 .htai-article__section > .htai-article__reading {
  width: min(100%, var(--ht26-reading));
  max-width: var(--ht26-reading);
  margin-left: auto;
  margin-right: auto;
}

.ht-ai-contract-v3.htai-article h2 {
  margin-top: 0;
  margin-bottom: 24px;
  color: var(--ht26-dark) !important;
  font-size: clamp(32px, 3vw, 36px);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: -.015em;
}

.ht-ai-contract-v3.htai-article h3 {
  margin-top: 32px;
  margin-bottom: 16px;
  color: var(--ht26-navy) !important;
  font-size: clamp(24px, 2.4vw, 28px);
  line-height: 1.29;
  font-weight: 700;
}

.ht-ai-contract-v3.htai-article h4 {
  margin: 24px 0 12px;
  color: var(--ht26-dark) !important;
  font-size: 22px;
  line-height: 1.36;
  font-weight: 650;
}

.ht-ai-contract-v3.htai-article p {
  margin: 0 0 20px;
  color: var(--ht26-ink) !important;
  font-size: 18px;
  line-height: 1.67;
}

.ht-ai-contract-v3.htai-article ul,
.ht-ai-contract-v3.htai-article ol {
  margin-top: 0;
  margin-bottom: 24px;
  padding-left: 28px;
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3.htai-article li {
  margin: 8px 0;
  font-size: 18px;
  line-height: 1.67;
}

.ht-ai-contract-v3 .htai-article__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 32px auto;
}

.ht-ai-contract-v3 .htai-article__grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ht-ai-contract-v3 .htai-article__grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ht-ai-contract-v3 .htai-article__card,
.ht-ai-contract-v3 .htai-article__facts > div,
.ht-ai-contract-v3 .htai-article__step {
  border: 1px solid var(--ht26-border);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  color: var(--ht26-ink) !important;
  box-shadow: 0 4px 18px rgba(7, 17, 22, .07);
}

.ht-ai-contract-v3 .htai-article__card h3,
.ht-ai-contract-v3 .htai-article__step h3 {
  margin-top: 0;
  font-size: 23px;
  line-height: 1.35;
}

.ht-ai-contract-v3 .htai-article__note {
  margin-top: 28px;
  margin-bottom: 28px;
  border: 1px solid var(--ht26-border);
  border-left: 4px solid var(--ht26-bronze);
  border-radius: 6px;
  padding: 20px 24px;
  background: var(--ht26-surface);
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3 .htai-article__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  width: min(100%, var(--ht26-form));
  max-width: var(--ht26-form);
  margin: 32px auto 48px;
}

.ht-ai-contract-v3 .htai-article__process {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 32px auto;
}

.ht-ai-contract-v3 .htai-article__media-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 48px;
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 40px auto;
}

.ht-ai-contract-v3 .htai-article__media {
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 40px auto 56px;
}

.ht-ai-contract-v3 .htai-article__media img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--ht26-border);
  border-radius: 8px;
  background: var(--ht26-surface);
}

.ht-ai-contract-v3 .htai-article__media figcaption,
.ht-ai-contract-v3 .htai-article__gallery figcaption {
  margin-top: 8px;
  color: var(--ht26-muted) !important;
  font-size: 14px;
  line-height: 20px;
}

.ht-ai-contract-v3 .htai-article__gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  width: min(100%, var(--ht26-container));
  max-width: var(--ht26-container);
  margin: 32px auto 56px;
}

.ht-ai-contract-v3 .htai-article__gallery figure {
  border-color: var(--ht26-border);
  border-radius: 8px;
  background: #fff;
}

.ht-ai-contract-v3 .htai-article__gallery figcaption {
  padding: 10px 12px 12px;
}

.ht-ai-contract-v3 .htai-article__table-wrap {
  width: min(100%, var(--ht26-form));
  max-width: var(--ht26-form);
  margin: 32px auto 48px;
  overflow-x: auto;
  border: 1px solid var(--ht26-border);
  border-radius: 8px;
  background: #fff;
  -webkit-overflow-scrolling: touch;
}

.ht-ai-contract-v3.htai-article table,
.ht-ai-contract-v3.htai-article .htai-article__specs {
  width: 100%;
  min-width: 640px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: #fff;
  color: var(--ht26-ink) !important;
  font-size: 16px;
}

.ht-ai-contract-v3.htai-article th,
.ht-ai-contract-v3.htai-article td {
  border: 0;
  border-bottom: 1px solid var(--ht26-border);
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3.htai-article th {
  background: var(--ht26-navy);
  color: #fff !important;
  font-weight: 650;
}

.ht-ai-contract-v3.htai-article tr:nth-child(even) td {
  background: var(--ht26-surface);
}

.ht-ai-contract-v3 .htai-article__faq {
  width: min(100%, var(--ht26-form));
  max-width: var(--ht26-form);
  margin: 0 auto 80px;
}

.ht-ai-contract-v3 .htai-article__faq details {
  margin-bottom: 12px;
  border: 1px solid var(--ht26-border);
  border-radius: 8px;
  padding: 0 20px;
  background: #fff;
  color: var(--ht26-ink) !important;
}

.ht-ai-contract-v3 .htai-article__faq summary {
  min-height: 56px;
  color: var(--ht26-dark) !important;
  font-size: 21px;
  line-height: 30px;
  font-weight: 650;
}

.ht-ai-contract-v3 .htai-article__cta {
  width: min(100%, var(--ht26-form));
  max-width: var(--ht26-form);
  margin: 80px auto 0;
  border: 1px solid rgba(215, 173, 114, .45);
  border-radius: 8px;
  padding: clamp(28px, 4vw, 48px);
  background: var(--ht26-dark);
  color: #fff !important;
}

.ht-ai-contract-v3 .htai-article__cta h2,
.ht-ai-contract-v3 .htai-article__cta h3,
.ht-ai-contract-v3 .htai-article__cta p {
  max-width: var(--ht26-reading);
  color: #fff !important;
}

.ht-ai-contract-v3 .htai-article__cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.ht-ai-contract-v3 .htai-article__cta a {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 14px 24px;
  background: var(--ht26-gold);
  color: var(--ht26-dark) !important;
  font-size: 17px;
  line-height: 24px;
  font-weight: 700;
  text-decoration: none !important;
}

.ht-ai-contract-v3 .htai-article__cta a + a {
  border: 1px solid var(--ht26-gold);
  background: transparent;
  color: #fff !important;
}

.ht-ai-contract-v3.htai-article a {
  color: var(--ht26-navy) !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.ht-ai-contract-v3.htai-article a:hover,
.ht-ai-contract-v3.htai-article a:focus-visible {
  color: #061c32 !important;
  text-decoration: underline;
}

.ht-ai-contract-v3.htai-article a:focus-visible,
.ht-ai-contract-v3.htai-article summary:focus-visible {
  outline: 3px solid var(--ht26-gold);
  outline-offset: 3px;
}

.ht-ai-contract-v3.htai-article blockquote {
  border-left: 4px solid var(--ht26-bronze);
  margin-left: auto;
  padding: 8px 0 8px 22px;
  color: var(--ht26-ink) !important;
}

@media (max-width: 1023px) {
  .ht-ai-contract-v3 .htai-article__grid--3,
  .ht-ai-contract-v3 .htai-article__grid--4,
  .ht-ai-contract-v3 .htai-article__process {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/*
 * HTML Contract v4.3 — full-width sections, 800 px reading rhythm and
 * contrast-safe surfaces. This final layer intentionally overrides the older
 * 1,180/1,200 px and dark-only rules while retaining their class compatibility.
 */
.ht-ai-contract-v3.htai-article.ht-ai-article,
.ht-ai-contract-v4.htai-article.ht-ai-article {
  --ht-ai-reading: 800px;
  --ht-ai-gutter: clamp(20px, 3vw, 48px);
  --ht-ai-surface-bg: #071116;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-surface-muted: #edf2f3;
  --ht-ai-card-bg: #12212a;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #0b2a4a;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
  overflow-x: clip;
  background: #071116 !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-wide, .htai-article__wide, .ht-ai-hero, .htai-article__hero,
    .ht-ai-media, .htai-article__media, .ht-ai-gallery, .htai-article__gallery,
    .ht-ai-grid, .htai-article__grid, .ht-ai-process, .htai-article__process,
    .ht-ai-facts, .htai-article__facts, .ht-ai-table-wrap, .htai-article__table-wrap,
    .ht-ai-cta-panel, .htai-article__cta),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-wide, .htai-article__wide, .ht-ai-hero, .htai-article__hero,
    .ht-ai-media, .htai-article__media, .ht-ai-gallery, .htai-article__gallery,
    .ht-ai-grid, .htai-article__grid, .ht-ai-process, .htai-article__process,
    .ht-ai-facts, .htai-article__facts, .ht-ai-table-wrap, .htai-article__table-wrap,
    .ht-ai-cta-panel, .htai-article__cta) {
  width: 100% !important;
  max-width: none !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section),
.ht-ai-contract-v4.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(56px, 6vw, 96px) var(--ht-ai-gutter) !important;
  box-sizing: border-box;
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

/* Stored fragments without new surface classes still alternate deterministically. */
.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n + 1),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n + 1),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--cobalt,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--cobalt {
  --ht-ai-surface-bg: #0b2a4a;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-surface-muted: #edf2f3;
  --ht-ai-card-bg: #071116;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #071116;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n + 2),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n + 2),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--charcoal,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--charcoal {
  --ht-ai-surface-bg: #20282e;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-surface-muted: #edf2f3;
  --ht-ai-card-bg: #0f1a20;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #0b2a4a;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--black,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--black {
  --ht-ai-surface-bg: #071116;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-surface-muted: #edf2f3;
  --ht-ai-card-bg: #12212a;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #0b2a4a;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--light,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--light {
  --ht-ai-surface-bg: #f4f6f7;
  --ht-ai-surface-fg: #172026;
  --ht-ai-surface-muted: #4b5b63;
  --ht-ai-card-bg: #ffffff;
  --ht-ai-card-fg: #172026;
  --ht-ai-action-bg: #071116;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: #9a6c34;
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

/* One-column prose is centered as a block; its text remains left-aligned. */
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-reading, .htai-article__reading),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-reading, .htai-article__reading) {
  width: 100% !important;
  max-width: 800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: left !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-contract-v4.htai-article.ht-ai-article
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-contract-v3.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section)
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-contract-v4.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section)
  > :where(h2, h3, h4, p, ul, ol, blockquote) {
  width: 100% !important;
  max-width: 800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: left !important;
}

/* In multi-column rows each prose block starts at the left edge of its column. */
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-process, .htai-article__process, .ht-ai-facts, .htai-article__facts)
  :where(.ht-ai-reading, .htai-article__reading),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-process, .htai-article__process, .ht-ai-facts, .htai-article__facts)
  :where(.ht-ai-reading, .htai-article__reading) {
  max-width: min(100%, 800px) !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  justify-self: start !important;
  text-align: left !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-process, .htai-article__process, .ht-ai-facts, .htai-article__facts)
  :where(.ht-ai-card, .htai-article__card, .ht-ai-step, .htai-article__step, div, aside)
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-process, .htai-article__process, .ht-ai-facts, .htai-article__facts)
  :where(.ht-ai-card, .htai-article__card, .ht-ai-step, .htai-article__step, div, aside)
  > :where(h2, h3, h4, p, ul, ol, blockquote) {
  width: 100% !important;
  max-width: 800px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  text-align: left !important;
}

/* A row with only one card uses the single-column centered reading rhythm. */
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child {
  grid-column: 1 / -1;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child
  :where(.ht-ai-reading, .htai-article__reading),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child
  :where(.ht-ai-reading, .htai-article__reading),
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-grid, .htai-article__grid) > :where(.ht-ai-card, .htai-article__card):only-child
  > :where(h2, h3, h4, p, ul, ol, blockquote) {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Each component inherits a complete foreground/background pair from its section. */
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step,
    .ht-ai-faq details, .htai-article__faq details),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step,
    .ht-ai-faq details, .htai-article__faq details) {
  border: 1px solid var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-card-bg) !important;
  color: var(--ht-ai-card-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap, table, .ht-ai-table, .htai-article__specs),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap, table, .ht-ai-table, .htai-article__specs) {
  border-color: var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-card-bg) !important;
  color: var(--ht-ai-card-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-card, .htai-article__card,
    .ht-ai-faq, .htai-article__faq, .ht-ai-table-wrap, .htai-article__table-wrap)
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-card, .htai-article__card,
    .ht-ai-faq, .htai-article__faq, .ht-ai-table-wrap, .htai-article__table-wrap)
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a {
  border: 1px solid var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-action-bg) !important;
  color: var(--ht-ai-action-fg) !important;
  -webkit-text-fill-color: var(--ht-ai-action-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-actions, .htai-article__cta-actions),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-actions, .htai-article__cta-actions) {
  width: 100% !important;
  max-width: 800px !important;
  margin-inline: auto !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-faq, .htai-article__faq),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-faq, .htai-article__faq) {
  max-width: 800px !important;
  margin-inline: auto !important;
}

@media (max-width: 767px) {
  .ht-ai-contract-v3.htai-article.ht-ai-article
    > :where(.ht-ai-section, .htai-article__section),
  .ht-ai-contract-v4.htai-article.ht-ai-article
    > :where(.ht-ai-section, .htai-article__section) {
    padding: 56px 20px !important;
  }
}

/* Stored 1.x fragments without a contract marker receive the same geometry. */
.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) {
  --ht-ai-reading: 800px;
  --ht-ai-gutter: clamp(20px, 3vw, 48px);
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding: 0 !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(.htai-article__wide, .ht-ai-wide) {
  width: 100% !important;
  max-width: none !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  > :where(.htai-article__section, .ht-ai-section) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(56px, 6vw, 96px) var(--ht-ai-gutter) !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(.htai-article__reading, .ht-ai-reading),
.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  > :where(h2, h3, h4, p, ul, ol, blockquote),
.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  > :where(.htai-article__section, .ht-ai-section)
  > :where(h2, h3, h4, p, ul, ol, blockquote) {
  width: 100% !important;
  max-width: 800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: left !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(.htai-article__grid, .ht-ai-grid, .htai-article__media-split, .ht-ai-media-split)
  :where(.htai-article__reading, .ht-ai-reading) {
  margin-left: 0 !important;
  margin-right: auto !important;
  justify-self: start !important;
}

/* Legacy fragments without a contract marker follow the same dark-only palette. */
.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) {
  --ht26-dark: #071116;
  --ht26-navy: #0b2a4a;
  --ht26-gold: #d6aa6d;
  --ht26-gold-icon: #ffffff;
  --ht26-gold-line: rgba(214, 170, 109, .72);
  --ht26-card-shadow: 0 14px 34px rgba(0, 0, 0, .28), 0 3px 10px rgba(0, 0, 0, .18);
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  color-scheme: dark;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td) {
  background-color: transparent !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(.htai-article__hero, .htai-article__toc, .htai-article__note,
    .htai-article__card, .htai-article__facts > div, .htai-article__step,
    .htai-article__faq details, .htai-article__gallery figure,
    .htai-article__cta) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
  box-shadow: var(--ht26-card-shadow) !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(.htai-article__media img, .htai-article__gallery img) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  :where(table, .htai-article__specs) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) th {
  border-color: var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) td {
  border-color: var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) tr:nth-child(even) td {
  background: var(--ht26-navy) !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration-color: var(--ht26-gold) !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4) ul > li::before {
  color: currentColor !important;
  -webkit-text-fill-color: currentColor !important;
}

.htai-article:not(.ht-ai-contract-v3):not(.ht-ai-contract-v4)
  .htai-article__cta a {
  border: 1px solid var(--ht26-gold) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

@media (max-width: 767px) {
  .ht-ai-contract-v3.htai-article {
    width: 100%;
    border-radius: 0;
    padding: 56px 20px;
    font-size: 17px;
    line-height: 1.65;
  }

  .ht-ai-contract-v3 .htai-article__hero {
    margin-bottom: 48px;
    padding: 24px 20px;
  }

  .ht-ai-contract-v3 .htai-article__lead {
    font-size: 19px;
    line-height: 1.58;
  }

  .ht-ai-contract-v3 .htai-article__section {
    margin-bottom: 56px;
  }

  .ht-ai-contract-v3.htai-article h2 {
    margin-bottom: 20px;
    font-size: 28px;
    line-height: 1.286;
  }

  .ht-ai-contract-v3.htai-article h3 {
    font-size: 23px;
    line-height: 1.35;
  }

  .ht-ai-contract-v3.htai-article h4 {
    font-size: 20px;
    line-height: 1.4;
  }

  .ht-ai-contract-v3.htai-article p,
  .ht-ai-contract-v3.htai-article li {
    font-size: 17px;
    line-height: 1.65;
  }

  .ht-ai-contract-v3 .htai-article__grid,
  .ht-ai-contract-v3 .htai-article__grid--3,
  .ht-ai-contract-v3 .htai-article__grid--4,
  .ht-ai-contract-v3 .htai-article__facts,
  .ht-ai-contract-v3 .htai-article__process,
  .ht-ai-contract-v3 .htai-article__media-split,
  .ht-ai-contract-v3 .htai-article__gallery {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .ht-ai-contract-v3 .htai-article__card,
  .ht-ai-contract-v3 .htai-article__facts > div,
  .ht-ai-contract-v3 .htai-article__step {
    padding: 20px;
  }

  .ht-ai-contract-v3 .htai-article__faq summary {
    font-size: 20px;
    line-height: 28px;
  }

  .ht-ai-contract-v3 .htai-article__cta {
    margin-top: 64px;
    padding: 28px 20px;
  }

  .ht-ai-contract-v3 .htai-article__cta-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ht-ai-contract-v3 .htai-article__cta a {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ht-ai-contract-v3 *,
  .ht-ai-contract-v3 *::before,
  .ht-ai-contract-v3 *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Hà Tiên AI Authoring Contract v3 — new-class aliases and legacy fallback. */
.ht-ai-article,
.htai-article {
  --ht-ai-container: 100%;
  --ht-ai-reading: 800px;
  --ht-ai-form: 960px;
  --ht-ai-gutter: 32px;
  --ht-ai-section-space: 96px;
  width: 100%;
  max-width: none;
  margin-inline: auto;
  font-size: 18px;
  line-height: 1.67;
  overflow-wrap: anywhere;
}

.ht-ai-article :where(p, li) {
  font-size: inherit;
  line-height: inherit;
}

.ht-ai-reading {
  width: 100%;
  max-width: var(--ht-ai-reading);
  margin-inline: auto;
}

.ht-ai-wide {
  width: 100%;
  max-width: var(--ht-ai-container);
  margin-inline: auto;
}

.ht-ai-section,
.htai-article__section {
  width: 100%;
  max-width: none;
  margin: 0 auto var(--ht-ai-section-space);
}

/* Fallback protection for legacy/generated blocks missing a reading wrapper. */
.ht-ai-article > :where(h2, h3, h4, p, ul, ol, blockquote),
.htai-article > :where(h2, h3, h4, p, ul, ol, blockquote),
.ht-ai-section > :where(h2, h3, h4, p, ul, ol, blockquote),
.htai-article__section > :where(h2, h3, h4, p, ul, ol, blockquote) {
  width: 100%;
  max-width: var(--ht-ai-reading);
  margin-inline: auto;
}

.ht-ai-hero,
.htai-article__hero {
  width: 100%;
  max-width: var(--ht-ai-container);
  margin-inline: auto;
}

.ht-ai-hero > :where(h2, h3, p, ul, ol),
.htai-article__hero > :where(h2, h3, p, ul, ol),
.ht-ai-lead,
.htai-article__lead {
  width: 100%;
  max-width: var(--ht-ai-reading);
  margin-inline: auto;
}

.ht-ai-lead,
.htai-article__lead {
  font-size: 20px;
  line-height: 1.6;
}

.ht-ai-toc,
.htai-article__toc {
  width: 100%;
  max-width: var(--ht-ai-reading);
  margin-inline: auto;
}

.ht-ai-grid,
.htai-article__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.ht-ai-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ht-ai-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ht-ai-card,
.htai-article__card {
  min-width: 0;
  padding: 28px;
}

.ht-ai-media-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 32px;
}

.ht-ai-media,
.ht-ai-gallery,
.htai-article__media,
.htai-article__gallery {
  width: 100%;
  max-width: var(--ht-ai-container);
  margin-inline: auto;
}

.ht-ai-process {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.ht-ai-step {
  min-width: 0;
  border: 1px solid var(--htai-a-line);
  border-radius: 8px;
  padding: 28px;
  background: var(--htai-a-surface);
}

.ht-ai-facts,
.htai-article__facts {
  width: 100%;
  max-width: var(--ht-ai-container);
  margin-inline: auto;
}

.ht-ai-table-wrap {
  width: 100%;
  max-width: var(--ht-ai-container);
  margin: 24px auto 40px;
}

.ht-ai-table,
.ht-ai-table-wrap table {
  width: 100%;
  margin: 0;
  font-size: 17px;
  line-height: 1.55;
}

.ht-ai-faq,
.htai-article__faq {
  width: 100%;
  max-width: var(--ht-ai-form);
  margin-inline: auto;
}

.ht-ai-faq summary,
.htai-article__faq summary {
  min-height: 52px;
  font-size: 21px;
  line-height: 1.43;
}

.ht-ai-cta-panel,
.htai-article__cta {
  width: 100%;
  max-width: var(--ht-ai-form);
  margin: var(--ht-ai-section-space) auto 10px;
}

.ht-ai-cta-actions,
.htai-article__cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start;
}

.ht-ai-cta-button,
.htai-article__cta a {
  min-height: 52px;
  font-size: 17px;
  line-height: 24px;
}

.ht-ai-article a:focus-visible,
.htai-article a:focus-visible,
.ht-ai-article summary:focus-visible,
.htai-article summary:focus-visible {
  outline: 3px solid var(--htai-a-copper-soft);
  outline-offset: 3px;
}

@media (max-width: 1023px) {
  .ht-ai-article,
  .htai-article {
    --ht-ai-gutter: 24px;
    --ht-ai-section-space: 72px;
  }

  .ht-ai-grid--3,
  .ht-ai-grid--4,
  .ht-ai-process { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .ht-ai-article,
  .htai-article {
    --ht-ai-gutter: 20px;
    --ht-ai-section-space: 56px;
    padding: 56px 20px;
    font-size: 17px;
    line-height: 1.65;
  }

  .ht-ai-lead,
  .htai-article__lead {
    font-size: 19px;
    line-height: 1.58;
  }

  .ht-ai-grid,
  .ht-ai-grid--3,
  .ht-ai-grid--4,
  .htai-article__grid,
  .ht-ai-media-split,
  .ht-ai-process { grid-template-columns: 1fr; }

  .ht-ai-card,
  .htai-article__card,
  .ht-ai-step { padding: 20px; }

  .ht-ai-table,
  .ht-ai-table-wrap table { font-size: 17px; }

  .ht-ai-table-wrap table:has(td[data-label]) thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .ht-ai-table-wrap table:has(td[data-label]),
  .ht-ai-table-wrap table:has(td[data-label]) tbody,
  .ht-ai-table-wrap table:has(td[data-label]) tr,
  .ht-ai-table-wrap table:has(td[data-label]) td {
    display: block;
    width: 100%;
  }

  .ht-ai-table-wrap table:has(td[data-label]) {
    border: 0;
    background: transparent;
  }

  .ht-ai-table-wrap table:has(td[data-label]) tr {
    margin-bottom: 16px;
    border: 1px solid var(--htai-a-line);
    border-radius: 8px;
    overflow: hidden;
    background: var(--htai-a-surface);
  }

  .ht-ai-table-wrap table:has(td[data-label]) td {
    display: grid;
    grid-template-columns: minmax(112px, 40%) minmax(0, 1fr);
    gap: 12px;
    border-width: 0 0 1px;
    padding: 14px 16px;
  }

  .ht-ai-table-wrap table:has(td[data-label]) td:last-child { border-bottom: 0; }
  .ht-ai-table-wrap table:has(td[data-label]) td::before {
    content: attr(data-label);
    color: var(--htai-a-text);
    font-weight: 700;
  }

  .ht-ai-faq summary,
  .htai-article__faq summary {
    font-size: 20px;
    line-height: 1.4;
  }

  .ht-ai-cta-actions,
  .htai-article__cta-actions { display: grid; grid-template-columns: 1fr; }
  .ht-ai-cta-button,
  .htai-article__cta a { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .ht-ai-article *,
  .htai-article * {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Keep CTA contrast after the generic article-link rule. */
.ht-ai-contract-v3.htai-article .htai-article__cta a,
.ht-ai-contract-v3.htai-article .ht-ai-cta-panel a {
  color: var(--ht26-dark) !important;
}

.ht-ai-contract-v3.htai-article .htai-article__cta a + a,
.ht-ai-contract-v3.htai-article .ht-ai-cta-panel a + a {
  color: #fff !important;
}

/*
 * HTML Contract v4 — shared visual components.
 * Content contains semantic classes only; color, elevation and interaction stay
 * centralized here so WordPress/Flatsome articles remain maintainable.
 */
.ht-ai-contract-v4.htai-article {
  --ht26-ink: #ffffff;
  --ht26-muted: #ffffff;
  --ht26-navy: #0b2a4a;
  --ht26-dark: #071116;
  --ht26-surface: #0b2a4a;
  --ht26-border: rgba(214, 170, 109, .72);
  --ht26-gold: #d6aa6d;
  --ht26-gold-icon: #ffffff;
  --ht26-gold-line: rgba(214, 170, 109, .72);
  --ht26-card-shadow: 0 14px 34px rgba(0, 0, 0, .28), 0 3px 10px rgba(0, 0, 0, .18);
}

.ht-ai-contract-v4 .htai-article__card,
.ht-ai-contract-v4 .ht-ai-card,
.ht-ai-contract-v4 .htai-article__facts > div,
.ht-ai-contract-v4 .ht-ai-facts > div,
.ht-ai-contract-v4 .htai-article__step,
.ht-ai-contract-v4 .ht-ai-step {
  border: 1px solid var(--ht26-gold-line);
  box-shadow: var(--ht26-card-shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.ht-ai-contract-v4 .htai-article__card:hover,
.ht-ai-contract-v4 .ht-ai-card:hover,
.ht-ai-contract-v4 .htai-article__facts > div:hover,
.ht-ai-contract-v4 .ht-ai-facts > div:hover,
.ht-ai-contract-v4 .htai-article__step:hover,
.ht-ai-contract-v4 .ht-ai-step:hover {
  transform: translateY(-3px);
  border-color: var(--ht26-gold);
  box-shadow: 0 18px 38px rgba(11, 42, 74, .14), 0 4px 12px rgba(7, 17, 22, .08);
}

.ht-ai-contract-v4.htai-article ul {
  list-style: none;
  padding-left: 0;
}

.ht-ai-contract-v4.htai-article ul > li {
  position: relative;
  padding-left: 1.75em;
}

.ht-ai-contract-v4.htai-article ul > li::before {
  content: "✓";
  position: absolute;
  top: .02em;
  left: 0;
  color: var(--ht26-gold-icon);
  -webkit-text-fill-color: var(--ht26-gold-icon);
  font-size: 1.05em;
  line-height: inherit;
  font-weight: 800;
}

.ht-ai-contract-v4.htai-article ol {
  padding-left: 1.55em;
}

.ht-ai-contract-v4 .ht-ai-media img,
.ht-ai-contract-v4 .ht-ai-gallery img,
.ht-ai-contract-v4 .ht-ai-zoomable,
.ht-ai-contract-v3 .ht-ai-zoomable {
  cursor: zoom-in;
  transition: transform .22s ease, filter .22s ease, box-shadow .22s ease;
}

.ht-ai-contract-v4 .ht-ai-media img:hover,
.ht-ai-contract-v4 .ht-ai-gallery img:hover,
.ht-ai-contract-v4 .ht-ai-zoomable:hover,
.ht-ai-contract-v3 .ht-ai-zoomable:hover {
  transform: scale(1.012);
  filter: brightness(1.025);
  box-shadow: 0 14px 34px rgba(7, 17, 22, .15);
}

.ht-ai-contract-v4 .ht-ai-zoomable:focus-visible,
.ht-ai-contract-v3 .ht-ai-zoomable:focus-visible {
  outline: 3px solid var(--ht26-gold, #d6aa6d);
  outline-offset: 4px;
}

body.htai-lightbox-open {
  overflow: hidden !important;
}

.htai-lightbox[hidden] {
  display: none !important;
}

.htai-lightbox {
  position: fixed;
  z-index: 999999;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(18px, 4vw, 48px);
  background: rgba(3, 8, 12, .92);
  opacity: 0;
  visibility: hidden;
  backdrop-filter: blur(8px);
  transition: opacity .22s ease, visibility .22s ease;
}

.htai-lightbox.is-open {
  opacity: 1;
  visibility: visible;
}

.htai-lightbox__stage {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  max-width: min(94vw, 1600px);
  max-height: 92vh;
  transform: scale(.965) translateY(8px);
  transition: transform .24s ease;
}

.htai-lightbox.is-open .htai-lightbox__stage {
  transform: scale(1) translateY(0);
}

.htai-lightbox__image {
  display: block;
  max-width: min(94vw, 1600px);
  max-height: 82vh;
  width: auto;
  height: auto;
  margin: auto;
  border: 1px solid rgba(214, 170, 109, .72);
  border-radius: 8px;
  background: #071116;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .45);
  object-fit: contain;
}

.htai-lightbox__caption {
  max-width: 960px;
  margin: 0 auto;
  color: #fff !important;
  font: 500 16px/1.55 "Be Vietnam Pro", Inter, Arial, sans-serif;
  text-align: center;
}

.htai-lightbox__close {
  position: fixed;
  z-index: 2;
  top: 18px;
  right: 20px;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(214, 170, 109, .72);
  border-radius: 50%;
  padding: 0;
  background: rgba(7, 17, 22, .88);
  color: #fff;
  font: 300 34px/1 Arial, sans-serif;
  cursor: pointer;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .28);
  transition: transform .18s ease, background .18s ease;
}

.htai-lightbox__close:hover,
.htai-lightbox__close:focus-visible {
  transform: rotate(4deg) scale(1.05);
  background: #0b2a4a;
  outline: 3px solid rgba(214, 170, 109, .38);
  outline-offset: 3px;
}

@media (max-width: 640px) {
  .htai-lightbox { padding: 64px 14px 20px; }
  .htai-lightbox__image { max-width: calc(100vw - 28px); max-height: 76vh; }
  .htai-lightbox__caption { font-size: 14px; }
  .htai-lightbox__close { top: 10px; right: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .ht-ai-contract-v4 .htai-article__card,
  .ht-ai-contract-v4 .ht-ai-card,
  .ht-ai-contract-v4 .htai-article__facts > div,
  .ht-ai-contract-v4 .ht-ai-facts > div,
  .ht-ai-contract-v4 .htai-article__step,
  .ht-ai-contract-v4 .ht-ai-step,
  .ht-ai-contract-v4 .ht-ai-media img,
  .ht-ai-contract-v4 .ht-ai-gallery img,
  .htai-lightbox,
  .htai-lightbox__stage,
  .htai-lightbox__close {
    transition: none !important;
  }
}

/* Keep CTA contrast after the generic article-link rule in v4 output. */
.ht-ai-contract-v4.htai-article .htai-article__cta a,
.ht-ai-contract-v4.htai-article .ht-ai-cta-panel a {
  color: var(--ht26-dark) !important;
}

.ht-ai-contract-v4.htai-article .htai-article__cta a + a,
.ht-ai-contract-v4.htai-article .ht-ai-cta-panel a + a {
  color: #fff !important;
}

/*
 * HTML Contract v4.2 — Dark Industrial Premium, dark surfaces only.
 *
 * The article canvas is technical black; cards and grouped surfaces use dark
 * cobalt. Text is white at the surface root and otherwise inherits. Gold is
 * reserved for 1 px lines, list icons and focus indicators. The same override
 * also upgrades stored v3 fragments without rewriting post content.
 */
.ht-ai-contract-v3.htai-article.ht-ai-article,
.ht-ai-contract-v4.htai-article.ht-ai-article {
  --ht26-ink: #ffffff;
  --ht26-muted: #ffffff;
  --ht26-navy: #0b2a4a;
  --ht26-dark: #071116;
  --ht26-surface: #0b2a4a;
  --ht26-border: rgba(214, 170, 109, .72);
  --ht26-gold: #d6aa6d;
  --ht26-gold-icon: #ffffff;
  --ht26-gold-line: rgba(214, 170, 109, .72);
  --ht26-card-shadow: 0 14px 34px rgba(0, 0, 0, .28), 0 3px 10px rgba(0, 0, 0, .18);
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  color-scheme: dark;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td) {
  background-color: transparent !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-reading, .htai-article__reading,
    .ht-ai-wide, .htai-article__wide, .ht-ai-grid, .htai-article__grid,
    .ht-ai-process, .htai-article__process, .ht-ai-gallery, .htai-article__gallery,
    .ht-ai-media, .htai-article__media, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-facts, .htai-article__facts, .ht-ai-faq, .htai-article__faq),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-reading, .htai-article__reading,
    .ht-ai-wide, .htai-article__wide, .ht-ai-grid, .htai-article__grid,
    .ht-ai-process, .htai-article__process, .ht-ai-gallery, .htai-article__gallery,
    .ht-ai-media, .htai-article__media, .ht-ai-media-split, .htai-article__media-split,
    .ht-ai-facts, .htai-article__facts, .ht-ai-faq, .htai-article__faq) {
  background-color: transparent !important;
  color: inherit !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-hero, .htai-article__hero, .ht-ai-toc, .htai-article__toc,
    .ht-ai-note, .htai-article__note),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-hero, .htai-article__hero, .ht-ai-toc, .htai-article__toc,
    .ht-ai-note, .htai-article__note) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
  box-shadow: var(--ht26-card-shadow) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-faq, .htai-article__faq) details,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-faq, .htai-article__faq) details {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-gallery, .htai-article__gallery) figure,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-gallery, .htai-article__gallery) figure {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-media, .htai-article__media, .ht-ai-gallery, .htai-article__gallery) img,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-media, .htai-article__media, .ht-ai-gallery, .htai-article__gallery) img {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap,
    table, .ht-ai-table, .htai-article__specs),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap,
    table, .ht-ai-table, .htai-article__specs) {
  border-color: var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article th,
.ht-ai-contract-v4.htai-article.ht-ai-article th {
  border-color: var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article td,
.ht-ai-contract-v4.htai-article.ht-ai-article td {
  border-color: var(--ht26-gold-line) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article tr:nth-child(even) td,
.ht-ai-contract-v4.htai-article.ht-ai-article tr:nth-child(even) td {
  background: var(--ht26-navy) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) {
  border: 1px solid var(--ht26-gold-line) !important;
  background: var(--ht26-navy) !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article a,
.ht-ai-contract-v4.htai-article.ht-ai-article a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration-color: var(--ht26-gold) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article ul > li::before,
.ht-ai-contract-v4.htai-article.ht-ai-article ul > li::before {
  color: currentColor !important;
  -webkit-text-fill-color: currentColor !important;
}

/* Hide empty rows already stored by an older generator; new output is cleaned in PHP. */
.ht-ai-contract-v3.htai-article.ht-ai-article li:empty,
.ht-ai-contract-v3.htai-article.ht-ai-article li:has(> br:only-child),
.ht-ai-contract-v4.htai-article.ht-ai-article li:empty,
.ht-ai-contract-v4.htai-article.ht-ai-article li:has(> br:only-child) {
  display: none !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a {
  border: 1px solid var(--ht26-gold) !important;
  background: var(--ht26-dark) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a:hover,
.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a:focus-visible,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a:hover,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a:focus-visible {
  background: var(--ht26-navy) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article ::selection,
.ht-ai-contract-v4.htai-article.ht-ai-article ::selection {
  background: var(--ht26-navy);
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
}

@media (max-width: 767px) {
  .ht-ai-contract-v3.htai-article.ht-ai-article
    .ht-ai-table-wrap table:has(td[data-label]) tr,
  .ht-ai-contract-v4.htai-article.ht-ai-article
    .ht-ai-table-wrap table:has(td[data-label]) tr {
    border-color: var(--ht26-gold-line) !important;
    background: var(--ht26-navy) !important;
  }

  .ht-ai-contract-v3.htai-article.ht-ai-article
    .ht-ai-table-wrap table:has(td[data-label]) td::before,
  .ht-ai-contract-v4.htai-article.ht-ai-article
    .ht-ai-table-wrap table:has(td[data-label]) td::before {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
  }
}

/* v4.3 cascade terminator: this must remain the final presentation policy. */
.ht-ai-contract-v3.htai-article.ht-ai-article,
.ht-ai-contract-v4.htai-article.ht-ai-article {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding: 0 !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-wide, .htai-article__wide),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-wide, .htai-article__wide) {
  width: 100% !important;
  max-width: none !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section),
.ht-ai-contract-v4.htai-article.ht-ai-article
  > :where(.ht-ai-section, .htai-article__section) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(56px, 6vw, 96px) var(--ht-ai-gutter) !important;
  background: var(--ht-ai-surface-bg) !important;
  color: var(--ht-ai-surface-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n + 1),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n + 1),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--cobalt,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--cobalt {
  --ht-ai-surface-bg: #0b2a4a;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-card-bg: #071116;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #071116;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: #0b2a4a !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n + 2),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n + 2),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--charcoal,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--charcoal {
  --ht-ai-surface-bg: #20282e;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-card-bg: #0f1a20;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #0b2a4a;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: #20282e !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article > section:nth-of-type(3n),
.ht-ai-contract-v4.htai-article.ht-ai-article > section:nth-of-type(3n),
.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--black,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--black {
  --ht-ai-surface-bg: #071116;
  --ht-ai-surface-fg: #ffffff;
  --ht-ai-card-bg: #12212a;
  --ht-ai-card-fg: #ffffff;
  --ht-ai-action-bg: #0b2a4a;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: rgba(214, 170, 109, .82);
  background: #071116 !important;
  color: #ffffff !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article section.ht-ai-surface--light,
.ht-ai-contract-v4.htai-article.ht-ai-article section.ht-ai-surface--light {
  --ht-ai-surface-bg: #f4f6f7;
  --ht-ai-surface-fg: #172026;
  --ht-ai-card-bg: #ffffff;
  --ht-ai-card-fg: #172026;
  --ht-ai-action-bg: #071116;
  --ht-ai-action-fg: #ffffff;
  --ht-ai-surface-line: #9a6c34;
  background: #f4f6f7 !important;
  color: #172026 !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step,
    .ht-ai-faq details, .htai-article__faq details),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-card, .htai-article__card, .ht-ai-facts > div,
    .htai-article__facts > div, .ht-ai-step, .htai-article__step,
    .ht-ai-faq details, .htai-article__faq details) {
  border: 1px solid var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-card-bg) !important;
  color: var(--ht-ai-card-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap, table, .ht-ai-table, .htai-article__specs),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-table-wrap, .htai-article__table-wrap, table, .ht-ai-table, .htai-article__specs) {
  border-color: var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-card-bg) !important;
  color: var(--ht-ai-card-fg) !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-card, .htai-article__card,
    .ht-ai-faq, .htai-article__faq, .ht-ai-table-wrap, .htai-article__table-wrap)
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td),
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-section, .htai-article__section, .ht-ai-card, .htai-article__card,
    .ht-ai-faq, .htai-article__faq, .ht-ai-table-wrap, .htai-article__table-wrap)
  :where(h2, h3, h4, p, ul, ol, li, span, strong, em, blockquote, summary, figcaption, a, th, td) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

.ht-ai-contract-v3.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a,
.ht-ai-contract-v4.htai-article.ht-ai-article
  :where(.ht-ai-cta-panel, .htai-article__cta) a {
  border: 1px solid var(--ht-ai-surface-line) !important;
  background: var(--ht-ai-action-bg) !important;
  color: var(--ht-ai-action-fg) !important;
  -webkit-text-fill-color: var(--ht-ai-action-fg) !important;
}

@media (max-width: 767px) {
  .ht-ai-contract-v3.htai-article.ht-ai-article
    > :where(.ht-ai-section, .htai-article__section),
  .ht-ai-contract-v4.htai-article.ht-ai-article
    > :where(.ht-ai-section, .htai-article__section) {
    padding: 56px 20px !important;
  }
}
