:root {
  --orchid-container-max: 1480px;
  --orchid-container-gutter: 40px;
}

.orchid-content-container {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--orchid-container-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--orchid-container-gutter) !important;
}

.public-header-stack {
  border-bottom: 1px solid var(--border-subtle, rgba(17, 17, 17, 0.14));
}

.public-header-stack > .site-header.orchid-content-container {
  width: 100% !important;
  max-width: var(--orchid-container-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--orchid-container-gutter) !important;
  border-bottom: 0 !important;
}

.site-footer {
  padding-inline: 0 !important;
}

.site-footer__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

html body.page-discover #discover .discover-intelligent-search.orchid-content-container,
html body.page-discover #discover .discover-flow-section.orchid-content-container,
html body.page-discover #discover .discover-load-more.orchid-content-container,
html body.page-brands #brands :is(.brand-public, .brand-dashboard).orchid-content-container,
html body:is(.page-journal, .page-blog) #journal .journal-intelligence-shell.orchid-content-container,
html body.page-creator-link #shop .public-creator-storefront.orchid-content-container,
html body.page-creator-link #shop .buyer-storefront-skeleton.orchid-content-container {
  width: 100% !important;
  max-width: var(--orchid-container-max) !important;
  margin-inline: auto !important;
  padding-inline: var(--orchid-container-gutter) !important;
}

.creator-app.orchid-content-container #screen-storefront {
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
  transform: none !important;
}

@media (max-width: 1024px) {
  :root {
    --orchid-container-gutter: 32px;
  }
}

@media (max-width: 760px) {
  :root {
    --orchid-container-gutter: 18px;
  }

  .site-footer__container {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }
}

@media (max-width: 420px) {
  :root {
    --orchid-container-gutter: 16px;
  }
}
