/* =====================================================================
   v19 · TRANG GIẢI PHÁP (giai-phap-<slug>.html) — trang do CMS sinh
   Khung hero / nội dung dùng chung với trang phân hệ phần mềm (css/software.css): cùng lưới 12 cột, cùng độ rộng nội dung.
   Ở đây chỉ thêm: ảnh bìa · bộ ảnh · thẻ "Mô hình khác" · CTA 2 nút. Hover chỉ ≥1200px có chuột.
   ===================================================================== */

/* ---------- Ảnh bìa (trong hero, full container) ---------- */
.gp-cover { grid-column: 1 / -1; margin-top: 2rem; border-radius: 1.6rem; overflow: hidden; background: var(--light-gray); aspect-ratio: 16 / 7; }
.gp-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- Nội dung: bỏ khoảng đệm riêng của .article-body (section đã có padding), tiêu đề đầu tiên thẳng hàng nhãn "Tổng quan" ---------- */
.gp-body .article-body { padding: 0; }
.gp-body .article-body > :first-child { margin-top: 0; }
.gp-body .article-body img { border-radius: 1.2rem; }

/* ---------- Bộ ảnh ---------- */
.gp-gallery-sec { padding-top: 0; }
.gp-gallery { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gutter); }
.gp-gallery--n1 { grid-template-columns: 1fr; }
.gp-gallery--n2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gp-gallery figure { margin: 0; border-radius: 1.2rem; overflow: hidden; background: var(--light-gray); aspect-ratio: 4 / 3; }
.gp-gallery--n1 figure { aspect-ratio: 16 / 7; }
.gp-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- Mô hình khác ---------- */
.gp-more { border-top: 1px solid var(--border); }
.gp-more-grid { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gutter); }
.gp-card { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: 1.6rem; overflow: hidden; background: #fff; color: var(--fg);
  transition: border-color .3s var(--ease); }
.gp-card-media { display: grid; place-items: center; aspect-ratio: 16 / 9; background: var(--light-gray); color: var(--primary); overflow: hidden; }
.gp-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease); }
.gp-card-media svg { width: 4.8rem; height: 4.8rem; }
.gp-card-body { position: relative; flex: 1; display: flex; flex-direction: column; gap: .8rem; padding: 2.4rem 2.4rem 6rem; }
.gp-card-cat { font-size: 1.2rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--fg-muted); }
.gp-card b { font-size: 2.2rem; font-weight: 500; line-height: 1.3; letter-spacing: -.04rem; }
.gp-card-d { font-size: 1.5rem; line-height: 1.6; color: var(--fg-muted); }
.gp-card-go { position: absolute; left: 2.4rem; bottom: 2.2rem; font-size: 2rem; color: var(--primary); transition: transform .35s var(--ease); }
@media (min-width: 1200px) and (hover: hover) {
  .gp-card:hover { border-color: var(--primary); }
  .gp-card:hover .gp-card-media img { transform: scale(1.03); }
  .gp-card:hover .gp-card-go { transform: translateX(.6rem); }
}

/* ---------- CTA: Liên hệ tư vấn (nút trắng) · Đặt lịch demo (viền trắng) ---------- */
.gp-cta .btn--dark { background: #fff; color: var(--primary); }
@media (min-width: 1200px) and (hover: hover) { .gp-cta .btn--dark:hover { background: rgba(255,255,255,.88); } }

/* ===================== MOBILE / TABLET (< 1200px) ===================== */
@media (max-width: 1199px) {
  .gp-cover { margin-top: 1rem; aspect-ratio: 4 / 3; }
  .gp-gallery, .gp-gallery--n2 { grid-template-columns: 1fr; gap: 1.2rem; }
  .gp-gallery--n1 figure { aspect-ratio: 4 / 3; }
  .gp-more-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .gp-card b { font-size: var(--m-h3, 2rem); }
  .gp-cta .blog-cta-actions { flex-direction: column; }
  .gp-cta .blog-cta-actions .btn { justify-content: center; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .gp-gallery:not(.gp-gallery--n1), .gp-more-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}