/************** VALUES ****************/
:root {
    --defaultmargin: 0 5% 0 5%;
    --smallmargin: 0 10% 0 10%;
    --mobilemargin: 0 15px 0 15px;
    --accent-color: #8a100a;
    --grey-color: #434242;
    --light-grey-color: #fafafa;
    --font-size-title: 48px;
    --font-size-title-small: 36px;
    --font-size-subtitle: 20px;
  }
  /************** VALUES ****************/
  
  
  
  
  
  /************** UTILS ****************/
  .hoverEffectUnderlineWhite {
    background-image: linear-gradient(
      to right,
      black,
      black 50%,
      white 50%
    );
    background-size: 200% 100%;
    background-position: -100%;
    display: inline-block;
    padding: 5px 0;
    position: relative;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    border-bottom: 1px solid white;
  }
  .hoverEffectUnderlineWhite:before{
    content: '';
    background: black;
    display: block;
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 0;
    height: 3px;
    transition: all 0.3s ease-in-out;
  }
  .hoverEffectUnderlineWhite:hover {
   background-position: 0;
  }
  .hoverEffectUnderlineWhite:hover::before{
    width: 100%;
  }
  .hoverEffectUnderlineRed {
    background-image: linear-gradient(
      to right,
      black,
      black 50%,
      var(--accent-color) 50%
    );
    background-size: 200% 100%;
    background-position: -100%;
    display: inline-block;
    padding: 5px 0;
    position: relative;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    border-bottom: 2px solid var(--accent-color);
  }
  .hoverEffectUnderlineRed:before{
    content: '';
    background: black;
    display: block;
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 0;
    height: 3px;
    transition: all 0.3s ease-in-out;
  }
  .hoverEffectUnderlineRed:hover {
   background-position: 0;
  }
  .hoverEffectUnderlineRed:hover::before{
    width: 100%;
  }
  .boxShadow {
    transition: transform 0.2s ease;
    box-shadow: rgb(50 50 93 / .25) 0 6px 12px -2px, 
    rgb(0 0 0 / .3) 0 3px 7px -3px; 
  }
  .boxShadow:hover {
    box-shadow: rgb(50 50 93 / .35) 0 6px 12px -2px, 
    rgb(0 0 0 / .4) 0 3px 7px -3px; 
  }
  .hoverEffectScale {
    transition: transform 0.2s ease;
  }
  .hoverEffectScale:hover {
    transform: scale(1.05);
  }
  /************** UTILS ****************/
  
  .sectionPage {
    margin-top: 160px;
  }
  @media (max-width: 576px) {
    .sectionPage {
      margin-top: 100px;
    }
  }
  #staticPage {
    padding-top: 140px;
    padding-bottom: 70px;
    background-color: #f9f9f9;
  }
  #staticPageContent {
    background-color: white;
    padding: 24px;
    border: 1px solid var(--accent-color);
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
  }
  
  #staticPage h1, 
  #staticPage h2, 
  #staticPage h3, 
  #staticPage h4, 
  #staticPage h5, 
  #staticPage h6 {
      color: var(--accent-color);
      padding-top: 12px;
      padding-bottom: 12px;
  }
  
  
  /************** HEADER ****************/
  .search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(2px); /* Blurs only the background */
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .search-wrapper {
    max-width: 600px;
    width: 100%;
    margin: auto;
  }
  
  .search-overlay input.form-control {
    font-size: 1.5rem;
    padding: 1rem;
    border-radius: 8px !important;
  }
  
  .search-overlay button.btn {
    font-size: 1.5rem;
    border-radius: 8px;
    background: #fff;
    color: #000;
  }
  @media (max-width: 576px) {
    .search-wrapper {
      max-width: 300px;
    }
    .search-overlay input.form-control {
      font-size: 1rem;
      padding: 8px;
    }
  }
  
  
  
  
  
  
  .menuContainerWrapper {
    max-width: 1200px;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin: auto;
  }
  .menuContainerWrapper, .menuWebsiteLinks, .menuContainer {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
 .menuWebsiteLinks {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping to a second row */
    justify-content: flex-end;
    text-align: center;
  }
  .websiteLink, .menuSearch, .mobileMenuIconWrapper {
    margin: 0 10px 0 10px;
    border-bottom: 1px solid transparent;
  }
  .menuWebsitePhone, .changeLanguage, .menuSearch, .websiteLink, .mobileMenuIconWrapper{
    font-size: 16px;
    font-weight: bold;
    color: var(--accent-color);
  }
  .changeLanguage i, .menuWebsitePhone i, .menuSearch i, #cosul-meu i{
    padding: 0 5px 0 5px;
  }
  .changeLanguage, .menuSearch {
    cursor: pointer;
  }
  .changeLanguage {
    white-space: nowrap; /* Prevent breaking words */
  }
  .menuWebsitePhone {
    white-space: nowrap; 
    padding: 0 20px 0 20px;
  }
  #logo {
    max-height: 70px;
    width: auto;
  }
  #mobileMenu {
    display: none;
  }
  #websiteMenu {
    display: block;
    justify-items: center;
    padding: var(--defaultmargin);
    padding-top: 14px;
    padding-bottom: 14px;
  }
  @media (max-width: 768px) {
    #logo {
      max-height: 60px;
    }
    .menuWebsitePhone, .changeLanguage {
      display: none;
    }
  }
  @media (max-width: 576px) {
    .menuContainerWrapper {
      height: 60px;
      padding: 0px 20px 0 20px;
    }
    #logo {
	max-height: 100px;
        padding: 25px;
    }
    #mobileMenu {
      display: block;
    }
    #websiteMenu {
      display: none;
    }
  }
  
  #mobileMenu, #websiteMenu {
    position: fixed; /* Keeps it fixed at the top */
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000; /* Ensures it stays on top */
    width: 100%;
    background: rgba(255, 255, 255, 0.1); /* Semi-transparent */
    backdrop-filter: blur(10px); /* Blurs only the background */
  }
  .hoverEffect a {
      -webkit-transform: perspective(1px) translateZ(0);
      transform: perspective(1px) translateZ(0);
      box-shadow: 0 0 1px rgba(135, 133, 133, 0);
      position: relative;
      -webkit-transition-duration: 0.3s;
      transition-duration: 0.3s;
      -webkit-transition-property: transform;
      transition-property: transform;
  }
  
  .hoverEffect a:before {
      pointer-events: none;
      position: absolute;
      z-index: -1;
      content: '';
    top: 100%;
    left: -5%;
    height: 2px;
    width: 110%;
      opacity: 0;
      background: -webkit-radial-gradient(center, ellipse, var(--accent-color) 0%, rgba(0, 0, 0, 0) 80%);
      background: radial-gradient(ellipse at center, var(--accent-color) 0%, rgba(0, 0, 0, 0) 80%);
      -webkit-transition-duration: 0.3s;
      transition-duration: 0.3s;
      -webkit-transition-property: transform, opacity;
      transition-property: transform, opacity;
  }
  .hoverEffect a:hover:before, .hoverEffect a:focus:before, .hoverEffect a:active:before {
      opacity: 1;
      -webkit-transform: translateY(5px);
      transform: translateY(5px);
  }
  a {
    text-decoration: none !important;
    color: inherit !important;
  }
  /**** mobile header ****/
  /* Full-screen Mobile Menu Overlay */
  .mobileMenuOverlay {
    position: fixed;
    top: 0;
    right: -100%; /* Starts hidden off-screen */
    width: 75%; 
    height: 100vh; /* Full height */
    background: var(--accent-color); /* Dark background */
    color: white;
    transition: right 0.3s ease-in-out;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* When menu is open */
  .mobileMenuOverlay.active {
    right: 0; /* Slide in from right */
  }
  /* Menu Content */
  .mobileMenuContent {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Distribute links evenly */
    padding: 50px 30px; /* Spacing for better alignment */
  }
  /* Close Button */
  .closeMenu {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 24px;
    cursor: pointer;
  }
  /* Menu List */
  .mobileMenuList {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Align links to the left */
    height: 100%;
    justify-content: space-between;
  }
  .mobileMenuList li {
    width: 100%;
    display: flex;
    align-items: center;
  }
  .mobileMenuList a, .mobileMenuList i {
    color: white;
    text-decoration: none;
    font-size: 20px;
    padding: 10px 0;
    width: 100%;
    transition: color 0.3s;
  }
  .mobileMenuList i {
    padding: 10px 10px 10px 0;
  }
  /************** HEADER ****************/
  
  
  
  
  
/************** FOOTER ****************/
footer {
  background-color: var(--accent-color);
  padding-top: 30px;
}
.newsletterButton {
  background-color: var(--light-grey-color);
  border-radius: 8px;
  display: inline-block;
  transition: transform 0.1s ease, box-shadow 0.2s ease;
  text-align: center;
  width: auto;
}
.newsletterButton button {
  background: none;
  border: none;
  color: var(--accent-color);
  padding: 12px;
  font-size: 16px;
  cursor: pointer;
  transition: color 0.2s ease;
}
.newsletterButton:hover button {
  color: var(--accent-color);
}
.newsletterButton:active button {
  color: var(--accent-color) !important;
}
.newsletterButton:active {
  transform: scale(0.96);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) inset;
}


