.wired-substack-rss {
  margin: 24px 0;

  .wired-substack-rss__loader {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 120px;

    .wired-substack-rss__spinner {
      animation: wired-substack-rss-spin 0.8s linear infinite;
      border: 3px solid #e5e5e5;
      border-radius: 50%;
      border-top-color: #111;
      display: block;
      height: 34px;
      width: 34px;
    }
  }

  .wired-substack-rss__items {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 26px;

    .wired-substack-rss__card {
      width: 33%;
      background: #fff;
      border: 1px solid #dedede;
      border-radius: 10px;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
      color: #242424;
      overflow: hidden;

      .wired-substack-rss__image-link {
        background: #f4f4f4;
        display: block;

        .wired-substack-rss__image {
          aspect-ratio: 1.78 / 1;
          display: block;
          height: auto;
          object-fit: cover;
          width: 100%;
        }
      }

      .wired-substack-rss__body {
        padding: 18px 16px 14px;

        .wired-substack-rss__title {
          font-size: 24px;
          font-weight: 800;
          letter-spacing: 0;
          line-height: 1.1;
          margin: 0 0 6px;

          a {
            font-weight: bold !important;
            color: inherit;
            text-decoration: none;
            font-family: "Inter", sans-serif !important;

            &:hover,
            &:focus {
              text-decoration: underline;
            }
          }
        }

        .wired-substack-rss__description {
          color: #6b7280;
          font-size: 17px;
          line-height: 1.35;
          margin: 0 0 16px;
        }

        .wired-substack-rss__excerpt {
          color: #242424;
          font-size: 15px;
          line-height: 1.45;
          margin: 0 0 18px;
        }

        .wired-substack-rss__meta {
          align-items: center;
          display: grid;
          grid-template-columns: 40px 1fr auto;
          gap: 10px;

          .wired-substack-rss__avatar {
            border-radius: 8px !important;
            width: 40px;
            display: block;
            object-fit: cover;
            aspect-ratio: 1;
          }
          .wired-substack-rss__avatar--fallback {
            align-items: center;
            background: #111;
            color: #fff;
            display: flex;
            font-size: 20px;
            font-weight: 800;
            justify-content: center;
            line-height: 1;
          }

          .wired-substack-rss__author {
            display: grid;
            gap: 2px;
            min-width: 0;

            strong,
            span {
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }

            strong {
              font-size: 14px;
              line-height: 1.2;
            }

            span {
              color: #111;
              font-size: 13px;
              line-height: 1.2;
            }
          }
        }
      }
      .wired-substack-rss__footer {
        align-items: center;
        border-top: 1px solid #e5e5e5;
        color: #6b7280;
        display: flex;
        font-size: 13px;
        justify-content: space-between;
        min-height: 44px;
        padding: 0 16px;

        .wired-substack-rss__footer-group {
          align-items: center;
          display: flex;
          gap: 20px;

          .wired-substack-rss__icon-link {
            align-items: center;
            color: #777;
            display: inline-flex;
            gap: 5px;
            text-decoration: none;

            &:hover,
            &:focus {
              color: #242424;
            }

            .wired-substack-rss__icon-link--share span {
              font-size: 13px;
              color: #777777;
            }

            .wired-substack-rss__icon {
              fill: none;
              height: 18px;
              stroke-linecap: round;
              stroke-linejoin: round;
              stroke-width: 1.8;
              width: 18px;
            }
          }
        }
        .wired-substack-rss__date {
          font-family: "JetBrains Mono", sans-serif;
          color: #6b7280;
          font-size: 13px;
          line-height: 1;
        }
      }
      .wired-substack-rss__cta-wrap {
        border-top: 1px solid #e5e5e5;
        padding: 14px 16px 16px;

        .wired-substack-rss__cta {
          align-items: center;
          border: 1px solid #d7d7d7;
          border-radius: 999px;
          color: #f15a24 !important;
          display: flex;
          font-size: 14px !important;
          font-weight: 700 !important;
          gap: 5px;
          justify-content: center;
          text-decoration: none;
          width: 100%;
          padding: 5px;

          &:hover,
          &:focus {
            background: #eeeeee;
          }
          .wired-substack-rss__cta-logo {
            display: block;
            width: 24px;
            height: 24px;
            object-fit: contain;
          }
        }
      }
    }
  }
  .wired-substack-rss-error,
  .wired-substack-rss-empty {
    color: #555;
    margin: 0;
  }
}

@keyframes wired-substack-rss-spin {
  to {
    transform: rotate(360deg);
  }
}

@media screen and (max-width: 1648px) and (min-width: 1025px) {
  .wired-substack-rss {
    margin: 1.46vw 0;

    .wired-substack-rss__loader {
      min-height: 7.28vw;

      .wired-substack-rss__spinner {
        height: 1.46vw;
        width: 1.46vw;
      }
    }

    .wired-substack-rss__items {
      gap: 1.58vw;

      .wired-substack-rss__card {
        .wired-substack-rss__body {
          padding: 1.09vw 0.97vw 0.85vw;

          .wired-substack-rss__title {
            font-size: 1.46vw;
            margin: 0 0 0.36vw;
          }

          .wired-substack-rss__description {
            font-size: 1.03vw;
            margin: 0 0 0.97vw;
          }

          .wired-substack-rss__excerpt {
            font-size: 0.91vw;
            margin: 0 0 1.09vw;
          }

          .wired-substack-rss__meta {
            grid-template-columns: 2.43vw 1fr auto;

            .wired-substack-rss__avatar {
              border-radius: 0.49vw !important;
              width: 2.43vw;
            }
            .wired-substack-rss__avatar--fallback {
              font-size: 1.21vw;
            }

            .wired-substack-rss__author {
              gap: 0.12vw;

              strong {
                font-size: 14p0.85vwx;
              }

              span {
                color: #111;
                font-size: 0.79vw;
              }
            }
          }
        }
        .wired-substack-rss__footer {
          font-size: 0.79vw;
          min-height: 2.67vw;
          padding: 0 0.97vw;

          .wired-substack-rss__footer-group {
            gap: 1.21vw;

            .wired-substack-rss__icon-link {
              gap: 0.3vw;

              .wired-substack-rss__icon-link--share span {
                font-size: 0.79vw;
              }

              .wired-substack-rss__icon {
                height: 1.09vw;
                width: 1.09vw;
              }
            }
          }
          .wired-substack-rss__date {
            font-size: 0.79vw;
          }
        }
        .wired-substack-rss__cta-wrap {
          padding: 0.85vw 0.97vw 0.97vw;

          .wired-substack-rss__cta {
            font-size: 0.85vw !important;
            gap: 0.3vw;

            padding: 0.3vw;

            .wired-substack-rss__cta-logo {
              width: 1.46vw;
              height: 1.46vw;
            }
          }
        }
      }
    }
  }
}

@media screen and (max-width: 1024px) {
  .wired-substack-rss {
    .wired-substack-rss__items {
      flex-direction: column;
      .wired-substack-rss__card {
        width: 100%;
      }
    }
  }
}