/**********************
  Part Hero Section
 **********************/

.habitat-service_hero-section {
  position : relative;
  height   : 745px;
  overflow : hidden;
}

.breadcrumb__wrapper {
  display : none;
}

.habitat-service_hero-section .breadcrumb-wrapper {
  position : absolute;
  top      : 0;
  width    : 100%;
  z-index  : 1;
}

.habitat-service_hero-section .breadcrumb__wrapper {
  background : transparent;
  display    : block;
}

.habitat-service_hero-section .breadcrumb li a {
  color       : var(--color-white-default);
  font-size   : 12px;
  font-style  : normal;
  font-weight : 500;
  line-height : normal;
}

.habitat-service_hero-section .breadcrumb li {
  color : var(--color-white-default);
}

.habitat-service_hero-background {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 100%;
  height   : 100%;
  overflow : hidden;
}

.habitat-service_hero-background img {
  width      : 100%;
  height     : 100%;
  object-fit : cover;
}

.habitat-service_hero-background::after {
  content        : "";
  position       : absolute;
  inset          : 0;
  background     : linear-gradient(
    243deg,
    rgba(0, 164, 188, 0) 12.96%,
    #2C3248 94.24%
  );
  pointer-events : none;
}

.habitat-service_hero-bottom-motif {
  position : absolute;
  left     : -90px;
  bottom   : -70px;
}

.habitat-service_hero-container.container-secondary {
  display     : flex;
  height      : 100%;
  align-items : center;
}

.habitat-service_hero-content {
  border-radius   : 24px;
  background      : #FFF;
  display         : flex;
  max-width       : 515px;
  padding         : 40px 32px;
  flex-direction  : column;
  justify-content : center;
  align-items     : center;
  gap             : 36px;
  z-index         : 1;
}

.habitat-service_hero-title {
  color       : var(--color-primary);
  text-align  : center;
  font-size   : 45px;
  font-style  : normal;
  font-weight : 700;
  line-height : 50px;
  margin      : 0;
}

.habitat-service_hero-subtitle {
  color       : var(--color-primary);
  text-align  : center;
  font-size   : 20px;
  font-style  : normal;
  font-weight : 400;
  line-height : normal;
}

.habitat-service_hero-reduc_text {
  color       : var(--color-primary);
  font-size   : 20px;
  font-style  : normal;
  font-weight : 800;
  line-height : normal;
}

.habitat-service_hero-subtitle-container {
  display         : flex;
  align-items     : center;
  justify-content : center;
  flex-direction  : column;
}

.habitat-service_hero-current-offer {
  background    : var(--gradient-pro);
  border-radius : 8px;
  padding       : 2px;
  display       : flex;
}

.habitat-service_hero-current-offer-text {
  background    : var(--color-white-default);
  border-radius : 7px;
  padding       : 10px;
  color         : var(--color-primary);
  text-align    : center;
  font-size     : 16px;
  font-style    : normal;
  font-weight   : 700;
  line-height   : normal;
}

.habitat-service_hero-price_base_main {
  color       : var(--color-primary);
  text-align  : center;
  font-size   : 32px;
  font-style  : normal;
  font-weight : 700;
  line-height : 42px;
}

.habitat-service_hero-price_base-container {
  display                 : inline-flex;
  background              : var(--gradient-pro);
  background-clip         : text;
  -webkit-background-clip : text;
  -webkit-text-fill-color : transparent;
  align-items             : flex-start;
}

.habitat-service_hero-contact-container a.btn {
  text-align     : center;
  font-size      : 16px;
  font-style     : normal;
  font-weight    : 600;
  line-height    : normal;
  text-transform : inherit;
}

.habitat-service_hero-contact-container .btn-pro {
  width           : 100%;
  display         : flex;
  padding         : 16px 24px;
  justify-content : center;
  align-items     : center;
  gap             : 8px;
  align-self      : stretch;
}

.habitat-service_hero-contact-container {
  display        : flex;
  flex-direction : column;
  gap            : 10px;
  width          : 100%;
}

.habitat-service_hero-contact-btns {
  display         : flex;
  align-items     : center;
  justify-content : space-between;
  gap             : 10px;
}

.habitat-service_hero-contact-btns .btn.btn-secondary {
  display         : flex;
  padding         : 16px 24px;
  justify-content : center;
  align-items     : center;
  gap             : 8px;
  flex            : 1 0 0;
  border-radius   : 60px;
  border          : 1px solid var(--color-primary);
  color           : var(--color-primary);
}

.habitat-service_hero-price_base-ttc {
  font-size   : 16px;
  line-height : 32px;
}

/**********************
  Part Project Section
 **********************/

