/* Essentials Design public catalogue theme.
   This file owns the client-facing catalogue only. Studio continues to use styles.css. */
:root {
  --ed-public-bg: #f4f0e8;
  --ed-public-bg-2: #ebe3d5;
  --ed-public-ink: #23211d;
  --ed-public-soft-ink: #5f584f;
  --ed-public-muted: #7b7165;
  --ed-public-gold: #9d7646;
  --ed-public-line: rgba(103, 88, 67, 0.20);
  --ed-public-card: rgba(255, 253, 248, 0.90);
  --ed-public-glass: rgba(226, 221, 211, 0.86);
  --ed-public-shadow: 0 24px 70px rgba(48, 39, 26, 0.13);
  --ed-public-serif: Georgia, "Times New Roman", serif;
  --ed-public-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

html:has(body.public-surface),
body.public-surface {
  min-height: 100% !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  color: var(--ed-public-ink) !important;
  font-family: var(--ed-public-sans) !important;
  background:
    radial-gradient(circle at 18% 4%, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0) 28%),
    linear-gradient(180deg, var(--ed-public-bg) 0%, var(--ed-public-bg-2) 100%) !important;
}

body.public-surface::before,
body.public-surface::after,
body.public-surface .topbar::before,
body.public-surface .topbar::after,
body.public-surface .client-catalogue-intro::before,
body.public-surface .client-catalogue-intro::after,
body.public-surface .customer-gallery::before,
body.public-surface .customer-gallery::after {
  content: none !important;
  display: none !important;
}

body.public-surface .studio-only,
body.public-surface #storageStatus,
body.public-surface #grokStatus,
body.public-surface #openaiStatus,
body.public-surface #creditUsedStatus,
body.public-surface #creditAvailableStatus,
body.public-surface #productCostStatus,
body.public-surface .surface-switcher,
body.public-surface.direct-catalogue-domain .public-menu-studio-toggle,
body.public-surface .public-catalogue-tools,
body.public-surface .library-mode-toggle,
body.public-surface .library-smart-chips,
body.public-surface .library-active-filter-summary,
body.public-surface .library-bulk-actions,
body.public-surface .library-selection-bar,
body.public-surface .customer-gallery-actions,
body.public-surface .local-safe-banner {
  display: none !important;
}

body.public-surface #app,
body.public-surface main,
body.public-surface #libraryPage,
body.public-surface .library-page,
body.public-surface .client-catalogue-intro,
body.public-surface .public-catalogue-explore,
body.public-surface .library-filter-shell,
body.public-surface .library-page-summary,
body.public-surface .library-dashboard-grid,
body.public-surface .customer-gallery-shell,
body.public-surface .customer-gallery-main,
body.public-surface .customer-gallery-info {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.public-surface .topbar,
body.public-surface .customer-gallery-top {
  position: sticky !important;
  top: 18px !important;
  z-index: 900 !important;
  width: min(1260px, calc(100vw - 56px)) !important;
  height: 74px !important;
  min-height: 74px !important;
  max-height: 74px !important;
  margin: 22px auto 28px !important;
  padding: 0 26px !important;
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) 54px !important;
  align-items: center !important;
  gap: 18px !important;
  overflow: visible !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-bottom-color: var(--ed-public-line) !important;
  border-radius: 999px !important;
  background: var(--ed-public-glass) !important;
  box-shadow: var(--ed-public-shadow) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

body.public-surface .brand,
body.public-surface .top-actions,
body.public-surface .public-menu-wrap,
body.public-surface .customer-gallery-menu-wrap {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
}

body.public-surface .brand > div {
  display: none !important;
}

body.public-surface #brandLogo,
body.public-surface .customer-gallery-top > img {
  width: 82px !important;
  height: 46px !important;
  display: block !important;
  object-fit: contain !important;
  opacity: 1 !important;
  filter: none !important;
  background: transparent !important;
}

body.public-surface .public-glass-menu,
body.public-surface .customer-gallery-links {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(22px, 4vw, 52px) !important;
  min-width: 0 !important;
}

body.public-surface .public-glass-menu a,
body.public-surface .customer-gallery-links button {
  min-height: auto !important;
  padding: 0 0 7px !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ed-public-soft-ink) !important;
  font-size: 14px !important;
  font-weight: 760 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

body.public-surface .public-glass-menu a:hover,
body.public-surface .public-glass-menu a:first-child,
body.public-surface .customer-gallery-links button:hover,
body.public-surface .customer-gallery-links button:first-child {
  color: var(--ed-public-ink) !important;
  border-bottom-color: var(--ed-public-gold) !important;
}

body.public-surface .top-actions,
body.public-surface .public-menu-wrap,
body.public-surface .customer-gallery-menu-wrap {
  position: relative !important;
  justify-content: flex-end !important;
}

body.public-surface .public-menu-button,
body.public-surface .customer-gallery-menu-button {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  border: 1px solid rgba(61, 52, 38, 0.13) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, 0.58) !important;
  box-shadow: none !important;
}

