/* «Подари HireHi» в профиле: на десктопе под меню справа, в одной колонке — после «уведомлений о вакансиях»;
   текст слева, небольшая карточка с переливом справа; список «Мои подарки» — в модалке по «История». */
.profile-card-2.gift-block {
  margin: 16px 0 0;
}
.gift-block .profile-card-title {
  margin-bottom: 0;
}
/* Высоту баннера задаёт только текст; карточка стоит справа абсолютно и по центру по вертикали.
   Нажимается весь баннер, не только карточка */
.gift-block-main {
  --gift-hero-w: 104px;
  position: relative;
  border-radius: 12px;
  cursor: var(--cursor-pointer, pointer);
}
.gift-block-main:focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: 6px;
}
.gift-block-text {
  padding-right: calc(var(--gift-hero-w) + 32px);
}
.gift-block-lead {
  margin: 6px 0 0;
  font-size: var(--fs-14);
  line-height: var(--lh-14);
  letter-spacing: var(--ls-14);
  color: var(--text-muted);
}

/* Карточка без тарифа: стоит ровно, сине-бирюзовая, светится снизу, ореол медленно «дышит».
   При открытии профиля всплывает, потом раз в несколько секунд подарок вздрагивает и по карточке проходит блик.
   Наклон за курсором и блик под ним — из 01_card.css */
.gift-block .gift-card--hero {
  --gift-c: #4E9FFF;
  position: absolute;
  top: 50%;
  right: 8px;
  width: var(--gift-hero-w);
  margin: calc(var(--gift-hero-w) / -3.172) 0 0; /* минус половина высоты: ширина / (2 × aspect-ratio 1.586) */
  padding: 0;
  border-radius: 12px;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(110% 75% at 50% 112%, rgba(222, 252, 255, 0.95) 0%, rgba(150, 236, 250, 0.5) 38%, rgba(150, 236, 250, 0) 72%),
    radial-gradient(80% 60% at 18% 0%, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 62%),
    linear-gradient(180deg, #6C7DFF 0%, #4E9FFF 48%, #5BD9EE 100%);
  animation:
    gift-hero-glow 4s ease-in-out infinite alternate,
    gift-hero-in 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s backwards;
}
/* Ореол и свечение снизу вместо серой тени базовой карточки */
@keyframes gift-hero-glow {
  from { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28), inset 0 -12px 24px rgba(255, 255, 255, 0.22), 0 12px 30px -12px rgba(78, 159, 255, 0.5); }
  to { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32), inset 0 -16px 30px rgba(255, 255, 255, 0.36), 0 14px 38px -10px rgba(91, 217, 238, 0.7); }
}
@keyframes gift-hero-in {
  from { opacity: 0; scale: 0.5; translate: 0 12px; }
}
/* Блик по кругу; пока карточку ведут мышью, вместо него работает блик за курсором */
.gift-block .gift-card--hero::after {
  animation: gift-hero-shine 5s cubic-bezier(0.2, 0, 0, 1) 0.9s infinite;
}
.gift-block .gift-card--hero.is-tilting::after {
  animation: none;
}
@keyframes gift-hero-shine {
  0% { --gx: -30%; opacity: 1; }
  24% { opacity: 1; }
  32%, 100% { --gx: 130%; opacity: 0; }
}
.gift-block .gift-card-icon {
  width: 36%;
  height: auto;
  color: rgba(255, 255, 255, 0.95);
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.6)) drop-shadow(0 3px 6px rgba(0, 0, 0, 0.15));
  animation: gift-hero-wiggle 5s ease-in-out 1s infinite;
}
@keyframes gift-hero-wiggle {
  0%, 62%, 100% { transform: none; }
  68% { transform: rotate(-12deg) scale(1.1); }
  74% { transform: rotate(10deg) scale(1.1); }
  80% { transform: rotate(-6deg); }
  86% { transform: none; }
}

/* Мои подарки (модалка «История»): образец карточки с тарифом, имя со статусом, срок и почта;
   под ними ссылка и повторное письмо */
.gift-mine-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.gift-mine-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--filter-divider);
}
.gift-mine-item:first-child {
  padding-top: 0;
}
.gift-mine-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.gift-mine-item .gift-mine-swatch {
  flex: 0 0 auto;
  width: 52px;
  padding: 0;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-12);
  line-height: var(--lh-12);
  font-weight: var(--fw-semibold);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
}
.gift-mine-info {
  flex: 1 1 0;
  min-width: 0;
}
.gift-mine-head {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.gift-mine-name {
  min-width: 0;
  font-size: var(--fs-16);
  line-height: var(--lh-16);
  font-weight: var(--fw-medium);
  color: var(--text-color);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gift-mine-meta {
  margin-top: 2px;
  font-size: var(--fs-14);
  line-height: var(--lh-14);
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gift-mine-status {
  flex: 0 0 auto;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: var(--fs-12);
  line-height: var(--lh-12);
  background: var(--surface-secondary);
  color: var(--text-muted);
}
.gift-mine-status[data-status="redeemed"] {
  background: color-mix(in srgb, var(--accent-color) 14%, transparent);
  color: var(--accent-hover);
}
.gift-mine-actions {
  display: flex;
  gap: 8px;
  width: 100%;
  padding-left: 64px;
}

@media (min-width: 1280px) {
  .gift-block-main {
    --gift-hero-w: 72px;
  }
  .gift-block-text {
    padding-right: calc(var(--gift-hero-w) + 16px);
  }
}
/* Меню профиля здесь скрыто (03_sub_segments), колонка остаётся ради баннера. После загрузки карточки профиля
   становятся элементами общей колонки (display: contents), баннер встаёт за «уведомлениями о вакансиях» по order;
   пока идёт загрузка, баннер скрыт, как остальные карточки */
@media (max-width: 1279px) {
  .profile-layout {
    align-items: stretch;
  }
  .profile-layout > .profile-main:not(.profile-main--loading) {
    display: contents;
  }
  .profile-layout > .profile-sidebar {
    display: block;
    order: 1;
    flex: none;
    width: 100%;
  }
  .profile-layout:has(> .profile-main--loading) > .profile-sidebar {
    display: none;
  }
  #savedFiltersSection ~ * {
    order: 2;
  }
  .profile-sidebar .profile-menu-card {
    display: none;
  }
}

@media (max-width: 767px) {
  .gift-block-main {
    --gift-hero-w: 88px;
  }
  .gift-block-text {
    padding-right: calc(var(--gift-hero-w) + 20px);
  }
  .gift-block .gift-card--hero {
    right: 4px;
    border-radius: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gift-block .gift-card--hero,
  .gift-block .gift-card--hero::after,
  .gift-block .gift-card-icon { animation: none; transition: none; }
}