.mainButton {
  background-color: var(--accent-color);
  border-radius: 8px;
  display: inline-block;
  transition: transform 0.1s ease, box-shadow 0.2s ease;
}
.mainButton button {
  background: none;
  border: none;
  color: white;
  padding: 12px 24px;
  font-size: 16px;
  cursor: pointer;
  transition: color 0.2s ease;
}
.mainButton:hover button {
  color: white;
}
.mainButton:active button {
  color: white !important;
}
.mainButton:active {
  transform: scale(0.96);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) inset;
}
@media (max-width: 576px) {
  #newsletterForm {
    width: 90%;
    justify-self: center;
  }
}
.help-block {
  color: red;
}
/************** FOOTER ****************/




/* Adds blur + dark layer over the image */
.image-container-gradient-background-category::after {
  content: "";
  position: absolute;
  inset: 0;
  backdrop-filter: blur(2px);
  background: rgba(255, 255, 255, 0.3); /* dark tint */
  z-index: 1;
  pointer-events: none; /* allows clicking through */
}

/* Centered title */
.overlay-title-center {
  position: absolute;
  top: 40%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 2rem;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0,0,0,0.6);
  padding: 0 1rem;
  max-width: 90%;
  line-height: 1.2;
}

/* Bottom description */
.overlay-description-bottom {
  z-index: 2;
}
.overlayTitle { 
  font-size: clamp(28px, 2vw, 54px) !important;
}




  /************** Home Hero ****************/
  .video-container {
    width: 100%;
    height: 100%; /* Ensures it takes full height of the parent */
    overflow: hidden; /* Hides overflow when cropping */
    display: flex;
  }
  
  .video-container video {
    object-fit: cover; /* Ensures the video fills the container and crops sides */
  }

  .sectionContainer {
    display: flex;
    flex-direction: column;
  }
  .image-container-gradient-background, .projectImageBackground {
    position: relative;
    display: flex; /* Center the image */
    justify-content: center; /* Horizontally center */
    align-items: center; /* Vertically center */
    height: 80vh; /* Default full height */
    overflow: hidden; /* Prevents overflow */
  }
  /* Make the image responsive */
  .image-container-gradient-background img, .projectImageBackground img {
    width: 100%;
    height: 100%; /* Ensure it fills the container */
    display: block;
    object-fit: cover; /* Keeps it centered and prevents distortion */
  }
  .image-container-gradient-background::before, projectImageBackground::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgb(255 255 255) 20%, transparent 50%);;
  }

  .image-container-gradient-background-subcategory::before{
    background: linear-gradient(to top, rgb(255 255 255) 5%, transparent 20%) !important;
  }

  /* Title Positioning */
  .firstSlideTitleWrapper {
    position: absolute;
    width: 100%;
    bottom: 5%;
    left: 0%;
    padding: 0 40px;
    display: flex;
    justify-content: center;
    max-height:80px;
  }
  .categorySlideTitleWrapper {
    top: 35% !important;
  }

  .firstSlideTitle {
    width: 90%;
    text-align: center;
    color: var(--accent-color);
    font-weight: 500;
    text-shadow: 1px 1px 2px var(--grey-color);
  
    font-size: clamp(22px, 1.5vw, 48px);
  }

  .categorySlideTitle {
    font-size: clamp(18px, 1vw, 40px);
  }
  /* Responsive Design */
  @media (max-width: 1024px) { /* Medium Screens */
  
  }
  @media (max-width: 768px) { /* Small Screens */
    .image-container-gradient-background {
      height: 100vh; /* Full height */
    }
  }
  @media (max-width: 576px) { /* Small Screens */
    .firstSlideTitleWrapper {
      max-height:180px;
    }
    .overlay-title-center {
      top: 15%;
    }
    .categorySlideTitleWrapper {
      top: 25% !important;
    }
  }

  /************** Home Hero ****************/
  
  
  
  
  /************** About us Hero ****************/
  .fullWidthContainer {
    width: 100%;
    padding: 40px;
  }
  .aboutUsContainerWrapper {
    background-color: var(--accent-color);
    display: flex;
    justify-content: center; /* Centers the content */
    width: 100%;
  }
  .aboutUsContainer {
    display: flex;
    width: 100%; /* Takes full width */
    max-width: 1024px; /* Limits width to 1024px */
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .aboutUsContainer > * { /* Targets both children */
    flex: 0 0 40%; /* Prevents shrinking/growing, sets width to 40% */
    max-width: 40%;
  }
  .aboutUsText {
    display: flex;
    flex-direction: column;
    color: white;  
  }
  .aboutUsTitle {
    align-self: flex-start !important;
    padding-bottom: 16px !important;
  }
  .aboutUsDescription {
    font-size: var(--font-size-subtitle);
    padding-bottom: 32px;
  }
  .aboutUsImage {
    height: 100%;
  }
  .aboutUsImage img {
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
  }
  @media (max-width: 768px) {
    .aboutUsImage {
      display: none;
    }
    .aboutUsContainer > * {
      flex: 0 0 100%;
      max-width: 100%;
    }
    .aboutUsTitle, .aboutUsButton {
      align-self: center;
    }
  }
  /************** About us Hero ****************/
  
  
  
  
  /************** Main Categories Hero ****************/
  .mainCategoriesContainerWrapper {
    background-color: white;
    display: flex;
    justify-content: center; /* Centers content */
  }
  
  .mainCategoriesContainer {
    display: flex;
    flex-direction: column; /* Stack items by default */
    width: 90%;
    gap: 20px; /* Adds spacing between sections */
  }
  
  /* Default: All cards take full width */
  .mainCategoriesCardContainer {
    cursor: pointer;
    position: relative;
    width: 100%;
    border-radius: 6px;
    display: flex;
    flex-direction: row;
    max-width: 1400px;
    justify-content: space-between;
  }
  .mainCategoriesCardContainer:hover {
    border: 2px solid var(--accent-color);
  }
  .mainCategoriesRow > .mainCategoriesCardContent {
    width: 48%;
  }
  .mainCategoriesCardImage img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 0;
      -webkit-mask-image: linear-gradient(to left, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
      mask-image: linear-gradient(to left, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
  }
  .mainCategoriesCardImage {
    width: 50%;
  }
  /* Wrap the two middle cards into a flex container */
  @media (min-width: 769px) { /* Apply only for larger screens */
    .mainCategoriesContainer {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .mainCategoriesRow {
      display: flex;
      justify-content: space-between; /* Spaces items evenly */
      width: 100%;
    }
    .mainCategoriesRow .mainCategoriesCardContainer:first-child {
        margin-right: 10px;
      }
    
      .mainCategoriesRow .mainCategoriesCardContainer:last-child {
        margin-left: 10px;
      }
  }
  .mainCategoriesCardContent {
    padding: 48px 16px 48px 32px;
    width: 50%;
    z-index: 1;
  }
  .sectionTitle {
    font-weight: 700;
    font-size: 32px;
    padding-bottom: 52px;
    text-align: center;
  }
  .mainCategoriesTitle {
    font-weight: 700;
    font-size: 22px;
    padding-bottom: 32px;
    color: var(--accent-color);
  }
  .mainCategoriesDescription {
    font-size: 1rem;
    text-align: justify;
    padding-bottom: 16px;
  }
  @media (max-width: 1024px) {
    .mainCategoriesCardContent {
      padding: 48px 32px 48px 32px;
      width: 100%
    }
    .mainCategoriesContainer {
    flex-direction: column;
    }
    .mainCategoriesCardContainer { 
    flex-direction: column;
    }
    .mainCategoriesCardImage {
    width: 100%;
    }
    .mainCategoriesCardImage img {
        -webkit-mask-image: linear-gradient(to left, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
        mask-image: linear-gradient(to top, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 100%);
    }
    .mainCategoriesContainer .mainCategoriesCardContainer {
        width: 100%;
    }
    .sectionTitle {
        font-size: 22px;
    }
  }
  @media (max-width: 576px) {
    .mainCategoriesCardContent {
      padding: 18px;
    }
    .mainCategoriesDescription {
      font-size: 16px;
    }
    .mainCategoriesCardContent {
      width: 100%;
    }
  }
  /************** Main Categories Hero ****************/
  




  /************** Projects Hero ****************/
  .projectsContainerWrapper {
    display: flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
  }
  .projectsContainer {
    display: flex;
    flex-direction: column; /* Stack items by default */
    width: 90%;
  }
  .projectsContentContainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
  }
  .projectsContent3PerRow {
    flex: 1 1 calc(33.33% - 20px);
  }
  .projectsContent4PerRow {
    flex: 1 1 calc(25% - 20px);
  }
  .projectsContent {
    background-color: white;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
  }
  .categoriesContent {
    flex: 0 0 calc(25% - 20px); /* 4 per row */
    max-width: calc(25% - 20px);
    min-width: 220px; /* or whatever minimum you want */
    background-color: white;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    margin: 10px;
    box-sizing: border-box;
    justify-content: space-between;
  }
  .categoriesContentContainer {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
  }

  .projectsContent:hover, .categoriesContent:hover {
    transform: scale(1.05);
  }
  .projectImage {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
  }
  .projectTitle {
    font-size: var(--font-size-subtitle);
    font-weight: bold;
    color: var(--accent-color);
    padding: 16px 16px 8px;
  }
  .projectDescription {
    font-size: 14px;
    color: #555;
    padding: 0 16px;
    flex-grow: 1;
  }
  .projectsButton {
    text-align: end;
    padding: 0 32px 16px 16px;
    font-size: 24px;
    color: var(--accent-color);
    transition: 
      background-color 0.3s ease,
      color 0.3s ease,
      padding 0.3s ease,
      border-radius 0.3s ease,
      font-size 0.3s ease;
  }
  .viewAllProjects {
    text-decoration: none !important;
    text-align: end;
    /* padding: 0 32px 16px 16px; */
    font-size: 24px;
    color: var(--accent-color) !important;
    margin-top: 24px;
    transition: 
      background-color 0.3s ease,
      color 0.3s ease,
      padding 0.3s ease,
      border-radius 0.3s ease,
      font-size 0.3s ease;
  }
  .viewAllProjects i {
    margin-left: 4px;
    padding: 5px;
  }

  .projectsContent:hover .projectsButton i, .categoriesContent:hover .projectsButton i, .viewAllProjects:hover i {
    background-color: var(--accent-color);
    color: white;
    border-radius: 50%;
    font-size: 18px;
    padding: 8px; /* makes it look more like a button */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  }
  @media (max-width: 1200px) {
    .categoriesContent {
      flex: 0 0 calc(33.33% - 20px); /* 4 per row */
      max-width: calc(33.33% - 20px);
    }
  }

  @media (max-width: 1024px) {
    .projectsContent, .categoriesContent {
      flex: 1 1 calc(50% - 20px);
    }
    .categoriesContent {
      max-width: calc(50% - 20px);
    }
  }
  @media (max-width: 600px) {
    .projectsContent, .categoriesContent {
      flex: 1 1 100%;
    }
    .categoriesContent {
      max-width: 100%;
    }
  }
  /************** Projects Hero ****************/
  
  
  
  
  /************** Benefits Hero ****************/
  .benefitsContainerWrapper {
    background-color: var(--light-grey-color);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .benefitsContainer {
    display: flex;
    flex-direction: row;
    width: 90%;
  }
  .benefitsTitle {
    width: 40%;
  }
  .benefitsDescription {
color: var(--accent-color);
   align-self: end;
   font-size: 2rem;
	margin-right: 40px;
   padding-bottom: 32px;
   width: 100%;
  }
  .benefitsContentFirst {
    display: flex;
    flex-wrap: wrap;
    margin-right: 10px;
    width: 50%;
    align-content: space-around;
  }

  .benefitsContent {
    display: flex;
    flex-wrap: wrap;
    margin-left: 10px;
    width: 50%;
  }
  
  .benefitsContent > * {
    width: 50%; /* 2 pe rând */
    padding: 1rem;
    box-sizing: border-box;
  }
  .benefitIcon {
    color: var(--accent-color)
  }
@media (max-width: 1200px) {
    .benefitsContainer {
      flex-direction: column;
      align-items: center;
    }
  .benefitsContentFirst {
    justify-content: center;
    margin-right: 0px;
    width: 100%;
  }
  .benefitsDescription { 
    text-align: center;
margin-right: 0 !important;
}
  .figuresNumbersContainer {
    padding-bottom: 32px;
    margin-right: 0 !important;
  }
    .benefitsTitle {
      width: 100%;
      text-align: center;
      margin-bottom: 2rem;
    }
  
    .benefitsContent {
      width: 100%;
      justify-content: center;
    }
  
    .benefitsContent > * {
      width: 50%;
    }
  }
  
  /* Sub 576px: 1 pe rând */
  @media (max-width: 576px) {
    .benefitsContent > * {
      width: 100%;
    }
  }
  
  /************** Benefits Hero ****************/
  
  
  
  
  /************** Figures Hero ****************/
  .figuresContainerWrapper {
    display: flex;
    flex-direction:column;
    align-items: center;
    justify-content: center; /* Centers content */
  }
  .figuresContainer {
    display: flex;
    flex-direction: column; /* Stack items by default */
    width: 90%;
  }
  .figureNumber {
    font-weight: 700;
    color: var(--accent-color);
  }
  .figuresNumbersContainer {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    margin-right: 60px;
  }
  /************** Figures Hero ****************/

  
  
  
  .max-width-container {
    max-width: 1400px;
  }
  
  /************** Products Hero ****************/
  
  .popularProductSectionTitle {
    color: black;
  }
  .popularProductTitle {
    padding-top: 12px;
    font-weight: 700;
    padding-bottom: 12px;
    font-size: var(--font-size-subtitle); 
  }
  .popularProductContainer {
    border-radius: 6px;
    padding: 24px;
    display: flex;
    background-color: white;
    flex-direction: column;
    flex: 1 1 calc(25% - 20px); /* Each takes ~1/3 of the row, minus the gap */
    max-width: calc(25% - 20px);
    justify-content: space-between;
  }
  .productUsedInProjectContainer {
    margin: 25px;
  }
  .popularProductContentContainerWrapper {
    width: 90%;
  }
  .popularProductContainerWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Centers items when they don’t fill a row */
    gap: 20px; /* Adds spacing between items */
    width: 100%;
  }
  .disountedPriceProduct {
    font-weight: 700;
    color: #E43A36;
    font-size: var(--font-size-subtitle);
  }
  .fullPriceProduct {
    font-weight: 700;  
    font-size: 12px;
    padding-bottom: 10px;
  }
  @media (max-width: 1024px) {
    .popularProductContainer {
        flex: 1 1 calc(50% - 20px); /* Each takes ~1/2 of the row */
        max-width: calc(50% - 20px);
    }
  }
  @media (max-width: 768px) {
    .popularProductContainer {
        flex: 1 1 100%; /* Each takes full width */
        max-width: 100%;
    }
  }
  /************** Products Hero ****************/
  



  
  /************** Last visited products Hero ****************/
  
  .lastVisitedProductsSectionTitle {
    color: black;
  }
  .lastVisitedProductTitle {
    padding-top: 12px;
    font-weight: 700;
    padding-bottom: 12px;
    font-size: var(--font-size-subtitle); 
  }
  .lastVisitedProductContainer {
    border-radius: 6px;
    padding: 24px;
    display: flex;
    background-color: white;
    flex-direction: column;
    flex: 1 1 calc(25% - 20px); /* Each takes ~1/3 of the row, minus the gap */
    /* max-width: calc(25% - 20px); */
    justify-content: space-between;
  }
  .lastVisitedProductContainerWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Centers items when they don’t fill a row */
    gap: 20px; /* Adds spacing between items */
    width: 100%;
  }
  @media (max-width: 1024px) {
    .lastVisitedProductContainer {
        flex: 1 1 calc(50% - 20px); /* Each takes ~1/2 of the row */
        /* max-width: calc(50% - 20px); */
    }
  }
  @media (max-width: 768px) {
    .lastVisitedProductContainer {
        flex: 1 1 100%; /* Each takes full  width */
        /* max-width: 100%; */ 
    }
  }
  /************** Last visited products Hero ****************/
  
  /************** Partners Hero ****************/
  .partnerLogo img {
    max-height: 160px;
    padding: 10px;
  }
  .partnersContainerWrapper {
    background-color: var(--light-grey-color);
  }
  
  /************** Products Hero ****************/
  
  
  
  
  /************** Carousel styling ****************/
  #parteneriiNostri .owl-nav,
  #parteneriiNostri .owl-dots {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #parteneriiNostri .owl-controls-wrapper {
    display: flex;
    justify-content: space-between; /* space between nav and dots */
    align-items: center;
  }
  #parteneriiNostri .owl-nav {
    display: none;
  }
  #parteneriiNostri .owl-dots {
    gap: 6px;
    margin-left: auto;
  }
  .owl-stage {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
  }
  /************** Carousel styling ****************/
  
  
  
  
  /************** Carousel styling ****************/

  
  .contactMap {
    background-color: var(--light-grey-color);
  }
  .pageDescription  {
    font-size: var(--font-size-subtitle);
    padding-bottom: 32px;
  }
  .formContainer {
    max-width: 900px;
    justify-self: center;
  }



  .override-font * {
  font-family: 'Open Sans', sans-serif !important;
}
.override-font h3 {
  font-size: 32px !important;
  line-height: 1.3;
  margin-top: 1em;
  margin-bottom: 0.5em;
}

