:root{
  /* Màu — §4.1 */
  --orange: #f97316;      /* cam chính (ai-x.vn) */
  --orange-700: #ea580c;  /* primary — nút, link, eyebrow, dải CTA */
  --orange-500: #fb923c;   /* accent sáng — gradient, thanh, nhãn trọng tâm */
  --orange-800: #c2410c;   /* hover nút, link, chữ trên tint */
  --orange-soft: #fff1e7; /* tint cam nhạt nền chọn */
  --orange-50:  #fff1e7;   /* tint — nền lựa chọn, nhãn Miễn phí */
  --ink:        #171a26;   /* chữ chính, footer, nhãn Chuyên sâu */
  --ink-2:      #2B2F37;   /* chữ nav, chip */
  --muted:      #4E535E;   /* chữ phụ */
  --bar-gray:   #6B707B;   /* thanh biểu đồ thường */
  --bg:         #FBF6EF;   /* cream — nền section xen kẽ */
  --surface:    #FFFFFF;
  --line:       #E8E0D6;   /* viền thẻ */
  --line-strong:#D6D1C6;   /* viền chip */
  --on-orange:  #ffedd5;   /* câu phụ trên CTA cam */
  --cream:      #FBF6EF;
  --hero-dark:  #2a1b15;  /* nền hero tối (ai-x.vn) */
  --hero-ink:   #251812;  /* section dark, footer */
  --grad-primary: linear-gradient(135deg, #fb923c, #ea580c);
  --grad-deep:   linear-gradient(135deg, #9a3412, #fb923c);
  --shadow-warm: 0 20px 60px rgba(100, 45, 16, .10);

  /* Chữ — §4.2 */
  --font-head:  "Lora", Georgia, serif;
  --font-body:  "Be Vietnam Pro", Arial, sans-serif;
  --font-mono:  "JetBrains Mono", "Consolas", monospace;

  /* Hình thái — §4.3 */
  --radius-card: 24px;
  --radius-btn: 10px;
  --radius-pill: 999px;
  --container-max: 1200px;
  --space-section: 64px;
  --shadow-soft: 0 10px 30px -14px rgba(21, 23, 28, 0.18);

  /* Phân cấp gói dịch vụ — §4.1 */
  --tier-free-bg: var(--orange-50);
  --tier-free-fg: var(--orange-800);
  --tier-free-line: var(--orange-700);
  --tier-deep-bg: var(--ink);
  --tier-deep-fg: #fff;
  --tier-impl-bg: #E7E9EE;
  --tier-impl-fg: var(--ink-2);
}
.aix-redesign *, .aix-redesign *::before, .aix-redesign *::after{ box-sizing: border-box; }
.aix-redesign img, .aix-redesign svg{ max-width: 100%; height: auto; }
.aix-redesign img{ display: block; }
.aix-redesign{
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.6;
  color: var(--muted);
  background: var(--surface);
  -webkit-font-smoothing: antialiased;
}
.aix-redesign h1, .aix-redesign h2, .aix-redesign h3, .aix-redesign h4{
  font-family: var(--font-head);
  color: var(--ink);
  line-height: 1.2;
  margin: 0 0 0.5em;
}
.aix-redesign h1{ font-size: clamp(2.5rem, 4.6vw, 3.5rem); line-height: 1.1; font-weight: 600; }
.aix-redesign h2{ font-size: clamp(1.75rem, 3.2vw, 2.5rem); }
.aix-redesign h3{ font-family: var(--font-body); font-weight: 700; font-size: clamp(1.06rem, 1.6vw, 1.3rem); }
.aix-redesign p{ margin: 0 0 1em; }
.aix-redesign h1, .aix-redesign h2, .aix-redesign h3, .aix-redesign h4, .aix-redesign p{ overflow-wrap: break-word; }
.aix-redesign a{ color: var(--orange-700); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.aix-redesign a:hover{ color: var(--orange-800); }
.aix-redesign .eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--orange-700);
  margin-bottom: 16px;
}
.aix-redesign .eyebrow::before{ content: ""; width: 24px; height: 1.5px; background: var(--orange-700); }
.aix-redesign .mono{ font-family: var(--font-mono); font-size: 0.8125rem; letter-spacing: 0.01em; }
.aix-redesign .muted{ color: var(--muted); }
.aix-redesign .text-sm{ font-size: 0.875rem; }
.aix-redesign .text-xs{ font-size: 0.75rem; }
.aix-redesign .container{ width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: 24px; }
.aix-redesign .section{ padding-block: var(--space-section); }
.aix-redesign .section-bg{ background: var(--bg); }
.aix-redesign .section-ink{ background: var(--ink); }
.aix-redesign .section-head{ max-width: 760px; margin: 0 auto 36px; }
.aix-redesign .section-head.center{ text-align: center; }
.aix-redesign .section-head .lede{ color: var(--muted); font-size: 1.125rem; }
.aix-redesign .grid{ display: grid; gap: 24px; }
.aix-redesign .grid-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
.aix-redesign .grid-4{ grid-template-columns: repeat(4, minmax(0,1fr)); }
.aix-redesign [id]{ scroll-margin-top: calc(76px + 12px); }
.aix-redesign{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){.aix-redesign *, .aix-redesign *::before, .aix-redesign *::after{ animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }}
.aix-redesign :focus-visible{ outline: 2.5px solid var(--orange-700); outline-offset: 2px; border-radius: 4px; }
@media (max-width: 991.98px){.aix-redesign .grid-3, .aix-redesign .grid-4{ grid-template-columns: repeat(2, minmax(0,1fr)); }}
@media (max-width: 767.98px){.aix-redesign .container{ padding-inline: 18px; }
.aix-redesign .section{ padding-block: 56px; }
.aix-redesign .grid-3, .aix-redesign .grid-4{ grid-template-columns: minmax(0,1fr); }
.aix-redesign h1{ font-size: clamp(2.2rem, 9vw, 2.6rem); }}
.aix-redesign :is(p, li, span, a, td, th, dd, dt, figcaption, small, strong, em, label):not(#aix):not(#aix){ font-family: "Be Vietnam Pro", Arial, sans-serif !important; }
.aix-redesign :is(h1, h2, h3, h4, h5):not(#aix):not(#aix){ font-family: "Lora", Georgia, serif !important; }
.aix-redesign :is(.mono, code, .roi-comp, .t-num, .g-count):not(#aix):not(#aix){ font-family: "JetBrains Mono", Consolas, monospace !important; }
.aix-redesign :is(button, input, select, textarea, .btn):not(#aix):not(#aix){ font-family: "Be Vietnam Pro", Arial, sans-serif !important; }
.aix-redesign :is(a.btn, a.tool-card):not(#aix):not(#aix){ font-family: "Be Vietnam Pro", Arial, sans-serif !important; }
.aix-redesign{font-family:var(--font-body);font-size:1rem;line-height:1.7;color:var(--muted)}
.aix-redesign h1,.aix-redesign h2,.aix-redesign h3,.aix-redesign h4{font-family:var(--font-head);color:var(--ink)}
.aix-redesign .mono{font-family:var(--font-mono)}
