/* Homepage hero: framed cage; swap light/dark via Shibuya color-mode. */

.dseams-hero {
  text-align: center;
  margin: 0.5rem 0 1.25rem;
}

.dseams-hero-logo {
  display: none;
  margin: 0 auto;
  max-width: min(320px, 70vw);
  height: auto;
}

html.light .dseams-hero-logo--light,
html:not(.dark) .dseams-hero-logo--light {
  display: block;
}

html.dark .dseams-hero-logo--light {
  display: none;
}

html.dark .dseams-hero-logo--dark {
  display: block;
}

html.light .dseams-hero-logo--dark,
html:not(.dark) .dseams-hero-logo--dark {
  display: none;
}

@media (prefers-color-scheme: dark) {
  html:not(.light):not(.dark) .dseams-hero-logo--light {
    display: none;
  }
  html:not(.light):not(.dark) .dseams-hero-logo--dark {
    display: block;
  }
}

.sy-head-brand img.light-logo,
.sy-head-brand img.dark-logo {
  height: 40px;
  width: auto;
}