/* ═══════════════════════════════════════════════════════════
   BONO MODO — Цифровые продукты (Soft Luxe)
   ═══════════════════════════════════════════════════════════ */

/* ─── Хаб ──────────────────────────────────────────────────── */
.products-hub { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 44px; }
.product-card {
  display: flex; flex-direction: column; background: var(--surface); border-radius: var(--r-lg);
  overflow: hidden; box-shadow: var(--shadow-sm); transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}
.product-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.product-card__media { aspect-ratio: 1.414; background: #15151A; }
.product-card__media img { width: 100%; height: 100%; object-fit: cover; }
.product-card__body { padding: 26px 28px 28px; display: flex; flex-direction: column; flex: 1; }
.product-card__tag { font-size: 13px; color: var(--muted); letter-spacing: .02em; }
.product-card__title { font-family: var(--font-serif); font-size: 26px; font-weight: 600; line-height: 1.12; margin-top: 8px; }
.product-card__text { color: var(--muted); margin-top: 12px; font-size: 15.5px; line-height: 1.55; flex: 1; }
.product-card__foot { display: flex; justify-content: space-between; align-items: baseline; margin-top: 20px; }
.product-card__price { font-family: var(--font-serif); font-size: 26px; font-weight: 600; }
.product-card__link { font-weight: 600; color: var(--accent-deep); }

/* ─── Страница продукта: hero ──────────────────────────────── */
.product-page { padding-block: 8px 56px; }
.product-hero { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 72px); align-items: center; padding-block: clamp(16px, 3vw, 36px) clamp(28px, 4vw, 48px); }
.product-hero__title { font-family: var(--font-serif); font-weight: 500; font-size: clamp(32px, 4.4vw, 54px); line-height: 1.05; letter-spacing: -0.01em; margin-top: 8px; }
.product-hero__tagline { margin-top: 20px; font-size: clamp(17px, 1.5vw, 20px); color: var(--ink-2); line-height: 1.55; max-width: 46ch; }
.product-hero__buy { margin-top: 30px; display: flex; flex-direction: column; gap: 22px; }
.product-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.product-hero__media { border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-lg); background: #15151A; }
.product-hero__media img { width: 100%; height: auto; display: block; }

.product-price { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.product-price__value { font-family: var(--font-serif); font-weight: 600; font-size: clamp(34px, 3.6vw, 46px); line-height: 1; color: var(--ink); white-space: nowrap; }
.product-price__note { font-size: 14px; color: var(--muted); line-height: 1.4; }
.product-price--lg { margin-top: 18px; }

/* ─── Факты ────────────────────────────────────────────────── */
.product-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 8px; padding-top: 30px; border-top: 1px solid var(--line); }
.product-fact { display: flex; flex-direction: column; gap: 6px; }
.product-fact__num { font-family: var(--font-serif); font-size: clamp(36px, 4vw, 52px); font-weight: 600; line-height: 1; color: var(--accent-deep); }
.product-fact__cap { font-size: 14.5px; color: var(--muted); line-height: 1.4; max-width: 24ch; }

/* ─── Секции ───────────────────────────────────────────────── */
.product-section { margin-top: clamp(56px, 8vw, 104px); }
.product-section__title { font-family: var(--font-serif); font-size: clamp(28px, 3.4vw, 42px); font-weight: 600; line-height: 1.08; margin-top: 8px; }
.product-section__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.product-section__text p + p { margin-top: 16px; }
.product-section__text { font-size: 17px; line-height: 1.65; color: var(--ink-2); }
.product-section__note { margin-top: 18px; color: var(--muted); line-height: 1.6; font-size: 16px; }
.product-section__lead { margin-top: 34px; font-size: 18px; line-height: 1.6; color: var(--ink-2); max-width: 70ch; padding-left: 22px; border-left: 3px solid var(--accent); }

.product-layers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 36px; }
.product-layer { background: var(--surface); border-radius: var(--r-lg); padding: 28px 28px 30px; box-shadow: var(--shadow-sm); }
.product-layer__num { font-family: var(--font-serif); font-size: 15px; color: var(--accent); letter-spacing: .08em; }
.product-layer__title { font-family: var(--font-serif); font-size: 24px; font-weight: 600; margin-top: 10px; line-height: 1.15; }
.product-layer p { margin-top: 12px; font-size: 15.5px; line-height: 1.55; color: var(--muted); }

