@charset "utf-8";

@-webkit-keyframes shimmering { 
  100% { background-position-x: 0px; }
}

@keyframes shimmering { 
  100% { background-position-x: 0px; }
}

.card-article-s-skeleton { display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; gap: 12px; }

@media (min-width: 880px) {
  .card-article-s-skeleton { gap: 16px; }
}

.card-article-s-skeleton__img { aspect-ratio: 16 / 9; border-radius: 16px; width: 100%; --anim-base-color: #dcdee8; --anim-shimmer-color: #e7e8ef; animation: 1.5s linear 0s infinite normal none running shimmering; background-image: ; background-position-y: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; background-color: ; background-position-x: 100%; background-size: 300%; }

@media screen and (prefers-reduced-motion: reduce) {
  .card-article-s-skeleton__img { animation: auto ease 0s 1 normal none running none; }
}

.card-article-s-skeleton__text { display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-flex: 1; flex: 1 1 0%; gap: 8px; }

.card-article-s-skeleton__text-line { border-radius: 4px; height: 1.8rem; width: 100%; --anim-base-color: #dcdee8; --anim-shimmer-color: #e7e8ef; animation: 1.5s linear 0s infinite normal none running shimmering; background-image: ; background-position-y: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; background-color: ; background-position-x: 100%; background-size: 300%; }

@media screen and (prefers-reduced-motion: reduce) {
  .card-article-s-skeleton__text-line { animation: auto ease 0s 1 normal none running none; }
}

@media screen and (max-width: 879px) {
  .card-article-s-skeleton__text-line:nth-child(3), .card-article-s-skeleton__text-line:nth-child(4) { width: 50%; }
}

@media (min-width: 880px) {
  .card-article-s-skeleton__text-line:nth-child(3), .card-article-s-skeleton__text-line:nth-child(4) { width: 33%; }
}

.card-article-s-skeleton__text-line:nth-child(4) { margin-top: 24px; }

.card-article-s-skeleton--dark .card-article-s-skeleton__img, .card-article-s-skeleton--dark .card-article-s-skeleton__text-line { --anim-base-color: #414141; --anim-shimmer-color: #494949; }
