/* Shared public footer for the website and ecommerce tools */
.site-footer {
  display: block !important;
  position: relative;
  overflow: hidden;
  float: none !important;
  clear: both;
  width: 100%;
  margin: 0;
  padding: 0 !important;
  background: #111d30;
  color: rgba(255,255,255,.68);
  font-family: 'Varela Round', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
.site-footer *, .site-footer *::before, .site-footer *::after { box-sizing: border-box; }
.site-footer a { color: inherit; text-decoration: none; }
.site-footer-container { width: calc(100% - 40px); max-width: 1160px; margin-right: auto; margin-left: auto; }
.site-footer-main { display: grid !important; grid-template-columns: minmax(270px,1.4fr) repeat(4,minmax(120px,1fr)); gap: 28px; padding-top: 36px; padding-bottom: 28px; }
.site-footer-main > section, .site-footer-main > details { float: none !important; width: auto; margin: 0; padding-right: 0; padding-left: 0; }
.site-footer-brand-media { display: flex; align-items: center; gap: 15px; }
.site-footer-brand-lockup { display: block; width: fit-content; }
.site-footer-brand-lockup img { display: block; width: 160px; height: 80px; object-fit: contain; object-position: left center; }
.site-footer-qr { display: block; width: 74px; height: 74px; padding: 3px; border-radius: 8px; background: #fff; object-fit: cover; }
.site-footer-brand > p { max-width: 285px; margin: 10px 0 13px; color: rgba(255,255,255,.55); font-size: 13px; line-height: 1.7; }
.site-footer-group { min-width: 0; }
.site-footer-group summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 15px; cursor: default; color: #fff; font-size: 14px; font-weight: 750; list-style: none; }
.site-footer-group summary::-webkit-details-marker { display: none; }
.site-footer-group summary i { display: none; color: #71819a; font-size: 11px; transition: transform .18s ease; }
.site-footer-group[open] summary i { transform: rotate(180deg); }
.site-footer-links { display: grid; gap: 10px; }
.site-footer-links a, .site-footer-links > span { display: flex; align-items: center; gap: 8px; min-height: 24px; color: rgba(255,255,255,.55); font-size: 13px; line-height: 1.5; transition: color .18s ease; }
.site-footer-links a:hover { color: #fff; }
.site-footer-links i { width: 14px; margin-top: 2px; color: #779bd2; text-align: center; }
.site-footer-note { margin: 0 auto; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.42); font-size: 11px; line-height: 1.65; }
.site-footer-bottom { display: flex; align-items: center; justify-content: center; min-height: 58px; border-top: 1px solid rgba(255,255,255,.09); color: rgba(255,255,255,.38); font-size: 11px; text-align: center; }
.site-footer-bottom a:hover { color: rgba(255,255,255,.75); }

@media (min-width: 768px) and (max-width: 1050px) {
  .site-footer-main { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px; }
  .site-footer-brand { display: flex; grid-column: 1 / -1; align-items: center; gap: 28px; }
  .site-footer-brand > p { margin: 0; }
}

@media (max-width: 767px) {
  .site-footer-container { width: calc(100% - 28px); }
  .site-footer-main { display: block !important; padding-top: 24px; padding-bottom: 18px; }
  .site-footer-brand { display: block; margin-bottom: 20px; }
  .site-footer-brand-lockup img { width: 150px; height: 75px; }
  .site-footer-qr { width: 70px; height: 70px; }
  .site-footer-brand > p { max-width: none; }
  .site-footer-group { border-top: 1px solid rgba(255,255,255,.09); }
  .site-footer-group:last-child { border-bottom: 1px solid rgba(255,255,255,.09); }
  .site-footer-group summary { margin: 0; padding: 15px 2px; cursor: pointer; font-size: 14px; }
  .site-footer-group summary i { display: inline-block; }
  .site-footer-links { gap: 0; padding: 0 2px 13px; }
  .site-footer-links a, .site-footer-links > span { min-height: 0; padding: 8px 0; font-size: 13px; }
  .site-footer-bottom { min-height: 70px; padding: 13px 0; }
}
