/* line 1, _elements.page.scss */
.page {
  display: grid;
  grid-template-rows: min-content;
  grid-template-areas: "content content"; }
  /* line 5, _elements.page.scss */
  .page__content {
    grid-area: content;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 20px 0; }
  /* line 12, _elements.page.scss */
  .page__sidebar {
    grid-area: sidebar;
    min-width: 0; }
    @media (max-width: 1024px) {
      /* line 12, _elements.page.scss */
      .page__sidebar {
        display: none; } }
    /* line 19, _elements.page.scss */
    .page__sidebar .sidebar__item {
      position: sticky;
      top: 108px; }
  /* line 25, _elements.page.scss */
  .page__form {
    max-width: 480px;
    box-shadow: var(--shadow-s);
    border-radius: var(--radius);
    padding: 20px;
    margin: 20px 0 0; }
  @media (min-width: 1025px) {
    /* line 32, _elements.page.scss */
    .page.with-sidebar {
      grid-template-columns: 1fr 4fr;
      grid-template-areas: "sidebar content";
      gap: 0 40px; } }

/* line 1, _elements.sidebar-menu.scss */
.sidebar-menu {
  display: flex;
  flex-direction: column;
  gap: 3px; }
  /* line 5, _elements.sidebar-menu.scss */
  .sidebar-menu a {
    display: inline-block;
    vertical-align: top;
    padding: 5px 10px;
    border-radius: var(--radius); }
    /* line 10, _elements.sidebar-menu.scss */
    .sidebar-menu a.is-active {
      background: var(--bg-grey);
      font-weight: var(--font-bold); }
    /* line 14, _elements.sidebar-menu.scss */
    .sidebar-menu a.is-parent {
      display: inline-flex;
      gap: 8px;
      align-items: center;
      padding-left: 5px; }
  /* line 21, _elements.sidebar-menu.scss */
  .sidebar-menu__submenu {
    margin: 3px 0 0 10px; }

/* line 1, _elements.sitemap.scss */
.sitemap {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin: 40px 0 0; }
  /* line 6, _elements.sitemap.scss */
  .sitemap .text {
    color: var(--color-black); }
    /* line 9, _elements.sitemap.scss */
    .sitemap .text ol + ol, .sitemap .text ol + ul, .sitemap .text ul + ol, .sitemap .text ul + ul {
      margin-top: 0; }
    /* line 12, _elements.sitemap.scss */
    .sitemap .text ol li, .sitemap .text ul li {
      margin: 0;
      padding: 5px 0 0; }
    /* line 17, _elements.sitemap.scss */
    .sitemap .text a {
      text-decoration: none; }
  /* line 21, _elements.sitemap.scss */
  .sitemap__list {
    column-count: 3;
    gap: 20px;
    margin: 15px 0 0 0 !important; }
    @media (max-width: 767px) {
      /* line 21, _elements.sitemap.scss */
      .sitemap__list {
        column-count: 2; } }
    @media (max-width: 575px) {
      /* line 21, _elements.sitemap.scss */
      .sitemap__list {
        column-count: 1; } }
    /* line 31, _elements.sitemap.scss */
    .sitemap__list > li {
      display: block;
      break-inside: avoid; }
    /* line 35, _elements.sitemap.scss */
    .sitemap__list-collections {
      margin: 0 !important; }
      /* line 37, _elements.sitemap.scss */
      .sitemap__list-collections > li {
        padding: 20px 0 0 !important; }
        /* line 39, _elements.sitemap.scss */
        .sitemap__list-collections > li > a {
          font-weight: var(--font-bold); }

/* line 1, _elements.universal.scss */
.universal {
  display: flex;
  flex-direction: column;
  gap: 20px; }
  /* line 5, _elements.universal.scss */
  .universal__item {
    display: flex;
    gap: 20px;
    flex-direction: column; }
    /* line 9, _elements.universal.scss */
    .universal__item.is-shadow {
      padding: 20px;
      border-radius: var(--radius);
      box-shadow: var(--shadow-s); }
    /* line 14, _elements.universal.scss */
    .universal__item.is-border {
      padding: 20px;
      border-radius: var(--radius);
      border: 1px solid var(--border-grey); }
  /* line 20, _elements.universal.scss */
  .universal__header {
    display: flex;
    gap: 20px; }
  /* line 24, _elements.universal.scss */
  .universal__info {
    display: flex;
    gap: 4px;
    flex-direction: column;
    align-self: center; }
  /* line 30, _elements.universal.scss */
  .universal__title {
    font-size: 18px;
    line-height: 22px;
    font-weight: var(--font-normal); }
  /* line 34, _elements.universal.scss */
  .universal__subtitle {
    color: var(--color-grey-l); }
  /* line 37, _elements.universal.scss */
  .universal__image {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 50px;
    max-width: 50px;
    height: 50px; }
    /* line 44, _elements.universal.scss */
    .universal__image.is-bg {
      flex: 0 0 70px;
      max-width: 70px;
      height: 70px;
      background-color: var(--bg-grey);
      border-radius: 50%; }
    /* line 51, _elements.universal.scss */
    .universal__image img {
      width: 50px;
      height: 50px;
      object-fit: contain; }
  /* line 57, _elements.universal.scss */
  .universal__info {
    align-self: center; }

