

/* --------------------- Blog Post --------------------- */

.featured_img {
    width: 100%;
  }

  .blog-post_heading {
    color: #1A1D2C;
    font-size: 40px;
    font-weight: 700;
    line-height: 125%;
    padding-top: 31px;
  }

.blog-post_metadata {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 0; 
}

.blog-post_author {
    display: flex;
    align-items: center;
  }

.blog-post_author-name {
    font-size: 16px;
    color: #333;
    line-height: normal;
    font-weight: 400;
  }

.blog_post-time {
    font-size: 16px;
    color: #333;
    line-height: normal;
    font-weight: 400;
  }

.blog-post_bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding-top: 30px;
  }

.blog_post-tag {
  background-color: #1A1D2C;
    padding: 10px;
  color: #ffffff;
    font-size: 15px;
    font-weight: 500;
    border: 1px solid #1A1D2C;
    display: inline-block;
  }

  .blog_post-tag:hover {
      background-color: #ffffff;
      color: #1A1D2C;
  }

.blog-post_body h2 {
  color: #1A1D2C;
  font-size: 28px;
  font-weight: 700;
  line-height: 142%;
  padding-top: 32px;
}

.blog-post_body h3 {
  color: #1A1D2C;
  font-size: 24px;
  font-weight: 600;
  line-height: 142%;
  padding-top: 32px;
}

.blog-post_body h4 {
  color: #1A1D2C;
  font-size: 22px;
  font-weight: 600;
  line-height: 142%;
  padding-top: 32px;
}

  .blog-post_body p, .blog-post_body span {
    color: #666;
    font-size: 18px;
    font-weight: 400;
    line-height:  177.778%;
  }

.social-sharing {
    display: flex;
    gap: 20px;
    align-items: center;
  }

  .social-sharing__share-text {
    color: #1A1D2C; 
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
  }
  
  .social-sharing_link span svg {
    width: 30px;
    height: 30px;
    fill: #fff;
    transition: all .3s ease-in;
  }

  .social-sharing_link span svg:hover {
    fill: #1A1D2C;
  }

  .search-box_label {
      color: #1A1D2C;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
  }

    .search-box {
    padding: 12px 40px 12px 20px;
      border: 1px solid #CCC;
    background: #FFF;
      color: #1A1D2C;
      font-size: 16px;
      font-weight: 400;
      line-height: normal;
    }

.search-box:focus-visible {
      outline: 1px solid  color: #fff;;
}

.hs-search-field__suggestions {
  list-style: none;
}

.hs-search-field__suggestions #results-for {
  font-weight: bold;
}

.hs-search-field__suggestions .hs-highlight-title {
      font-style: italic;
  text-decoration: underline;
}

.search-submit svg {
    width: 19px;
    height: 19px;
    fill: #000000;
    
  }

.related_post-heading {
  color: #1A1D2C;
  font-size: 18px;
  font-weight: 700;
  line-height: 133.333%;
  letter-spacing: -0.18px;
}

  .related_post-title, .related_post-title a {
    color: #666;
    font-size: 14px;
    font-weight: 400;
    line-height: 142.857%;
  }

    .related_post-title:not(:last-child) {
      padding-bottom: 16px;
    }

  @media (max-width: 767px) {
    .blog-post_heading {
      font-size: 24px;
      line-height:  150%;
    }
    
    .blog-post_body h2 {
  font-size: 20px;
  line-height: 152%;
      padding-top: 40px;
}
    
    .blog-post_body h3 {
      font-size: 18px;
      line-height: 150%;
      padding-top: 40px;
    }
    
    .blog-post_body h4 {
      font-size: 17px;
      line-height: 150%;
      padding-top: 40px;
    }
    
    
    .blog-post_body p, .blog-post_body span { 
      font-size: 16px;
      line-height: 175%;
    }
    
    .related_post-heading {
      font-size: 16px;
    }
  }

/* --------------------- Blog Post --------------------- */


/* --------------------- Blog Post Comments --------------------- */

#blogComments {
  padding: 80px 0;
}

@scope (#blogComments) {
  .comment.depth-0 {
    border-top: 2px solid #CCCCCC;
    margin-top: 0;
    padding: 40px 0;
  }
  
  .comment-date, .comment-reply-to {
    display: none;
  }
  
  .section.post-footer {
    display: flex;
    flex-direction: column-reverse;
    gap: 70px;
  } 
  
  form.hs-form {
    padding: 0;
  }
  
  .hs-form fieldset {
    max-width: 100%;
  }
  
  fieldset.form-columns-1 {
    padding: 20px 0;
  }
  
  fieldset.form-columns-3 {
    padding-bottom: 20px;
    display: flex;
    gap: 20px;
  }
  
  .hs-form label:not(label.hs-error-msg) {
    width: 1px;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    overflow: hidden;
    position: absolute;
  }
  
  .hs-error-msgs .hs-error-msg {
    display: inline-block;
  }
  
  .hs-form fieldset div.hs-form-field {
    padding-bottom: 0;
  }
    
  .hs-form fieldset .hs-input, .hs-form fieldset.form-columns-3 .hs-input {
    width: 100% !important;
  }
  
  .hs-form .hs-form-field .hs-input {
    background-color: transparent; 
    outline: 1px solid #CCC;
    color: #1A1D2C;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
  }
  
  .hs-form fieldset .hs-input, .hs-form fieldset .input {
    margin-right: 0 !important;
  }
  
  .hs-form .hs-submit .actions {
    text-align: right;
  }
  
  .hs-form .hs-submit .hs-button {
    max-width: 164px;
    margin-top: 0;
  }
  
  .hs-recaptcha {
    padding: 20px 0;
  }
  
  .comment-from h4 {
    color: #1A1D2C;
    font-size: 18px;
    font-weight: 700;
    line-height: 133.333%;
    letter-spacing: -0.18px;
    padding-bottom: 16px;
  }
  
  .comment-body p {
    color: #666;
    font-size: 14px;
    font-weight: 400;
    line-height: 142.857%;
  }
}

@media (max-width: 767px) {
  #blogComments {
  padding: 40px 0;
  }
  
  @scope (#blogComments) {
    fieldset.form-columns-3 {
      flex-direction: column;
    }
    
    .hs-form fieldset.form-columns-3 .hs-form-field {
      width: 100%;
    }
    
    .hs-form .hs-submit .hs-button {
      max-width: 100%;
    }
  }
}


/* --------------------- Blog Post Comments --------------------- */