.carousel-wrapper, .carousel-wrapper-project {
  position: relative; /* esențial pentru layering cu ::before */
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  margin: 0;
}

.carousel-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgb(255 255 255) 20%, transparent 50%);
  z-index: 2;
  pointer-events: none;
}

.carousel-gallery {
  width: 100%;
  box-sizing: border-box;
  z-index: 1; /* conținutul rămâne sub gradient */
}

.carousel-gallery .slick-slide {
  display: flex !important;
  justify-content: center;
  align-items: center;
}

.carousel-img {
  width: 100%;
  max-height: 80vh;
  object-fit: cover;
  display: block;
}
  .slick-slide > div {
    padding: 0;
  }
  .slick-prev:before, .slick-next:before {
    color: var(--accent-color) !important; /* Set the color of the arrows */
    font-size: 24px !important; /* Adjust the size of the arrows */
  }
  .slick-next {
    right: 20px !important;
  }
  .slick-prev {
    left: 15px !important;
    z-index: 1;
  }
  /************** Carousel styling ****************/
  
  .contactContainerWrapper {
    width: 90%;
    display: flex;
    justify-self: center;
    justify-content: space-around;
  }
  .contactContainer {
      display: flex;
      justify-content: space-between;
      width: 100%;
      max-width: 860px;
      padding-bottom: 60px;
  }
  .contactContentRow {
    padding-bottom: 00px;
  }
  .contactTitle {
    font-size: 22px;
    font-weight: 700;
    color: var(--accent-color);
  }
  .contactImage img {
    width: 100%;
    max-height: 400px;
  }
  .contactDetail {
    padding-bottom: 10px;
  }
  
  .contactButton {
    background-color: var(--accent-color);
    border: none;
    border-radius: 8px;
    color: white;
    padding: 12px 24px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
    transition: transform 0.1s ease, box-shadow 0.2s ease, color 0.2s ease;
  }
  
  .contactButton:hover {
    color: white;
  }
  
  .contactButton:active {
    transform: scale(0.96);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) inset;
    color: white !important;
  }
  .gdprAndButtonRow {
    display: flex;
    flex-wrap: wrap;
    align-items: center; /* vertically align both */
    gap: 1rem;
  }
  
  .gdprWrapper {
    flex: 2;
    display: flex;
    align-items: flex-start;
  }
  
  .contactButtonWrapper {
    flex: 1;
    display: flex;
    justify-content: flex-end;
  }
  #messageContact {
    height: 148px !important; /* force match height of 3 stacked inputs */
    resize: none;
  }
  
  
  @media (max-width: 992px) {
    .contactContent {
      width: 30%;
      padding-bottom: 40px;
    }
    .contactImage img {
      margin-left: 20px;
    }
  }
  @media (max-width: 768px) {
    .contactContainer {
      flex-direction: column;
      align-items: center;
    }
    .contactContent {
      width: 100%;
      padding-bottom: 20px;
    }
    .contactImage img {
      margin-left: 0px;
    }
  }
  

  /************** PRODUCTS ****************/
