/*
Theme Name:     Innotechnika
Theme URI:      n/a
Template:       kadence
Author:         Innotechnika
Author URI:     n/a
Description:    Child Theme Description
Version:        1.0.4
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/

html {
  scroll-behavior: smooth;
  scroll-padding-top: 120px;
}
.grecaptcha-badge {
  visibility: hidden;
}

/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(64, 94, 92, 0.85);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(64, 94, 92, 0.85);
}

strong {
  font-weight: 600;
}

.wp-block-kadence-advancedheading {
  &.has-light-background,
  &.has-dark-background {
    position: relative !important;

    .kb-adv-text-inner {
      padding: 0 20px 2px;
      -webkit-box-decoration-break: clone;
      box-decoration-break: clone;
      border-radius: 0;
      display: inline;

      @media (max-width: 767px) {
        padding: 0 16px;
        top: 8px;
        font-size: 28px;
      }

      span {
        position: relative;
        z-index: 2;
      }
    }

    &.heading-with-icon {
      &.kt-adv-heading-has-icon {
        position: relative;
        display: inline-block !important;
        gap: 0px !important;
        background-color: transparent;
        align-items: unset !important;
      }
  
      .kb-svg-icon-wrap {
        position: absolute;
        top: -8px;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--global-palette2);
        padding: 6px 22px;
        height: calc(100% + 17px);
        color: #fff;
  
        @media (max-width: 767px) {
          top: -6px;
          font-size: 28px !important;
          height: calc(100% + 12px);
        }
      }
  
      .kb-adv-text-inner {
        margin-left: 90px;
  
        @media (max-width: 767px) {
          margin-left: 72px;
        }
      }

      &::after {
        height: calc(100% + 17px);

        @media (max-width: 767px) {
          height: calc(100% + 12px);
          top: -6px;
        }
      }
    }

    &::after {
      content: "";
      position: absolute;
      height: calc(100% + 15px);
      width: 100vw;
      top: -8px;
      right: 100%;

      @media (max-width: 767px) {
        height: calc(100% + 4px);
        top: -1px;
      }
    }

    &.only-text {
      @media (max-width: 767px) {
        font-size: 24px !important;
        line-height: 1.15 !important;

        &::after {
          height: calc(100% + 7px);
          top: -4px;
        }

        .kb-adv-text-inner {
          @media (max-width: 767px) {
            font-size: 24px !important;
            line-height: 1.15 !important;
          }
        }
      }
    }

    &.only-text-left {
      .kb-adv-text-inner {
        padding: 0 20px 0 0;

        @media (max-width: 767px) {
          padding: 0 16px 0 0;
        }
      }
    }

    &.product-subheadline {
      &::after {
        height: calc(100% + 19px);
        top: -10px;

        @media (max-width: 767px) {
          top: -4px;
          height: calc(100% + 8px);
        }
      }

      .kb-adv-text-inner {
        @media (max-width: 767px) {
          font-size: 28px !important;
          line-height: 1.15 !important;
        }
      }
    }

    &.main-heading {

      @media (max-width: 767px) {
        font-size: 25px !important;
        line-height: 1 !important;
      }

      & .kb-adv-text-inner {
        padding-left: 0;

        @media (max-width: 767px) {
          font-size: 25px !important;
          line-height: 1 !important;
        }
      }

      &::after {
        height: calc(100% + 21px);
        top: -10px;

        @media (max-width: 767px) {
          height: calc(100% + 11px);
          top: -6px;
        }
      }
    }

    &.main-only-text {
      margin-top: 19px;

      .kb-adv-text-inner {
        padding: 8px 20px 8px 0;
      }

      @media (max-width: 767px) {
        margin-top: 13px;
       font-size: 15px !important;
       line-height: 1.15 !important;

        .kb-adv-text-inner {
          padding: 7px 16px 6px 0;
          font-size: 14px !important;
          line-height: 1.15 !important;
        }
      }

      &::after {
        height: calc(100% + 16px);
        top: -8px;
      }
    }

    &.case-studie-headline {
      &::after {
        display: none;
      }

      .kb-adv-text-inner {
        padding: 0 16px;
      }
    }
  }

  &.has-light-background {
    &::after {
      background-color: #fff;
    }

    .kb-adv-text-inner {
      background-color: #fff;
    }
  }

  &.has-dark-background {
    &::after {
      background-color: var(--global-palette1);
    }

    .kb-adv-text-inner {
      background-color: var(--global-palette1);
    }
  }
  &.blog-heading {
    line-height: 1.1;
    .kb-svg-icon-wrap {
      top: -7px !important;
    }
    &::after {
      top: -7px;
    }
    .kb-adv-text-inner {
      padding-top: 1px;
      padding-bottom: 4px;
    }
    @media(max-width: 767px) {
      .kb-svg-icon-wrap {
        top: -6px !important;
      }
      .kb-adv-text-inner {
        padding-top: 1px;
        padding-bottom: 1px;
      }
    }
  }
}

.arrow-button {
  padding: 0 !important;
  border-radius: 0 !important;
  gap: 0 !important;

  .kt-btn-inner-text {
    padding: 12.5px 18.5px !important;
  }

  .kb-svg-icon-wrap {
    background-color: var(--global-palette-btn-bg-hover);
    color: #fff;
    padding: 13px;
  }
}

.kb-form-basic-style input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
}

.testimonials {
  .kb-advanced-slide-inner {
    overflow: unset;
    text-align: left;

    p.testimonial-content-desc {
      position: relative;
      background-color: transparent !important;
      margin: 16px auto;
      padding-top: 7px !important;
      padding-bottom: 7px !important;

      .testimonial-content {
        display: inline;
        text-align: center !important;
        box-decoration-break: clone;
        -webkit-box-decoration-break: clone;
        position: relative;
        padding-left: 16px !important;
        padding-right: 16px !important;
      }

      span {
        position: relative;
      }

      &::before,
      &::after {
        position: absolute;
        content: "";
        font-family: "innotechnika" !important;
        speak: never;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;

        /* Better Font Rendering =========== */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: var(--global-palette2);
        z-index: 2;
      }

      &::before {
        content: "\e909";
        bottom: -16px;
        left: -46px;
      }

      &::after {
        content: "\e908";
        top: -16px;
        right: -60px;
      }

      @media (max-width: 1024px) {
        font-size: 24px;

        &::before,
        &::after {
          font-size: 20px;
        }

        &::before {
          left: -30px;
        }

        &::after {
          right: -30px;
        }
      }

      @media (max-width: 767px) {
        font-size: 22px;
      }
    }
  }

  .kb-splide {
    &[data-slider-dots="true"] {
      margin-bottom: 0 !important;
    }
    .splide__slide {
      display: flex;
      justify-content: center;
      align-items: center;

      @media (max-width: 1024px) {
        .kb-advanced-slide {
          padding-right: 2rem;
          padding-left: 2rem;
        }
      }
    }

    &:hover {
      .splide__arrow {
        opacity: 1;
      }
    }

    .splide__arrow {
      background: transparent;
      border: none;
      opacity: 1;
      width: 32px;
      height: 32px;

      svg {
        display: none;
      }

      &::before {
        position: relative;
        content: "";
        font-family: "innotechnika" !important;
        speak: never;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;

        /* Better Font Rendering =========== */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-size: 32px;
        z-index: 2;
      }

      &.splide__arrow--next {
        &::before {
          content: "\e907";
        }
      }

      &.splide__arrow--prev {
        &::before {
          content: "\e906";
        }
      }

      &:hover,
      &:focus {
        opacity: 1;
        background: transparent;
      }

      @media (max-width: 1024px) {
        display: none;
      }
    }
  }

  ul.splide__pagination.splide__pagination {
    display: none;
    position: relative !important;
    bottom: unset !important;
    left: unset !important;
    right: unset !important;
    margin: 2rem auto 0 !important;
    justify-content: center !important;
    align-items: center !important;

    @media (max-width: 1024px) {
      display: flex;
    }
  }

  &.testimonials-light {
    .testimonial-content {
      background-color: var(--global-palette1) !important;
    }

    .splide__arrow {
      color: var(--global-palette1);

      &:hover {
        color: var(--global-palette2);
      }
    }
  }

  &.testimonials-dark {
    .testimonial-content {
      background-color: var(--global-palette9) !important;
    }

    .splide__arrow {
      color: var(--global-palette9);

      &:hover {
        color: var(--global-palette2);
      }
    }

    .splide__pagination {
      .splide__pagination__page {
        background-color: var(--global-palette9);
      }
    }
  }
}