body.public-surface .public-menu-button span,
body.public-surface .customer-gallery-menu-button span {
  width: 18px !important;
  height: 1.5px !important;
  margin: 0 !important;
  display: block !important;
  border-radius: 999px !important;
  background: var(--ed-public-ink) !important;
}

body.public-surface .public-menu-panel,
body.public-surface .customer-gallery-menu-panel {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  right: 0 !important;
  z-index: 1100 !important;
  min-width: 214px !important;
  padding: 10px !important;
  border: 1px solid var(--ed-public-line) !important;
  border-radius: 18px !important;
  background: rgba(250, 247, 240, 0.98) !important;
  box-shadow: var(--ed-public-shadow) !important;
}

body.public-surface .public-menu-panel.hidden,
body.public-surface .customer-gallery-menu-panel.hidden {
  display: none !important;
}

body.public-surface .public-menu-panel button,
body.public-surface .customer-gallery-menu-panel button {
  width: 100% !important;
  min-height: 40px !important;
  justify-content: flex-start !important;
  padding: 9px 11px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--ed-public-ink) !important;
  font-size: 13px !important;
  font-weight: 760 !important;
  text-align: left !important;
}

body.public-surface .public-menu-panel button:hover,
body.public-surface .customer-gallery-menu-panel button:hover {
  background: rgba(157, 118, 70, 0.10) !important;
}