.card-header {
  background-color: var(--accent-color) !important;
}
.nav-tabs .nav-link {
  color: white !important;
}
.card-header-tabs .nav-link.active {
  color: black !important;
}
.aceeasiGama .owl-prev,
#produsePopulareSlider0 .owl-prev,
#produsePopulareSlider1 .owl-prev,
#produsePopulareSlider2 .owl-prev {
    top: 38%!important;
    position: absolute!important;
    left: -15px!important;
    z-index: 2!important;
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    width: 30px!important;
    height: 30px!important;
    background-color: #fff!important;
    color: #1d1d1d!important;
    border-radius: 24px!important;
    box-shadow: 0 0 0 1px #7f7f7f0d,0 2px 5px #7f7f7f80!important;
    transition: transform .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1)!important
}

.aceeasiGama .owl-next,
#produsePopulareSlider0 .owl-next,
#produsePopulareSlider1 .owl-next,
#produsePopulareSlider2 .owl-next {
    top: 38%!important;
    position: absolute!important;
    right: -15px!important;
    z-index: 2!important;
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    width: 30px!important;
    height: 30px!important;
    background-color: #fff!important;
    color: #1d1d1d!important;
    border-radius: 24px!important;
    box-shadow: 0 0 0 1px #7f7f7f0d,0 2px 5px #7f7f7f80!important;
    transition: transform .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1)!important
}

.aceeasiGama .owl-prev:hover,
.aceeasiGama .owl-next:hover,
#produsePopulareSlider0 .owl-prev:hover,
#produsePopulareSlider0 .owl-next:hover,
#produsePopulareSlider1 .owl-prev:hover,
#produsePopulareSlider1 .owl-next:hover,
#produsePopulareSlider2 .owl-prev:hover,
#produsePopulareSlider2 .owl-next:hover {
    background-color: #20417d!important;
    color: #fff!important;
    border: 0;
    border-radius: 100%
}

#produsePopulare .nav-tabs {
    position: absolute;
    right: 0;
    top: 0;
    left: auto;
    display: flex;
    margin: 0;
    border-bottom: 2px solid #fff0
}

#produsePopulare .nav-tabs li a {
    color: #232f3e;
    font-weight: 500;
    transition: background-color 0.3s ease,color 0.3s ease;
    border: 0;
    border-bottom: 2px solid #fff0
}