.habitat-service_project-section {
  background  : linear-gradient(265deg, #00A4BC -117.43%, #2B3952 62.17%);
  color       : var(--color-white-default);
  position    : relative;
  display     : flex;
  align-items : center;
  min-height  : 333px;
}

.habitat-service_project-title {
  transform   : rotate(-90deg);
  font-size   : 28px;
  font-style  : normal;
  font-weight : 700;
  line-height : 42px;
  position    : absolute;
}

.habitat-service_project-list {
  display         : flex;
  flex-direction  : row;
  justify-content : center;
  align-items     : center;
  position        : relative;
  margin-bottom   : 18px;
}

.habitat-service_project-item {
  background      : var(--color-white-default);
  width           : 100px;
  height          : 100px;
  flex-shrink     : 0;
  border-radius   : 50px;
  display         : flex;
  align-items     : center;
  justify-content : center;
}

.habitat-service_project-container {
  background-color : black;
  mix-blend-mode   : color-dodge;
  position         : relative;
}

.habitat-service_project-container:after {
  content        : "";
  position       : absolute;
  top            : 0;
  left           : 0;
  width          : 100%;
  height         : 100%;
  background     : linear-gradient(270deg, #DEDD14 0.08%, #88BF40 40.41%, #24A2D8 100.01%);
  mix-blend-mode : multiply;
}

.habitat-service_project-separator {
  height           : 8px;
  background-color : #ffffff;
}

.habitat-service_project-item img {
  position : relative;
  color    : var(--color-white-default);
  z-index  : 1;
}

.habitat-service_project-text-container {
  display : grid;
  gap     : 60px;
}

.habitat-service_project-text {
  text-align  : center;
  font-size   : 15px;
  font-style  : normal;
  font-weight : 500;
  line-height : 150%;
}

/**********************
  Part Main Section
 **********************/

.habitat-service_main-section {
  position : relative;
}

.habitat-service_main-container.container-secondary {
  display               : grid;
  grid-template-columns : 1fr minmax(auto, 520px);
  gap                   : 44px;
  padding               : 110px 0 0;
  z-index               : 1;
}

.habitat-service_description-title h2 {
  color       : var(--color-primary);
  font-size   : 45px;
  font-style  : normal;
  font-weight : 700;
  line-height : 50px;
  margin      : 0 0 24px 0;
}

.habitat-service_description-text {
  color         : var(--color-primary);
  font-size     : 15px;
  font-style    : normal;
  font-weight   : 500;
  line-height   : 180%;
  margin-bottom : 40px;
}

.habitat-service_description-img {
  border-radius : 7px;
  overflow      : hidden;
  position      : relative;
  margin        : 0 0 40px;
}

.habitat-service_description-img::after {
  content        : "";
  position       : absolute;
  inset          : 0;
  background     : linear-gradient(243deg, rgba(0, 164, 188, 0) 12.96%, #2C3248 94.24%);
  pointer-events : none;
}

.habitat-service_advantages {
  margin-bottom : 30px;
}

.habitat-service_advantages-title {
  color       : var(--color-primary);
  font-size   : 28px;
  font-style  : normal;
  font-weight : 700;
  line-height : 42px;
}

.habitat-service_form-container {
  height : 100%;
}

.habitat-service_form {
  border-radius   : 20px;
  background      : #F3F7FA;
  display         : flex;
  width           : 520px;
  padding         : 24px 32px;
  flex-direction  : column;
  justify-content : center;
  align-items     : center;
  gap             : 24px;
  position        : sticky;
  top             : 150px;
  margin-bottom   : 30px;
}

.habitat-service_form-title {
  color          : var(--color-primary);
  text-align     : center;
  font-size      : 29px;
  font-style     : normal;
  font-weight    : 700;
  line-height    : 34px;
  margin         : 0 0 12px;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  gap            : 10px;
}

.habitat-service_form-offer {
  background    : var(--color-secondary);
  padding       : 10px;
  color         : var(--color-white-default);
  border-radius : 8px;
  text-align    : center;
  font-size     : 16px;
  font-style    : normal;
  font-weight   : 700;
  line-height   : normal;
  margin        : 0 0 8px;
}

.habitat-service_form-fields {
  display               : grid;
  grid-template-columns : repeat(2, 1fr);
  gap                   : 8px;
}

.habitat-service_form-group label {
  display : none;
}

.habitat-service_form-group input {
  display       : flex;
  padding       : 16px 16px 16px 20px;
  align-items   : flex-start;
  gap           : 8px;
  border-radius : 100px;
  background    : #FFF;
  border        : none;
  width         : 100%;
}

.habitat-service_form-group textarea {
  display       : flex;
  padding       : 16px 16px 16px 20px;
  align-items   : flex-start;
  gap           : 8px;
  border-radius : 16px;
  background    : #FFF;
  border        : none;
  width         : 100%;
  min-height    : 170px;
}

.habitat-service_form-group.full-width, .habitat-service_form-actions {
  grid-column : 1/3;
}

.habitat-service_form-actions {
  padding-top    : 24px;
  display        : flex;
  flex-direction : column;
  gap            : 8px;
}

.habitat-service_form-actions .btn.btn-pro {
  color           : var(--color-white-default);
  text-align      : center;
  font-size       : 16px;
  font-style      : normal;
  font-weight     : 600;
  line-height     : normal;
  text-transform  : initial;
  padding         : 16px 24px;
  justify-content : center;
  align-items     : center;
  width           : 100%;
}

.habitat-service_form-actions .btn.btn-secondary {
  color           : var(--color-primary);
  text-align      : center;
  font-size       : 16px;
  font-style      : normal;
  font-weight     : 600;
  line-height     : normal;
  border-radius   : 60px;
  border          : 1px solid var(--color-primary);
  background      : transparent;
  display         : flex;
  padding         : 16px 24px;
  justify-content : center;
  align-items     : center;
  text-transform  : initial;
}

.habitat-service_form-logo {
  position : absolute;
  bottom   : -5px;
  right    : 0;
  opacity  : 0.1;
}

.habitat-service_advantages-list {
  display               : grid;
  grid-template-columns : repeat(2, 1fr);
  gap                   : 8px;
}

.habitat-service_advantages-item {
  display       : flex;
  padding       : 24px;
  align-items   : center;
  gap           : 16px;
  border-radius : 16px;
  background    : #F3F7FA;
  color         : var(--color-primary);
  font-size     : 18px;
  font-style    : normal;
  font-weight   : 800;
  line-height   : normal;
}

.habitat-service_advantages-item svg {
  min-width : 45px;
  max-width : 45px;
  height    : 45px;
}

/********************************
  Part overview selection Section
 ********************************/

.habitat-service-overview-section {
  background : var(--color-primary);
  color      : var(--color-white-default);
  padding    : 75px 0;
}

.habitat-service-overview-title-section-title {
  color       : var(--color-white-default);
  text-align  : center;
  margin      : 0;
  font-size   : 45px;
  font-style  : normal;
  font-weight : 700;
  line-height : 50px;
}

.habitat-service-section {
  padding-top : 50px;
  position    : relative;
}

.habitat-service-section_svg {
  position : absolute;
  top      : -30px;
  left     : -100px;
}

.habitat-service-link {
  display         : flex;
  flex-direction  : column;
  height          : 100%;
  justify-content : space-between;
  gap             : 15px;
}

.habitat-service-header {
  display     : flex;
  align-items : center;
  gap         : 5px;
  height      : 100%;
}

.habitat-service-header .habitat-service-title:after {
  content          : '';
  position         : absolute;
  width            : calc(100% + 15px);
  left             : -15px;
  height           : 1px;
  background-color : var(--color-pro);
  bottom           : -5px;
  transform-origin : left;
  transform        : scaleX(0);
  transition       : transform 0.25s ease-in, width .25s ease-in, left .25s ease-in;
}

.habitat-service-section_slide:hover .habitat-service-header .habitat-service-title:after {
  transform        : scaleX(1);
  width            : calc(100%);
  left             : 0;
  transition-delay : .35s;
}

.habitat-service-title {
  color         : var(--color-white-default);
  font-size     : 15px;
  font-style    : normal;
  font-weight   : 700;
  line-height   : normal;
  position      : relative;
  margin-top    : 0;
  margin-bottom : 6px;
}

.habitat-service-section_slide .habitat-service-header_svg {
  transform : rotate(45deg);
}

.habitat-service-section_slide .habitat-service-header_svg line {
  stroke-dasharray  : 9 0;
  stroke-dashoffset : 0;
  transition        : stroke-dashoffset .35s ease-out, stroke-dasharray .35s ease-out;
  transition-delay  : .35s;
}

.habitat-service-section_slide:hover .habitat-service-header_svg line {
  stroke-dashoffset : 20;
  stroke-dasharray  : 18 25;
  transition-delay  : 0s;
}

.habitat-service-section_slide .habitat-service-header_svg path {
  stroke-dasharray  : 15 15;
  stroke-dashoffset : -14;
  transition        : stroke-dasharray .25s ease-out;
  transition-delay  : .3s;
}

.habitat-service-section_slide:hover .habitat-service-header_svg path {
  stroke-dasharray : 0 15;
  transition-delay : .1s;
}

.habitat-service-section .media-container {
  overflow      : hidden;
  border-radius : 10px;
  width         : fit-content;
}

.habitat-service-link:hover {
  color : var(--color-white-default);
}

.habitat-service-link:hover .default-media {
  transform : scale(1.05);
}

.habitat-service-header_svg {
  color : var(--color-pro);
}

.habitat-service-header_svg, .habitat-service-section .default-media {
  transition : all 0.3s ease-in-out;
}
