:root {
  --catalog-radius-lg: 1.35rem;
  --catalog-shadow: 0 18px 55px color-mix(in srgb, var(--wb-public-text) 10%, transparent);
}

body[data-wb-public-theme] {
  background:
    radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--wb-public-accent) 13%, transparent), transparent 28rem),
    var(--wb-public-page-bg);
}

.wb-public-main { min-height: 68vh; }
.wb-slot-main > .wb-stack { gap: clamp(2.5rem, 6vw, 5rem); }

[data-wb-public-block-type="sticky-navbar"] {
  border-bottom: 1px solid color-mix(in srgb, var(--wb-public-border) 72%, transparent);
  background: color-mix(in srgb, var(--wb-public-page-bg) 86%, transparent);
  backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 8px 30px color-mix(in srgb, var(--wb-public-text) 5%, transparent);
}

.wb-navbar-brand img { width: 2.35rem; height: 2.35rem; border-radius: .7rem; }
.wb-navbar-brand { gap: .7rem; }
.wb-navbar-brand strong { letter-spacing: -.025em; }
.wb-navbar-links { gap: .25rem; }
.wb-navbar-link { border-radius: 999px; padding-inline: .9rem; }

.wb-slot-main > .wb-stack > .wb-section:first-child { padding-top: clamp(3rem, 8vw, 7rem); }
.wb-slot-main h1, .wb-slot-main h2 { letter-spacing: -.04em; text-wrap: balance; }
.wb-slot-main p { text-wrap: pretty; }

[data-wb-public-block-type="grid"] .wb-btn { margin-top: auto; width: 100%; }
.wb-slot-footer { margin-top: clamp(4rem, 10vw, 8rem); border-top: 1px solid var(--wb-public-border); background: var(--wb-public-surface-muted); }
.wb-slot-footer [data-wb-public-block-type="section"] { padding-block: 3.5rem 2rem; }
.wb-slot-footer [data-wb-public-block-type="grid"] { align-items: start; }
.wb-slot-footer [data-wb-public-block-type="plain_text"] { color: var(--wb-public-muted); }

@media (max-width: 760px) {
  .wb-slot-main > .wb-stack > .wb-section:first-child { padding-top: 2rem; }
}

/* Colorful catalog: frame bounded visual entities, not layout wrappers. */
body:is(.wb-page-home,.wb-page-plugins,.wb-page-categories,.wb-page-products)
  [data-wb-public-block-type="grid"] > [data-wb-public-block-type="stack"]:has(> figure) {
  padding: 1rem;
  border: 1px solid var(--wb-public-border);
  border-radius: var(--catalog-radius-lg);
  background: color-mix(in srgb, var(--wb-public-surface) 92%, transparent);
  box-shadow: 0 12px 34px color-mix(in srgb, var(--wb-public-text) 6%, transparent);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

body:is(.wb-page-home,.wb-page-plugins,.wb-page-categories,.wb-page-products)
  [data-wb-public-block-type="grid"] > [data-wb-public-block-type="stack"]:has(> figure):hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--wb-public-accent) 55%, var(--wb-public-border));
  box-shadow: 0 20px 46px color-mix(in srgb, var(--wb-public-text) 10%, transparent);
}

body:is(.wb-page-home,.wb-page-plugins,.wb-page-categories,.wb-page-products)
  [data-wb-public-block-type="grid"] figure {
  margin: 0;
}

body:is(.wb-page-home,.wb-page-plugins,.wb-page-categories,.wb-page-products)
  [data-wb-public-block-type="grid"] figure img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 11;
  object-fit: cover;
  border-radius: calc(var(--catalog-radius-lg) - .35rem);
}

body.wb-page-home .wb-pagination {
  display: none;
}

body:is(.wb-page-administration,.wb-page-analytics,.wb-page-commerce,.wb-page-content,.wb-page-developer-tools,.wb-page-forms,.wb-page-integrations,.wb-page-seo,.wb-page-webblocks-cms,.wb-page-webblocks-appointments,.wb-page-webblocks-campaigns,.wb-page-webblocks-commerce,.wb-page-webblocks-forms,.wb-page-webblocks-quiztem,.wb-page-webblocks-redirect-manager,.wb-page-webblocks-support)
  [data-wb-public-block-type="split"] > figure {
  margin: 0;
  overflow: hidden;
  border-radius: var(--catalog-radius-lg);
}

body:is(.wb-page-administration,.wb-page-analytics,.wb-page-commerce,.wb-page-content,.wb-page-developer-tools,.wb-page-forms,.wb-page-integrations,.wb-page-seo,.wb-page-webblocks-cms,.wb-page-webblocks-appointments,.wb-page-webblocks-campaigns,.wb-page-webblocks-commerce,.wb-page-webblocks-forms,.wb-page-webblocks-quiztem,.wb-page-webblocks-redirect-manager,.wb-page-webblocks-support)
  [data-wb-public-block-type="split"] > figure img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 11;
  object-fit: cover;
}

@media (prefers-reduced-motion: reduce) {
  body:is(.wb-page-home,.wb-page-plugins,.wb-page-categories,.wb-page-products)
    [data-wb-public-block-type="grid"] > [data-wb-public-block-type="stack"]:has(> figure) {
    transition: none;
  }
}