/* ============================================
   КОМПЛЕКТ ВНУТРЕННИХ СТРАНИЦ
   Общие блоки для «Бизнесу», «Партнёрам»,
   «Запрещённые товары» и «Документы».

   Язык тот же, что на главной: крупные карточки
   с радиусом 30, заголовок секции = иконка со
   свечением слева + крупный текст, чёрная и синяя
   карточки для акцентов.

   Префикс pk- (page kit), чтобы не пересекаться
   с классами главной страницы.
   ============================================ */

/* --------------------------------------------
   Первый экран внутренних страниц
   -------------------------------------------- */
.pk-hero {
  position: relative;
  /* z-index:0 (вместо auto) превращает блок в отдельный слой наложения,
     чтобы декоративные кольца с z-index:-1 гарантированно оставались
     позади контента, а не "убегали" в слой всей страницы. */
  z-index: 0;
  /* Отступ сверху = высота фиксированной шапки + воздух */
  padding-top: calc(var(--header-h) + var(--space-16));
  padding-bottom: var(--space-12);
  text-align: center;
  background-image: var(--gradient-hero);
  /* Декоративные кольца режем по краю экрана, иначе они
     растягивают страницу вбок на телефоне */
  overflow: hidden;
}

/* Первый экран во весь экран — как на главной.
   svh, а не vh: на телефоне vh считается без учёта адресной строки
   и низ блока уезжает под неё. min-height, а не height:
   если контент выше экрана, блок просто вырастет. */
.pk-hero--full {
  display: flex;
  flex-direction: column;
  min-height: 100svh;
}

.pk-hero--full > .container {
  /* Прижимаем контент к центру между шапкой и низом экрана */
  margin-block: auto;
}

.pk-hero__decor {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

.pk-hero__ring {
  position: absolute;
  border: 1.5px solid rgba(0, 73, 255, 0.07);
  border-radius: 50%;
}

.pk-hero__ring--1 { width: 620px; height: 620px; top: -200px; left: -160px; }
.pk-hero__ring--2 { width: 460px; height: 460px; bottom: -220px; right: -120px; }

.pk-hero__eyebrow {
  margin: 0;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-brand);
}

.pk-hero__title {
  margin: var(--space-3) 0 0;
  font-size: clamp(2rem, 5.4vw, 5.1875rem); /* 32px → 83px */
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  letter-spacing: -0.02em;
}

/* Заголовок из длинной фразы — для «Запрещённых» и документов */
.pk-hero__title--sm {
  font-size: clamp(1.75rem, 4.2vw, 3.75rem); /* 28px → 60px */
  line-height: 1.08;
}

.pk-hero__subtitle {
  max-width: 700px;
  margin: var(--space-4) auto 0;
  font-size: clamp(1rem, 1.5vw, 1.375rem);
  line-height: 1.5;
  color: var(--color-ink-soft);
}

.pk-hero__meta {
  margin: var(--space-4) 0 0;
  font-size: var(--fs-md);
  color: var(--color-ink-soft);
}

.pk-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-4);
  margin-top: var(--space-8);
}

/* Белые плашки-доверия под кнопками */
/* Факты под кнопками. Раньше это были белые плашки со скруглением
   и тенью — они читались как ещё один ряд кнопок. Теперь просто
   строки с круглой иконкой: синяя заливка осталась только у кнопок. */
.pk-trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-4) var(--space-8);
  margin-top: var(--space-10);
}

.pk-trust__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-size: 1.0625rem;
  font-weight: var(--fw-medium);
  color: var(--color-ink);
}

.pk-trust__ico {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(0, 73, 255, 0.10);
}

/* --------------------------------------------
   Секция и стопка карточек
   -------------------------------------------- */
.pk-sec {
  padding-block: var(--space-12);
}

/* Карточки идут вплотную, как «Price List» и «Способы перевозки» на главной */
.pk-stack > * + * {
  margin-top: var(--space-8);
}

.pk-card {
  padding: var(--space-12) var(--space-14);
  border-radius: 30px;
  background: var(--color-surface);
  box-shadow: 0 24px 60px rgba(10, 30, 80, 0.07);
}

.pk-card--dark {
  padding-bottom: var(--space-14);
  background: #000000;
  color: var(--color-surface);
  box-shadow: none;
}

.pk-card--brand {
  position: relative;
  overflow: hidden;
  background: var(--color-brand);
  color: var(--color-surface);
  box-shadow: none;
}

/* --------------------------------------------
   Заголовок секции: иконка 70px + текст
   -------------------------------------------- */
