/*
Theme Name: Maxcut Theme
Description: Theme tuỳ chỉnh giao diện cho maxcut.vn
Author: Maxcut Dev
Template: flatsome
Version: 1.0.0
*/

/* ==========================================================================
   MAXCUT CHILD THEME CUSTOM CSS
   ========================================================================== */

/* 1. Biến màu & Chuẩn hóa chung */
:root {
  --maxcut-blue: #0b4e8c;
  --maxcut-dark-blue: #083763;
  --maxcut-red: #d9232e;
  --maxcut-bg: #f4f6f9;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Fix lỗi icon thanh toán & logo footer bị kéo dãn */
.footer-wrapper img, 
.payment-icons img {
  max-height: 32px !important;
  width: auto !important;
}

/* 2. Hero Section */
.hero-subtitle {
  color: #d9232e;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.hero-title {
  color: #083763;
  font-size: 32px;
  font-weight: 800;
  line-height: 1.25;
  margin-bottom: 12px;
}

/* 3. Thanh USP Cam kết (6 Cột) */
.usp-bar-section {
  background-color: #0b4e8c !important;
  padding: 12px 0 !important;
}

.usp-item-box {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  gap: 8px;
}

/* 4. Thống kê Counter */
.counter-box-maxcut {
  text-align: center;
  padding: 15px 10px;
  background: #ffffff;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}

.counter-box-maxcut .stats-number {
  font-size: 32px;
  font-weight: 800;
  color: #0b4e8c;
}

/* 5. Bo góc Card Sản phẩm & Danh mục */
.product-small, .icon-box, .featured-box {
  background: #ffffff;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.product-small:hover, .featured-box:hover {
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
  transform: translateY(-3px);
  border-color: #0b4e8c;
}

/* 6. Quy trình làm việc (Circle Steps) */
.step-item-box {
  text-align: center;
  padding: 10px;
}

.step-number-circle {
  width: 42px;
  height: 42px;
  background-color: #0b4e8c;
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
  margin: 0 auto 10px auto;
  box-shadow: 0 4px 10px rgba(11, 78, 140, 0.25);
}

.step-title {
  font-size: 14px;
  font-weight: 700;
  color: #083763;
  margin-bottom: 4px;
}

.step-desc {
  font-size: 12px;
  color: #64748b;
  line-height: 1.35;
}