#module-bwahabitat-services .page-header {
  display               : grid;
  grid-template-columns : 1fr;
}

#module-bwahabitat-services .page-header > * {
  grid-area : 1/1
}

#module-bwahabitat-services .page-header img {
  object-fit : cover;
  height     : 410px;
  width      : 100%;
}

#module-bwahabitat-services .page-header h1 {
  background      : transparent;
  display         : flex;
  align-items     : center;
  justify-content : center;
  color           : white;
  text-align      : center;
  font-size       : 60px;
  font-style      : normal;
  font-weight     : 700;
  line-height     : 1.1;
  padding         : 20px;
}

.habitat-services-grid {
  display               : grid;
  grid-template-columns : repeat(auto-fill, minmax(260px, 305px));
  align-items           : center;
  justify-content       : center;
  gap                   : 30px;
}

.habitat-service-card {
  overflow : hidden;
}

.habitat-service-image {
  border-radius : 10px;
  overflow      : hidden;
}

.habitat-service-image img {
  width         : 100%;
  height        : 100%;
  object-fit    : cover;
  transition    : transform .3s ease;
  border-radius : 10px;
}

.habitat-service-image:hover img {
  transform : scale(1.05);
}

.habitat-services-header .title {
  color       : var(--color-primary);
  text-align  : center;
  font-size   : 35px;
  font-style  : normal;
  font-weight : 700;
  line-height : 50px;
  margin      : 0 0 20px 0;
  max-width   : 810px;
}

.habitat-services-header .subtitle {
  color       : var(--color-primary);
  text-align  : center;
  font-size   : 15px;
  font-style  : normal;
  font-weight : 500;
  line-height : 180%;
  opacity     : 0.7;
  max-width   : 590px;
}

.habitat-services-header {
  display        : flex;
  flex-direction : column;
  margin-bottom  : 70px;
  align-items    : center;
}

.habitat-services {
  padding : 80px 0 140px;
}

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

.habitat-service-content .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-content:hover .habitat-service-header_svg line {
  stroke-dashoffset : 20;
  stroke-dasharray  : 18 25;
  transition-delay  : 0s;
}

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

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

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

.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-content:hover .habitat-service-title:after {
  transform        : scaleX(1);
  width            : calc(100%);
  left             : 0;
  transition-delay : .35s;
}

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

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

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