/* Universal breakpoints */
.blog-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; }
  .blog-tags .blog-tag {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    height: 36px;
    background-color: #f3f6f6;
    color: black;
    text-decoration: none;
    padding-left: 16px;
    padding-right: 16px;
    border-radius: 24px;
    border: 1px solid transparent;
    transition: border-color 200ms ease-in-out; }
    .blog-tags .blog-tag span {
      pointer-events: none;
      margin-top: 3px; }
    .blog-tags .blog-tag img {
      pointer-events: none;
      display: none; }
    .blog-tags .blog-tag:hover {
      cursor: pointer; }
    .blog-tags .blog-tag:hover, .blog-tags .blog-tag:focus-visible {
      border-color: #727377; }
    @media (max-width: 1279px) {
      .blog-tags .blog-tag {
        padding: 8px 12px; } }
    .blog-tags .blog-tag.active {
      background-color: #62657b;
      color: white;
      border-color: #62657b; }
      .blog-tags .blog-tag.active img {
        display: block; }

.blog-typography .blog-body {
  color: #3b3d49;
  /*LL Code*/
  word-break: break-word; }
  .blog-typography .blog-body h1 {
    font-size: 64px;
    font-weight: 700;
    line-height: 74px; }
    /*LL Code*/
    @media (max-width: 1079px) {
      .blog-typography .blog-body h1 {
        font-size: 42px;
        line-height: 52px; } }
  .blog-typography .blog-body h2 {
	  scroll-margin-top: 160px;
    font-size: 48px;
    font-weight: 700;
    line-height: 58px; }
    /*LL Code*/
    @media (max-width: 1079px) {
      .blog-typography .blog-body h2 {
        font-size: 36px;
        line-height: 46px; } }
  .blog-typography .blog-body h3 {
    font-size: 32px;
    font-weight: 700;
    line-height: 42px; }
    /*LL Code*/
    @media (max-width: 767px) {
      .blog-typography .blog-body h3 {
        font-size: 24px;
        line-height: 32px; } }
  .blog-typography .blog-body h4 {
    font-size: 24px;
    font-weight: 500;
    line-height: 32px; }
    /*LL Code*/
    @media (max-width: 767px) {
      .blog-typography .blog-body h4 {
        font-size: 18px;
        line-height: 24px; } }
  .blog-typography .blog-body h5 {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px; }
    /*LL Code*/
    @media (max-width: 767px) {
      .blog-typography .blog-body h5 {
        font-size: 16px;
        line-height: 20px; } }
  .blog-typography .blog-body h6 {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px; }
    /*LL Code*/
    @media (max-width: 767px) {
      .blog-typography .blog-body h6 {
        font-size: 14px;
        line-height: 18px; } }
  .blog-typography .blog-body p,
  .blog-typography .blog-body li {
    font-size: 24px;
    line-height: 32px; }
    .blog-typography .blog-body li a {
      text-decoration: none;
        color: #3f647c;
        font-weight: 500; }
    @media (max-width: 767px) {
      .blog-typography .blog-body p,
      .blog-typography .blog-body li {
        font-size: 18px;
        line-height: 24px; } }
        /*LL Code*/
        @media (max-width: 1079px) {
      .blog-typography .blog-body p,
      .blog-typography .blog-body li {
        font-size: 18px;
        line-height: 24px; } }
        /*LL Code*/
    @media (max-width: 767px) {
      .blog-typography .blog-body p,
      .blog-typography .blog-body li {
        font-size: 16px;
        line-height: 20px; } }
  .blog-typography .blog-body p {
    margin: 24px 0; }
    .blog-typography .blog-body p a {
      text-decoration: none;
      color: #3f647c;
      font-weight: 500;
      /*LL Code*/
      word-break: break-word; }
  .blog-typography .blog-body a {
  	text-decoration:none;
	color: #3f647c;}
  .blog-typography .blog-body img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto; }
  .blog-typography .blog-body__video {
    overflow: hidden;
    position: relative; }
    .blog-typography .blog-body__video__thumbnail {
      cursor: pointer; }
    .blog-typography .blog-body__video__play-button {
      height: 84px !important;
      width: 84px !important;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      pointer-events: none; }
    .blog-typography .blog-body__video iframe {
      border: 0;
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;
      display: none; }
  .blog-typography .blog-body__table_container {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 16px; }
    .blog-typography .blog-body__table_container table {
      width: 890px;
      border: 1px solid #b7bdc9;
      border-collapse: separate;
      border-spacing: 0;
      border-radius: 8px;
      overflow: hidden; }
      .blog-typography .blog-body__table_container table thead tr {
        background-color: #62657b; }
        .blog-typography .blog-body__table_container table thead tr th {
          padding: 16px;
          text-align: left;
          font-size: 24px;
          color: white;
          width: 150px; }
          .blog-typography .blog-body__table_container table thead tr th:not(:last-child) {
            border-right: 1px solid #b7bdc9; }
            /*LL Code*/
          @media (max-width: 767px) {
            .blog-typography .blog-body__table_container table thead tr th {
              font-size: 18px; } }
      .blog-typography .blog-body__table_container table tbody tr:nth-child(even) {
        background-color: #f3f6f6; }
      .blog-typography .blog-body__table_container table tbody tr td {
        padding: 16px;
        font-size: 18px;
        line-height: 32px;
        color: #3b3d49; }
        
        /*LL Code*/
        @media (max-width: 767px) {
          .blog-typography .blog-body__table_container table tbody tr td {
            font-size: 16px;
            padding: 12px; } }
        .blog-typography .blog-body__table_container table tbody tr td:first-child {
          font-size: 24px; }
          /*LL Code*/
          @media (max-width: 767px) {
            .blog-typography .blog-body__table_container table tbody tr td:first-child {
              font-size: 18px; } }
        .blog-typography .blog-body__table_container table tbody tr td:not(:last-child) {
          border-right: 1px solid #b7bdc9; }
  .blog-typography .blog-body__back-to-top {
    color: #3b3d49;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    font-weight: 700;
    padding: 16px;
    transition: all 200ms ease-in-out;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto;
    border-radius: 8px; }
    .blog-typography .blog-body__back-to-top img {
      height: 8px;
      width: auto; }
    .blog-typography .blog-body__back-to-top:hover, .blog-typography .blog-body__back-to-top:active, .blog-typography .blog-body__back-to-top:focus-visible {
      background-color: #f3f6f6; }
	  
	  /* Blog TOC */
	  .blog-toc {
  margin-top: 34px;
  scroll-margin-top: 160px; }
  @media (max-width: 1079px) {
    .blog-toc {
      scroll-margin-top: 200px; } }
  .blog-toc details {
    border: 0;
    border-radius: 0;
    border-bottom: 2px solid #e8e9ec;
    margin-bottom: 16px; }
    .blog-toc details[open] {
      border: none;
      border-bottom: 2px solid #e8e9ec; }
    .blog-toc details summary {
      color: #3b3d49;
      list-style: none;
      cursor: pointer;
      font-weight: bold;
      display: flex;
      padding: 0 0 6px 0;
      justify-content: start;
      gap: 6px;
      font-weight: 700; }
      .blog-toc details summary::-webkit-details-marker {
        display: none; }
      .blog-toc details summary .toc-toggle {
        color: #3f647c; }
    .blog-toc details ul {
      padding-left: 0;
      margin-top: 8px;
      display: flex;
      flex-direction: column;
      gap: 12px; }
      .blog-toc details ul li {
        list-style: none;
        margin: 4px 0;
        font-size: 18px; }
        .blog-toc details ul li a {
          color: #3f647c; }


     
