/** Cyberlytics /blog geometry, with the existing green brand retained. */

html body.path-blog.page-blog #wrapper #main-content {
  --cyb-blog-title-width: 100%;
  --cyb-blog-intro-width: min(832px, calc(100vw - 43.2px));
  --cyb-blog-intro-offset: 0px;
}

html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 26.4px 20px 0 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title :is(.container-wrap, .block-content, .field-body, .field-item) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--cyb-blog-title-width) !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title h1 {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 13.6px 19.2px !important;
  border: 1px solid #073d24 !important;
  border-radius: 8px !important;
  background: linear-gradient(125deg, #0a4f2f 0%, #0e6c3e 72%, #138450 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 4px 12px rgb(7 55 32 / 12%) !important;
  text-shadow: none !important;
  text-align: center !important;
  font-size: clamp(19.2px, 2.6vw, 26.4px) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  overflow-wrap: break-word;
}

html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title h1 * {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  font-size: inherit !important;
  background: transparent !important;
  text-shadow: none !important;
}

/* The search and introduction follow their own reference rails, in flow. */
html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-exposedformblog-searchblog-search.block {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 832px !important;
  margin: 26px auto 16px !important;
  padding: 16px 18.4px 33.6px !important;
  border: 1px solid #c5e6d4 !important;
  border-left: 5px solid #0e6c3e !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 4px 14px rgb(14 108 62 / 8%) !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search :is(.container-wrap, .block-content) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search form {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-end !important;
  gap: 10.4px !important;
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search .form-item {
  flex: 1 1 0 !important;
  min-width: 0;
  margin: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search .form-actions {
  display: flex !important;
  flex: 0 0 140px !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search input[name="keys"] {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 48px !important;
  padding: 12px 15.2px !important;
  border: 1px solid #c5e6d4 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #0a2f1c !important;
  -webkit-text-fill-color: #0a2f1c !important;
  font-size: 16px !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search input[type="submit"],
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub a.blog-term-index-back-btn {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 8.8px 20px !important;
  border: 2px solid #0a4f2f !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #4fa36f 0%, #138450 55%, #0e6c3e 100%) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 3px 0 #0a4f2f, 0 8px 18px rgb(14 108 62 / 25%) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search input[type="submit"] {
  width: 140px !important;
  font-size: 15.68px !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search input[type="submit"]:is(:hover, :focus-visible),
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub a.blog-term-index-back-btn:is(:hover, :focus-visible) {
  background: linear-gradient(180deg, #138450 0%, #0e6c3e 55%, #0a4f2f 100%) !important;
}

html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub {
  box-sizing: border-box !important;
  width: var(--cyb-blog-intro-width) !important;
  max-width: var(--cyb-blog-intro-width) !important;
  margin: 0 auto 18.4px !important;
  /* Match the search rail through intermediate Bootstrap wrapper widths. */
  margin-inline: calc((100% - var(--cyb-blog-intro-width)) / 2 + var(--cyb-blog-intro-offset)) calc((100% - var(--cyb-blog-intro-width)) / 2 - var(--cyb-blog-intro-offset)) !important;
  padding: 18.4px 20.8px 19.2px !important;
  border: 1px solid #c5e6d4 !important;
  border-left: 5px solid #0e6c3e !important;
  border-radius: 14px !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: 0 4px 14px rgb(14 108 62 / 8%) !important;
}

html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub > p {
  max-width: 100% !important;
  margin: 0 0 11.2px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #0a2f1c !important;
  -webkit-text-fill-color: #0a2f1c !important;
  font-size: 16.8px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub > p.blog-listing-intro__actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  margin: 16px 0 0 !important;
}

html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub a.blog-term-index-back-btn {
  width: 200px !important;
  font-size: 12.8px !important;
}

html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search :is(input[name="keys"], input[type="submit"]):focus-visible,
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub a.blog-term-index-back-btn:focus-visible {
  outline: 3px solid #138450 !important;
  outline-offset: 3px !important;
}

@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title {
    padding: 24px 24px 0 !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title h1 {
    border-radius: 7px !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-exposedformblog-searchblog-search.block {
    width: calc(100% - 43.2px) !important;
    margin: 18px auto 6px !important;
    padding: 14.4px 13.6px 15.2px !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search form {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #block-martis-exposedformblog-searchblog-search .form-actions {
    flex-basis: auto !important;
    width: 100% !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub > p {
    text-align: left !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub > p.blog-listing-intro__actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .view-header > .blog-listing-intro.cyb-editorial-hub a.blog-term-index-back-btn {
    width: 100% !important;
  }
}

/* A narrow title rail is independent of the wider tablet search/grid rails. */
@media (min-width: 768px) {
  html body.path-blog.page-blog #wrapper #main-content {
    --cyb-blog-title-width: 609px;
    --cyb-blog-intro-width: min(832px, calc(100vw - 58px));
  }
}
@media (min-width: 992px) {
  html body.path-blog.page-blog #wrapper #main-content {
    --cyb-blog-title-width: 849px;
  }
}
@media (min-width: 1200px) {
  html body.path-blog.page-blog #wrapper #main-content {
    --cyb-blog-title-width: 920px;
  }
}
@media (min-width: 768px) and (max-width: 1000px) {
  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title {
    padding-inline: calc(17vw - 79px) 0 !important;
  }
}
@media (max-width: 991.98px) {
  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title {
    padding-top: 24px !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title h1 {
    padding: 11.2px 14.4px !important;
    font-size: clamp(16.8px, 4vw, 20.8px) !important;
  }
}
@media (max-width: 575.98px) {
  html body.path-blog.page-blog #wrapper #main-content #content-wide-top #block-martis-blogh1title h1 {
    padding: 9.6px 12px !important;
    font-size: 16.8px !important;
  }
}

/* Remove the second Bootstrap inset around the listing, not other pages. */
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .main-content {
  padding-inline: 15px !important;
  margin-bottom: 0 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper {
  padding-bottom: 0 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper > .container {
  padding-bottom: 13px !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper #block-martis-content--3 {
  margin-bottom: 0 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .views-view-responsive-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr)) !important;
  gap: 16px !important;
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  column-count: auto !important;
  column-width: auto !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper :is(.views-view-responsive-grid__item, .views-view-responsive-grid__item-inner, .blog-post-teaser, .post-content-wrap, .content-wrap) {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper :is(.views-view-responsive-grid__item-inner, .blog-post-teaser, .post-content-wrap, .content-wrap) {
  flex: 1 1 auto !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser {
  padding-bottom: 5.6px !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-thumb {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 0 -16px !important;
  padding: 0 6.4px !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-image {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 3 / 2 !important;
  margin: 0 0 10.4px !important;
  border-width: 3px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
}
/* Keep titles below the photo without the old relative top offset. */
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-content {
  box-sizing: border-box !important;
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0;
  margin: 0 !important;
  padding: 21.6px 17.6px 18.4px !important;
  top: 0 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-link {
  margin-top: auto !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .read-more {
  width: auto !important;
  min-width: 140px !important;
  min-height: 44px !important;
  padding: 8.8px 20px !important;
  font-size: 15.68px !important;
  line-height: 1.2 !important;
}
html body.path-blog.page-blog #wrapper #main-content #page-wrapper .pagerer-container {
  margin: 8px 0 0 !important;
}
@media (max-width: 991.98px) {
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .main-content {
    padding-inline: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  html body.path-blog.page-blog #wrapper #main-content {
    --cyb-blog-intro-offset: 5px;
  }
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .views-view-responsive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: calc(100vw - 48px) !important;
    margin-inline: calc((100% - (100vw - 48px)) / 2) !important;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper > .container {
    padding-inline: 10px !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .main-content {
    padding-inline: 15px 0 !important;
  }
}
@media (max-width: 767.98px) {
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .views-view-responsive-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-image {
    margin-bottom: 8.8px !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #page-wrapper .blog-post-teaser .post-content {
    padding: 32px 15.2px 16.8px !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #block-breadcrumbs nav.breadcrumb {
    padding: 11.52px 11.2px !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #block-breadcrumbs nav.breadcrumb :is(.breadcrumb__item--current, .breadcrumb__item:last-child) {
    flex: 0 1 auto !important;
    width: auto !important;
    margin-block-start: 0 !important;
  }
  html body.path-blog.page-blog #wrapper #main-content #block-breadcrumbs nav.breadcrumb .breadcrumb__current {
    width: auto !important;
  }
}