body.public-surface .client-catalogue-intro {
  width: min(1260px, calc(100vw - 56px)) !important;
  min-height: clamp(560px, calc(100dvh - 150px), 780px) !important;
  margin: 0 auto 72px !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: flex-end !important;
  padding: clamp(34px, 5vw, 72px) !important;
  border-radius: 30px !important;
  background:
    linear-gradient(90deg, rgba(24, 20, 15, 0.76) 0%, rgba(24, 20, 15, 0.45) 42%, rgba(24, 20, 15, 0.12) 100%),
    var(--public-hero-image),
    linear-gradient(135deg, #5a554b, #d8cec0) !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: var(--ed-public-shadow) !important;
}

body.public-surface .client-catalogue-copy {
  width: min(680px, 100%) !important;
  position: relative !important;
  z-index: 2 !important;
}

body.public-surface .client-catalogue-copy span,
body.public-surface .public-catalogue-explore section > span,
body.public-surface .customer-gallery-meta,
body.public-surface .customer-gallery-details dt {
  color: #d4b98f !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: 0.22em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

body.public-surface .client-catalogue-copy h2,
body.public-surface .customer-gallery-copy h2 {
  font-family: var(--ed-public-serif) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

body.public-surface .client-catalogue-copy h2 {
  max-width: 740px !important;
  margin: 16px 0 20px !important;
  color: #fffaf1 !important;
  font-size: clamp(52px, 7.5vw, 116px) !important;
  line-height: 0.92 !important;
}

body.public-surface .client-catalogue-copy p {
  max-width: 650px !important;
  margin: 0 !important;
  color: rgba(255, 250, 241, 0.88) !important;
  font-size: 16px !important;
  font-weight: 620 !important;
  line-height: 1.62 !important;
}

body.public-surface .client-catalogue-hero {
  position: absolute !important;
  right: clamp(28px, 4vw, 58px) !important;
  bottom: clamp(28px, 4vw, 58px) !important;
  z-index: 3 !important;
  min-height: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

body.public-surface .client-catalogue-actions {
  display: none !important;
}

body.public-surface .client-catalogue-stats {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
}

body.public-surface .client-catalogue-stats div {
  width: 92px !important;
  height: 92px !important;
  min-height: 92px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.36) !important;
  background: rgba(38, 34, 29, 0.52) !important;
  color: #fffaf1 !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 3px !important;
  text-align: center !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

body.public-surface .client-catalogue-stats strong {
  font-size: 24px !important;
  line-height: 1 !important;
}

body.public-surface .client-catalogue-stats small {
  color: rgba(255, 250, 241, 0.86) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

body.public-surface .public-catalogue-explore,
body.public-surface .library-filter-shell,
body.public-surface .library-page-summary,
body.public-surface .library-dashboard-grid {
  width: min(1260px, calc(100vw - 56px)) !important;
  max-width: 1260px !important;
}

body.public-surface .public-catalogue-explore {
  margin: 0 auto 28px !important;
  display: grid !important;
  grid-template-columns: 130px minmax(0, 1fr) !important;
  gap: 14px 20px !important;
}

body.public-surface .public-catalogue-explore.hidden {
  display: none !important;
}

body.public-surface .public-catalogue-explore section {
  display: contents !important;
}

body.public-surface .public-catalogue-explore section > span {
  align-self: center !important;
  color: var(--ed-public-gold) !important;
}

body.public-surface .public-explore-chips,
body.public-surface .public-search-suggestions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 9px !important;
}

body.public-surface .public-explore-chips button,
body.public-surface .public-search-suggestions button {
  min-height: 34px !important;
  padding: 8px 15px !important;
  border: 1px solid var(--ed-public-line) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, 0.66) !important;
  box-shadow: none !important;
  color: var(--ed-public-muted) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body.public-surface .public-explore-chips button.active,
body.public-surface .public-explore-chips button:hover,
body.public-surface .public-search-suggestions button:hover {
  color: var(--ed-public-ink) !important;
  border-color: rgba(157, 118, 70, 0.45) !important;
}

body.public-surface .library-filter-shell.smart-library-filter {
  margin: 0 auto 24px !important;
  padding: 0 !important;
}

body.public-surface .library-filter-top {
  position: relative !important;
  min-height: 62px !important;
  padding: 0 12px 0 22px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 40px 62px !important;
  align-items: center !important;
  gap: 12px !important;
  overflow: visible !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-bottom-color: var(--ed-public-line) !important;
  border-radius: 999px !important;
  background: rgba(226, 221, 211, 0.76) !important;
  box-shadow: 0 20px 54px rgba(63, 50, 31, 0.10) !important;
}

body.public-surface .library-filter-top::before,
body.public-surface .library-filter-top::after,
body.public-surface .library-search-icon,
body.public-surface .library-search-icon svg {
  content: none !important;
  display: none !important;
}

body.public-surface #librarySearchInput {
  width: 100% !important;
  min-width: 0 !important;
  height: 48px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: var(--ed-public-ink) !important;
  font-size: 15px !important;
  font-weight: 720 !important;
}

body.public-surface #librarySearchInput::placeholder {
  color: #8b8378 !important;
  opacity: 1 !important;
}

body.public-surface #libraryMoreFiltersBtn,
body.public-surface #libraryClearFiltersBtn {
  min-height: 42px !important;
  height: 42px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, 0.70) !important;
  box-shadow: none !important;
  color: var(--ed-public-muted) !important;
}

body.public-surface #libraryMoreFiltersBtn {
  width: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
}

body.public-surface #libraryMoreFiltersBtn svg {
  width: 18px !important;
  height: 18px !important;
  stroke: #5f584f !important;
  stroke-width: 2 !important;
}

body.public-surface #libraryClearFiltersBtn {
  padding: 0 16px !important;
  font-size: 12px !important;
  font-weight: 820 !important;
}

body.public-surface .public-search-suggestions {
  width: 100% !important;
  margin: 12px 0 0 !important;
}

body.public-surface .public-search-suggestions.hidden {
  display: none !important;
}

