.blog-preview {
  padding: 60px 0;
}

.blog-preview .H3.spacer {
  margin-bottom: 30px;
}

.blog-preview .side .Sub2 {
  max-width: 190px;
}

.blog-view {
  padding: 100px 0 60px;
}

.blog-view .blog-side-bar {
  width: 280px;
  display: flex;
  margin-right: 20px;
  flex-direction: column;
  position: sticky;
  height: max-content;
  top: 0;
  align-self: baseline;
}

.blog-view .blog-side-bar img {
  width: 280px;
  height: 360px;
  object-fit: cover;
}

.blog-view .blog-side-bar .blog-widget {
  padding-top: 32px;
}

.blog-view .blog-side-bar a svg {
  flex: none;
}

.blog-view .blog-side-bar a.active p{
  color: #004d35 !important;
}
.blog-view .blog-side-bar a.active svg{
  display: block !important;
}

.blog-view .blog-side-bar a:hover p,
.blog-view .blog-side-bar a:hover .Body {
  color: #004d35 !important;
}

.blog-view .blog-content {
  max-width: 715px;
  flex: 1;
}

.blog-view .blog-content img {
  width: 100%;
}

.blog-view .file-heading {
  margin-bottom: 42px;
}

.blog-view .file-label {
  width: fit-content;
}

.bookmark-list {
  margin-bottom: 20px;
}

.bookmark-link {
  text-decoration: none;
  transition: all 0.2s ease;
}

.bookmark-link:hover .Body {
  color: #004d35;
}

.bookmark-icon {
  flex-shrink: 0;
}

.blog-view-mob .blog-author {
  display: flex;
  padding: 40px 16px 20px;
  flex-direction: row;
}

.blog-view-mob .blog-author .img,
.blog-view-mob .blog-author img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #afbcba;
  object-fit: cover;
}

.blog-view-mob .blog-author .details {
  margin-left: 12px;
}

.blog-view-mob .blog-author .Cap {
  font-size: 11px;
}

.blog-view-mob .mob-widget {
  padding: 40px 16px 20px;
}

.blog-view-mob .mob-widget .Body {
  font-size: 14px;
  line-height: unset;
}

.blog-view-mob .blog-content img {
  width: 100%;
}

.blog-view-mob .file-heading {
  margin-bottom: 32px;
}

.blog-view-mob .module-container .Sub2 {
  font-size: 16px;
  line-height: 19px;
}

.module-container {
  margin-bottom: 12px;
}

.blog-view-mob .module-container.padding{
  padding: 40px 20px;
}
.blog-view-mob .module-container.side-pad{
  padding-left: 60px !important;
}
.blog-view-mob .blog-author .img, .blog-view-mob .blog-author img {
    background-color: var(--light-grey);
    border-radius: 50%;
    height: 40px;
    width: 40px;
}
.module-container.padding {
  padding: 60px;
}


/* Module Types */
.module-container.type-head {
  margin-top: 18px;
}

.module-container.type-paragraph {
  margin-bottom: 12px;
}

.module-container.type-image img {
  width: 100%;
  height: auto;
  display: inline;
}

.module-container.type-linkedImage img {
  width: 100%;
  height: auto;
  display: block;
  transition: opacity 0.3s ease;
}

.module-container.type-linkedImage img:hover {
  opacity: 0.9;
}

/* Side by Side Layout */
.side-by-side {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}

/* Link Button */
.link-btn-wrapper {
  margin: 40px auto 0;
}
.blog-view-mob .module-container .H5 {
  font-size: 20px;
}
.blog-view-mob .module-container .H6 {
  font-size: 18px;
}
.link-btn-toggle {
  display: inline-block;
  padding: 19px 21px;
  border: 2px solid #004d35;
  text-decoration: none;
  transition: all 0.3s ease;
}

@media screen and (max-width: 1200px) and (min-width: 481px) {
  .link-btn-toggle {
    padding: 16px 101px;
  }
}

@media screen and (max-width: 480px) {
  .link-btn-toggle {
    width: 100% !important;
    margin-inline: 32px;
    display: flex;
    justify-content: center;
  }
  .blog-view-mob .module-container .Body, .blog-view-mob .module-container .Sub, .blog-view-mob .module-container .Sub2{
    padding: 0 32px;
  }
}

.link-btn-toggle:hover {
  background-color: #004d35;
}

.link-btn-toggle:hover .Sub2 {
  color: #ffffff !important;
}

/* File Display */
.file {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background-color: #f5f5f5;
  border-radius: 8px;
  margin-bottom: 20px;
}

.file .file-label {
  flex: 1;
}

.file .file-label a {
  text-decoration: none;
  color: inherit;
}

