/*!
 * Cleafs Optimize — hero-breadcrumbs-global.css (v1.8.0 migration from replacer-flaticon-emoji.css)
 * Universal sitewide hero/title-box + breadcrumbs styling:
 *   - .title-box H1 yellow + white subtitle
 *   - hero container forced to block layout (children stack)
 *   - breadcrumbs delimiter, hover, current item color
 *
 * Loaded sitewide via custom_css.files (named conditional file, universal scope).
 */

/* === HERO (.title-box) — żółty H1, biały subtitle === */
.title-box .title h1 {
  color: #ffe27a !important;
  text-align: center;
  word-break: break-word;
  font-size: 36px;
}
.title-box .subtitle-content {
  font-size: 16px;
  line-height: 26px;
  white-space: pre-wrap;
  text-align: center;
  margin: 13px 0 0;
  color: #ffffff !important;
}
.title-box .page-title .container {
  margin-bottom: 0 !important;
  padding: 37px 15px 36px !important;
}
.title-box {
  overflow: hidden;
  position: relative;
}
.title-box .page-title {
  position: relative;
  z-index: 1;
}
@media (max-width: 767px) {
  .title-box .title h1 { font-size: 24px; }
}

/* === HERO container — FORCE BLOCK layout (children stack) === */
.title-box .page-title .container,
.title-box .page-title .container.header_center,
.title-box .container.header_center,
.title-box .page-title > .container {
  display: block !important;
  flex-direction: unset !important;
  text-align: center !important;
}
.title-box .page-title .container > .title,
.title-box .page-title .container > .subtitle-content,
.title-box .page-title .container > .bread-crumbs,
.title-box .container.header_center > .title,
.title-box .container.header_center > .subtitle-content,
.title-box .container.header_center > .bread-crumbs {
  width: auto !important;
  display: block !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  flex: none !important;
  position: static !important;
}
.title-box .page-title .container > .title h1 {
  text-align: center !important;
  word-break: break-word;
  display: block;
}
.title-box .page-title .container > .subtitle-content {
  margin-top: 13px !important;
  font-size: 16px;
  line-height: 26px;
  max-width: 900px;
}
.title-box .page-title .container > .bread-crumbs {
  margin-top: 19px !important;
}

/* === BREADCRUMBS — białe linki, delimiter », current żółte === */
.title-box .bread-crumbs,
.bread-crumbs {
  margin-top: 19px !important;
  text-align: center;
  display: block !important;
}
.bread-crumbs > * {
  display: inline-block;
}
.bread-crumbs span {
  word-break: break-word;
}
.title-box .bread-crumbs,
.title-box .bread-crumbs a,
.bread-crumbs,
.bread-crumbs a {
  color: #ffffff !important;
}
.title-box .bread-crumbs a:hover,
.bread-crumbs a:hover {
  color: #ffe27a !important;
}
.bread-crumbs .current,
.bread-crumbs .breadcrumb_last,
.bread-crumbs .breadcrumb_last strong,
.title-box .bread-crumbs .current,
.title-box .bread-crumbs .breadcrumb_last {
  color: #ffe27a !important;
  font-weight: 700;
}
.bread-crumbs .delimiter,
.title-box .bread-crumbs .delimiter {
  position: relative;
  margin: 0 12px;
  display: inline-block;
}
.bread-crumbs .delimiter:before,
.title-box .bread-crumbs .delimiter:before {
  content: "\BB" !important;
  display: inline-block;
  font-family: inherit !important;
  color: rgba(255,255,255, .5) !important;
  font-size: 14px;
  line-height: 13px;
  text-align: center;
  width: auto;
  height: auto;
}