/* MOBILE HERO – PRESNE AKO NÁVRH */

@media (max-width: 768px) {
  body.type-category {
    --xcat-hero-height: 180px;
  }

  .type-category .category-top {
    position: relative !important;
    //background: #07100c !important;
    margin: 0px 0 28px !important;
    padding: 0 0 34px !important;
    overflow: hidden !important;
    border-radius: 0 !important;left: calc(50% - 50vw) !important;
    width: 100vw !important;
  }

  .type-category .category-top::before {
    content: "";
    position: absolute !important;
    top: 0 !important;
    left: calc(50% - 50vw) !important;
    width: 100vw !important;
    height: var(--xcat-hero-height) !important;
    z-index: 1 !important;
    background-image: var(--xcat-hero-image) !important;
    background-size: cover !important;
    background-position: var(--xcat-hero-position-mobile, 72% center) !important;
    background-repeat: no-repeat !important;
  }

  .type-category .category-top::after {
    content: "";
    position: absolute !important;
    top: 0 !important;
    left: calc(50% - 50vw) !important;
    width: 100vw !important;
    height: var(--xcat-hero-height) !important;
    z-index: 2 !important;
    pointer-events: none;
    background:
      linear-gradient(
        180deg,
        rgba(7, 16, 12, 0.12) 0%,
        rgba(7, 16, 12, 0.22) 28%,
        rgba(7, 16, 12, 0.70) 58%,
        rgba(7, 16, 12, 0.96) 78%,
        #07100c 100%
      ),
      linear-gradient(
        90deg,
        rgba(7, 16, 12, 0.72) 0%,
        rgba(7, 16, 12, 0.34) 56%,
        rgba(7, 16, 12, 0.08) 100%
      ) !important;
  }

.type-category .breadcrumbs.navigation-home-icon-wrapper {
  position: absolute !important;
  z-index: 10;
  margin: 0 !important;
  padding: 0 !important;
  top: 95px;
  //left: max(20px, calc((100vw - 1320px) / 2));
  color: rgba(255,255,255,.78) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.45);background-color:transparent !important;
}

.type-category .breadcrumbs.navigation-home-icon-wrapper a,
.type-category .breadcrumbs.navigation-home-icon-wrapper span {
  color: rgba(255,255,255,.78) !important;
  text-decoration: none;
}

.type-category .breadcrumbs.navigation-home-icon-wrapper [data-testid="breadcrumbsLastLevel"] span,
.type-category .breadcrumbs.navigation-home-icon-wrapper #navigation-2 span {
  color: var(--xcat-sand) !important;
}

.type-category .breadcrumbs.navigation-home-icon-wrapper .navigation-bullet {
  margin: 0 8px;
  color: rgba(255,255,255,.55) !important;
}
  /* nadpis hore cez fotku */
  .type-category .category-top .category-title {
    position: relative !important;
    z-index: 4 !important;
    max-width: calc(100% - 32px) !important;
    margin: 10px 16px !important;
    padding: 50px 0 0 !important;
    color: #ffffff !important;
    line-height: 1.08 !important;
    text-shadow: 0 4px 18px rgba(0, 0, 0, 0.62) !important;
  }

  /* popis v spodnom tmavom gradiente */
  .type-category .category-top .category-perex {
    position: relative !important;
    z-index: 4 !important;
    margin: 90px 0 0 !important;
    padding: 0 0 32px !important;
    min-height: 0 !important;
    color: #ffffff !important;  background-color: #07100c; border-radius: 0px !important;
  }

  .type-category .category-top .category-perex p {
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.94) !important;
    text-shadow: none !important; padding: 0 16px 0px;
  }

  .type-category .category-top .category-perex strong {
    color: #ffffff !important;
    font-weight: 850 !important;
  }

  .type-category .category-top .category-perex a {
    color: #f4d8a4 !important;
    font-weight: 850 !important;
    text-decoration: underline !important;
    text-underline-offset: 4px !important;
  }
}