#produsePopulare .nav-tabs li a:hover,#produsePopulare .nav-tabs li a.active {
    border-bottom: 2px solid #20417d!important;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    color: #232f3e;
    font-weight: 500
}
.modeleprodus .active, .modeleprodus .childrenP:hover {
    background: var(--accent-color);
    color: #fff;
}
.modeleprodus .active a{
    color:#fff;
}
.modeleprodus li {
    background-color: #f0f0f0;
    padding: 5px 10px;
    margin-bottom: 5px;
    margin-right: 5px;
}
.btn-cart {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
    color: #fff;
    transition: background-color 0.3s ease, color 0.3s ease;
}
.btn-cart:hover,.btn-cart:focus,.btn-cart:active {
    color: #ffffff!important;
}
.item-category {
    border: 1px solid #eee;
    box-sizing: border-box;
}
.item-category {
    height: 100%;
    color: #6c757d;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    text-align: left;
    border: 1px solid #fff0;
    border-radius: .5rem;
    background: #f4f5f7;
}
.item-category:hover {
    box-shadow: none;
    box-shadow: 0 4px 16px -3px #01adf123;
    border-color: var(--accent-color)
}
.item-category .img-category {
    padding: 1rem;
    position: relative;
    overflow: hidden;
    border-radius: .5rem;
    background-color: #fff;
}
.item-category .image-primary-cat {
    transition: 0.3s;
    left: 50%;
    margin-right: -50%;
    max-width: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: .5rem;
}
.item-category .img-responsive-cat-1by1:before {
    padding-top: 100%;
}
.item-category .img-responsive-cat:before {
    content: "";
    display: block;
}
.item-category:hover .image-primary-cat {
    max-width: 110%;
    width: 110%;
}


.item-product {
    height: 100%;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    text-align: left;
    border: 1px solid #fff0;
    border-radius: .5rem;
    background: var(--light-grey-color);
}
.item-product:hover {
    box-shadow: none;
    box-shadow: 0 4px 16px -3px #01adf123;
    border-color: #e5e5e5
}

.item-product .img-product {
    padding: 1rem;
    position: relative;
    overflow: hidden;
    border-radius: .5rem;
    background-color: #fff;
}

.item-product .image-primary {
    transition: 0.3s;
    left: 50%;
    margin-right: -50%;
    max-width: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    border-radius: .5rem;
    padding: 10px;
}

.item-product:hover .image-primary {
    max-width: 110%;
    width: 110%;
}

.item-product .image-primary {
    transition: 0.3s;
    left: 50%;
    margin-right: -50%;
    max-width: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%)
}

.item-product .img-responsive:before {
    content: "";
    display: block
}

.item-product .img-responsive-1by1:before {
    padding-top: 100%
}

.item-product .product-name a {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 60px;
    word-break: break-word;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: .5px;
}

.item-product a {
    font-size: 1rem;
    color: #232f3e;
    text-decoration: none!important;
    display: block;
}
.item-product:hover a {
    color: #20417d;
}
.h2hr{
    padding: 7px 0;
    font-size: 20px;
    color: #20417d;
    letter-spacing: .3px;
    font-size: 22px;
    font-weight: 700;
    border-bottom: 1px solid #e5e5e5;
}

/************** PRODUCTS ****************/



/************** CATALOAGE ****************/
.catalogsTitle {
  color: var(--accent-color);
  font-weight: 700 !important;
  font-size: 32px !important;
  padding-bottom: 24px !important;
  text-align: center;
}
.catalogDownload {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.catalogItem:hover .catalog-link, .catalogItem:hover .catalogDownload {
  color: white !important;
  cursor: pointer;
}
.catalogItem {
  border-bottom: 1px var(--accent-color) solid;
  display: flex;
  flex-direction: row;
  background-color: var(--light-grey-color);
  border-radius: 0px;
}
.catalogItem:hover {
    border-radius: 8px;
  background-color: var(--accent-color);
}

/************** CATALOAGE ****************/


.pagination .page-item a:not(:first-child):not(:last-child) .page-item a:hover{
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--accent-color);
}
.pagination .active a, .pagination .page-item a:hover{
    background-color: transparent !important;
    color: #000;
}
.pagination .page-link:focus{
    border-color: inherit;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.pagination .page-link{
    border:0px;
    color:var(--accent-color);
}
.pagination .page-item.active::after{
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--accent-color);
}


.pagination .page-item.active{
    color: var(--accent-color);
}





