/**
 * ZBI Shell Consistency v1 — unified horizontal grid (P1 polish).
 * Load after template CSS. Does not change URLs, content, or tool logic.
 */
:root {
  --zbi-shell-max: 1180px;
  --zbi-shell-gutter: 1.25rem;
  --zbi-logo-width: 198px;
  --zbi-logo-width-mobile: 180px;
  --zbi-content-readable: 960px;
  --zbi-ds-max: var(--zbi-shell-max);
  --zbi-ds-gutter: var(--zbi-shell-gutter);
  --zbi-cms-max: var(--zbi-shell-max);
  --zbi-cms-pad: var(--zbi-shell-gutter);
}

/* --- Canonical shell containers --- */
.topbar-inner,
.site-header-inner,
.site-footer-inner,
.footer-bottom,
.zbi-breadcrumb-inner,
.breadcrumb,
p.breadcrumb,
.zbi-header-inner {
  box-sizing: border-box;
  max-width: var(--zbi-shell-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--zbi-shell-gutter);
  padding-right: var(--zbi-shell-gutter);
}

/* --- Unified logo geometry --- */
.brand-logo,
.site-header .brand-logo,
.site-header--tools .brand-logo,
.zbi-tools-chrome .brand-logo,
.footer-brand .brand-logo {
  display: block;
  width: var(--zbi-logo-width);
  max-width: 100%;
  height: auto;
  max-height: 54px;
  object-fit: contain;
}

.site-header .logo-brand,
.zbi-tools-chrome .logo-brand {
  flex: 0 0 auto;
  min-width: 0;
}

/* --- Main content axis (contained pages) --- */
body.zbi-ds-active main,
main:not(.page-shell):not(.elementor-page),
.tool-page,
.zbi-tools-chrome .zbi-tools-wrap {
  box-sizing: border-box;
}

body.zbi-ds-active main {
  max-width: var(--zbi-shell-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--zbi-shell-gutter);
  padding-right: var(--zbi-shell-gutter);
}

.tool-page {
  max-width: var(--zbi-shell-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--zbi-shell-gutter);
  padding-right: var(--zbi-shell-gutter);
}

/* --- Header / sticky / admin bar --- */
.site-header,
.zbi-header {
  position: sticky;
  top: 0;
  z-index: 20;
  width: 100%;
}

body.admin-bar .site-header,
body.admin-bar .zbi-header {
  top: 32px;
}

@media (max-width: 782px) {
  body.admin-bar .site-header,
  body.admin-bar .zbi-header {
    top: 46px;
  }
}

.site-nav {
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* Full-bleed hero: inner copy stays on shell axis */
.hero-reference {
  padding-left: max(
    var(--zbi-shell-gutter),
    calc(50vw - var(--zbi-shell-max) / 2 + var(--zbi-shell-gutter))
  );
  padding-right: max(
    var(--zbi-shell-gutter),
    calc(50vw - var(--zbi-shell-max) / 2 + var(--zbi-shell-gutter))
  );
}

/* FHA standalone tool — align body grid to global shell */
.page-shell {
  width: min(var(--zbi-shell-max), calc(100% - 2 * var(--zbi-shell-gutter)));
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 680px) {
  .brand-logo,
  .site-header .brand-logo,
  .site-header--tools .brand-logo,
  .zbi-tools-chrome .brand-logo {
    width: var(--zbi-logo-width-mobile);
  }

  .topbar-inner,
  .site-header-inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}
