/* PannaCotta · цена на странице товара (макет v2). Токены — из pannacotta-brand.css / product-page-v3.css / variants.css. */

/* ===== Ценник в hero: «гроссбух» под переключателем / под названием ===== */
.px{display:flex;align-items:center;justify-content:space-between;gap:22px;margin:20px 0 0;padding:16px 0 17px;border-top:3px solid var(--ink);border-bottom:1px solid var(--line)}
.px-main{min-width:0}
.px-eyebrow{margin:0 0 6px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.px-eyebrow em{font-style:normal;color:var(--red)}
.px-sum{margin:0;color:var(--ink);font:700 60px/.9 var(--display);letter-spacing:-.035em;white-space:nowrap;font-variant-numeric:tabular-nums}
.px-sum i{font-style:normal;color:var(--red);margin-left:.06em}
.px-sum.is-flip{animation:px-flip .42s var(--ease-out)}
@keyframes px-flip{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}
.px-cta{flex:0 0 auto;min-width:190px;min-height:52px;padding:0 24px;font-size:11px}

.px .pc-kp-add small{margin-left:6px;opacity:.65;font-size:9px;font-weight:700}

/* состояние «по запросу»: тот же гроссбух, формулировка — действие, а не извинение */
.px--ask .px-sum{font-size:44px;line-height:.95;letter-spacing:-.03em}
.px--ask .px-sum i{display:inline-block;width:.42em;height:4px;margin:0 .22em 0 0;vertical-align:.32em;background:var(--red)}
.px-note{margin:7px 0 0;color:var(--muted);font-size:11.5px;line-height:1.4}
.px--ask .px-cta{min-width:210px}

/* после гроссбуха — остальные действия: уже вторичные */
.px + .tagline{margin-top:22px}
.actions--after-px{margin-top:0}

/* ===== Цена в плитках исполнения ===== */
.vx-price{display:flex;align-items:baseline;gap:6px;margin-top:5px;padding-top:6px;border-top:1px dashed var(--line);color:var(--muted);font-size:10px;white-space:nowrap}
.vx-price b{color:var(--ink);font:700 17px/1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.vx-price i{font-style:normal;margin:0}
.vx-opt[aria-checked="true"] .vx-price b{color:var(--ink)}

/* строка цены в таблице «чем отличаются» */
.vx-table tr.vx-price-row td:not(:first-child){color:var(--ink);font:700 19px/1.2 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.vx-table tr.vx-price-row td:not(:first-child):not(.is-on){color:#8d9094}
.vx-table tr.vx-price-row td small{display:block;margin-top:3px;color:var(--muted);font:400 10px/1.3 var(--text);letter-spacing:0}

/* ===== Липкая плашка (мобильные) — цена + главное действие, над cookie-баннером ===== */
.sticky-cta .sc-price{display:block;color:var(--ink);font:700 19px/1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.sticky-cta .sc-price b,.sticky-cta .sc-price i{display:inline;font:inherit;color:inherit;letter-spacing:inherit}
.sticky-cta .sc-price i{font-style:normal;color:var(--red)}
.sticky-cta .sc-price small{margin-left:5px;color:var(--muted);font:700 9px/1 var(--text);letter-spacing:.06em;text-transform:uppercase}
.sticky-cta .sc-line{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


@media(max-width:900px){
  .px-sum{font-size:52px}
}
@media(max-width:650px){
  .px{margin-top:14px;padding:12px 0 13px;gap:12px}
  .px-eyebrow{margin-bottom:3px;font-size:9px}
  .px-sum{font-size:40px}
  .px--ask .px-sum{font-size:30px}
  .px-note{margin-top:4px;font-size:10.5px}
  .px-cta,.px--ask .px-cta{min-width:0;min-height:46px;padding:0 14px;font-size:10px}
  .px-cta small{display:none}
  .vx-price b{font-size:15px}
  .vx-price{gap:4px;font-size:9px}
  /* плашка поднимается на высоту cookie-баннера; переменную ставит price.js */
  body{padding-bottom:calc(64px + var(--pc-cookie-h,0px))}
  .sticky-cta{bottom:var(--pc-cookie-h,0px);box-shadow:0 -10px 30px rgba(21,22,23,.08)}
  .sticky-cta .button{min-width:0;padding:0 18px}
}

/* ===== Каталог: цена в подвале карточки ===== */
.product__footer--price{align-items:flex-end;padding-top:16px;text-transform:none;letter-spacing:0}
.product__price{display:flex;flex-direction:column;gap:3px;min-width:0}
.product__price b{color:var(--ink);font:700 26px/1 var(--display);letter-spacing:-.025em;font-variant-numeric:tabular-nums;white-space:nowrap}
.product__price b i{font:inherit;font-style:normal;letter-spacing:inherit;text-transform:none;color:var(--red)}
.product__price i{font-style:normal;color:var(--muted);font:600 9.5px/1.3 var(--text);letter-spacing:.06em;text-transform:uppercase}
.product__price--ask b{font-size:21px}
.product__price--ask b:before{content:"";display:inline-block;width:12px;height:3px;margin:0 7px 0 0;vertical-align:.32em;background:var(--red)}
.product__footer--price>b{margin-bottom:2px}

@media(prefers-reduced-motion:reduce){.px-sum.is-flip{animation:none}}
.kp-pricing-total{font-weight:700;margin-top:16px}.kp-unit-price,.kp-line-price{white-space:nowrap}

/* Explicit visibility beats display:flex in shared button styles. */
.px [hidden],.actions--after-px [hidden],.sticky-cta [hidden]{display:none!important}
.px--ask .px-sum:before{content:"";display:inline-block;width:.42em;height:4px;margin:0 .22em 0 0;vertical-align:.32em;background:var(--red)}
.actions--after-px .px-secondary-add{background:#fff;border-color:var(--red);color:var(--red)}.actions--after-px .px-secondary-add:hover{background:var(--red);color:#fff}
.actions--after-px .px-secondary-add:hover{background:var(--red);border-color:var(--red)}
.px .pc-kp-add.px-cta{min-height:52px;font:700 11px var(--text)}
@media(max-width:650px){
 .px .pc-kp-add.px-cta{min-height:46px;font-size:10px}
 .sticky-cta .sc-price{font-size:19px}
 .sticky-cta .sc-price>span{color:var(--ink);font:inherit}
 .sticky-cta .button{min-width:0;min-height:44px;font-size:10px}
}
