:root {
  --blog-radius: 16px;

  --blog-article-info-box-radius: var(--blog-radius);
  --blog-article-info-box-title-display: inherit;
  --blog-article-info-box-title-font-weight: 600;
  --blog-article-info-box-title-mobile-font-size: var(--blog-font-size-3xl);
  --blog-article-info-box-title-mobile-line-height: 34px;

  --blog-article-gallery-image-height: 240px;
  --blog-article-gallery-image-max-width-mobile: 320px;
  --blog-article-gallery-image-radius: 16px;

  --blog-article-layout-justify: center;
  --blog-article-title-font-weight: var(--blog-font-weight-semibold);
  --blog-article-title-font-size: var(--blog-font-size-4xl);
  --blog-article-title-line-height: var(--blog-line-height-4xl);
  --blog-article-title-font-size-mobile: 40px;
  --blog-article-title-line-height-mobile: 50px;
  --blog-article-meta-padding: 8px;
  --blog-article-meta-gap: 0;
  --blog-article-subtitle-font-size: var(--blog-font-size-lg);
  --blog-article-subtitle-font-weight: var(--blog-font-weight-extrabold);
  --blog-article-subtitle-line-height: var(--blog-line-height-lg);
  --blog-article-subtitle-font-size-mobile: var(--blog-font-size-lg);
  --blog-article-subtitle-font-weight-mobile: var(--blog-font-weight-extrabold);
  --blog-article-subtitle-line-height-mobile: var(--blog-line-height-lg);
  --blog-article-image-height: 240px;
  --blog-article-image-radius: 16px;
  --blog-article-separator-margin: 12px;
  --blog-article-separator-color: var(--blog-color-gray-600);
  --blog-article-show-avatar: none;
  --blog-article-author-gap: 0;
  --blog-article-text-block-font-size: var(--blog-font-size-md);
  --blog-article-text-block-line-height: var(--blog-line-height-lg);
  --blog-article-author-name-font-size: var(--blog-font-size-lg);
  --blog-article-author-name-font-weight: 800;
  --blog-article-author-name-line-height: var(--blog-line-height-lg);
  --blog-article-author-link-font-weight: 700;

  --blog-article-card-image-radius: 16px;
  --blog-article-card-info-radius: 16px;

  --blog-left-content-max-width: 712px;

  --blog-gap-s: 16px;
  --blog-gap-m: 30px;

  --blog-author-card-avatar-border-radius: 16px;
  --blog-author-card-avatar-width: 180px;
  --blog-author-card-avatar-width-mobile: 180px;

  --blog-button-radius: 10px;
  --blog-button-text-font-weight: var(--blog-font-weight-bold);
  --blog-button-secondary-color: var(--blog-color-white);
  --blog-button-secondary-background: var(--blog-color-yellow-500);

  --blog-card-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1);

  --blog-container-max-width: 1180px;
  --blog-container-padding-inline: 20px;

  --blog-headline-font-weight: var(--blog-font-weight-medium);
  --blog-headline-h3-font-size: var(--blog-font-size-lg);

  --blog-main-carousel-title-font-weight: var(--blog-font-weight-medium);
  --blog-main-carousel-max-height: 500px;
  --blog-main-carousel-max-height-mobile: 225px;
  --blog-main-carousel-max-height-mobile-wide: 400px;
  --blog-main-carousel-pagination-bottom: 20px;

  --blog-articles-gap: 20px;

  --blog-article-card-max-width: 360px;
  --blog-article-card-border-radius: 16px;
  --blog-article-card-border-color: var(--blog-color-gray-300);
  --blog-article-card-description-padding: 20px 20px;
  --blog-article-card-description-gap: 8px;
  --blog-article-card-description-min-height: 180px;
  --blog-article-card-description-font-size: var(--blog-font-size-xl);
  --blog-article-card-description-font-weight: var(--blog-font-weight-semibold);
  --blog-article-card-description-line-height: var(--blog-line-height-xl);
  --blog-article-card-description-font-size-mobile: 20px;
  --blog-article-card-description-line-height-mobile: var(--blog-line-height-xl);
  --blog-article-card-image-height: 240px;

  --blog-articles-by-tag-content-align: center;
  --blog-articles-by-tag-button-align: initial;

  --blog-button-background: var(--blog-color-yellow-500);
  --blog-button-color: var(--blog-color-white);
  --blog-button-border: none;

  --blog-toc-title-color: var(--blog-color-gray-800);

  --blog-header-submenu-z-index: initial;
  --blog-header-submenu-transform: initial;
  --blog-header-submenu-padding-top: initial;
}