/* line 62, _elements.universal.scss */
.universal-gallery {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(4, 1fr); }
  @media (max-width: 767px) {
    /* line 62, _elements.universal.scss */
    .universal-gallery {
      gap: 10px;
      grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 575px) {
    /* line 62, _elements.universal.scss */
    .universal-gallery {
      grid-template-columns: repeat(2, 1fr); } }
  /* line 73, _elements.universal.scss */
  .universal-gallery__item {
    box-shadow: var(--shadow-s);
    border-radius: var(--radius);
    overflow: hidden;
    color: var(--color-black);
    background-color: var(--bg-grey); }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 73, _elements.universal.scss */
      .universal-gallery__item {
        transition: box-shadow 0.2s ease; } }
    @media (hover: none) {
      /* line 73, _elements.universal.scss */
      .universal-gallery__item {
        -webkit-tap-highlight-color: transparent; } }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 25, _mixins.scss */
      .universal-gallery__item:hover {
        color: var(--color-secondary);
        box-shadow: var(--shadow); }
        /* line 86, _elements.universal.scss */
        .universal-gallery__item:hover .thumb img {
          filter: brightness(80%);
          transform: scale(1.02); } }
    /* line 92, _elements.universal.scss */
    .universal-gallery__item .thumb {
      color: currentColor !important;
      --radius: 0; }
      @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
        /* line 95, _elements.universal.scss */
        .universal-gallery__item .thumb img {
          will-change: transform;
          transition: filter 0.6s ease, transform 0.6s ease; } }
    /* line 102, _elements.universal.scss */
    .universal-gallery__item .svg-icon {
      position: absolute;
      z-index: 5;
      left: 50%;
      top: 50%;
      padding: 2px;
      background-color: var(--bg-white);
      border-radius: 50%;
      box-shadow: var(--shadow-m);
      object-fit: none;
      width: 38px;
      height: 38px;
      transform: translate(-50%, -50%); }

/* line 1, _elements.article.scss */
.article {
  margin: 0 0 -20px;
  position: relative; }
  /* line 5, _elements.article.scss */
  .article__date {
    font-size: 12px;
    line-height: 16px;
    color: var(--color-grey-l);
    margin: 0 0 5px; }
  /* line 11, _elements.article.scss */
  .article__timer {
    margin: 0 0 20px; }
    /* line 14, _elements.article.scss */
    .article__timer .labels__item_type_timer {
      --label-bg: var(--bg-grey); }
  /* line 19, _elements.article.scss */
  .article__tags {
    font-size: 12px;
    line-height: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 20px 0 0; }
    /* line 26, _elements.article.scss */
    .article__tags a {
      border: 1px solid var(--border-grey);
      padding: 5px 10px;
      border-radius: var(--radius);
      color: var(--color-grey-l); }
      @media (hover: none) {
        /* line 26, _elements.article.scss */
        .article__tags a {
          -webkit-tap-highlight-color: transparent; } }
      @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
        /* line 25, _mixins.scss */
        .article__tags a:hover {
          border-color: currentColor;
          color: var(--color-primary); } }
  /* line 39, _elements.article.scss */
  .article__back {
    display: flex;
    gap: 10px 20px;
    flex-wrap: wrap; }
  /* line 45, _elements.article.scss */
  .article .play-button .svg-icon {
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    padding: 2px;
    background-color: var(--bg-white);
    border-radius: 50%;
    box-shadow: var(--shadow-m);
    object-fit: none;
    width: 60px;
    height: 60px;
    transform: translate(-50%, -50%); }

/* line 61, _elements.article.scss */
.video-container {
  position: relative;
  width: 100%;
  max-width: 1280px;
  aspect-ratio: 16 / 9; }

/* line 68, _elements.article.scss */
#my-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; }

