/* Block - Blog Article Start */
/* ------------------------------------------------*/
.db-article-area {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-top: 11.2rem;
}
@media only screen and (min-width: 768px) {
  .db-article-area {
    padding-top: 15.2rem;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article-area {
    padding-top: 6.9rem;
  }
}

.db-article-container {
  position: relative;
  width: 100%;
}

.db-article {
  position: relative;
  width: 100%;
}

.db-article__headline {
  position: relative;
  width: 100%;
  text-align: center;
  margin-bottom: 7rem;
}
@media only screen and (min-width: 1200px) {
  .db-article__headline {
    max-width: 1100px;
    margin: 0 auto 10rem;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article__headline {
    max-width: 1160px;
  }
}

.db-article__meta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1rem;
  margin-bottom: 1.6rem;
}
@media only screen and (min-width: 1200px) {
  .db-article__meta {
    margin-bottom: 1.8rem;
  }
}

.db-article__breadcrumbs {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.5rem;
}
.db-article__breadcrumbs span {
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-muted);
}
.db-article__breadcrumbs span::after {
  content: "/";
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-left: 0.2rem;
}
.db-article__breadcrumbs span:last-of-type::after {
  display: none;
}
.db-article__breadcrumbs span a {
  display: inline;
  color: var(--t-muted);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
       background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}
.no-touch .db-article__breadcrumbs span a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
       background-size: 0 1px, 100% 1px;
}
.db-article__breadcrumbs span.current-item {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
       background-size: 100% 1px, 0 1px;
  background-position: 100% 100%;
  background-repeat: no-repeat;
}
.db-article__breadcrumbs span.current-item a {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
       background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}
.no-touch .db-article__breadcrumbs span.current-item a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
       background-size: 0 1px, 100% 1px;
}

.db-article__data {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
  color: var(--t-bright);
}
.db-article__data span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
}
.db-article__data span a {
  color: var(--pt-t-light-bright);
}
.db-article__data span svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: currentColor;
}
.db-article__data span.meta-tag {
  font-weight: var(--fw-semibold);
}
.db-article__data span.meta-time {
  font-weight: var(--fw-semibold);
}

.db-article__title {
  margin-bottom: 3.3rem;
}
@media only screen and (min-width: 1200px) {
  .db-article__title {
    margin-bottom: 4.4rem;
  }
}

.db-article__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 1rem;
}

