/* Лендинг «Таблицы по юнит-экономике» (калькулятор прибыли) — поверх общих стилей новой главной (styles.css,
   story.css, liquid.css, offers.css, footer.css, section.css). Здесь — только то, чего у раздела
   не было: сменный баннер сверху, обложка видеообзора и карточка файла в блоке «Скачать». */

/* кнопки скачивания: при наведении стрелка уходит вниз в «лоток» и появляется сверху снова,
   ручка не уезжает вверх-вправо, как у кнопок-ссылок (владелец 14.10) */
.btn[download]:hover .knob { transform: translateY(2px); }
.dl-icon { overflow: hidden; }
.btn[download]:hover .dl-arrow, .btn[download]:focus-visible .dl-arrow { animation: dl-drop 1.1s var(--ease) infinite; }
@keyframes dl-drop {
  0% { transform: translateY(0); opacity: 1; }
  40% { transform: translateY(9px); opacity: 0; }
  41% { transform: translateY(-9px); opacity: 0; }
  75%, 100% { transform: translateY(0); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .btn[download]:hover .dl-arrow { animation: none; } }

.dl-note { font-size: 13.5px; color: var(--ink-3); }

/* ── под первым экраном: ОДИН баннер — сервис SELLERSMART и зонд JET сменяют друг друга (владелец 14.10) ── */
.promo-row { position: relative; z-index: 3; max-width: 1440px; margin: 0 auto; padding: 0 56px; display: grid; gap: 10px; justify-items: center; }
.promo-stage { position: relative; width: 100%; display: grid; }
.promo { grid-area: 1 / 1; position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 24px; align-items: center;
  min-height: 150px; padding: 30px 36px; border-radius: 32px; color: #fff; text-decoration: none; opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0s linear 0.3s; }
.promo.on { opacity: 1; visibility: visible; transform: none; transition: opacity 0.5s var(--ease) 0.3s, transform 0.5s var(--ease) 0.3s, visibility 0s; }
.promo-app { background: radial-gradient(120% 160% at 100% 0%, #3D6BFF 0%, #1535ED 45%, #0B1A5C 100%); box-shadow: 0 30px 70px -40px rgba(21, 53, 237, 0.8); }
.promo-jet { background: radial-gradient(120% 160% at 100% 0%, #2A3A66 0%, #121A33 55%, #070D1F 100%); box-shadow: 0 30px 70px -40px rgba(7, 13, 31, 0.8); }
.promo::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0.3; pointer-events: none;
  background-image: linear-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.09) 1px, transparent 1px); background-size: 32px 32px;
  -webkit-mask-image: radial-gradient(70% 120% at 90% 20%, #000, transparent 75%); mask-image: radial-gradient(70% 120% at 90% 20%, #000, transparent 75%); }
/* JET в светлой теме — светлая бело-серо-синяя плашка с тёмным текстом и синей кнопкой;
   в тёмной остаётся тёмно-синей (владелец 14.10) */
body[data-theme="light"] .promo-jet { color: var(--ink); background: linear-gradient(135deg, #FFFFFF 0%, #F1F5FB 55%, #E3ECFB 100%);
  border: 1px solid rgba(21, 53, 237, 0.12); box-shadow: 0 30px 70px -44px rgba(23, 59, 122, 0.45); }
body[data-theme="light"] .promo-jet::before { opacity: 0.6;
  background-image: linear-gradient(rgba(21, 53, 237, 0.07) 1px, transparent 1px), linear-gradient(90deg, rgba(21, 53, 237, 0.07) 1px, transparent 1px); }
body[data-theme="light"] .promo-jet .promo-copy em { color: var(--blue); }
body[data-theme="light"] .promo-jet .promo-copy span { color: var(--ink-2); }
body[data-theme="light"] .promo-jet .promo-go { color: #fff; background: linear-gradient(180deg, #3D6BFF, #1535ED); box-shadow: 0 12px 26px -12px rgba(21, 53, 237, 0.8); }
.promo-dots { display: flex; gap: 8px; }
.promo-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: rgba(74, 90, 112, 0.3); cursor: pointer; transition: width 0.4s var(--ease), background 0.4s var(--ease); }
.promo-dots button[aria-selected="true"] { width: 26px; background: var(--blue); }
body[data-theme="dark"] .promo-dots button { background: rgba(170, 200, 255, 0.3); }
body[data-theme="dark"] .promo-dots button[aria-selected="true"] { background: #9CC2FF; }
.promo-ic { width: 72px; height: 72px; display: block; object-fit: contain; filter: drop-shadow(0 10px 18px rgba(4, 12, 48, 0.35)); }
.promo-copy { display: grid; gap: 6px; min-width: 0; }
.promo-copy em { font-style: normal; font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.7); }
.promo-copy b { font-size: 26px; font-weight: 800; letter-spacing: -0.025em; line-height: 1.15; }
.promo-copy span { font-size: 16px; line-height: 1.45; color: rgba(255, 255, 255, 0.82); max-width: 960px; }
.promo-go { display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 20px 0 24px; border-radius: 999px; font-size: 16px; font-weight: 650; white-space: nowrap;
  color: #0B1324; background: #fff; }
/* первый экран — не на всю высоту окна, чтобы баннер под ним был виден сразу */
.calc-hero { min-height: 0; padding-bottom: 48px; }
#calc { padding-top: 56px; padding-bottom: 32px; }
#calc .feats { margin-top: 28px; }

/* ── окно видеообзора: ролик 16:9 и кнопка звука в углу ── */
.calc-hero .hv-screen { aspect-ratio: 16 / 9; }
.hv-sound { position: absolute; right: 22px; bottom: 22px; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 0; cursor: pointer;
  color: #fff; background: rgba(11, 19, 36, 0.55); backdrop-filter: blur(8px); }

/* ── первый экран: заголовок в две строки, справа — видеообзор ── */
.calc-hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 48px; }
.calc-hero .sp-copy { max-width: 660px; }
.calc-hero .sp-copy h1 { font-size: clamp(40px, 3.6vw, 54px); line-height: 1.04; }
.calc-hero .sp-copy h1 span { white-space: nowrap; }
.calc-hero .lead { max-width: 540px; }
.calc-hero .hero-actions { flex-wrap: wrap; }
.nw { white-space: nowrap; }

/* ── скачать: карточка файла над списком листов ── */
#download .offer h2 { font-size: clamp(30px, 2.7vw, 40px); }
.dl-file { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px 16px; border-radius: 22px;
  background: rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.24); }
.dl-file > span:last-child { display: grid; gap: 2px; min-width: 0; font-size: 13px; color: rgba(255, 255, 255, 0.72); }
.dl-file b { font-size: 15px; font-weight: 700; color: #fff; overflow-wrap: anywhere; }
.dl-xls { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 12px; font-weight: 800; letter-spacing: 0.04em; color: #fff; background: #1F7A4D; }
.site-foot { background: transparent; }
body[data-theme="dark"] .site-foot { background: transparent; }

/* ── ролик о сервисе: широкое окно по центру ── */
.svc-sec { padding-top: 48px; padding-bottom: 96px; display: grid; gap: 36px; }
.section-page .svc-sec .sec-head { max-width: 1240px; }
.section-page .svc-sec .sec-head h2 { font-size: clamp(30px, 2.7vw, 40px); }
.svc-video { position: relative; z-index: 2; width: min(100%, 1120px); justify-self: center; padding: 10px; border-radius: 32px; }
.svc-video .hv-screen { aspect-ratio: 16 / 9; }

/* заголовки не сжимать в три строки: колонка шире, кегль спокойнее */
.section-page .sec-head { max-width: 1100px; }
.section-page .sec-head h2 { font-size: clamp(34px, 3.2vw, 46px); line-height: 1.08; }
.section-page .sec-head .lead { max-width: 760px; }
/* перенос между предложениями в баннере — только на широком экране, уже текст идёт сплошным */
@media (max-width: 1360px) { .pc-br { display: none; } }
@media (max-width: 1100px) {
  .calc-hero { grid-template-columns: minmax(0, 1fr); }
}