.inno-info-box {
  .kt-blocks-info-box-link-wrap {
    position: relative;
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-gap: 36px;

    &::before {
      content: "";
      position: absolute;
      height: 100%;
      width: 3px;
      top: 0;
      left: 75px;
      background-color: var(--global-palette1);

      @media (max-width: 767px) {
        left: 65px;
      }
    }
  }
  .kt-blocks-info-box-media {
    padding: 7px 0 !important;

    .kb-svg-icon-wrap {
      color: var(--global-palette1) !important;
    }

    @media (max-width: 767px) {
     .kb-svg-icon-wrap {
      font-size: 48px !important;
     }
    }
  }
  .kt-infobox-textcontent {
    position: relative;

    .kt-blocks-info-box-title {
      display: flex;
      align-items: center;
      letter-spacing: 0.03em;
      min-height: 72px;
    }
  
    .kt-blocks-info-box-text {
      padding: 17px 26px 17px 0;
    }
  }

  a {
    padding: 16px 24px !important;
    background: rgba(64, 94, 92, 0.05);

    &.kt-blocks-info-box-link-wrap {
      &::before {
        height: calc(100% - 32px);
        top: 16px;
        left: 99px;

        @media (max-width: 767px) {
          left: 89px;
        }
      }

      &::after {
        content: "\e905";
        position: absolute;
        bottom: 27px;
        right: 24px;
        font-family: "innotechnika" !important;
        width: 30px;
        height: 30px;
        background-color: var(--global-palette2);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .kt-blocks-info-box-text {
        max-width: 350px;
      }
    }

    &:hover {
      background: var(--global-palette1);

      .kb-svg-icon-wrap {
        color: var(--global-palette2) !important;
      }

      &::before {
        background-color: #fff;
      }

      h2.kt-blocks-info-box-title,
      h3.kt-blocks-info-box-title {
        color: #fff;
      }

      .kt-blocks-info-box-text {
        color: #fff;
      }

      .kt-infobox-textcontent {
        &::before {
          background-color: #fff;
        }
      }
    }
  }

  &.product-inno-info-box {
    a {
      padding-bottom: 90px !important;
      &.kt-blocks-info-box-link-wrap {
        &::before {
          height: calc(100% - 105px);
        }
      }
    }
  }
  &.single-product-inno-info-box {
    a {
      padding-bottom: 90px !important;
      &.kt-blocks-info-box-link-wrap {
        &::before {
          height: calc(100% - 105px);
        }
      }

      &:after {
        rotate: 90deg;
        background-color: var(--global-palette1);
      }

      &:hover {
        &:after {
          background-color: var(--global-palette2);
        }

        .kb-svg-icon-wrap {
          color: #fff !important;
        }
      }
    }

    @media(max-width: 1199px) {
      a {
        padding-bottom: 76px !important;
        
        &.kt-blocks-info-box-link-wrap {
          &::before {
            height: calc(100% - 91px);
          }
        }
        
        .kt-blocks-info-box-text {
          display: none;
        }
      }
    }
    @media(max-width: 1024px) {
      a {
        padding-bottom: 32px !important;
        
        &.kt-blocks-info-box-link-wrap {
          &::before {
            height: calc(100% - 48px);
          }
          &::after {
            bottom: 16px;
          }
        }
        
        .kt-blocks-info-box-text {
          display: none;
        }
      }
    }
  }
  &.single-product-inno-info-box {
    &.is-active {
      a {
        background: var(--global-palette1);
        
        &::after {
          background-color: var(--global-palette2);
        }
        &::before {
          background-color: #fff;
        }
        h2.kt-blocks-info-box-title, 
        h3.kt-blocks-info-box-title,
        .kt-blocks-info-box-text {
          color: #fff;
        }
        .kb-svg-icon-wrap {
          color: #fff !important;
        }
      }
    }
  }
  &.tech-inno-info-box {
    a {
      padding-bottom: 60px !important;
      &.kt-blocks-info-box-link-wrap {
        &::before {
          height: calc(100% - 75px);
        }
      }
    }
  }
}

.inno-info-box-light  {
  .kt-blocks-info-box-media-align-left {
    align-items: flex-start;
    gap: 32px;
    
    .kadence-info-box-image-inner-intrisic-container .kadence-info-box-image-intrisic {
      width: 87px;
    }
  }
  .kt-infobox-textcontent {
    display: flex;
    flex-direction: column;
    gap: 32px;

    .kt-blocks-info-box-title {
      max-width: 350px;
      min-height: 48px;
    }
  }

  @media(max-width: 1024px) {
    .kadence-info-box-image-inner-intrisic-container .kadence-info-box-image-intrisic {
      width: 64px !important;
    }
  }
  @media(max-width: 767px) {
    .kt-blocks-info-box-media-align-left {
      gap: 24px;
    }
    .kadence-info-box-image-inner-intrisic-container .kadence-info-box-image-intrisic {
      width: 50px !important;
    }
  }
}

.kt-blocks-carousel {
  .kb-splide {
    &:hover {
      .splide__arrow {
        opacity: 1;
      }
    }
  
    .splide__arrow {
      background: transparent;
      border: none;
      opacity: 1;
      width: 32px;
      height: 32px;
      border-radius: 0;
  
      svg {
        display: none;
      }
  
      &::before {
        position: relative;
        content: "";
        font-family: "innotechnika" !important;
        font-size: 32px;
        z-index: 2;
      }
  
      &.splide__arrow--next {
        &::before {
          content: "\e907";
        }
      }
  
      &.splide__arrow--prev {
        &::before {
          content: "\e906";
        }
      }
  
      &:hover,
      &:focus {
        opacity: 1;
        background: transparent;
      }

      @media (max-width: 767px) {
       background-color: var(--global-palette1);
       top: unset;
       transform: unset;
       bottom: 0;
       right: 0;
       width: 48px;
       height: 48px;

        &.splide__arrow--prev {
          right: 48px;
          left: unset;
        }

        &:hover,
        &:focus {
          opacity: 1;
          background: var(--global-palette2);
        }
        

        &::before {
          font-size: 20px;
        }
      }
    }
  }
}

.site-footer {
  &.dark-footer {
    background-color: var(--global-palette1);
    color: #fff;

    p {
      color: #fff !important;
    }
    
    path {
      &.dark-path {
        fill: #fff;
      }
    }
  }
}

.content-tabs {
  & > .kt-inside-inner-col {
    .tab-content:not(.is-active) {
      display: none;
    }
  }
}

.entry {
  &.loop-entry {
    border-radius: 0;
    box-shadow: unset;
    transition: all .3s cubic-bezier(0.17, 0.67, 0.35, 0.95);

    &:hover {
      box-shadow: unset;
    }

    .entry-header {
      margin-bottom: 0 !important;
      padding-bottom: 0 !important;

      .entry-meta {
        margin: 0.5em 0 !important;
      }
    }

    .entry-summary {
      margin: var(--global-xs-spacing) 0 0 !important;
      p {
        margin: 0.5em 0 !important;
        font-size: 14px;
      }
    }

    .entry-actions {
      .more-link-wrap {
        display: flex;
        justify-content: flex-end;
      }
      .post-more-link {
        width: 30px;
        height: 30px;
        background-color: var(--global-palette2);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
      }
    }
    
    h2.entry-title,
    h3.entry-title,
    .entry-taxonomies a {
      transition: all .3s cubic-bezier(0.17, 0.67, 0.35, 0.95);
    }

    h3.entry-title {
      color: var(--global-palette1);
      font-size: 24px;
      line-height: 1;
      padding: 0 !important;
    }

    &:hover {
      background: rgba(64, 94, 92, 1);
      color: #fff;

      h2.entry-title,
      h3.entry-title,
      .entry-taxonomies a {
        color: #fff;
      }
    }

    .entry-content-wrap {
      position: relative;

      .entry-loop-overlay-link {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
    }
  }
}

.blog,
.category {
  .nav-links {
    display: flex;
    justify-content: center;

    .page-numbers {
      &.current {
        border: 2px solid var(--global-palette1);
        border-radius: 0;
      }
    }
  }
}

.blog,
.category,
.single-post,
.search {
  background: var(--global-palette9);

  .site-main {
    position: relative;
  
    &::after {
      content: '';
      position: absolute;
      top: 0;
      right: -1.5rem;
      height: 100%;
      width: 1px;
      background-color: var(--global-palette1);
      opacity: .25;

      @media screen and (max-width: 1024px) {
        display: none;
      }
    }
  }
  .sidebar-inner-wrap {
    top: 150px;
    position: sticky;
  }
}

.kb-search .kb-search-icon-submit {
  padding: 0;
}

.wp-block-categories-list {
  list-style-type: none;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: .75rem;
  padding: 0 !important;
  margin: 0;

  li {
    a {
      padding: 0.4em 1em;
      border: 0;
      font-size: .95rem;
      line-height: 1.6;
      display: inline-block;
      box-shadow: rgba(0, 0, 0, 0) 0px 0.0588115px 0.0980192px -7px;
      color: var(--global-palette1);
      background: rgba(64, 94, 92, 0.05);

      &:hover {
        text-decoration: none;
        color: var(--global-palette9);
        background: rgba(64, 94, 92, 1)
      }
    }

    &.current-cat {
      a {
        color: var(--global-palette9);
        background: rgba(64, 94, 92, 1)
      }
    }
  }
}

.has-sidebar .content-container {
  @media screen and (min-width: 1025px) {
    grid-gap: 3rem;
  }
}

.single-post,
.single-innotech_portfolio {
  .wp-site-blocks .post-thumbnail {
    margin-bottom: 2rem;
  }

  .single-content p {
    margin-bottom: 18px;
  }

  .kb-adv-heading-icon {
    margin-top: -4px;
  }
}

.posts-slider {
  .content-bg {
    background: rgba(64, 94, 92, 0.05) !important;
    height: 100%;

    &:hover {
      background: rgba(64, 94, 92, 1) !important;
    }
  }
  .kt-blocks-post-grid-item,
  .kt-blocks-post-grid-item-inner-wrap,
  .kt-blocks-post-grid-item-inner,
  .entry-content {
      height: 100%;
  }
  .kt-blocks-post-grid-item {
    .kt-blocks-post-grid-item-inner {
      & > header {
        display: none;
      }
    }
    footer {
      justify-content: flex-end;
    }
  }

  .kb-splide {
    .splide__arrows {
      & .splide__arrow {
        color: var(--global-palette2);
        background: transparent;
        border: none;
        opacity: 1;
        width: 32px;
        height: 32px;
        border-radius: 0;
        font-size: 32px;
  
        &::before {
          position: relative;
          content: "";
          font-family: "innotechnika" !important;
          font-size: 32px;
          z-index: 2;        
        }
  
        &.splide__arrow--prev {
          left: -80px;
          &::before {
            content: "\e906";
          }
        }
        
        &.splide__arrow--next {
          right: -80px;
          
          &::before {
            content: "\e907";
          }
        }
  
        svg {
          display: none;
        }
  
      }

    }
    @media(max-width: 1024px) {
      display: flex;
      flex-direction: column-reverse;
      gap: 32px;

      .splide__arrows {
        display: flex;
        justify-content: flex-end;
  
        & .splide__arrow {
          &.splide__arrow--prev,
          &.splide__arrow--next {
            position: relative;
            top: unset;
            bottom: unset;
            right: unset;
            left: unset;
            width: 48px;
            height: 48px;
            color: #fff;
            background: var(--global-palette1);
            transform: unset; 
          }
  
          &::before {
            font-size: 20px;
          }
  
          &:hover,
          &:focus {
            background: var(--global-palette2);
          }
        }
      }
    }
  }
}

.product-table {
  &.kb-table-container {
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px; /* Height for horizontal scrollbar */
    }
    &::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 4px;
    }
    &::-webkit-scrollbar-thumb {
      background: rgba(64, 94, 92, 0.85);
      &:hover {
        background: rgba(64, 94, 92, 1);
      }
    }
    &::-webkit-scrollbar-corner {
      background: #f1f1f1;
    }
  }
  .kb-table-row {
    th,
    td {
      p {
        font-size: 14px;
        line-height: 1.15;
      } 
    }
    &:first-child {
      td {
        border: 1px solid var(--global-palette1) !important;
      }
    }
    @media(max-width: 1024px) {
      td {
        width: 160px;
      }
    }
  }
}

