/* ======================
       SHOPIFY LIGHT COLORS
    ====================== */
    :root {
      --bg-page: #f5f5f5;       /* nền ghi Shopify */
      --bg-footer: #f5f5f5;     /* footer cùng màu page */
      --text-main: #111827;     /* chữ đen */
      --text-muted: #6b7280;    /* chữ xám */
      --border-color: #e5e7eb;  /* border Shopify */
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
                   Roboto, Helvetica, Arial, sans-serif;
      background: var(--bg-page);
      color: var(--text-main);
    }

    /* ======================
       FOOTER
    ====================== */
    #SiteFooter {
      background: var(--bg-footer);
      border-top: 1px solid var(--border-color);
      padding: 50px 20px;
    }

    .footer-container {
      max-width: 1440px;
      margin: auto;
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 32px;
    }

    .footer-block h5 {
      font-size: 14px;
      font-weight: 600;
      margin-bottom: 14px;
      text-transform: uppercase;
    }

    .footer-block ul {
      list-style: none;
    }

    .footer-block li {
      margin-bottom: 10px;
    }

    .footer-block a {
      color: var(--text-muted);
      text-decoration: none;
      font-size: 14px;
    }

    .footer-block a:hover {
      color: var(--text-main);
    }

    /* ======================
       PAYMENT & CERT
    ====================== */
    .payment-logos,
    .cert-logos {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px;
    }

    .payment-logos img,
    .cert-logos img {
      width: 128%;
      height: 50px;
      object-fit: contain;
      background: #ffffff;
      padding: 6px;
      border: 1px solid var(--border-color);
      border-radius: 4px;
    }

    .footer-subtitle {
      margin-top: 22px;
    }
    /* SOCIAL */
    .footer-social {
      margin-top: 30px;
      text-align: center;
    }

    .footer-social a {
      margin: 0 10px;
      font-weight: 500;
      color: #cbd5f5;
    }

    .footer-social a:hover {
      color: #fff;
    }
/* COPYRIGHT */
    .footer-bottom {
      margin-top: 20px;
      text-align: center;
      font-size: 13px;
      color: #94a3b8;
    }
    /* ======================
       RESPONSIVE
    ====================== */
    @media (max-width: 992px) {
      .footer-container {
        grid-template-columns: repeat(2, 1fr);
      }
    }

    @media (max-width: 576px) {
      .footer-container {
        grid-template-columns: 1fr;
      }
    }