.consult-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 60px 80px;
  padding-bottom: 2rem;
}

.consult-breadcrumb {
  margin: 0 0 22px;
}

/* Scope under .consult-page để thắng specificity từ Yoast / Woo / global */
.consult-page .breadcrumb {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 12px;
  /* WCAG AA: #8a8070 on #fdfaf4 ~3.73:1 → #6b6053 ~6.2:1 */
  color: #6b6053;
  margin-bottom: 28px;
  padding-bottom: 16px;
  border-bottom: 1px solid #E8DDD0;
  letter-spacing: .04em;
}

.consult-page .breadcrumb a,
.consult-page .consult-breadcrumb a,
.consult-page .consult-breadcrumb a:visited {
  color: #6b6053 !important;
  text-decoration: none;
  transition: color .2s;
}

.consult-page .breadcrumb a:hover,
.consult-page .consult-breadcrumb a:hover {
  color: #8f4f30 !important;
}

.consult-page .breadcrumb .breadcrumb_last,
.consult-page .breadcrumb span:not(.bc-sep) {
  color: #1C1A17;
}

.bc-sep {
  opacity: .4;
}

.page-eyebrow {
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  /* WCAG AA: #c4714a on #fdfaf4 ~3.47:1 → #8f4f30 ~5.5:1 */
  color: #8f4f30;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Scope + !important: chắc chắn thắng plugin / global (Lighthouse vẫn báo #c4714a) */
.consult-page .page-eyebrow {
  color: #8f4f30 !important;
}

.page-eyebrow::before {
  content: '';
  width: 28px;
  height: 1px;
  background: #8f4f30;
}

.consult-page .page-eyebrow::before {
  background: #8f4f30 !important;
}

.page-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(32px, 5vw, 38px);
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -.01em;
  color: #1C1A17;
  margin-bottom: 20px;
}

.page-title em {
  color: #C4714A;
  font-style: italic;
}

.page-desc {
  font-size: 15px;
  line-height: 1.85;
  /* WCAG AA: #8a8070 on #fdfaf4 ~3.73:1 → #6b6053 ~6.2:1 */
  color: #6b6053;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #E8DDD0;
}

.page-desc strong {
  color: #1C1A17;
  font-weight: 500;
}

.help-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #E8DDD0;
}

.help-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 6px;
  background: #F5F0E8;
  border-left: 2px solid #C4714A;
}

.help-icon {
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}

.help-title {
  font-size: 14px;
  font-weight: 600;
  color: #1C1A17;
  margin-bottom: 3px;
}

.help-desc {
  font-size: 13px;
  /* WCAG AA: #8a8070 on #f5f0e8 ~3.4:1 → #6b6053 ~5.8:1 */
  color: #6b6053;
  line-height: 1.6;
}

.channels-title {
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  /* WCAG AA: #8a8070 on #fdfaf4 ~3.73:1 → #6b6053 ~6.2:1 */
  color: #6b6053;
  margin-bottom: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}

.channels-title::before {
  content: '✦';
  color: #C9A96E;
  font-size: 8px;
}

.channels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 40px;
}

.channel-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  border-radius: 8px;
  border: 1px solid #E8DDD0;
  background: #FDFAF4;
  cursor: pointer;
  text-decoration: none;
  transition: all .25s;
}

.channel-card:hover {
  border-color: #C4714A;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(28, 26, 23, .07);
}

.channel-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

.channel-card.phone .channel-icon-wrap {
  background: #FFF0EC;
}

.channel-card.zalo .channel-icon-wrap {
  background: #E6F4FF;
}

.channel-label {
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #6b6053;
  margin-bottom: 3px;
}

.channel-value {
  font-size: 15px;
  font-weight: 600;
  color: #1C1A17;
}

.channel-sub {
  font-size: 11px;
  color: #6b6053;
  margin-top: 2px;
}

.ornament {
  display: flex;
  align-items: center;
  gap: 14px;
  /* WCAG AA: #c9a96e on #fdfaf4 ~2.14:1 → #6b6053 ~6.2:1 */
  color: #6b6053;
  font-size: 12px;
  margin-bottom: 40px;
}

.ornament::before,
.ornament::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #E8DDD0;
}

.form-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(20px, 3vw, 26px);
  font-weight: 400;
  line-height: 1.3;
  color: #1C1A17;
  margin-bottom: 6px;
}

.form-sub {
  font-size: 13px;
  color: #6b6053;
  margin-bottom: 28px;
  line-height: 1.6;
}

.consult-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Họ tên + điện thoại: một hàng trên desktop */
.form-row--name-phone {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

@media (min-width: 769px) {
  .form-row--name-phone {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 24px;
    align-items: start;
  }
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.form-label {
  font-size: 12px;
  letter-spacing: .06em;
  font-weight: 600;
  color: #1C1A17;
}

.req {
  color: #C4714A;
}

.form-input,
.form-textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid #E8DDD0;
  border-radius: 6px;
  font-size: 14px;
  color: #1C1A17;
  background: #fff;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}

.form-input:focus,
.form-textarea:focus {
  border-color: #C4714A;
  box-shadow: 0 0 0 3px rgba(196, 113, 74, .1);
}

.form-textarea {
  resize: vertical;
  min-height: 130px;
  line-height: 1.7;
}

.form-hint {
  font-size: 11px;
  color: #6b6053;
}

.topic-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.topic-chip {
  padding: 6px 14px;
  border-radius: 20px;
  border: 1.5px solid #E8DDD0;
  font-size: 12px;
  color: #6b6053;
  cursor: pointer;
  background: #fff;
}

.topic-chip.selected {
  background: #1C1A17;
  color: #F5F0E8;
  border-color: #1C1A17;
}

.form-submit {
  width: 100%;
  padding: 15px 24px;
  /* WCAG AA: #fff on #c4714a ~3.6:1 → #8f4f30 ~5.5:1 */
  background: #8f4f30;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .3s;
}

.form-submit:hover {
  background: #7a3f28;
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(122, 63, 40, .4);
}

.privacy-note {
  text-align: center;
  font-size: 12px;
  /* WCAG AA: #8a8070 on #fdfaf4 ~3.73:1 → #6b6053 ~6.2:1 */
  color: #6b6053;
  line-height: 1.7;
  margin-top: 4px;
}

.form-success {
  display: none;
  text-align: center;
  padding: 40px 20px;
  background: #F5F0E8;
  border: 1px solid #8FAF90;
  border-radius: 8px;
}

.form-success.show {
  display: block;
}

.success-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #3D7A5E;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  font-size: 28px;
  font-weight: 700;
}

.success-title {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 400;
  color: #1C1A17;
  margin-bottom: 8px;
}

.success-sub {
  font-size: 14px;
  color: #8A8070;
  line-height: 1.7;
}

.closing-ctas {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.btn-primary,
.btn-ghost {
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration: none;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: all .25s;
}

.btn-primary {
  background: #C4714A;
  color: #fff;
  border: 1px solid #C4714A;
}

.btn-primary:hover {
  background: #A85D3A;
  border-color: #A85D3A;
}

.btn-ghost {
  background: transparent;
  color: #1C1A17;
  border: 1px solid #E8DDD0;
}

.btn-ghost:hover {
  border-color: #C4714A;
  color: #C4714A;
}

@media (max-width: 768px) {
  .consult-page {
    padding: 36px 24px 80px;
  }

  .channels {
    grid-template-columns: 1fr;
  }

  .page-title {
    font-size: clamp(28px, 8vw, 38px);
  }
}