nav.sg-ecosystem {
  display:block;
  width:100%;
  box-sizing:border-box;
  margin:0;
  padding:40px clamp(18px,4vw,50px) 44px;
  border-block:1px solid #253140;
  background:#0e1c2b;
  color:#cbd0d5;
  text-align:left;
}
.sg-ecosystem .sfc-eco-label,
.sg-ecosystem .sfc-eco-grid { max-width:1440px; margin-inline:auto; }
.sg-ecosystem .sfc-eco-label {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:24px;
  color:#a9b5c0;
}
.sg-ecosystem .sfc-eco-label::after { content:""; flex:1; height:1px; background:#253140; }
.sg-ecosystem .sfc-eco-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
body .sg-ecosystem .sfc-eco-card {
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  min-height:94px;
  margin:0;
  padding:14px 16px;
  border:1px solid #2b3746;
  border-radius:9px;
  background:#192434;
  color:#edf1f4;
  text-decoration:none;
}
body .sg-ecosystem .sfc-eco-card:hover,
body .sg-ecosystem .sfc-eco-card:focus-visible { background:#203245; border-color:#5ac5a6; color:#fff; text-decoration:none; }
body .sg-ecosystem .sfc-eco-card:focus-visible { outline:2px solid #5ac5a6; outline-offset:3px; }
.sg-ecosystem .sfc-eco-icon {
  display:grid;
  flex:0 0 36px;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:8px;
  background:#173a3f;
  color:#45cfaa;
}
.sg-ecosystem .sfc-eco-icon svg { width:18px; height:18px; }
.sg-ecosystem .sfc-eco-name { display:block; color:inherit; }
.sg-ecosystem .sfc-eco-desc { display:block; margin-top:3px; color:#adb9c5; }
.sfc-eco-label .sfc-eco-logo {
  display: block;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  object-fit: contain;
}

.sg-footer-brand-title {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sg-footer-brand-title > img {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

body #page-footer > nav.sg-ecosystem {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: clamp(26px, 4vw, 44px) clamp(18px, 4vw, 52px);
}

body #page-footer > .sg-ecosystem .sfc-eco-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

body #page-footer > .sg-ecosystem .sfc-eco-card {
  flex: 1 1 clamp(150px, 15vw, 188px);
  flex-direction: row;
  align-items: center;
  gap: 12px;
  min-height: 102px;
  padding: 15px;
  overflow-wrap: anywhere;
}

/* Match the footer typography across host themes, including their native text. */
body :is(footer:has(.sfc-eco-label), #footer:has(.sfc-eco-label), .sg-legacy-footer),
body#vb-page-body #footer-vb-copyright {
  --sg-footer-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sg-footer-text: 400 13px/1.55 var(--sg-footer-font);
  --sg-footer-title: 700 14px/1.35 var(--sg-footer-font);
  font: var(--sg-footer-text);
}

body :is(footer:has(.sfc-eco-label), #footer:has(.sfc-eco-label), .sg-legacy-footer) :is(
  .sfc-eco-desc, .sg-network-footer-info p, .sg-network-footer-info nav a,
  .sg-network-store-links a, .sg-footer-grid p:not(.sg-footer-brand-title, .sg-footer-label),
  .sg-footer-grid nav a, .sg-footer-grid address,
  .sg-footer-meta, .sg-footer-meta a, .sg-footer-copy, .sg-footer-copy a,
  .snmf-footer-grid p, .snmf-footer-grid a, .snmf-footer-fine, .snmf-footer-fine a,
  .sfc-col li a, .sfb-nl-text span, .sfb-nl-form :is(input, button),
  .sfb-nl-badge, .sfb-legal a, .sfb-mnt,
  .copyright-content .copyright, .copyright-content .copyright a,
  .sg-legacy-footer p, .sg-legacy-footer a:not([title]), .sg-legacy-footer-copy,
  #footer-tabbar a
),
body#vb-page-body #footer-vb-copyright a {
  font: var(--sg-footer-text);
  letter-spacing: normal;
  text-transform: none;
}

body :is(footer:has(.sfc-eco-label), #footer:has(.sfc-eco-label), .sg-legacy-footer) :is(
  .sfc-eco-label, .sfc-eco-name, .sg-footer-brand-title, .sg-footer-label,
  .snmf-footer-grid strong, .sfc-col h4, .sfb-nl-text strong, .sg-legacy-footer-title
) {
  font: var(--sg-footer-title);
  letter-spacing: normal;
  text-transform: none;
}

.sg-legacy-footer-columns {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(4, minmax(0, 1fr));
  gap: 40px;
  overflow-wrap: anywhere;
}

@media (max-width: 820px) {
  .sg-legacy-footer-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
  .sg-legacy-footer-columns > :first-child { grid-column: 1 / -1; }
}

#vb-page-body #footer-user-copyright,
#vb-page-body #footer-current-datetime {
  display: none;
}

@media(max-width:1050px) { .sg-ecosystem .sfc-eco-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:680px) { .sg-ecosystem .sfc-eco-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:430px) { .sg-ecosystem .sfc-eco-grid { grid-template-columns:minmax(0,1fr); } }
