main {
  margin: 0; 
}

@media (max-width: 781px) {
  body.home .hero-section {
    padding-left: 0 !important;
  
    .wp-block-cover {
      img {
        width: 100vw !important; 
      }
    }
  }
  
  body.home .hero-section > .has-primary-background-color {
    padding-left: 24px !important;
  }
}

/* This is a utility class to make sure images cover their container without distortion. */
.object-fit-cover img {
  object-fit: cover;
}


@media (max-width: 1290px) {
  .services-columns-list {
    flex-wrap: wrap !important;
    gap: 16px !important;
    .wp-block-column {
      flex-basis: 100% !important;
    }
  }
}

@media (max-width: 960px) {
  .services-columns-container {
    flex-wrap: wrap !important;
    .wp-block-column {
      flex-basis: 100% !important;
    }
    .object-fit-cover img {
      width: 100% !important;
      height: 400px !important;
      object-fit: cover !important;
    }
  }
}

/* button hover styles */ 
.wp-block-button__link {
  position: relative;
  overflow: hidden;
  z-index: 0;
  isolation: isolate;
}

.wp-block-button__link::after {
  content: "";
  position: absolute;
  inset: 0;
  background: inherit;
  background-color: #0A433E;
  clip-path: circle(0% at 50% 200%); 
  transition: clip-path 0.5s ease;
  z-index: -1;
}

.wp-block-button__link:hover::after {
  clip-path: circle(150% at 50% 100%);
}

.wp-block-button__link {
  z-index: 1;
}

.wp-block-button__link > * {
  position: relative;
  z-index: 2;
}

.is-style-button-orange .wp-block-button__link::after {
  background-color: #F88D3A;
}

.is-style-button-white .wp-block-button__link::after {
  background-color: #DCE3DC;
}

/* Hide image captions globally */
.wp-element-caption {
  display: none !important;
}

/* 404 */
.page-404 {
  max-height: 100% !important;
  min-height: 100vh !important;
  height: 100vh !important;
  position: relative;
  z-index: 0;

  .page-404-content {
    position: relative;
    z-index: 2;
  }

}

.page-404::before {
  content: "";
  position: absolute;
  left: 0;
  top: -100px;

  width: 100%;
  height: 100vh;

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='916' height='728' viewBox='0 0 916 728' fill='none'><path d='M-312.205 600.856C-141.647 577.057 2.08869 724.187 169.608 700.986C514.982 653.154 248.086 123.607 129.621 172.455C7.3583 222.868 225.837 699.728 475.181 547.553C543.002 506.161 636.011 391.993 668.38 215.903C715.789 -42.0019 891.045 -160.261 891.045 -160.261' stroke='%23006258' stroke-width='40' stroke-linecap='round'/></svg>");

  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: left top;

  z-index: -1;
}

.page-404::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;

  width: 100%;
  height: 100vh;

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='549' height='800' viewBox='0 0 549 800' fill='none'><path d='M366.418 1043.08C507.34 808.913 582.183 575.137 472.128 485.649C356.7 391.793 155.973 675.139 49.3923 568.558C-96.1029 423.063 437.95 194.505 283.456 -81.1158' stroke='%23006258' stroke-width='40' stroke-linecap='round'/></svg>");

  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: right top;

  z-index: -1;
}

@media (max-width: 1350px) {
  .page-404::before {
    background-size: auto 80% !important;
    background-position: left top !important;
    top: 0 !important;
  }

  .page-404::after {
    display: none !important;
  }
}

@media (max-width: 600px) {
  .page-404-content {
    h1 {
      font-size: var(--wp--preset--font-size--heading-3) !important;
    }
  }
}


/* Other css */ 
@media (max-width: 700px) {
  .three-steps-columns {
    h3 {
      font-size: var(--wp--preset--font-size--heading-6) !important;
    }
  }
}

@media (max-width: 550px) {
  .three-steps-columns {
    display: block !important;

    .wp-block-column {
      margin-top: 24px !important;
      width: 100% !important;
      flex: none !important;
      display: block !important;

      p {
        margin-top: 4px !important;
      }
    }
  }
}