.wp-block-table {
  &.custom-table {
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px; /* Height for horizontal scrollbar */
    }
    &::-webkit-scrollbar-track {
      background: #f1f1f1;
      border-radius: 4px;
    }
    &::-webkit-scrollbar-thumb {
      background: rgba(64, 94, 92, 0.85);
      &:hover {
        background: rgba(64, 94, 92, 1);
      }
    }
    &::-webkit-scrollbar-corner {
      background: #f1f1f1;
    }
    table {
      font-size: 14px;
      line-height: 1.15;
      text-align: center;


      tr {
        &:nth-of-type(even) {
          background-color: rgba(64, 94, 92, 0.05);
        }
        &:nth-of-type(odd) {
          background-color: rgba(64, 94, 92, 0.1);
        }
        th {
          background-color: var(--global-palette1);
          color: #fff;
          font-weight: 500;
          text-align: center;
          border: 1px solid rgba(255, 255, 255, .1);
        }
        td {
          border: 1px solid rgba(64,94,92,0.25);
          
          &:first-child {
            font-weight: 500;
          }
        }
      }
    }
  }
}



.half-background {
  position: relative;

  .wp-block-kadence-videopopup,
  .wp-block-kadence-image {
    position: relative;

    &::after {
      content: "";
      top: 0;
      position: absolute;
      z-index: -1;
      height: 100%;
      width: 100vw;
      background-color: var(--global-palette1);
    }
  }
  .kadence-video-popup-link {
    text-decoration: none;

    .kb-svg-icon-wrap {
      position: relative;
      padding: 13px;

      &::after {
        content: "\e920";
        left: 2px;
        position: relative;
        font-family: "innotechnika";
        width: 28px;
        height: 28px;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      svg {
        display: none;
      }
    }

    &:hover {
      .kb-svg-icon-wrap {
        box-shadow: 4px 4px 44px 0 rgba(247, 84, 51, 1);
      }
    }
  }
}

.kb-form-basic-style input[type=checkbox] {
  appearance: checkbox;
  -webkit-appearance: checkbox;
  font-size: 20px;
}

.wp-block-kadence-advanced-form-captcha {
  display: none;
}

.kb-radio-check-item-wrap {
  label {
    font-size: 12px !important;
    line-height: 20px !important;

    a {
      color: #fff;
    }
  }
}

/* Load More Gallery Styles */
.load-more-gallery {
  .kb-gallery-ul {
    .kadence-blocks-gallery-item {
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

      &:nth-child(n+7) {
        display: none;
      }

      /* Visible items */
      &.visible {
        opacity: 1;
        transform: translateY(0);
      }

      /* Dynamic staggered animation delays */
      &.visible {
        transition-delay: calc(var(--animation-delay, 0) * 50ms);
      }
    }

    @media (max-width: 767px) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 6px;

      .kadence-blocks-gallery-item {
        padding: 0 !important;
        opacity: 0;
        transform: translateY(20px);
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

        &:nth-child(n+5) {
          display: none;
        }

        /* Every 3rd item (1st, 4th, 7th, etc.) spans full width */
        &:nth-child(3n-2) {
          grid-column: 1 / 3;
        }

        /* Visible items */
        &.visible {
          opacity: 1;
          transform: translateY(0);
        }

        /* Dynamic staggered animation delays for mobile */
        &.visible {
          transition-delay: calc(var(--animation-delay, 0) * 50ms);
        }
      }
    }
  }
  
  .load-more-button {
    &.hidden {
      display: none;
    }
  }
  
  /* When all items are shown, hide the load more button */
  &.all-items-visible {
    .kb-gallery-ul {
      .kadence-blocks-gallery-item {
        display: block;
      }
    }
    
    .load-more-button {
      display: none;
    }
  }
}