body.public-surface .library-page-summary {
  margin: 8px auto 16px !important;
  color: rgba(82, 75, 66, 0.78) !important;
  font-size: 13px !important;
  font-weight: 780 !important;
}

body.public-surface .library-dashboard-grid {
  margin: 0 auto 80px !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
}

body.public-surface .library-dashboard-card.showcase-card {
  position: relative !important;
  min-height: 0 !important;
  padding: 0 0 54px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid rgba(161, 137, 101, 0.24) !important;
  border-radius: 22px !important;
  background: var(--ed-public-card) !important;
  box-shadow: 0 16px 46px rgba(67, 54, 36, 0.08) !important;
  color: var(--ed-public-ink) !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.public-surface .library-dashboard-card.showcase-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(157, 118, 70, 0.36) !important;
  box-shadow: 0 22px 62px rgba(67, 54, 36, 0.12) !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-dashboard-thumb-wrap {
  width: 100% !important;
  height: clamp(220px, 20vw, 310px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 20px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fffefa !important;
}

body.public-surface .library-dashboard-card.showcase-card img,
body.public-surface .library-dashboard-card.showcase-card .library-dashboard-thumb-empty {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  border-radius: 14px !important;
  background: transparent !important;
}

body.public-surface .library-dashboard-card.showcase-card strong {
  display: block !important;
  margin: 17px 20px 9px !important;
  color: var(--ed-public-ink) !important;
  font-family: var(--ed-public-serif) !important;
  font-size: clamp(20px, 1.55vw, 27px) !important;
  font-weight: 600 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
}

body.public-surface .library-dashboard-card.showcase-card small {
  display: block !important;
  margin: 0 20px 7px !important;
  color: var(--ed-public-muted) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  line-height: 1.34 !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-card-status,
body.public-surface .library-dashboard-card.showcase-card .library-card-badges,
body.public-surface .library-dashboard-card.showcase-card .library-thumbnail-label,
body.public-surface .library-dashboard-card.showcase-card .library-gallery-chip,
body.public-surface .library-dashboard-card.showcase-card .public-card-button-compact {
  display: none !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-card-actions {
  position: absolute !important;
  right: 16px !important;
  bottom: 16px !important;
  z-index: 5 !important;
  display: block !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--ed-public-line) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 8px 20px rgba(52, 41, 25, 0.11) !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot::before,
body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 11px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: var(--ed-public-ink) !important;
  transform: translate(-50%, -50%) !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot::after {
  transform: translate(-50%, -50%) rotate(90deg) !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot.active {
  background: var(--ed-public-ink) !important;
  border-color: var(--ed-public-ink) !important;
}

body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot.active::before,
body.public-surface .library-dashboard-card.showcase-card .library-shortlist-dot.active::after {
  background: #fffaf1 !important;
}

body.public-surface:has(#customerGalleryModal.customer-gallery:not(.hidden)) {
  overflow: hidden !important;
}

body.public-surface #customerGalleryModal.customer-gallery.hidden {
  display: none !important;
}

body.public-surface #customerGalleryModal.customer-gallery:not(.hidden) {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2000 !important;
  display: block !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 18px 0 40px !important;
  -webkit-overflow-scrolling: touch !important;
  background:
    radial-gradient(circle at 18% 4%, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0) 32%),
    linear-gradient(180deg, var(--ed-public-bg) 0%, var(--ed-public-bg-2) 100%) !important;
}

body.public-surface .customer-gallery-shell {
  width: min(1320px, calc(100vw - 56px)) !important;
  min-height: calc(100dvh - 58px) !important;
  margin: 0 auto !important;
  padding: 0 0 34px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.28fr) minmax(330px, 0.72fr) !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 24px 28px !important;
  align-items: start !important;
}

body.public-surface .customer-gallery-top {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  top: 12px !important;
  margin-top: 0 !important;
  z-index: 2020 !important;
}

body.public-surface .customer-gallery-main {
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 50px minmax(0, 1fr) 50px !important;
  align-items: center !important;
  gap: 14px !important;
}

body.public-surface .customer-gallery-frame {
  margin: 0 !important;
  padding: 22px !important;
  border: 1px solid var(--ed-public-line) !important;
  border-radius: 26px !important;
  background: rgba(255, 253, 248, 0.68) !important;
  box-shadow: 0 18px 54px rgba(63, 51, 33, 0.08) !important;
  text-align: center !important;
}

body.public-surface .customer-gallery-frame img {
  display: block !important;
  width: 100% !important;
  max-height: 60dvh !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  border-radius: 18px !important;
  background: transparent !important;
}

body.public-surface .customer-gallery-frame figcaption {
  margin-top: 12px !important;
  color: var(--ed-public-muted) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: 0.22em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

body.public-surface .customer-gallery-nav {
  position: static !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--ed-public-line) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.74) !important;
  box-shadow: 0 10px 28px rgba(55, 43, 25, 0.10) !important;
  color: var(--ed-public-ink) !important;
  font-size: 30px !important;
  line-height: 1 !important;
}