.pk-head {
  display: flex;
  align-items: center;
  gap: var(--space-5);
}

.pk-head__ico {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 70px;
  height: 70px;
  border-radius: 11.2px;
  background: var(--color-brand);
  /* Синее свечение — как у иконок заголовков на главной */
  filter: drop-shadow(0 8px 22px rgba(0, 73, 255, 0.45));
}

/* На чёрной карточке квадрат белый, глиф синий */
.pk-card--dark .pk-head__ico {
  background: var(--color-surface);
  filter: drop-shadow(0 8px 26px rgba(0, 73, 255, 0.55));
}

.pk-head__title {
  margin: 0;
  font-size: clamp(1.625rem, 3.4vw, 3.25rem); /* 26px → 52px */
  font-weight: var(--fw-bold);
  letter-spacing: -0.02em;
  line-height: 1.1;
}

/* --------------------------------------------
   Плитка «серая колонка + синяя плашка + белое тело»
   Структура повторяет .price-col на главной
   -------------------------------------------- */
.pk-tiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-8);
}

.pk-tile {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-6);
  border-radius: 18px;
  background: #F5F5F7;
}

.pk-tile__title {
  margin: 0;
  font-size: clamp(1.0625rem, 1.4vw, 1.3125rem);
  font-weight: var(--fw-bold);
  line-height: 1.25;
  color: var(--color-ink);
}

.pk-tile__text {
  margin: 0;
  overflow-wrap: break-word;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--color-ink-soft);
}

/* --------------------------------------------
   Финальный призыв на синей карточке
   -------------------------------------------- */
.pk-cta__title {
  margin: 0;
  max-width: 60%;
  font-size: clamp(1.5rem, 2.9vw, 2.625rem);
  font-weight: var(--fw-bold);
  line-height: 1.25;
}

.pk-cta__text {
  margin: var(--space-4) 0 0;
  max-width: 56%;
  font-size: clamp(1rem, 1.3vw, 1.125rem);
  line-height: 1.5;
  color: var(--color-on-brand-muted);
}

.pk-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  margin-top: var(--space-8);
}

.pk-cta__ring {
  position: absolute;
  border: 1.5px solid var(--color-decor);
  border-radius: 50%;
  pointer-events: none;
}

.pk-cta__ring--1 { width: 420px; height: 420px; top: -120px; right: -60px; }
.pk-cta__ring--2 { width: 260px; height: 260px; bottom: -140px; right: 120px; }

/* ============================================
   АДАПТИВ
   ============================================ */

@media (max-width: 1024px) {
  .pk-card {
    padding: var(--space-10) var(--space-8);
  }

  .pk-cta__title,
  .pk-cta__text {
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .pk-tiles {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .pk-hero {
    padding-top: calc(var(--header-h) + var(--space-10));
    padding-bottom: var(--space-8);
  }

  /* Факты в столбик и по левому краю — в строку они рвутся */
  .pk-trust {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
    max-width: 320px;
    margin-inline: auto;
    text-align: left;
  }

  .pk-sec {
    padding-block: var(--space-8);
  }

  .pk-stack > * + * {
    margin-top: var(--space-5);
  }

  .pk-card {
    /* На узком экране скругление меньше, поля тоньше —
       иначе контент сжимается до нечитаемого */
    padding: var(--space-6) var(--space-5);
    border-radius: 22px;
    box-shadow: 0 14px 34px rgba(10, 30, 80, 0.07);
  }

  .pk-card--dark {
    padding-bottom: var(--space-8);
  }

  .pk-head {
    gap: var(--space-4);
  }

  .pk-head__ico {
    width: 52px;
    height: 52px;
    border-radius: 9px;
  }

  .pk-head__ico svg {
    width: 46px;
    height: 46px;
  }

  /* Кнопки первого экрана — на всю ширину, так проще попасть пальцем */
  .pk-hero__actions .btn,
  .pk-cta__actions .btn {
    width: 100%;
  }

  .pk-trust {
    margin-top: var(--space-6);
  }

  .pk-trust__item {
    width: 100%;
    font-size: 1rem;
  }

  .pk-cta__ring {
    display: none;
  }
}

@media (max-width: 480px) {
  .pk-card {
    padding: var(--space-5) var(--space-4);
  }

  .pk-tile {
    padding: var(--space-5);
  }
}

/* Абзац с пояснением под плитками (страница «Оплата и возврат») */
.pay-note {
  margin: var(--space-6) 0 0;
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--color-ink-soft);
}

.pay-note a {
  color: var(--color-brand);
  text-decoration: underline;
}

.pay-note strong {
  color: var(--color-ink);
}