/* Load More Gallery Styles */
.load-more-gallery {
  .kb-gallery-ul {
    .kadence-blocks-gallery-item {
      opacity: 0;
      transform: translateY(20px);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

      &:nth-child(n+7) {
        display: none;
      }

      /* Visible items */
      &.visible {
        opacity: 1;
        transform: translateY(0);
      }

      /* Dynamic staggered animation delays */
      &.visible {
        transition-delay: calc(var(--animation-delay, 0) * 50ms);
      }
    }

    @media (max-width: 767px) {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 6px;

      .kadence-blocks-gallery-item {
        padding: 0 !important;
        opacity: 0;
        transform: translateY(20px);
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);

        &:nth-child(n+5) {
          display: none;
        }

        /* Every 3rd item (1st, 4th, 7th, etc.) spans full width */
        &:nth-child(3n-2) {
          grid-column: 1 / 3;
        }

        /* Visible items */
        &.visible {
          opacity: 1;
          transform: translateY(0);
        }

        /* Dynamic staggered animation delays for mobile */
        &.visible {
          transition-delay: calc(var(--animation-delay, 0) * 50ms);
        }
      }
    }
  }
  
  .load-more-button {
    &.hidden {
      display: none;
    }
  }
  
  /* When all items are shown, hide the load more button */
  &.all-items-visible {
    .kb-gallery-ul {
      .kadence-blocks-gallery-item {
        display: block;
      }
    }
    
    .load-more-button {
      display: none;
    }
  }
}

.kadence-video-popup-link {
  text-decoration: none;

  .kb-svg-icon-wrap {
    position: relative;
    padding: 8px;

    &::after {
      content: "\e920";
      left: 2px;
      position: relative;
      font-family: "innotechnika";
      width: 28px;
      height: 28px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    svg {
      display: none;
    }
  }

  &:hover {
    .kb-svg-icon-wrap {
      box-shadow: 4px 4px 44px 0 rgba(247, 84, 51, 1);
    }
  }
}