.comment { padding-block: 20px 24px; border-bottom: 1px solid var(--color-secondary); }
.comment__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.comment__identity { min-width: 0; }
.comment__author { font-size: 20px; font-weight: 500; line-height: 25px; }
.comment__date { display: block; color: var(--color-secondary); font-size: 14px; line-height: 25px; }
.comment__like { flex: none; border: 0; padding: 0; background: transparent; }
.comment__like:disabled { opacity: 1; }
.comment__like[aria-pressed="true"] { color: var(--color-accent); }
.comment__text { margin-top: 19px; font-size: 18px; line-height: 25px; }
.comment__reply { display: inline-block; margin-top: 16px; padding: 0 0 3px; border-bottom: 1px solid currentColor; font-size: 16px; line-height: 1.21; text-transform: uppercase; }
.comment__reply:focus-visible { color: var(--color-accent); }
@media (hover: hover) { .comment__reply:hover { color: var(--color-accent); } }
.comment--reply { margin-inline-start: 43px; }
@media (max-width: 639px) {
  .comment { padding-block: 20px 24px; }
  .comment__text { margin-top: 19px; font-size: 16px; line-height: 25px; }
  .comment--reply { margin-inline-start: clamp(32px, 16.4vw, 64px); }
}
