@media (max-width: 640px) {

  .rb-home .rb-cards3,
  .rb-home .rb-cm-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .rb-home .rb-c3,
  .rb-home .rb-cm {
    display: grid;
    grid-template-columns: 116px 1fr;
    column-gap: 14px;
    row-gap: 0;
    align-items: start;
    align-content: start;
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    transition: border-color .15s, box-shadow .15s;
  }

  .rb-home .rb-c3:hover,
  .rb-home .rb-cm:hover {
    transform: none;
    border-color: var(--accent);
    box-shadow: 0 6px 18px rgba(9, 17, 31, .07);
  }

  .rb-home .rb-c3 > .rb-c3-img,
  .rb-home .rb-cm > .rb-cm-img {
    position: relative;
    grid-column: 1;
    grid-row: 1 / span 4;
    width: auto;
    margin: 0;
    aspect-ratio: 16 / 11;
    background-color: var(--bg-sink);
    overflow: hidden;
  }

  .rb-home .rb-c3 > .rb-c3-img > img,
  .rb-home .rb-cm > .rb-cm-img > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .rb-home .rb-c3 > *:not(.rb-c3-img),
  .rb-home .rb-cm > *:not(.rb-cm-img) {
    grid-column: 2;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .rb-home .rb-c3-title,
  .rb-home .rb-cm-title {
    margin-top: 0;
    font-family: var(--head);
    font-weight: 700;
    font-size: 15px;
    line-height: 1.34;
    color: var(--ink);
    text-transform: none;
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }

  .rb-home .rb-c3-ex,
  .rb-home .rb-cm-ex {
    margin-top: 8px;
    font-family: var(--body);
    font-size: 13px;
    line-height: 1.42;
    color: var(--ink-soft);
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }

  .rb-home .rb-cm-meta { margin-top: 8px; font-size: 11.5px; }

  .rb-home .rb-fmix-main { display: none; }

  .rb-home .rb-akd-cards { gap: 10px; }

  .rb-home .rb-fmix-cat .rb-fmix-grid {
    grid-auto-rows: auto;
    gap: 10px;
  }

  .rb-home .rb-fmix-cat .rb-fmix-hitem {
    align-items: start;
    padding: 10px;
  }

  .rb-home .rb-fmix-htitle { color: var(--ink); }
  .rb-home .rb-fmix-hex { color: var(--ink-soft); }
}

@media (max-width: 560px) {

  .rb-home .rb-c3,
  .rb-home .rb-cm { grid-template-columns: 104px 1fr; }
}
