/* AMANI · блок «Сейчас в AMANI» на главной и страница архива.
   Живёт рядом с выгрузкой Tilda, поэтому всё — под префиксом .amn-, и ни один
   селектор не задевает разметку Tilda. Палитра совпадает с лендингом МК. */

.amn {
  --amn-rose: #d9347e;
  --amn-rose-deep: #b92a69;
  --amn-ink: #2a1f2d;
  --amn-muted: #7a6b76;
  --amn-sand: #fbf3ec;
  --amn-line: #efe0e6;

  background: var(--amn-sand);
  color: var(--amn-ink);
  /* Ритм секций у Tilda на этой странице — 75px сверху и 90px снизу (см. блок
     «Ответы на вопросы» под нами). Свои 56/64 выбивались: полоса выглядела
     случайной, а заголовок жался к верхнему краю. На узком экране столько
     воздуха ни к чему, поэтому clamp. */
  padding: clamp(48px, 6vw, 75px) 20px clamp(56px, 7vw, 90px);
  /* Над блоком заканчивается розовая плашка отзывов, и песочный фон начинался
     впритык к ней — два цветных полотна встык. Отступаем полем страницы, чтобы
     между ними был воздух, и блок читался отдельной полосой. */
  margin-block: clamp(32px, 4vw, 56px);
  /* шапка сайта липкая — без запаса заголовок блока уезжает под неё */
  scroll-margin-top: 90px;
  font: 16px/1.6 "proxima-nova", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
}

.amn__inner { max-width: 1160px; margin: 0 auto; }

.amn__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 28px;
}
.amn__title { font-size: clamp(24px, 3.4vw, 34px); font-weight: 800; margin: 0; letter-spacing: -0.01em; }
.amn__all { color: var(--amn-rose); font-weight: 700; text-decoration: none; white-space: nowrap; }
.amn__all:hover { color: var(--amn-rose-deep); text-decoration: underline; }

.amn__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px;
  /* start, а не stretch: карточка новости без картинки иначе растягивается до
     высоты карточки события и выглядит полупустой. */
  align-items: start; }
@media (max-width: 960px) { .amn__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .amn__grid { grid-template-columns: 1fr; } }

/* Карточка — ссылка целиком: попасть пальцем в заголовок на телефоне тяжело. */
.amn-card {
  display: flex; flex-direction: column; background: #fff; color: inherit;
  border: 1px solid var(--amn-line); border-radius: 18px; overflow: hidden;
  text-decoration: none; box-shadow: 0 10px 26px rgba(42, 31, 45, 0.07);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.amn-card:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(42, 31, 45, 0.12); }
@media (prefers-reduced-motion: reduce) { .amn-card { transition: none } }

.amn-card__media { aspect-ratio: 4 / 3; background: var(--amn-sand); overflow: hidden; }
.amn-card__media img { width: 100%; height: 100%; object-fit: cover; display: block;
  /* афиши вертикальные, и главное на них сверху: центрирование срезало заголовок */
  object-position: top center; }

.amn-card__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.amn-card__tag {
  align-self: flex-start; font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; padding: 5px 11px; border-radius: 999px;
  background: rgba(217, 52, 126, 0.1); color: var(--amn-rose);
}
.amn-card__tag_news { background: rgba(42, 31, 45, 0.07); color: var(--amn-muted); }
.amn-card__title { font-size: 20px; font-weight: 800; margin: 0; line-height: 1.25; text-wrap: balance; }
.amn-card__meta { font-size: 14px; color: var(--amn-rose); font-weight: 600; font-variant-numeric: tabular-nums; }
.amn-card__text { font-size: 15px; color: var(--amn-muted); margin: 0 }
.amn-card__cta { margin-top: auto; padding-top: 8px; color: var(--amn-rose); font-weight: 700; font-size: 15px; }

.amn-empty { color: var(--amn-muted) }

/* Страница архива: та же сетка, но заголовок страницы и возврат на сайт. */
.amn_page { min-height: 100vh; }
.amn__back { display: inline-block; margin-bottom: 18px; color: var(--amn-muted); text-decoration: none; font-size: 15px; }
.amn__back:hover { color: var(--amn-rose) }
.amn__year { margin: 34px 0 16px; font-size: 15px; font-weight: 700; color: var(--amn-muted); letter-spacing: 0.06em; }
