/* ============================================================
   SUN KIDS — форматы дня
   ============================================================ */

.sk-formats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: stretch;
}

.sk-fmt {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--sk-white);
  border-radius: var(--sk-r-lg);
  padding: 26px 22px 22px;
  box-shadow: 0 6px 22px rgba(122, 90, 0, .14);
  transition: transform .2s ease, box-shadow .2s ease;
}
.sk-fmt:hover { transform: translateY(-5px); box-shadow: 0 14px 34px rgba(122, 90, 0, .2); }

/* Цветовой код формата */
.sk-fmt--dawn { --fmt: #F2A03D; --fmt-soft: #FDF0DC; }
.sk-fmt--day  { --fmt: #1B7FB5; --fmt-soft: #E4F1F9; }
.sk-fmt--full { --fmt: #F2645A; --fmt-soft: #FDE9E7; }
.sk-fmt--flex { --fmt: #7B5EA7; --fmt-soft: #EFE9F7; }

/* Выделенная карточка */
.sk-fmt.is-featured {
  box-shadow: 0 0 0 3px var(--fmt), 0 14px 34px rgba(122, 90, 0, .22);
  transform: translateY(-8px);
}
.sk-fmt.is-featured:hover { transform: translateY(-12px); }

.sk-fmt__badge {
  position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
  background: var(--fmt); color: #fff;
  font-size: 11.5px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  padding: 6px 14px; border-radius: var(--sk-r-pill);
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .16);
}

/* Иконка */
.sk-fmt__icon {
  width: 52px; height: 52px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--fmt-soft); color: var(--fmt);
  margin-bottom: 16px;
}

/* Заголовок и время */
.sk-fmt__name { font-size: 19px; font-weight: 900; color: var(--sk-ink); margin: 0; letter-spacing: -.01em; }
.sk-fmt__time { margin-top: 5px; font-size: 15px; font-weight: 800; color: var(--fmt); }

/* Шкала дня */
.sk-fmt__scale { margin-top: 18px; }
.sk-fmt__track {
  position: relative; height: 10px;
  background: var(--sk-bg-alt);
  border-radius: var(--sk-r-pill);
  overflow: hidden;
}
.sk-fmt__fill {
  position: absolute; top: 0; bottom: 0;
  background: var(--fmt);
  border-radius: var(--sk-r-pill);
}
.sk-fmt__fill--dashed {
  right: 0; width: auto;
  background: repeating-linear-gradient(
    90deg,
    var(--fmt) 0 14px,
    transparent 14px 26px
  );
}
.sk-fmt__ticks {
  display: flex; justify-content: space-between;
  margin-top: 7px;
  font-size: 11.5px; font-weight: 700; color: var(--sk-ink-mute);
}

/* Список включᄅнного */
.sk-fmt__list {
  list-style: none; margin: 18px 0 0; padding: 0;
  flex: 1;
  display: flex; flex-direction: column; gap: 9px;
}
.sk-fmt__list li {
  position: relative;
  padding-left: 24px;
  font-size: 14px; line-height: 1.45; color: var(--sk-ink-soft);
}
.sk-fmt__list li::before {
  content: "";
  position: absolute; left: 0; top: 3px;
  width: 15px; height: 15px;
  border-radius: 50%;
  background: var(--fmt-soft);
}
.sk-fmt__list li::after {
  content: "";
  position: absolute; left: 4.5px; top: 7.5px;
  width: 6px; height: 3px;
  border-left: 2px solid var(--fmt);
  border-bottom: 2px solid var(--fmt);
  transform: rotate(-45deg);
}

/* Подвал карточки */
.sk-fmt__foot {
  margin-top: 20px; padding-top: 16px;
  border-top: 1px dashed var(--sk-line);
}
.sk-fmt__price {
  display: block;
  font-size: 13px; font-weight: 800; color: var(--sk-ink-mute);
}
.sk-fmt__cta {
  display: inline-block; margin-top: 8px;
  font-size: 14.5px; font-weight: 800; color: var(--fmt);
}
.sk-fmt__cta:hover { color: var(--sk-ink); }

/* Адаптив */
@media (max-width: 1100px) {
  .sk-formats { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .sk-fmt.is-featured { transform: none; }
  .sk-fmt.is-featured:hover { transform: translateY(-5px); }
}
@media (max-width: 600px) {
  .sk-formats { grid-template-columns: 1fr; }
  .sk-fmt { padding: 24px 20px 20px; }
}

/* Три формата */
.sk-formats--3 { grid-template-columns: repeat(3, 1fr); max-width: 960px; margin-inline: auto; }
@media (max-width: 900px) { .sk-formats--3 { grid-template-columns: 1fr; max-width: 420px; } }

.sk-formats__note {
  margin-top: 28px; text-align: center;
  font-size: 14.5px; line-height: 1.55; color: #7A5A00;
  max-width: 660px; margin-inline: auto;
}