/* Ціновий блок для плашки гейту статті (порт із головної, scoped під .pe-embed щоб не
   конфліктувати зі старим pricing.css). Генерується — не редагувати вручну. */
/* Вирівнюємо токени під головну (home.css), щоб блок виглядав ІДЕНТИЧНО незалежно від style.css.
   Скоуповано під .pe-embed → не впливає на решту сторінки. */
.pe-embed{--grn:#0a7d3f; --st-accent-soft:#fff1ec; --st-border-hard:#d1d5db;
  --st-border-strong:#e5e7eb; --st-radius-sm:6px; --st-shadow-lg:0 20px 60px -15px rgba(0,0,0,.10)}
@property --kb-angle{syntax:"<angle>"; initial-value:0deg; inherits:false}
@keyframes kb-spin{to{--kb-angle:360deg}}
.pe-embed{margin-top:8px}
.pe-embed .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px; font:inherit;
  font-weight:600; font-size:.98rem; line-height:1; padding:15px 26px; border-radius:var(--st-radius-sm);
  text-decoration:none; cursor:pointer; border:1px solid transparent; white-space:nowrap;
  transition:transform .15s ease, opacity .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.pe-embed .btn--primary{background:var(--st-ink); color:#fff; box-shadow:0 8px 20px -6px rgba(18,18,18,.5)}
.pe-embed .btn--primary:hover{opacity:.9; transform:translateY(-2px)}
.pe-embed .btn--accent{background:var(--st-accent); color:#fff; box-shadow:0 10px 24px -6px rgba(255,87,34,.55)}
.pe-embed .btn--accent:hover{transform:translateY(-2px); box-shadow:0 14px 30px -6px rgba(255,87,34,.65)}
.pe-embed .btn--ghost{background:#fff; color:var(--st-fg); border-color:var(--st-border-hard)}
.pe-embed .btn--ghost:hover{background:var(--st-soft); transform:translateY(-2px)}
.pe-embed .btn--lg{padding:18px 34px; font-size:1.05rem}
.pe-embed .btn--block{width:100%}
.pe-embed .arw{transition:transform .15s ease}
.pe-embed .btn:hover .arw{transform:translateX(4px)}
.pe-embed .pe-switch{display:flex; gap:5px; background:#fff; border:1px solid var(--st-border-hard); border-radius:100px; padding:5px; width:max-content; margin:0 auto 12px}
.pe-embed .pe-sw{border:0; background:none; font:inherit; font-weight:600; font-size:.92rem; color:var(--st-muted); padding:10px 22px; border-radius:100px; cursor:pointer; transition:.15s; display:flex; align-items:center; gap:8px}
.pe-embed .pe-sw.on{background:var(--st-ink); color:#fff}
.pe-embed .pe-sw .sv{font-size:.72rem; background:var(--st-accent); color:#fff; padding:2px 8px; border-radius:100px; font-weight:700}
.pe-embed .pe-sw.on .sv{background:#fff; color:var(--st-accent)}
.pe-embed .pe-guarantee-mini{text-align:center; font-size:.86rem; color:var(--st-muted); margin-bottom:40px}
.pe-embed .pe-tiers{display:grid; grid-template-columns:repeat(2,1fr); gap:22px; max-width:820px; margin:0 auto; align-items:stretch}
.pe-embed .pe-tier{display:flex; flex-direction:column; background:#fff; border:1px solid var(--st-border-strong); border-radius:20px; padding:32px 30px; position:relative; transition:.2s}
.pe-embed .pe-tier--feat{border:2px solid var(--st-ink); box-shadow:var(--st-shadow-lg)}
.pe-embed .pe-badge{position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--st-ink); color:#fff; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; padding:6px 16px; border-radius:100px; white-space:nowrap}
.pe-embed .pe-tier--feat .pe-badge{background:var(--st-accent)}
.pe-embed .pe-name-row{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:4px}
.pe-embed .pe-name{font-family:var(--st-serif); font-size:1.6rem; color:var(--st-fg); font-weight:500}
.pe-embed .pe-seats-top{position:relative; isolation:isolate; font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--st-accent); background:#2e1d13; border:1px solid rgba(255,87,34,.32); padding:6px 12px; border-radius:100px; white-space:nowrap}
.pe-embed .pe-seats-top::before{content:""; position:absolute; inset:0; border-radius:100px; padding:1.5px; pointer-events:none;
  background:conic-gradient(from var(--kb-angle), transparent 0deg 250deg, var(--st-accent) 322deg, #ff9a6f 344deg, transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:kb-spin 3.2s linear infinite}
.pe-embed .pr-hl{color:var(--st-accent); font-weight:800}
.pe-embed .pe-for{font-size:.86rem; color:var(--st-muted); margin-bottom:18px}
.pe-embed .pe-saleline{display:flex; align-items:center; gap:9px; margin-bottom:2px}
.pe-embed .pe-old{color:var(--st-muted); text-decoration:line-through; font-size:1.05rem}
.pe-embed .pe-sale{font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--st-accent); background:var(--st-accent-soft); padding:3px 9px; border-radius:100px}
.pe-embed .pe-price{display:flex; align-items:baseline; gap:6px; margin-bottom:6px}
.pe-embed .pe-amt{font-family:var(--st-serif); font-size:3rem; font-weight:500; color:var(--st-fg); line-height:1}
.pe-embed .pe-per{color:var(--st-muted); font-size:.98rem; font-weight:500}
.pe-embed .pe-meta{display:flex; flex-direction:column; gap:6px; margin:14px 0 20px; padding:14px 0; border-top:1px solid var(--st-border); border-bottom:1px solid var(--st-border)}
.pe-embed .pe-meta div{font-size:.86rem; display:flex; align-items:center; gap:7px}
.pe-embed .pe-permonth-row{display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%}
.pe-embed .pe-permonth{color:var(--st-muted)}
.pe-embed .pe-value{color:var(--st-fg); font-weight:500}
.pe-embed .pe-value--mut{color:var(--st-muted); text-decoration:line-through; text-decoration-color:#e5484d; text-decoration-thickness:2px}
.pe-embed .pe-save{color:var(--grn); font-weight:600}
.pe-embed .pe-seats{color:var(--st-accent); font-weight:600}
.pe-embed .pe-benefits{list-style:none; display:flex; flex-direction:column; gap:11px; margin-bottom:24px; flex:1}
.pe-embed .pe-benefits li{display:flex; gap:10px; font-size:.93rem; color:var(--st-text); line-height:1.4}
.pe-embed .pe-benefits li svg{width:18px;height:18px;color:var(--grn);flex-shrink:0;margin-top:1px}
.pe-embed .pe-benefits li.mut{color:var(--st-muted)}
.pe-embed .pe-benefits li.mut svg{color:var(--st-border-hard)}
.pe-embed .pe-benefits li.mut span{text-decoration:line-through; text-decoration-color:#e5484d; text-decoration-thickness:2px}
.pe-embed .pe-note{text-align:center; font-size:.8rem; color:var(--st-muted); margin-top:12px}
@media(max-width:720px){.pe-embed .pe-tiers{grid-template-columns:1fr; max-width:420px}}
.pe-embed .pe-legal{text-align:center; font-size:.8rem; color:var(--st-muted); margin-top:8px}
.pe-embed .pe-legal a{color:var(--st-muted); text-decoration:underline; text-underline-offset:2px}
.pe-embed .pe-legal a:hover{color:var(--st-accent)}