/************** COSUL MEU ****************/
#cosul-meu {
    color: var(--accent-color) !important;
}
#lblcosCount {
    position: absolute;
    font-size: 12px;
    background: var(--accent-color);;
    color: #fff;
    padding: 4px 4px;
    vertical-align: top;
    margin-left: -10px;
    margin-top: -8px;
    border-radius: 100%;
    font-weight: 700;
    min-width: 20px;
}
.input-group-btn button, .remove-prod-cart {
  color: var(--accent-color);
  cursor: pointer;
}
#confirmRemoveCartBtn  {
  color: #fff;
  background-color: var(--accent-color);
}
/************** COSUL MEU ****************/








  /************** FONTS ****************/
  /* Apply the font */
  body {
    font-family: 'Open Sans', sans-serif;
  }
  /************** FONTS ****************/
  
  
  /************** ICONS ****************/
  @font-face {
    font-display: swap;
    font-family: 'Font Awesome 5 Brands';
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/fontawesome/fa-brands-400.eot");
    src: url("../fonts/fontawesome/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome/fa-brands-400.woff2") format("woff2"), url("../fonts/fontawesome/fa-brands-400.woff") format("woff"), url("../fonts/fontawesome/fa-brands-400.ttf") format("truetype"), url("../fonts/fontawesome/fa-brands-400.svg#fontawesome") format("svg"); }
  
  .fab {
    font-family: 'Font Awesome 5 Brands'; }
  @font-face {
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url("../fonts/fontawesome/fa-light-300.eot");
    src: url("../fonts/fontawesome/fa-light-300.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome/fa-light-300.woff2") format("woff2"), url("../fonts/fontawesome/fa-light-300.woff") format("woff"), url("../fonts/fontawesome/fa-light-300.ttf") format("truetype"), url("../fonts/fontawesome/fa-light-300.svg#fontawesome") format("svg"); }
  
  .fal {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 300; }
  @font-face {
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url("../fonts/fontawesome/fa-regular-400.eot");
    src: url("../fonts/fontawesome/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome/fa-regular-400.woff2") format("woff2"), url("../fonts/fontawesome/fa-regular-400.woff") format("woff"), url("../fonts/fontawesome/fa-regular-400.ttf") format("truetype"), url("../fonts/fontawesome/fa-regular-400.svg#fontawesome") format("svg"); }
  
  .far {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 400; }
  @font-face {
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url("../fonts/fontawesome/fa-solid-900.eot");
    src: url("../fonts/fontawesome/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome/fa-solid-900.woff2") format("woff2"), url("../fonts/fontawesome/fa-solid-900.woff") format("woff"), url("../fonts/fontawesome/fa-solid-900.ttf") format("truetype"), url("../fonts/fontawesome/fa-solid-900.svg#fontawesome") format("svg"); }
  
  .fa,
  .fas {
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900; }
  
  .fa, .fas, .far, .fal, .fab, .far {
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      /*display: inline-block;*/
      font-style: normal;
      font-variant: normal;
      text-rendering: auto;
      line-height: 1;
  }
  
  .fa-heart:before {
    content: "\f004"; }
  
  .fa-envelope:before {
    content: "\f0e0"; }
  .fa-phone-volume:before {
    content: "\f2a0"; }
  .fa-clock:before {
    content: "\f017"; }
  .fa-map-marker-alt:before {
    content: "\f3c5"; }
  .fa-facebook-f:before {
    content: "\f39e"; }
  .fa-twitter:before {
      content: "\f099";
  }
  .fa-linkedin:before {
      content: "\f0e1";
  }
  .fa-linkedin-in:before {
    content: "\f0e1"; }
  .fa-times-circle:before {
    content: "\f057"; }
  .fa-instagram:before {
    content: "\f16d"; }
  .fa-square-instagram:before {
    content: "\e055"; }
  .fa-angle-up:before {
    content: "\f106"; }
  .fa-angle-left:before {
    content: "\f104"; }
  .fa-youtube:before {
    content: "\f167"; 
  }
  .fa-tiktok:before {
  content: "\e07b"; 
  }
  .fa-angle-right:before {
    content: "\f105"; }
  .fa-dot-circle:before {
    content: "\f192"; }
  .fa-comment:before {
    content: "\f075"; }
  .fa-shopping-cart:before {
    content: "\f07a"; }
  .fa-user:before {
    content: "\f007"; }
  .fa-search:before {
    content: "\f002"; }
  .fa-times:before {
    content: "\f00d";
  }
  .fa-bars:before {
    content: "\f0c9"; }
  .fa-angle-down:before {
    content: "\f107";
  }
  .fa-gears:before {
    content: "\f085";
  }
  .fa-wheat-awn:before {
    content: "\e2cd";
  }
  .fa-square-check:before {
    content: "\f14a";
  }
  .fa-handshake-angle:before {
    content: "\f4c4";
  }
  .fa-home:before {
    content: "\f015"; 
  }
  .fa-home:before {
    content: "\f015"; 
  }
  .fa-hand-holding-dollar:before {
    content: "\f4c0"; 
  }
  .fa-exclamation-circle:before {
      content: "\f06a";
  }
  .fa-check:before {
    content: "\f00c"; }
  .fa-google:before {
    content: "\f1a0"; }
  .fa-eye:before {
    content: "\f06e"; }
  .fa-eye-slash:before {
    content: "\f070"; }
  .fa-undo:before {
    content: "\f0e2"; }
  .fa-window-close:before {
    content: "\f410"; }
  .fa-minus:before {
    content: "\f068"; }
  .fa-plus:before {
    content: "\f067"; }
  .fa-phone:before {
    content: "\f095"; }
  .fa-barcode:before {
    content: "\f02a";
  }
  .fa-arrow-right:before {
    content: "\f061";
  }
  .fa-arrow-left:before {
    content: "\f060";
  }
  .fa-globe:before {
    content: "\f0ac";
  }
  .fa-paper-plane:before {
    content: "\f1d8"; }
  .fa-certificate:before {
    content: "\f0a3";
  }
  .fa-truck-fast:before {
    content: "\f48b";
  }
  .fa-angle-up:before {
    content: "\f106"; }
  .fa-pinterest:before {
    content: "\f0d2"; }
  .fa-hand-point-up:before {
    content: "\f0a6"; }
  .fa-angle-double-right:before{content:"\f101"}

  .fa-handshake-angle:before {content:"\f4c4";}
  .fa-ranking-star:before {content:"\e561";}
  .fa-lightbulb:before {content:"\f0eb";}
  .fa-stopwatch:before {content:"\f2f2";}
  .fa-screwdriver-wrench:before {content:"\f7d9";}

  .fa-angle-double-left:before{content:"\f100"}
  .fa-check:before { content: "\f00c"; }
  .fa-file-edit:before { content: "\f31c"; }
  .fa-thumbs-down:before { content: "\f165";font-size:30px; }
  .fa-thumbs-up:before {  content: "\f164";font-size:30px; }
  .fa-external-link-alt:before { content: "\f35d"; }
  .fa-edit:before {content: "\f044"; }
  .fa-trash-alt:before { content: "\f2ed"; }
  .fa-comment:before { content: "\f075"; }
  .fa-twitter:before {  content: "\f099"; }
  .fa-linkedin:before {  content: "\f08c"; }
  .fa-whatsapp:before {  content: "\f232"; }
  .fa-box:before { content: "\f466"; }
  .fa-truck:before {  content: "\f0d1"; }
  .fa-file-pdf:before {  content: "\f1c1"; }
  .fa-file-arrow-down:before {  content: "\f56d"; }
  .fa-file-lines:before {  content: "\f15c"; }
  .fa-file-alt:before {
    content: "\f15c"; }
  .fa-spinner:before {
    content: "\f110"; }
  .fa-bell:before {
    content: "\f0f3"; }
  .fa-play:before {
    content: "\f04b"; }
  .fa-play-circle:before {
    content: "\f144"; }
  
  .fa-spin {
    -webkit-animation: fa-spin 2s infinite linear;
            animation: fa-spin 2s infinite linear; }
  
  .fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
            animation: fa-spin 1s infinite steps(8); }
  
  @-webkit-keyframes fa-spin {
    0% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg); }
    100% {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg); } }
  
  @keyframes spin {
      from {
          transform:rotate(0deg);
      }
      to {
          transform:rotate(360deg);
      }
  }
  .fa-location-arrow:before{content:"\f124"}
  .fa-location-arrow{
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg);
      display: inline-block;
  }
  /************** ICONS ****************/
  
  
  /************** COOKIES ****************/
  
  button#ihavecookiesBtn {
      margin-left: 0px !important;
  }
  #gdpr-cookie-message {
      position: fixed;
      z-index: 999;
      left: 0px;
      bottom: 0px;
      background-color: #fff;
      padding: 10px 20px 10px 20px;
      box-shadow: 0 6px 6px 12px rgba(0,0,0,0.25);
  }
  #gdpr-cookie-message h4 {
      color: #000;
      font-size: 16px;
      font-weight: 500;
      margin-bottom: 10px;
  }
  #gdpr-cookie-message h5 {
      color: #fff;
      font-size: 15px;
      font-weight: 500;
      margin-bottom: 10px;
  }
  #gdpr-cookie-message p, #gdpr-cookie-message ul {
      color: #6A6A6A;
      font-size: 14px;
      line-height: 1.5em;
  }
  #gdpr-cookie-message p:last-child {
      margin-bottom: 0; 
  }
  #gdpr-cookie-message li {
      width: 49%;
      display: inline-block;
  }
  #gdpr-cookie-message a {
      color: #000;
      text-decoration: underline;
      font-size: 15px;
      padding-bottom: 2px;
      border-bottom: 1px dotted rgba(255,255,255,0.75);
      transition: all 0.3s ease-in;
  }
  #gdpr-cookie-message a:hover {
      color: #000;
      border-bottom-color: #000;
      transition: all 0.3s ease-in;
  }
  #gdpr-cookie-message button,
  button#ihavecookiesBtn {
      border: none;
      /* background: var(--green); */
      background-color: #000;
      color: white;
      font-size: 13px;
      padding: 7px;
      border-radius: 0px;
      margin-left: 15px;
      cursor: pointer;
      transition: all 0.3s ease-in;
      /* color: #75601f; */
  }
  
  #gdpr-cookie-message button:hover {
      background: #000;
      color: #fff;
      transition: all 0.3s ease-in;
  }
  button#gdpr-cookie-advanced {
      /* background:var(--info); */
      color: #fff;
      background-color: #595959;
  }
  #gdpr-cookie-message button:disabled {
      opacity: 0.3;
  }
  #gdpr-cookie-message input[type="checkbox"] {
      float: none;
      margin-top: 0;
      margin-right: 5px;
      border:1px solid #ccc;
  }
  /************** COOKIES ****************/































  /*
|--------------------------------------------------------------------------
| Custom Carousel
|--------------------------------------------------------------------------
|
*/
.custom-carousel .owl-carousel .owl-stage {
    display: flex !important;
}

.custom-carousel .owl-carousel .owl-item {
    display: flex !important;
    flex:    1 0 auto !important;
}

.custom-carousel .owl-carousel .thumbnail {
    display:        flex !important;
    flex-direction: column !important;
    margin:         0 15px !important;
}

.custom-carousel .owl-carousel .thumbnail .caption {
    display:        flex !important;
    flex:           1 0 auto !important;
    flex-direction: column !important;
}

.custom-carousel .owl-carousel .thumbnail .caption .flex-text {
    flex-grow: 1 Im !important;
}

.custom-carousel .owl-prev {
    top:             38% !important;
    position:         absolute !important;
    left:             -15px !important;
    z-index:          2 !important;
    display:          flex !important;
    align-items:      center !important;
    justify-content:  center !important;
    width:            30px !important;
    height:           30px !important;
    background-color: #fff !important;
    color:            #1d1d1d !important;
    border-radius:    24px !important;
    box-shadow:       0 0 0 1px #7f7f7f0d, 0 2px 5px #7f7f7f80 !important;
    transition:       transform .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1) !important;

}

.custom-carousel .owl-next {
    top: 38%          !important;
    position:         absolute !important;
    right:            -15px !important;
    z-index:          2 !important;
    display:          flex !important;
    align-items:      center !important;
    justify-content:  center !important;
    width:            30px !important;
    height:           30px !important;
    background-color: #fff !important;
    color:            #1d1d1d !important;
    border-radius:    24px !important;
    box-shadow:       0 0 0 1px #7f7f7f0d, 0 2px 5px #7f7f7f80 !important;
    transition:       transform .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1) !important;
}

.custom-carousel .owl-nav .fa{
    font-size: 28px;
    font-weight: 300;
}
/*
|--------------------------------------------------------------------------
| Stage carousel specific styles
|--------------------------------------------------------------------------
|
*/
.connected-carousels {
  max-width: 100vw;
}