.blog-share-buttons-bottom {
  -webkit-box-pack: start;
     -moz-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.db-article__thumb {
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
       border-radius: var(--_radius-l);
  overflow: hidden;
  margin-bottom: 5.4rem;
}
.db-article__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media only screen and (min-width: 768px) {
  .db-article__thumb {
    height: 600px;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article__thumb {
    height: 760px;
    margin-bottom: 8.3rem;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article__thumb {
    height: 930px;
    margin-bottom: 8rem;
  }
}

.db-article__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 6rem;
  width: 100%;
  text-align: left;
}
@media only screen and (min-width: 768px) {
  .db-article__content {
    gap: 7rem;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article__content {
    max-width: 870px;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article__content {
    max-width: 900px;
  }
}

.db-article__block {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 3rem;
  width: 100%;
}
.db-article__block.block-table-of-contents {
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
       border-radius: var(--_radius-m);
  padding: 3rem;
}
.db-article__block.block-table-of-contents ul li {
  margin-bottom: 0;
}
.db-article__block.block-quote {
  padding: 3rem 0;
  border-top: 1px solid var(--st-muted);
  border-bottom: 1px solid var(--st-muted);
}
.db-article__block.block-image {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 3rem;
}
@media only screen and (min-width: 768px) {
  .db-article__block.block-table-of-contents {
    padding: 4rem;
  }
  .db-article__block.block-image {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article__block.block-image {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}

.table-of-contents__title {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .table-of-contents__title {
    font-size: 3.6rem;
  }
}

.table-of-contents__nav {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.3rem;
}
.table-of-contents__nav li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}
.table-of-contents__nav li a {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}
.no-touch .table-of-contents__nav li a:hover {
  color: var(--t-bright);
}
@media only screen and (min-width: 1600px) {
  .table-of-contents__nav li a {
    font-size: 2.2rem;
  }
}

.quote__text {
  font: normal var(--fw-regular) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  margin-bottom: 2rem;
}
@media only screen and (min-width: 768px) {
  .quote__text {
    font-size: 3.6rem;
  }
}

.quote__cite {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}
@media only screen and (min-width: 1600px) {
  .quote__cite {
    font-size: 2.2rem;
  }
}

.db-article__content ol {
  list-style: decimal inside;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 1rem;
}
.db-article__content ol:not(:has(ol, ul)) {
  gap: 0;
}
.db-article__content ol li {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}
.db-article__content ol li span {
  font-weight: var(--fw-semibold);
  color: var(--t-bright);
}
.db-article__content ol ul {
  gap: 0;
  -webkit-padding-start: 2.4rem;
     -moz-padding-start: 2.4rem;
          padding-inline-start: 2.4rem;
  margin-top: 1rem;
}
.db-article__content ul {
  list-style: disc inside;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 1rem;
}
.db-article__content ul:not(:has(ol, ul)) {
  gap: 0;
}
.article-ul li a {
    text-decoration: none;
    background: -webkit-gradient(linear, left top, right top, from(var(--t-medium)), to(var(--t-medium))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
    background: -moz-linear-gradient(left, var(--t-medium), var(--t-medium)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
    background: linear-gradient(to right, var(--t-medium), var(--t-medium)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
    -moz-background-size: 100% 1px,0 1px;
    background-size: 100% 1px, 0 1px;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    color: var(--t-bright)!important;
    -webkit-transition: background-size 400ms, color 300ms;
    -moz-transition: background-size 400ms,color 300ms,-moz-background-size 400ms;
    transition: background-size 400ms, color 300ms;
    transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.article-ul li a:hover {
    color: var(--t-bright);
    -moz-background-size: 0 1px,100% 1px;
    background-size: 0 1px, 100% 1px;
}
 
.db-article__content ul li span {
  font-weight: var(--fw-semibold);
  color: var(--t-bright);
}
.db-article__content ul ol,
.db-article__content ul ul {
  gap: 0;
  -webkit-padding-start: 2.4rem;
     -moz-padding-start: 2.4rem;
          padding-inline-start: 2.4rem;
  margin-top: 1rem;
}
/* content ul li */
.db-block_single ul {
  list-style: disc inside;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 1rem;
}
.db-block_single ul:not(:has(ol, ul)) {
  gap: 0;
}
.db-block_single ul li {
  font: normal var(--fw-regular) 2.1rem/1.6 var(--_font-accent);
  color: var(--t-medium);
   margin-bottom: 1rem; /* increase to 16px gap */
}
.db-block_single ul li span {
  font-weight: var(--fw-semibold);
  color: var(--t-bright);
}
.db-block_single ul ol,
.db-article__content ul ul {
  gap: 0;
  -webkit-padding-start: 2.4rem;
     -moz-padding-start: 2.4rem;
          padding-inline-start: 2.4rem;
  margin-top: 1rem;
}


/* Inline code only */
.db-article__content p code,
.db-article__content li code,
.db-article__content td code,
.db-article__content span code {
  font-family: 'Fira Code', 'Courier New', monospace;
  font-size: 0.95em;
  color: #d63384;
  padding: 0.2em 0.4em;
  border-radius: 4px;
  white-space: nowrap;
}

/* Code blocks */
.db-article__content pre {
  padding: 1.2rem 1.5rem;
  border-radius: 8px;
  overflow-x: auto;
  margin: 2rem 0;
  font-size: 0.95em;
  line-height: 1.6;
  background: #111;
  color: #f5f5f5;
}

.db-article__content pre code {
  display: block;
  font-family: 'Fira Code', 'Courier New', monospace;
  color: inherit;
  padding: 0;
  border-radius: 0;
  white-space: pre;
  background: transparent;
}

/* Emphasised text */
.db-article__content em {
  font-style: italic;
  color: var(--t-dark);
  padding: 0 0.2em;
  border-radius: 3px;
  font-size: 18px;
}







.db-article__content h2 {
  font-size: clamp(2.4rem, 4vw, 5rem); /* scales between mobile & desktop */
  font-weight: 600;

}
.db-article__content h3 {
  font-size: clamp(2rem, 3vw, 3.2rem);
  font-weight: 600;
}

.db-article__content h2 a {
    color: var(--t-bright);
}
.db-article__content h3 a {
    color: var(--t-bright);
}

@media only screen and (min-width: 1600px) {
  .db-article__content ol li {
    font-size: 2.2rem;
  }
  .db-article__content ol ul {
    -webkit-padding-start: 2.8rem;
       -moz-padding-start: 2.8rem;
            padding-inline-start: 2.8rem;
  }
  .db-article__content ul li {
    font-size: 2.2rem;
  }
  .db-article__content ul ol,
  .db-article__content ul ul {
    -webkit-padding-start: 2.8rem;
       -moz-padding-start: 2.8rem;
            padding-inline-start: 2.8rem;
  }
}

.block-image__container {
  position: relative;
  -moz-border-radius: var(--_radius-m);
       border-radius: var(--_radius-m);
  overflow: hidden;
}

.block-image__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
     -moz-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 1rem;
}

.db-article-author {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 3rem;
  width: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
       border-radius: var(--_radius-m);
  padding: 3rem;
  margin-top: 6rem;
}
@media only screen and (min-width: 768px) {
  .db-article-author {
    padding: 4rem;
    margin-top: 7rem;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article-author {
    max-width: 870px;
    margin: 0rem auto 0;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article-author {
    max-width: 900px;
  }
}

.db-article-author__data {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 1.8rem;
}
@media only screen and (min-width: 768px) {
  .db-article-author__data {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: stretch;
       -moz-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    gap: 3rem;
  }
}

.db-article-author__avatar {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-preferred-size: 100px;
      flex-basis: 100px;
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  -moz-border-radius: var(--_radius-pt-m);
       border-radius: var(--_radius-pt-m);
  overflow: hidden;
}
.db-article-author__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media only screen and (min-width: 768px) {
  .db-article-author__avatar {
    -ms-flex-preferred-size: 120px;
        flex-basis: 120px;
    height: 12rem;
  }
}

.db-article-author__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.db-article-author__name a {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.db-article-author__position {
  line-height: 1.4;
}

.db-article-author__socials {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
     -moz-box-orient: horizontal;
     -moz-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
     -moz-column-gap: 1rem;
          column-gap: 1rem;
  margin-top: 2.2rem;
}

.db-article-navigation {
  position: relative;
  margin-top: 0rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid var(--st-muted);
}
@media only screen and (min-width: 768px) {
  .db-article-navigation {
    margin-top: 0rem;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article-navigation {
    max-width: 870px;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article-navigation {
    max-width: 900px;
  }
}

.db-article-navigation__navitem {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.db-article-navigation__navitem.left {
  -webkit-box-align: start;
     -moz-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  padding-right: 1.5rem;
}
.db-article-navigation__navitem.right {
  -webkit-box-align: end;
     -moz-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  padding-left: 1.5rem;
  text-align: right;
}

.db-article-navigation__link {
  display: block;
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  margin-top: 0.5rem;
}
.db-article-navigation__link span {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
       background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}
.no-touch .db-article-navigation__link span:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
       background-size: 0 1px, 100% 1px;
}

.db-article-comments {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 6rem;
  width: 100%;
  margin-top: 6rem;
}
@media only screen and (min-width: 768px) {
  .db-article-comments {
    gap: 7rem;
    margin-top: 7rem;
  }
}
@media only screen and (min-width: 1200px) {
  .db-article-comments {
    max-width: 870px;
    margin: 7rem auto 0;
  }
}
@media only screen and (min-width: 1600px) {
  .db-article-comments {
    max-width: 900px;
  }
}

.db-article-comments__container,
.db-article-comments__respond {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 3rem;
}

.db-article-comments__list {
  position: relative;
  width: 100%;
}
.db-article-comments__list ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.db-comment {
  margin-top: -1px;
  border-top: 1px solid var(--st-muted);
}
.db-comment:last-of-type {
  border-bottom: 1px solid var(--st-muted);
}

.db-comment__children {
  padding-left: 3rem;
}
@media only screen and (min-width: 768px) {
  .db-comment__children {
    padding-left: 13rem;
  }
}

.db-comment__container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.5rem;
  padding: 3rem 0;
}
@media only screen and (min-width: 768px) {
  .db-comment__container {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 3rem;
  }
}

.db-comment__avatar {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-preferred-size: 100px;
      flex-basis: 100px;
  -webkit-box-flex: 0;
     -moz-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  -moz-border-radius: var(--_radius-pt-m);
       border-radius: var(--_radius-pt-m);
  overflow: hidden;
  margin-bottom: 0.6rem;
}
.db-comment__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media only screen and (min-width: 768px) {
  .db-comment__avatar {
    margin-bottom: 0;
  }
}

.db-comment__content {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 1.4rem;
}
@media only screen and (min-width: 1200px) {
  .db-comment__content {
    gap: 1.3rem;
  }
}

.db-comment__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
     -moz-box-orient: vertical;
     -moz-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.2rem;
}

.db-comment__reply {
  margin-top: 0.9rem;
}

/* ------------------------------------------------*/
/* Block - Blog Article End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/