/* line 75, _elements.article.scss */
.play-button {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  padding: 2px;
  background-color: var(--bg-white);
  border-radius: 50%;
  box-shadow: var(--shadow-m);
  object-fit: none;
  width: 60px;
  height: 60px;
  transform: translate(-50%, -50%);
  cursor: pointer; }
  /* line 90, _elements.article.scss */
  .play-button:hover {
    color: var(--color-primary); }

/* line 2, _elements.articles.scss */
.articles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px; }
  /* line 7, _elements.articles.scss */
  .articles-grid.video-review {
    grid-template-columns: repeat(2, 1fr); }
    @media (max-width: 768px) {
      /* line 7, _elements.articles.scss */
      .articles-grid.video-review {
        grid-template-columns: repeat(1, 1fr); } }
  @media (max-width: 1024px) {
    /* line 2, _elements.articles.scss */
    .articles-grid {
      grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 575px) {
    /* line 2, _elements.articles.scss */
    .articles-grid {
      grid-template-columns: repeat(1, 1fr); } }
  /* line 21, _elements.articles.scss */
  .articles-grid__item {
    border-radius: var(--radius);
    box-shadow: var(--shadow-s);
    overflow: hidden; }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 21, _elements.articles.scss */
      .articles-grid__item {
        transition: box-shadow 0.4s ease; } }
    @media (hover: none) {
      /* line 21, _elements.articles.scss */
      .articles-grid__item {
        -webkit-tap-highlight-color: transparent; } }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 25, _mixins.scss */
      .articles-grid__item:hover {
        box-shadow: var(--shadow); } }
/* line 33, _elements.articles.scss */
.articles-sidebar {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px; }
  /* line 37, _elements.articles.scss */
  .articles-sidebar__item {
    border-radius: var(--radius);
    box-shadow: var(--shadow-s);
    overflow: hidden; }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 37, _elements.articles.scss */
      .articles-sidebar__item {
        transition: box-shadow 0.4s ease; } }
    @media (hover: none) {
      /* line 37, _elements.articles.scss */
      .articles-sidebar__item {
        -webkit-tap-highlight-color: transparent; } }
    @media (hover: hover), all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
      /* line 25, _mixins.scss */
      .articles-sidebar__item:hover {
        box-shadow: var(--shadow); } }

@media (min-width: 1025px) {
  /* line 55, _elements.articles.scss */
  .widget-articles .articles-grid__item:nth-child(4) {
    display: none; } }
@media (max-width: 575px) {
  /* line 55, _elements.articles.scss */
  .widget-articles .articles-grid__item:nth-child(4) {
    display: none; } }

/* line 1, _elements.article-card.scss */
.article-card {
  --article-card-title-clamp: 3;
  display: block; }
  /* line 4, _elements.article-card.scss */
  .article-card__image {
    position: relative; }
    /* line 6, _elements.article-card.scss */
    .article-card__image .thumb {
      border-radius: var(--radius) var(--radius) 0 0;
      background-color: var(--bg-grey); }
    /* line 10, _elements.article-card.scss */
    .article-card__image .labels {
      position: absolute;
      left: 5px;
      top: 5px; }
    /* line 15, _elements.article-card.scss */
    .article-card__image.article-video .svg-icon {
      position: absolute;
      z-index: 2;
      left: 50%;
      top: 50%;
      padding: 2px;
      background-color: var(--bg-white);
      border-radius: 50%;
      box-shadow: var(--shadow-m);
      object-fit: none;
      width: 60px;
      height: 60px;
      transform: translate(-50%, -50%); }
  /* line 30, _elements.article-card.scss */
  .article-card__timer {
    top: auto !important;
    bottom: 5px; }
  /* line 34, _elements.article-card.scss */
  .article-card__data {
    padding: 15px 20px; }
    @media (max-width: 575px) {
      /* line 34, _elements.article-card.scss */
      .article-card__data {
        padding: 10px 15px; } }
  /* line 40, _elements.article-card.scss */
  .article-card__title {
    font-size: 18px;
    line-height: 22px; }
  /* line 43, _elements.article-card.scss */
  .article-card__preview {
    font-size: 14px;
    line-height: 18px;
    color: var(--color-grey-l);
    overflow: hidden;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--article-card-title-clamp);
    max-height: calc(var(--article-card-title-clamp) * 18px);
    margin-top: 4px; }
  /* line 54, _elements.article-card.scss */
  .article-card__author {
    color: #000; }
  /* line 57, _elements.article-card.scss */
  .article-card__comments {
    color: #000; }

/* line 63, _elements.article-card.scss */
.articles-sidebar .article-card__data {
  padding: 10px 15px; }
/* line 66, _elements.article-card.scss */
.articles-sidebar .article-card__title {
  font-size: 16px;
  line-height: 20px; }