.connected-carousels .navigation {
    width: 340px;
    margin: 20px auto;
    position: relative;
}
.connected-carousels .carousel li {
    float: left;    
}
.connected-carousels .carousel-stage {
    cursor: pointer;
}
.connected-carousels .carousel ul {
    width: 10000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}
/** Navigation carousel specific styles **/

.connected-carousels .carousel-navigation {
    height: 102px;
    width: 100%;
    background: #fff;

}
.secondimg li{
    float: left;
    width: 81px;
    height: 81px;
    background-repeat: no-repeat;
    /* background-size: cover; */
    background-position: center center;
    background-size: contain;
}
.mainimg li {
    float: left;
    min-width: 560px;
    padding-bottom: calc(100%* 1 / 360);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
@media (max-width: 576px) {
  .mainimg li {
    min-width: 100vw
  }
}
.connected-carousels .carousel {
    overflow: hidden;
    position: relative;
}
.connected-carousels .stage {
    max-width: 558px;
    margin: 20px auto;
    position: relative;
}
.connected-carousels .carousel-navigation li {
    cursor: pointer;
}

.connected-carousels .carousel-navigation li {
    display: block;
    border: 5px solid #fff;
}

.connected-carousels .carousel-navigation li.active {
    /* border-color: #000; */
    border: 2px solid #888;
}

/** Stage carousel controls **/

.connected-carousels .prev-stage,
.connected-carousels .next-stage {
    display: block;
    position: absolute;
    top: 0;
    width: 60px;
    height: 350px;
    color: #fff;
}

.connected-carousels .prev-stage {
    left: 0;
}

.connected-carousels .next-stage {
    right: 0;
}

.connected-carousels .prev-stage.inactive,
.connected-carousels .next-stage.inactive {
    display: none;
}

.connected-carousels .prev-stage span,
.connected-carousels .next-stage span {
    display: none;
    position: absolute;
    top: 50%;
    width: 30px;
    height: 30px;
    text-align: center;
    background: #4E443C;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 0 1px #000;
    font: 24px/27px Arial, sans-serif;
    -webkit-border-radius: 30px;
       -moz-border-radius: 30px;
            border-radius: 30px;
    -webkit-box-shadow: 0 0 2px #999;
       -moz-box-shadow: 0 0 2px #999;
            box-shadow: 0 0 2px #999;
}

.connected-carousels .prev-stage span {
    left: 20px;
}

.connected-carousels .next-stage span {
    right: 20px;
}

.connected-carousels .prev-stage:hover span,
.connected-carousels .next-stage:hover span {
    display: block;
}

/** Navigation carousel controls **/

.connected-carousels .prev-navigation,
.connected-carousels .next-navigation {
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    background: #4E443C;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 0 1px #000;
    font: 16px/29px Arial, sans-serif;
    -webkit-border-radius: 30px;
       -moz-border-radius: 30px;
            border-radius: 30px;
    -webkit-box-shadow: 0 0 2px #999;
       -moz-box-shadow: 0 0 2px #999;
            box-shadow: 0 0 2px #999;
}

.connected-carousels .prev-navigation {
    left: -15px;
    top: 30px;
    text-indent: 6px;
}

.connected-carousels .next-navigation {
    right: -15px;
    top: 30px;
    text-indent: 20px;
}

.connected-carousels .prev-navigation.inactive,
.connected-carousels .next-navigation.inactive {
  display: none;
    opacity: .5;
    cursor: default;
}
/* end jcarousel */
.scroll {
    display: block;
    width: 100%;
    overflow: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgb(0 0 0 / .25) #fff0;
}

.scroll-x {
    overflow-x: auto !important;
    white-space: nowrap;
}

@-webkit-keyframes slideAnimation {
  50% {
    bottom: 0;
  }
}
@keyframes slideAnimation {
  50% {
    bottom: 0;
  }
}


.video-play-btn {
    position: absolute;
    z-index: 1;
    -webkit-box-shadow: 0 6px 50px 8px rgba(21, 131, 233, 0.15);
    box-shadow: 0 6px 50px 8px rgba(21, 131, 233, 0.15);
    width: 100px;
    height: 100px;
    display: inline-block;
    background-color: #20417d;
    border-radius: 50%;
    font-size: 3rem;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 9999;
}

.carouselTopLeft p {
    color: #8480ae;
    font-size: 1.25rem;
}
.carouselTopLeft h2 {
    font-size: 40px;
    color: #20417d; 
    margin-bottom: 1rem; 
    font-weight: 800; 
    letter-spacing: -1px;
}
.circle-animation .circle1 {
    position: absolute;
    top: 12%;
    left: 23%;
    width: 10px;
    height: 10px;
    background-color: #20417d;
    border-radius: 50%;
    z-index: -1;
    -webkit-animation: circleAnimation linear 4s infinite;
    animation: circleAnimation linear 4s infinite;
}
.circle-animation .circle2 {
    position: absolute;
    top: 70%;
    left: 12%;
    width: 10px;
    height: 10px;
    background-color: #20417d;
    border-radius: 50%;
    z-index: -1;
    -webkit-animation: circleAnimation linear 7s infinite;
    animation: circleAnimation linear 7s infinite;
}
.circle-animation .circle3 {
    position: absolute;
    top: 12%;
    right: 23%;
    width: 10px;
    height: 10px;
    background-color: #20417d;
    border-radius: 50%;
    z-index: -1;
    -webkit-animation: circleAnimation linear 6s infinite;
    animation: circleAnimation linear 6s infinite;
}

.circle-animation .circle4 {
    position: absolute;
    top: 70%;
    right: 12%;
    width: 10px;
    height: 10px;
    background-color: #20417d;
    border-radius: 50%;
    z-index: -1;
    -webkit-animation: circleAnimation linear 3s infinite;
    animation: circleAnimation linear 3s infinite;
}
@-webkit-keyframes circleAnimation {
  50% {
    -webkit-transform: scale(2);
            transform: scale(2);
  }
}

@keyframes circleAnimation {
  50% {
    -webkit-transform: scale(2);
            transform: scale(2);
  }
}

.aceeasiGama .owl-next,
#produsePopulareSlider0 .owl-next,
#produsePopulareSlider1 .owl-next,
#produsePopulareSlider2 .owl-next{
    top: 38% !important;
    position: absolute !important;
    right: -15px !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    background-color: #fff !important;
    color: #1d1d1d !important;
    border-radius: 24px !important;
    box-shadow: 0 0 0 1px #7f7f7f0d, 0 2px 5px #7f7f7f80 !important;
    transition: transform .15s cubic-bezier(.4,0,.2,1), box-shadow .15s cubic-bezier(.4,0,.2,1), opacity .15s cubic-bezier(.4,0,.2,1) !important;
}
.aceeasiGama .owl-prev:hover,
.aceeasiGama .owl-next:hover,
#produsePopulareSlider0 .owl-prev:hover,
#produsePopulareSlider0 .owl-next:hover,
#produsePopulareSlider1 .owl-prev:hover,
#produsePopulareSlider1 .owl-next:hover,
#produsePopulareSlider2 .owl-prev:hover,
#produsePopulareSlider2 .owl-next:hover{    
    background-color: #cd0c0b !important; 
    color: #fff !important;
    border: 0;
    border-radius: 100%;
}
#produsePopulare .nav-tabs{
    position: absolute;
    right: 0;
    top: 0;
    left: auto;
    display: flex;
    margin: 0;
    border-bottom: 2px solid transparent;
}
#produsePopulare .nav-tabs li a{
    color: #232f3e;
    font-weight: 500;
    transition: background-color 0.3s ease, color 0.3s ease;
    border: 0;
    border-bottom: 2px solid transparent;
}
#produsePopulare .nav-tabs li a:hover, #produsePopulare .nav-tabs li a.active {
    border-bottom: 2px solid #cd0c0b !important;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    color: #232f3e;
    font-weight: 500;
}
.cta-background-image{    
    width: 100%;
    height: 100%;
    opacity: 0.3;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.h2H{
    font-size: 22px;
    font-weight: 700;
    color:var(--accent-color);
}
.bg-gray {
    background-color: #f1f4fd;
}
.btnC{
    background-color:#20417d;
    color:#fff;
    font-weight: 600;
    padding: 10px 20px;
    border: 1px solid #20417d;
}
.btnC:hover, .btnC:focus{
    background-color:#4e72af !important;
    color:#fff !important;
    border: 1px solid #4e72af !important;
    font-weight: 600;
    padding: 10px 20px;
}
.faq--area .faq-content h2 {
    font-size: 2.75rem;
}
.faq--area .faq-content p {
    font-size: 1.25rem;
}

.faq--accordian .card-header {
    border-bottom: 0;
    padding: 0;
    margin-bottom: 0.25rem !important;
}
.faq--accordian .btn {
    font-size: 1rem;
    padding: 10px 20px;
    text-align: left;
    width: 100%;
    background-color: #20417d;
    color: #ffffff;
}
.faq--accordian .btn.collapsed {
    background-color: #f1f4fd;
    color: #1f0757;
}
.faq--accordian .card-body p {
    font-size: 1rem;
}

.faq--thumbnail {
    position: relative;
    z-index: 1;
}







































/*
|--------------------------------------------------------------------------
| Filters
|--------------------------------------------------------------------------
|
*/
.removeFilter:hover {
  background-color: var(--light-grey-color) !important;
}
.removeFilter i {
  padding-left: 4px;
}
.dropdown-item.active, .dropdown-item:active {
  background-color: #eee !important;
}
@media (min-width: 992px){
    #filter-products .offcanvas {
        visibility:    visible !important;
        position:      relative;
        transform:     none;
        border-right:  0px;
        z-index:       0;
    }

    #filter-products .offcanvas-body {
        padding: 0px;
    }

    #filter-products .offcanvas-header {
        padding: 0px;
    }

    #filter-products .offcanvas-header {
        display: none;
    }

}