.file .file-label a:hover {
  color: #004d35;
}

.file .download-button {
  transition: transform 0.2s ease;
}

.file .download-button:hover {
  transform: translateY(-2px);
}

/* Anchor Name (for bookmarks) */
.anchor-name {
  scroll-margin-top: 0px;
}

/* Block Spacer */
.block-spacer {
  transition: height 0.3s ease;
}

.blog-view-mob .module-container .Cap {
  font-size: 10px;
}

.blog-view-mob .module-container .H3 {
  font-size: 40px;
  line-height: 49px;
}

.blog-view-mob .module-container .H4 {
  font-size: 32px;
  line-height: 38px;
}

.blog-view-mob .module-container .Body {
  font-size: 14px;
  line-height: 18px;
}

/* Responsive Styles */

@media screen and (min-width: 481px) and (max-width: 1200px) {
  .blog-view-mob .blog-content .module-container .link-btn-wrapper {
    justify-content: start;
    margin-bottom: 50px;
  }
}

/* Tablet */
@media screen and (max-width: 1200px) and (min-width: 481px) {
  .blog-preview {
    padding: 60px 32px 40px;
  }

  .blog-preview .container {
    padding-right: 32px;
    display: flex;
    flex-direction: column;
  }

  .blog-preview .container .f3 p {
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
  }

  .blog-preview .container .f7 {
    align-self: flex-end;
    width: 70%;
  }

  .blog-preview .container .f7 .H3 {
    font-style: italic;
    font-weight: 400;
    font-size: 40px;
    line-height: 47px;
  }

  .blog-preview .container .f7 .Body {
    font-weight: 400;
    font-size: 14px;
    line-height: 140%;
  }

  .blog-preview .container .f2 {
    display: none;
  }

  .blog-view-mob {
    padding: 32px 64px 0;
  }

  .blog-view-mob .blog-author {
    padding: 40px 0 20px 168px;
  }

  .blog-view-mob .mob-widget {
    margin-left: 152px;
  }

  .blog-view-mob .blog-content .H-mob {
    font-weight: 400;
    padding-left: 168px;
  }

  .blog-view-mob .blog-content .module-container {
    margin-left: 168px;
  }

  .blog-view-mob
    .blog-content
    .module-container
    .link-btn-wrapper
    .link-btn-toggle {
    padding: 16px 101px;
  }
}

/* High DPI Tablets */
@media screen and (max-width: 1229px) and (min-width: 960px) and (-webkit-device-pixel-ratio: 1.25) {
  .blog-preview {
    padding: 60px 0;
  }

  .blog-preview .container {
    padding-right: unset;
    flex-direction: unset;
  }

  .blog-preview .container .f3 p {
    font-size: 18px;
    font-weight: 600;
    line-height: 21px;
  }

  .blog-preview .container .f7 {
    align-self: unset;
    width: unset;
  }

  .blog-preview .container .f7 .H3 {
    font-style: unset;
    font-size: 60px;
    font-weight: 400;
    line-height: 70px;
  }

  .blog-preview .container .f7 .Body {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
  }

  .blog-preview .container .f2 {
    display: unset;
  }

  .blog-view-mob {
    padding: unset;
  }

  .blog-view-mob .blog-author {
    padding: 40px 16px 20px;
  }

  .blog-view-mob .mob-widget {
    margin-left: unset;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .blog-view-mob .blog-content .H-mob {
    font-size: 30px;
    font-weight: 400;
    line-height: inherit;
    padding: 40px 32px 0;
  }
  .blog-preview .container,
  .inner-blog-preview {
    display: flex;
    padding: 32px;
    flex-direction: column;
  }

  .blog-preview .container .Sub2 {
    font-size: 12px;
  }

  .blog-preview .container .Body {
    font-size: 14px;
  }

  .blog-preview .container .H3 {
    font-size: 40px;
    font-weight: 300;
    line-height: 47px;
  }

  .blog-preview {
    padding: 60px 0 40px;
  }

  .blog-preview .container {
    padding: 0 32px;
  }

  .blog-preview .side .Sub2 {
    max-width: 311px;
  }

  .blog-view-mob .file-heading {
    padding: 0 32px;
  }

  .blog-view-mob .file {
    padding: 0 32px;
  }

  .blog-view-mob .file-label p {
    padding: 0 !important;
  }

  .blog-view-mob .module-container .Sub {
    padding: 0 32px;
  }

  .side-by-side {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .blog-view-mob .module-container .Body .Sub, .blog-view-mob .module-container .Body .Sub2, .blog-view-mob .module-container.padding .Body{
    padding: 0;
  }
  .blog-view-mob .module-container .link-btn-wrapper{
    margin-bottom: 10px;
  }
}