/* ─── Развороты ────────────────────────────────────────────── */
.product-spreads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 20px; margin-top: 36px; }
.product-spread { margin: 0; }
.product-spread img { width: 100%; height: auto; border-radius: var(--r-sm); box-shadow: var(--shadow); background: #15151A; }
.product-spread figcaption { margin-top: 12px; font-size: 14.5px; color: var(--muted); line-height: 1.45; }

/* ─── Содержание ───────────────────────────────────────────── */
.product-toc { counter-reset: toc; list-style: none; padding: 0; }
.product-toc li { counter-increment: toc; position: relative; padding: 14px 0 14px 54px; border-bottom: 1px solid var(--line-soft); font-size: 17px; line-height: 1.4; }
.product-toc li::before { content: counter(toc, decimal-leading-zero); position: absolute; left: 0; top: 14px; font-family: var(--font-serif); font-size: 18px; color: var(--accent-deep); }
.product-toc li:first-child { padding-top: 4px; } .product-toc li:first-child::before { top: 4px; }

/* ─── Заказ ────────────────────────────────────────────────── */
.product-order { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: start; margin-top: clamp(56px, 8vw, 104px); padding: clamp(28px, 4vw, 56px); border-radius: var(--r-xl); background: linear-gradient(155deg, var(--surface), var(--surface-2)); box-shadow: var(--shadow); }
.product-includes { margin-top: 26px; display: flex; flex-direction: column; gap: 12px; }
.product-includes li { position: relative; padding-left: 26px; font-size: 15.5px; color: var(--ink-2); line-height: 1.5; }
.product-includes li::before { content: "✦"; position: absolute; left: 0; top: 2px; color: var(--accent); font-size: 13px; }
.product-steps { counter-reset: step; list-style: none; padding: 0; margin-top: 30px; display: flex; flex-direction: column; gap: 12px; }
.product-steps li { counter-increment: step; position: relative; padding-left: 40px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.product-steps li::before { content: counter(step); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.product-form { margin: 0; }

.product-form__note { margin-top: 14px; font-size: 13.5px; color: var(--muted); line-height: 1.5; }
.product-form__note a { color: var(--accent-deep); font-weight: 600; }
.product-banner { margin: 8px 0 24px; padding: 18px 22px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); font-size: 16px; line-height: 1.5; }
.product-banner--ok { background: #EEF2E8; border-color: rgba(110,127,99,.35); }
.product-banner a { color: var(--accent-deep); font-weight: 600; }

/* ─── Автор ────────────────────────────────────────────────── */
.product-author { display: grid; grid-template-columns: 200px 1fr; gap: clamp(24px, 4vw, 48px); align-items: center; }
.product-author__photo { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; object-position: center 15%; box-shadow: var(--shadow); }
.product-author p { margin-top: 16px; font-size: 17px; line-height: 1.6; color: var(--ink-2); max-width: 62ch; }
.product-author__link { display: inline-block; margin-top: 16px; font-weight: 600; color: var(--accent-deep); }

.product-section--faq .article-faq { margin-top: 28px; max-width: 820px; }

/* grid-дети с картинками не должны расширять колонку (min-width:auto) */
.product-hero > *, .product-order > *, .product-section__grid > *, .product-author > *, .product-spread, .product-layer, .product-card { min-width: 0; }

/* ─── Адаптив ──────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .product-hero { grid-template-columns: 1fr; }
  .product-hero__media { max-width: 640px; }
  .product-facts { grid-template-columns: repeat(2, 1fr); }
  .product-layers { grid-template-columns: 1fr; }
  .product-spreads { grid-template-columns: repeat(2, 1fr); }
  .product-order { grid-template-columns: 1fr; }
  .product-section__grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .products-hub { grid-template-columns: 1fr; }
  .product-spreads { grid-template-columns: 1fr; }
  .product-author { grid-template-columns: 1fr; text-align: left; }
  .product-author__photo { width: 140px; height: 140px; }
  .product-facts { gap: 20px 14px; }
}

/* Прошлые выпуски на хабе */
.products-archive { list-style: none; padding: 0; margin: 20px 0 0; max-width: 760px; }
.products-archive li { padding: 14px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.products-archive li:last-child { border-bottom: 1px solid var(--line); }
.products-archive a { color: var(--ink); font-weight: 600; text-decoration: none; }
.products-archive a:hover { color: var(--accent-deep); }
.products-archive span { color: var(--muted); font-size: 14px; }

/* комплекты выпусков: кросс-продажа на странице одиночного выпуска */
.product-sets { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin-top: 28px; }
.product-set { display: flex; flex-direction: column; gap: 10px; padding: 26px 28px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
.product-set:hover { border-color: var(--accent); transform: translateY(-2px); }
.product-set__title { font-family: var(--font-display, 'Cormorant Garamond', serif); font-size: 26px; line-height: 1.15; font-weight: 500; }
.product-set__text { font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.product-set__foot { display: flex; align-items: baseline; gap: 14px; margin-top: 6px; flex-wrap: wrap; }
.product-set__price { font-size: 22px; font-weight: 600; }
.product-set__save { color: var(--accent); font-weight: 600; font-size: 14px; }

/* зачёркнутая цена «по отдельности» у комплекта */
.price-old { font-family: var(--font-serif); font-weight: 500; font-size: .58em; color: var(--muted); text-decoration: line-through; text-decoration-color: var(--accent); text-decoration-thickness: 2px; margin-right: .35em; white-space: nowrap; }
.product-card__price .price-old, .product-set__price .price-old { font-size: .78em; }
