.pcp,.pcp *{box-sizing:border-box}
.pcp{
  background:var(--pcp-bg,transparent);
  color:var(--pcp-ink,#0f2a3d);
}
.pcp-inner{margin:0 auto;text-align:center}
.pcp .pcp-heading {
    margin: 0 0 24px;
    font-size: clamp(25px,4vw,52px);
    font-weight: 800;
    line-height: 1.2;
    color: var(--pcp-ink);
}
.pcp .pcp-sub {
    margin: 0 auto 40px;
    max-width: 750px;
    font-size: 18px;
    line-height: 1.65;
    color: #36577F;
}

.pcp .pcp-grid-front{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:14px;
  align-items:stretch;
  text-align:center;
}
.pcp .pcp-card{
  position:relative;
  display:flex;flex-direction:column;align-items:center;
  background:#fff;
  border:1px solid #e4e9ee;
  border-radius:12px;
  padding:26px 16px 16px;
}
.pcp .pcp-card.is-featured{
  margin-top:-12px;
  border-top:2px solid var(--pcp-hot);
  box-shadow:0 14px 30px rgba(15,42,61,.10);
  padding-top:22px;
}
.pcp .pcp-badge{
  position:absolute;top:8px;left:0;right:0;
  font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--pcp-hot);
}
.pcp .pcp-badge::before{content:"★ "} 
.pcp .pcp-card.is-featured .pcp-title{margin-top:8px}

.pcp .pcp-title{margin:0 0 14px;font-size:18px;font-weight:700;line-height:1.25;color:var(--pcp-ink)}
.pcp .pcp-from {
    margin: 0 0 4px;
    font-size: 12px;
    color: #6b7a86;
}
.pcp .pcp-price{margin:0;display:flex;align-items:baseline;justify-content:center;gap:2px;color:var(--pcp-ink)}
.pcp .pcp-cur{font-size:15px;font-weight:700}
.pcp .pcp-amt{font-size:30px;font-weight:800;line-height:1.1}
.pcp .pcp-per{font-size:12px;color:#36577F;margin-left:3px}
.pcp .pcp-alt{margin:4px 0 0;font-size:12px;color:#36577F}
.pcp .pcp-alt strong{color:var(--pcp-ink);font-weight:700}
.pcp .pcp-desc {
    margin: 15px 0 15px;
    font-size: 14px;
    line-height: 1.6;
    color: #5b6b78;
    flex: 1 1 auto;
}

.pcp .pcp-actions{width:100%;display:flex;flex-direction:column;gap:8px}
.pcp .pcp-btn {
    display: block;
    width: 100%;
    padding: 9px 10px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    border-radius: 6px;
    border: 1px solid transparent;
    transition: filter .15s ease,background-color .15s ease;
}
.pcp .pcp-btn-main {
    background: var(--pcp-accent);
    color: #fff;
    text-decoration: none !important;
}
.pcp .pcp-btn-main:hover{filter:brightness(.92);color:#fff}
.pcp .pcp-card.is-featured .pcp-btn-main{background:var(--pcp-hot)}
.pcp .pcp-btn-ghost {
    background: #fff;
    color: var(--pcp-ink);
    border-color: #e1e6eb;
    text-decoration: none !important;
}
.pcp .pcp-btn-ghost:hover{background:#f4f6f8;color:var(--pcp-ink)}
.pcp .pcp-btn:focus-visible{outline:2px solid var(--pcp-ink);outline-offset:2px}

.pcp .pcp-note {
    margin: 30px 0 0;
    font-size: 14px;
    line-height: 1.7;
    color: #36577F;
}
.pcp .pcp-note a{color:var(--pcp-accent);font-weight:600;text-decoration:none}
.pcp .pcp-note a:hover{text-decoration:underline}

@media (min-width:1024px){
  .pcp .pcp-grid-front{grid-template-columns:repeat(5,1fr)}
}
@media (max-width:640px){
  .pcp .pcp-grid-front{grid-template-columns:1fr}
  .pcp .pcp-card.is-featured{margin-top:0}
}