/* Pricing plan cards — подключается к landing-v3.html и pricing-cards.html */
#pricing{background:var(--bg2)}
#pricing .ss{max-width:780px}
.plans{display:flex;flex-wrap:nowrap;justify-content:center;gap:18px;
  max-width:1500px;width:100%;margin:48px auto 0;padding:14px 24px 0}
.plan{flex:0 0 278px;width:278px;background:var(--bg1);border:1px solid var(--border);border-radius:var(--r);
  padding:28px 24px;position:relative;transition:border-color .2s,transform .2s;
  display:flex;flex-direction:column;isolation:isolate}
.plan::before{content:'';position:absolute;inset:0;border-radius:inherit;
  background:var(--card-glow);pointer-events:none;z-index:0}
.plan > *{position:relative;z-index:1}
@media(max-width:1280px){
  .plans{justify-content:flex-start;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:thin;scrollbar-color:rgba(6,172,255,.3) transparent}
  .plans::-webkit-scrollbar{height:6px}
  .plans::-webkit-scrollbar-thumb{background:rgba(6,172,255,.3);border-radius:3px}
}
@media(max-width:1024px){
  .plans{
    width:100%;
    max-width:100%;
    margin-left:0;
    margin-right:0;
    padding-left:0;
    padding-right:0;
    box-sizing:border-box;
  }
}
.plan:hover{border-color:rgba(6,172,255,.2);transform:translateY(-3px)}
.plan.hot{border-color:var(--c);background:linear-gradient(160deg,#0D1E38 0%,#091322 100%)}
.plan.hot::before{background:radial-gradient(ellipse 120% 90% at 100% 0%,rgba(6,172,255,.22) 0%,rgba(6,172,255,.08) 40%,transparent 72%)}
.hot-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);z-index:2;
  background:var(--c);color:#fff;padding:4px 14px;border-radius:999px;
  font-size:.7rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase;white-space:nowrap;
  box-shadow:0 4px 12px rgba(6,172,255,.35)}
.plan-name{font-size:.72rem;font-weight:800;letter-spacing:2px;color:var(--c);margin-bottom:6px}
.plan-sz{font-size:2.2rem;font-weight:900;letter-spacing:-1px;line-height:1.1}
.plan-bal{font-size:.72rem;color:var(--muted);font-weight:600;margin:6px 0 16px}
.plan-sp{font-size:.82rem;color:var(--g);font-weight:700;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.plan ul{list-style:none;margin-bottom:20px;flex:1;padding-top:4px}
.plan-pr{font-size:1.15rem;font-weight:800;letter-spacing:-.5px;text-align:center;margin-top:14px;color:var(--c)}
.plan-pr strong{color:var(--c);font-weight:800}
.plan ul li{display:flex;align-items:center;gap:9px;
  font-size:.8rem;color:var(--muted);padding:6px 0;border-bottom:1px solid var(--border)}
.plan ul li:not(.plan-param){white-space:nowrap}
.plan ul li.plan-param{justify-content:space-between;gap:10px}
.plan-param-l{display:flex;align-items:center;gap:9px;min-width:0}
.plan ul li.plan-param strong{color:#fff;white-space:nowrap;font-weight:700;flex-shrink:0}
.plan ul li:last-child{border:none}
.ck{color:var(--g)}
.pcta{display:block;text-align:center;background:linear-gradient(135deg,#06ACFF 0%,#0078C8 100%);color:#fff;
  padding:12px;border-radius:50px;font-weight:700;font-size:.92rem;transition:opacity .2s;margin-top:4px}
.pcta:hover{opacity:.85}
.pcta.out{background:transparent;color:#FFFFFF;border:1px solid var(--border)}
.pcta.out:hover{border-color:var(--c);color:var(--c)}

/* Скелетон загрузки тарифов */
.plan--sk{pointer-events:none}
.plan--sk .sk-list{flex:1;margin:20px 0}
.sk{border-radius:6px;background:linear-gradient(100deg,rgba(255,255,255,.05) 30%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.05) 70%);
  background-size:200% 100%;animation:sk-shimmer 1.3s ease-in-out infinite}
.sk-name{width:45%;height:12px;margin-bottom:14px}
.sk-sz{width:70%;height:34px;margin-bottom:10px}
.sk-bal{width:50%;height:11px;margin-bottom:22px}
.sk-sp{width:80%;height:14px;margin-bottom:20px}
.sk-row{height:12px;margin:12px 0;border-radius:6px}
.sk-row:nth-child(1){width:85%}.sk-row:nth-child(2){width:70%}
.sk-row:nth-child(3){width:90%}.sk-row:nth-child(4){width:65%}.sk-row:nth-child(5){width:80%}
.sk-cta{width:100%;height:44px;border-radius:50px}
.sk-pr{width:35%;height:18px;margin:16px auto 0}
@keyframes sk-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.sk{animation:none}}
