/* Bagian paket & harga halaman Sistem Kasir (POS). Tanpa inline style karena CSP situs: style-src 'self'.
   Fase 2: warna/spasi/ukuran diselaraskan ke token css/style.css (file ini selalu
   dimuat sesudah style.css) — nilai visual setara brand, bukan hex lepas. */
.pos-plans{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin:1.75rem 0 0;padding:0;list-style:none;align-items:stretch}
.pos-plan{position:relative;display:flex;flex-direction:column;background:var(--bg);border:2px solid var(--line-soft);border-radius:var(--radius-lg);padding:1.625rem 1.375rem}
.pos-plan--pop{border-color:var(--brand)}
.pos-plan__badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--brand);color:#fff;font-size:.75rem;font-weight:700;padding:.25rem .875rem;border-radius:999px;white-space:nowrap}
.pos-plan h3{margin:0;font-size:1.375rem}
.pos-plan__tag{margin:.375rem 0 .875rem;color:var(--text-muted);font-size:.9375rem}
.pos-plan__price{font-size:2rem;font-weight:800;line-height:1.1;margin:0;color:var(--ink)}
.pos-plan__price small{font-size:.875rem;font-weight:500;color:var(--text-muted)}
.pos-plan__sub{margin:.375rem 0 0;color:var(--text-muted);font-size:.875rem}
.pos-plan__save{color:var(--success);font-weight:700}
.pos-plan__strike{text-decoration:line-through;margin-left:.375rem}
.pos-plan ul{margin:1.125rem 0 1.375rem;padding:0;list-style:none;flex:1}
.pos-plan li{position:relative;padding-left:1.7rem;margin:0 0 .5rem;font-size:.9375rem}
.pos-plan li::before{content:"";position:absolute;left:0;top:.2em;width:1.05rem;height:1.05rem;border-radius:50%;background:var(--accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23144262' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 70% no-repeat}
.pos-plan .btn{width:100%;text-align:center;justify-content:center}
.pos-plans-note{margin:1.25rem 0 0;color:var(--text-muted);font-size:.875rem;text-align:center}
.pos-pricing{margin:2.25rem 0 0}
.pos-pricing__title{text-align:center;font-size:clamp(1.25rem,3vw,1.625rem);margin:0 0 .375rem}
.pos-pricing__desc{text-align:center;color:var(--text-muted);max-width:640px;margin:0 auto 1rem}
.pos-seg{display:flex;justify-content:center;gap:.25rem;width:max-content;max-width:100%;margin:0 auto 1.375rem;padding:.25rem;background:var(--surface);border:1px solid var(--line-soft);border-radius:.875rem}
.pos-seg button{appearance:none;border:0;background:transparent;font:inherit;color:var(--ink);cursor:pointer;display:flex;flex-direction:column;align-items:center;padding:.5rem 1.375rem;border-radius:.625rem;min-height:48px}
.pos-seg button span{font-weight:700;font-size:.9375rem}
.pos-seg button small{font-size:.75rem;font-weight:600;color:var(--success)}
.pos-seg button.is-on{background:var(--bg);color:var(--brand);box-shadow:0 1px 3px rgba(10,31,51,.15)}
.pos-seg button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.pos-pricing [hidden]{display:none !important}
.pos-plan__price{white-space:nowrap}.pos-plan__price small{white-space:nowrap}
.pos-plan__bill{margin:.375rem 0 0;font-size:.875rem;font-weight:600;color:var(--ink)}
.pos-plan__cta{margin-top:auto;width:100%;text-align:center;justify-content:center}
@media (max-width:520px){.pos-seg button{padding:.5rem 1rem}}
.pos-shots{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:1.75rem 0 0}
.pos-shot{margin:1.75rem 0 0}
.pos-shot img{display:block;width:100%;height:auto;border:2px solid var(--line-soft);border-radius:var(--radius-lg);background:var(--bg)}
.pos-shot figcaption{margin:.625rem 0 0;color:var(--text-muted);font-size:.875rem;text-align:center}
.pos-shots .pos-shot{margin:0}
.testimoni-kosong{background:var(--bg);border:2px dashed var(--brand);border-radius:var(--radius-lg);padding:1.75rem 1.5rem;text-align:center}
.testimoni-kosong p{margin:0 0 1rem;font-size:1.0625rem}