.filter-sidebar .filter-title {
    font-size:     1.125rem;
    font-weight:    800;
    letter-spacing: 0rem;
}

.filter-sidebar .filter-widget {
    border-top: 1px solid rgba(0,0,0,.15);
}

.filter-sidebar .filter-widget .widget-title {
    font-weight: 700;
    font-size:   .9375rem;
    color:       #1d1d1d;
}

.filter-sidebar .count {
    font-weight: 500;
    line-height: 1em;
    border-radius: 100px !important;
    min-width: 16px;
    min-height: 16px;
    margin-left: 5px;
    display: inline-block;
    justify-content: center;
    align-items: center;
    padding: 3px 5px;
    min-width: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    border-radius: 0;
    background-color: #eee;
    border-width: 0;
    border-style: solid;
    border-color: #ccc;
    color: #9e9e9e;
    vertical-align: baseline;
}

.filter-sidebar label {
    cursor: pointer;
    font-size: 14px;
    padding-top: 3px;
}

.filter-sidebar .filter-container {
    max-height: 200px;
    overflow: auto;
}
.filter-sidebar .filter-container:before {
    content: " ";
    display: table;
}
.filter-sidebar .filter-item {
    display: block;
    margin: 10px 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    line-height: 1.15;
    min-height: 20px;
    padding-left: 20px;
    color: #222222;
    text-decoration: none;
    font-size: .9375rem;
}
.filter-sidebar .filter-item.active:before {
    border-color: var(--accent-color) !important;
    background-color: var(--accent-color) !important;
    color: #fff;
    content: "\f00c";
    font-family: 'Font Awesome 5 Pro';
}

.filter-sidebar .filter-item:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "";
    font-family: eMAGv2;
    line-height: 14px;
    font-size: 9px;
    color: transparent;
    background-color: #fff;
    border: 1px solid #bbb;
    display: inline-block;
    vertical-align: top;
    width: 15px;
    height: 15px;
    padding: 0;
    margin: 3px;
    margin-right: 10px;
    text-align: center;
    border-radius: 2px;
    margin-left: 0;
}
.imgBoxS{
    border: 1px solid #e5e5e5;
}
.boxSolInd h1 a{
    font-size: 25px;
}
.boxSolInd h2{
    font-size: 20px;
}
@media (min-width: 1400px) {
    .departments {
        width: 315px;
    }
}
@media (min-width: 1200px) {
    .wshomeico{
        display:none!important;
    }
}
@media (min-width: 1200px) and (max-width: 1399px) {
    .departments {
        width: 270px;
    }
    .departments__megamenu--xl {
        width: 855px;
    }
    .nav-links__item > a > span{
        padding: 0 9px !important;
    }
    .block-slideshow--layout--with-departments .block-slideshow__slide, .block-slideshow--layout--with-departments .block-slideshow__body {
        height: 350px;
    }
    
}
@media (min-width: 992px) and (max-width: 1199px) {

    .departments__megamenu--xl {
        width: 890px;
    }
    .departments {
        width: 290px;
    }

    .megamenu--departments {
        padding-right: 32px;
    }
    
    .nav-links__item--with-submenu > a > span {
        padding-right: 23px;
    }
    .nav-links__item--with-submenu > a svg {
        right: 8px;
    }
    .nav-panel__nav-links {
        margin-left: 14px;
        margin-right: 14px;
    }
    .subbanner-description .banner_heading{
        font-size:23px;
    }
    /* .departments__megamenu--sm {
        width: 204px;
    }
    .departments__megamenu--nl {
        width: 376px;
    }
    .departments__megamenu--lg {
        width: 548px;
    }
    .departments__megamenu--xl {
        width: 720px;
    } */
} 

@media (min-width: 992px) {
    .block-slideshow--layout--with-departments .block-slideshow__body {
        /* margin-left: -15px; */
    }

     
}
@media only screen and (max-width: 1199.98px)
{
    .carouselTopLeft h2 {
        font-size: 36px; 
    }
        .nav-links__menu .menu{
        box-shadow:none;
    }
    .wshomeico{
       color: #fff !important;
    }
    .nav-links__item--hover .nav-links__menu{
      position: relative !important;
    }
    .mob-lg{
      display: flex;
      align-items: center;
    }
    .nav-links__item:hover > a span {
      background-color: transparent;
    }
   
    .mainmenu {
        box-shadow: none;
    }
    .nav-links li, .nav-panel__indicators li {
        color: #232f3e;
    }
    .departments .departments__links-wrapper {
        overflow: visible;
        height: auto;
        opacity: 1;
    }
    .departments__megamenu--visible {
        display: block; 
         
    }
    .nav-links__item > a > span {
        padding: 0 4px;
    }
     
    .departments__megamenu {
        display: none; 
    }
    .departments__megamenu, .departments__menu {
        position: relative;
        left: 0;
        height:100%;
        width:auto;
    }
    .departments__body {
        position: relative;
        box-shadow: none;
    }
    .departments__megamenu--xl, .departments__megamenu--lg, .departments__megamenu--nl, .departments__megamenu--sm, .departments__menu{
        width: auto;
        /*height: 0px !important;*/
        display:none;
    }

    .anglechange{
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      -o-transform: rotate(90deg);
      transform: rotate(90deg);
      margin-right: 10px;
    }
    .menu{
        width:auto;
    }
    .departments{
        height:100%;
        width: 290px;
    }
    .departments__body{
        padding-top: 0px;
        height:100% !important;
    }
    .departments__megamenu, .departments__menu{
        visibility: visible;
    }
    .offcanvas{
        width: 290px !important;
    }
 
    .departments__megamenu--visible {
      display: block; /* Afișează megamenu când are clasa departments__megamenu--visible */
    }
    .offcanvas.active {
      left: 0; /* Afișează meniul când are clasa active */
    }
    .nav-panel__nav-links {
        margin-left: 6px;
        margin-right: 6px;
    }
    .the__navigation .nav-links__item > a{
        font-size: 16px;
    }
    .the__navigation .nav-links__item > a > span {
        height: 35px;
    }
    .departments__links{
        padding: 0px;
    }
    header .offcanvas-body, .departments__body{
        background-color: #f5f5f5;
    }
    .megamenu{
        padding: 11px 15px;
        box-shadow: none;
    }
}

#prioritate-list .list-group-item { display:flex; align-items:center; gap:10px; }
#prioritate-list .drag-handle { cursor:grab; opacity:.7; }
#prioritate-list .prio-badge { min-width:32px; text-align:center; }
#prioritate-list .product-name { flex:1 1 auto; }
