/* Scoped to: portfolio-template-work-project-feature */

[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-section, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-section {
  width: 100%;
  padding: 160px 96px 20px;
}

@media (max-width:1100px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-section, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-section {
    padding: 120px 50px;
  }
}

@media (max-width:768px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-section, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-section {
    padding: 80px 16px;
  }
}


[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-image, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-image {
  width: 100%;
  object-fit: cover;
  margin-bottom: 40px;

  
  border-radius: 0;
}




@media (max-width:1100px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-image:not(:last-of-type), [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-image:not(:last-of-type) {
    margin-bottom: 80px;
  }
}


@media (max-width:768px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-image:not(:last-of-type), [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-image:not(:last-of-type) {
    margin-bottom: 64px;
  }
}


[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-content, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  margin-bottom: 100px; 
}

@media (max-width:1100px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-content, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-content {
    margin-bottom: 80px;
  }
}

@media (max-width:768px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-content, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-content {
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 64px;
  }
}


[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-title, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-title {
  font-family: Cabin, sans-serif;
  font-size: 32px;
  font-weight: 400;
  color: #fff;
  margin-bottom: 12px;
}

[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-desc, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-desc {
  font-family: Cabin, sans-serif;
  font-size: 24px;
  font-weight: 400;
  color: #7E7E7E;
  line-height: 130%;
  max-width: 900px;
}

@media (max-width:768px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-title, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-title {
    font-size: 28px;
  }

  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-desc, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-desc {
    font-size: 20px;
  }
}


[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-btn, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-btn {
  width: 210px;
  height: 56px;
  padding: 10px 16px;
  border-radius: 12px;
  background: #D3FF5B;
  color: #000;

  font-family: Cabin, sans-serif;
  font-size: 24px;
  font-weight: 400;

  display: flex;
  justify-content: center;
  align-items: center;

  cursor: pointer;
  transition: .25s;
  white-space: nowrap;
}

[data-component-slug="portfolio-template-work-project-feature"].work-project-feature-btn:hover, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-btn:hover {
  opacity: .85;
}

@media (max-width:768px){
  [data-component-slug="portfolio-template-work-project-feature"].work-project-feature-btn, [data-component-slug="portfolio-template-work-project-feature"] .work-project-feature-btn {
    width: 100%;
    max-width: 340px;
  }
}