body.public-surface .customer-gallery-info {
  grid-column: 2 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 26px 0 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 26px !important;
  border-top: 1px solid var(--ed-public-line) !important;
}

body.public-surface .customer-gallery-copy h2 {
  margin: 12px 0 16px !important;
  color: var(--ed-public-ink) !important;
  font-size: clamp(42px, 5vw, 76px) !important;
  line-height: 0.96 !important;
}

body.public-surface .customer-gallery-copy p {
  max-width: 640px !important;
  margin: 0 !important;
  color: var(--ed-public-muted) !important;
  font-size: 15px !important;
  font-weight: 620 !important;
  line-height: 1.62 !important;
}

body.public-surface .customer-gallery-details {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.public-surface .customer-gallery-details div {
  min-height: 0 !important;
  padding: 14px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ed-public-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.public-surface .customer-gallery-details dt {
  color: var(--ed-public-gold) !important;
}

body.public-surface .customer-gallery-details dd {
  margin: 7px 0 0 !important;
  color: var(--ed-public-ink) !important;
  font-size: 13px !important;
  font-weight: 780 !important;
  line-height: 1.42 !important;
}

body.public-surface .customer-gallery-dots {
  grid-column: 1 !important;
  grid-row: 3 !important;
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 0 auto !important;
}

body.public-surface .customer-gallery-dots button {
  width: 9px !important;
  height: 9px !important;
  min-width: 9px !important;
  min-height: 9px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(77, 72, 64, 0.24) !important;
  font-size: 0 !important;
}

body.public-surface .customer-gallery-dots button.active {
  width: 28px !important;
  background: var(--ed-public-gold) !important;
}

@media (max-width: 1100px) {
  body.public-surface .library-dashboard-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.public-surface .customer-gallery-info {
    grid-column: 1 !important;
    grid-row: 3 !important;
    grid-template-columns: 1fr !important;
  }

  body.public-surface .customer-gallery-shell {
    grid-template-columns: 1fr !important;
  }

  body.public-surface .customer-gallery-dots {
    grid-row: 4 !important;
  }
}

@media (max-width: 760px) {
  body.public-surface .topbar,
  body.public-surface .customer-gallery-top {
    top: 10px !important;
    width: calc(100vw - 24px) !important;
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
    margin: 12px auto 22px !important;
    padding: 0 14px !important;
    grid-template-columns: 74px minmax(0, 1fr) 42px !important;
    gap: 10px !important;
  }

  body.public-surface #brandLogo,
  body.public-surface .customer-gallery-top > img {
    width: 60px !important;
    height: 36px !important;
  }

  body.public-surface .public-glass-menu,
  body.public-surface .customer-gallery-links {
    gap: 15px !important;
    overflow: hidden !important;
  }

  body.public-surface .public-glass-menu a,
  body.public-surface .customer-gallery-links button {
    font-size: 12px !important;
  }

  body.public-surface .public-glass-menu a:nth-child(3),
  body.public-surface .customer-gallery-links button:nth-child(3) {
    display: none !important;
  }

  body.public-surface .public-menu-button,
  body.public-surface .customer-gallery-menu-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }

  body.public-surface .client-catalogue-intro,
  body.public-surface .public-catalogue-explore,
  body.public-surface .library-filter-shell,
  body.public-surface .library-page-summary,
  body.public-surface .library-dashboard-grid,
  body.public-surface .customer-gallery-shell {
    width: calc(100vw - 24px) !important;
  }

  body.public-surface .client-catalogue-intro {
    min-height: calc(100dvh - 108px) !important;
    margin-bottom: 42px !important;
    padding: 28px !important;
    border-radius: 24px !important;
    background:
      linear-gradient(180deg, rgba(24, 20, 15, 0.18) 0%, rgba(24, 20, 15, 0.76) 100%),
      var(--public-hero-image),
      linear-gradient(135deg, #5a554b, #d8cec0) !important;
    background-size: cover !important;
    background-position: center !important;
  }

  body.public-surface .client-catalogue-copy h2 {
    font-size: clamp(42px, 14vw, 68px) !important;
  }

  body.public-surface .client-catalogue-copy p {
    font-size: 14px !important;
  }

  body.public-surface .client-catalogue-hero {
    right: 18px !important;
    top: 18px !important;
    bottom: auto !important;
  }

  body.public-surface .client-catalogue-stats {
    gap: 6px !important;
  }

  body.public-surface .client-catalogue-stats div {
    width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
  }

  body.public-surface .client-catalogue-stats strong {
    font-size: 15px !important;
  }

  body.public-surface .client-catalogue-stats small {
    font-size: 8px !important;
  }

  body.public-surface .public-catalogue-explore {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  body.public-surface .public-catalogue-explore section > span {
    margin-top: 8px !important;
  }

  body.public-surface .library-filter-top {
    min-height: 56px !important;
    grid-template-columns: minmax(0, 1fr) 38px !important;
    gap: 8px !important;
    padding: 0 10px 0 16px !important;
  }

  body.public-surface #librarySearchInput {
    height: 44px !important;
    font-size: 13px !important;
  }

  body.public-surface #libraryMoreFiltersBtn {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
  }

  body.public-surface #libraryClearFiltersBtn {
    display: none !important;
  }

  body.public-surface .library-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  body.public-surface .library-dashboard-card.showcase-card {
    padding-bottom: 48px !important;
    border-radius: 18px !important;
  }

  body.public-surface .library-dashboard-card.showcase-card .library-dashboard-thumb-wrap {
    height: 154px !important;
    padding: 10px !important;
  }

  body.public-surface .library-dashboard-card.showcase-card strong {
    margin: 12px 13px 8px !important;
    font-size: 19px !important;
  }

  body.public-surface .library-dashboard-card.showcase-card small {
    margin: 0 13px 6px !important;
    font-size: 10.5px !important;
  }

  body.public-surface #customerGalleryModal.customer-gallery:not(.hidden) {
    padding: 10px 0 28px !important;
  }

  body.public-surface .customer-gallery-shell {
    min-height: 100dvh !important;
    padding-bottom: 24px !important;
    gap: 18px !important;
  }

  body.public-surface .customer-gallery-main {
    grid-template-columns: 38px minmax(0, 1fr) 38px !important;
    gap: 8px !important;
  }

  body.public-surface .customer-gallery-frame {
    padding: 10px !important;
    border-radius: 20px !important;
  }

  body.public-surface .customer-gallery-frame img {
    max-height: 42dvh !important;
    border-radius: 14px !important;
  }

  body.public-surface .customer-gallery-info {
    display: block !important;
    padding-top: 18px !important;
  }

  body.public-surface .customer-gallery-copy h2 {
    font-size: clamp(36px, 11vw, 52px) !important;
  }

  body.public-surface .customer-gallery-details {
    grid-template-columns: 1fr !important;
    margin-top: 18px !important;
  }
}

@media (max-width: 430px) {
  body.public-surface .public-glass-menu a:nth-child(2),
  body.public-surface .customer-gallery-links button:nth-child(2) {
    display: none !important;
  }

  body.public-surface .library-dashboard-grid {
    gap: 12px !important;
  }

  body.public-surface .library-dashboard-card.showcase-card .library-dashboard-thumb-wrap {
    height: 138px !important;
  }
}