/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}
.seo-article, .seo-article *, .seo-article *::before, .seo-article *::after {
  box-sizing: border-box;
}
.seo-article {
  font-family: 'Segoe UI';
  color: #22303f;
  line-height: 1.7;
  --seo-accent: #0c6b4f;
  --seo-accent-soft: #eafaf3;
  --seo-hero-from: #0c6b4f;
  --seo-hero-to: #4caf82;
}
.seo-article h1, .seo-article h2, .seo-article h3,
.seo-article p, .seo-article span, .seo-article div,
.seo-article li, .seo-article a, .seo-article strong {
  font-family: 'Segoe UI';
  margin: 0;
}
.seo-article ul, .seo-article ol { margin: 0; padding: 0; }

/* ---- Layout khung ---- */
.seo-article .seo-inner { max-width: 1250px; margin: 0 auto; padding: 0 32px; }
.seo-article .seo-hero {
  width: 100%;
  background: linear-gradient(135deg, var(--seo-hero-from), var(--seo-hero-to));
  padding: 52px 0 44px;
  overflow: hidden;
}
.seo-article .seo-hero h1 { color: #fff; font-size: 32px; font-weight: 800; line-height: 1.3; margin-bottom: 12px; }
.seo-article .seo-hero p { color: #fff; opacity: 0.92; font-size: 17px; max-width: 800px; margin-bottom: 22px; }
.seo-article .seo-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.seo-article .seo-badge {
  background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.4);
  color: #fff; font-size: 14px; font-weight: 600; padding: 8px 16px; border-radius: 999px;
}
.seo-article .seo-content { background: #fff; padding: 46px 0 60px; }
.seo-article .seo-content h2 {
  font-size: 24px; font-weight: 800; color: var(--seo-accent);
  margin: 38px 0 14px; padding-bottom: 8px; border-bottom: 3px solid var(--seo-hero-to); display: inline-block;
}
.seo-article .seo-content h2:first-child { margin-top: 0; }
.seo-article .seo-content p { font-size: 16px; margin-bottom: 14px; color: #3a4a58; }

/* ---- Khối nhấn mạnh / info box ---- */
.seo-article .seo-address-box {
  background: var(--seo-accent-soft); border-left: 4px solid var(--seo-hero-to);
  border-radius: 8px; padding: 18px 22px; margin-bottom: 18px;
}
.seo-article .seo-address-box p { margin-bottom: 6px; color: var(--seo-accent); }
.seo-article .seo-address-box p:last-child { margin-bottom: 0; }

/* ---- Ảnh / bản đồ ---- */
.seo-article .seo-map { width: 100%; height: 380px; border: 0; border-radius: 12px; margin: 8px 0 20px; }
.seo-article .seo-img { width: 100%; height: auto; border-radius: 12px; display: block; margin: 20px 0; }

/* ---- Grid card ---- */
.seo-article .seo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 18px 0 8px; }
.seo-article .seo-card { background: #f7fafc; border: 1px solid #e2edf3; border-radius: 10px; padding: 18px 20px; }
.seo-article .seo-card strong { color: var(--seo-accent); display: block; margin-bottom: 4px; font-size: 16px; }
.seo-article .seo-card span { font-size: 15px; color: #3a4a58; }

/* ---- List ---- */
.seo-article .seo-content ul { margin: 8px 0 16px 20px; }
.seo-article .seo-content ul li { font-size: 16px; color: #3a4a58; margin-bottom: 8px; list-style: disc; }

/* ---- FAQ ---- */
.seo-article .seo-faq-item {
  background: #f7fafc; border: 1px solid #e2edf3; border-radius: 10px; padding: 18px 20px; margin-bottom: 14px;
}
.seo-article .seo-faq-item h3 { font-size: 17px; color: var(--seo-accent); margin: 0 0 8px; }
.seo-article .seo-faq-item p { margin-bottom: 0; }

/* ---- Giá / số nổi bật ---- */
.seo-article .seo-price-box {
  display: flex; align-items: baseline; gap: 8px; margin: 14px 0 18px;
  background: var(--seo-accent-soft); border-radius: 10px; padding: 16px 20px; width: fit-content;
}
.seo-article .seo-price-box .price-num { font-size: 26px; font-weight: 800; color: var(--seo-accent); }
.seo-article .seo-price-box .price-unit { font-size: 15px; color: #3a4a58; }

/* ---- CTA box cuối bài ---- */
.seo-article .seo-cta-box {
  background: linear-gradient(135deg, var(--seo-hero-from), var(--seo-hero-to));
  border-radius: 14px; padding: 30px 32px; margin: 30px 0 6px; text-align: center;
}
.seo-article .seo-cta-box p { color: #fff; margin-bottom: 8px; font-size: 16px; }
.seo-article .seo-cta-box .cta-big { font-size: 20px; font-weight: 800; margin-bottom: 14px; }
.seo-article .seo-cta-box a.cta-btn {
  display: inline-block; background: #fff; color: var(--seo-accent); font-weight: 800;
  font-size: 16px; padding: 12px 28px; border-radius: 999px; text-decoration: none; margin-top: 6px;
}

/* ---- Bảng màu theo chủ đề — thêm class chung với "seo-article" ---- */
/* vd: class="seo-article seo-theme-blue" */
.seo-article.seo-theme-green  { --seo-accent:#0c6b4f; --seo-accent-soft:#eafaf3; --seo-hero-from:#0c6b4f; --seo-hero-to:#4caf82; }
.seo-article.seo-theme-blue   { --seo-accent:#0c4a7a; --seo-accent-soft:#eaf6ff; --seo-hero-from:#0c4a7a; --seo-hero-to:#1e88c7; }
.seo-article.seo-theme-teal   { --seo-accent:#02607f; --seo-accent-soft:#f2fbff; --seo-hero-from:#02607f; --seo-hero-to:#05aeef; }
.seo-article.seo-theme-orange { --seo-accent:#b3540f; --seo-accent-soft:#fef3e9; --seo-hero-from:#b3540f; --seo-hero-to:#f0932b; }
.seo-article.seo-theme-red    { --seo-accent:#8a1f2d; --seo-accent-soft:#fdecee; --seo-hero-from:#8a1f2d; --seo-hero-to:#e0525f; }
.seo-article.seo-theme-purple { --seo-accent:#5b2d91; --seo-accent-soft:#f3ecfb; --seo-hero-from:#5b2d91; --seo-hero-to:#9b6fd6; }

/* ---- 6 theme đối lập (bổ sung — mỗi theme là màu bù/complementary của 1 theme ở trên) ---- */
.seo-article.seo-theme-hong     { --seo-accent:#9c1958; --seo-accent-soft:#fdeaf2; --seo-hero-from:#9c1958; --seo-hero-to:#d6488f; } /* đối lập green */
.seo-article.seo-theme-vang     { --seo-accent:#92660c; --seo-accent-soft:#fdf6e3; --seo-hero-from:#92660c; --seo-hero-to:#e0a940; } /* đối lập blue */
.seo-article.seo-theme-do-cam   { --seo-accent:#a13a12; --seo-accent-soft:#fdece3; --seo-hero-from:#a13a12; --seo-hero-to:#e2703a; } /* đối lập teal */
.seo-article.seo-theme-cham     { --seo-accent:#1f2f7a; --seo-accent-soft:#eaecfb; --seo-hero-from:#1f2f7a; --seo-hero-to:#4d5fc7; } /* đối lập orange */
.seo-article.seo-theme-ngoc-lam { --seo-accent:#036666; --seo-accent-soft:#e5fbfa; --seo-hero-from:#036666; --seo-hero-to:#2bb3ad; } /* đối lập red */
.seo-article.seo-theme-chanh    { --seo-accent:#5a6b0c; --seo-accent-soft:#f4f9e3; --seo-hero-from:#5a6b0c; --seo-hero-to:#9cbd3a; } /* đối lập purple */

/* ---- Responsive ---- */
@media (max-width: 768px) {
  .seo-article .seo-inner { padding: 0 16px; }
  .seo-article .seo-hero h1 { font-size: 25px; }
  .seo-article .seo-content h2 { font-size: 21px; }
  .seo-article .seo-grid { grid-template-columns: 1fr; }
  .seo-article .seo-map { height: 280px; }
}

/* ---- Class rời cho bài dạng list tối giản (không dùng hero) ---- */
.nt-addr { color: #55606b; font-size: 15px; }