/* NexoSite: cenniki (strony i plakietki) — karty zestawów, konfigurator, podsumowanie. */
.q-hero { position:relative; isolation:isolate; overflow:clip; padding:clamp(8rem, 15vh, 10rem) 0 clamp(2.5rem, 5vw, 4rem); text-align:center; }
.q-hero .hero-bg::after { height:45%; }
.q-hero .display { font-size:clamp(2.4rem, 5vw, 4.4rem); max-width:16ch; margin:1.2rem auto; }
.q-hero .lead { margin-inline:auto; }

/* pakiety */
.pkgs { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:1.25rem; align-items:stretch; }
.pkg { position:relative; display:flex; flex-direction:column; padding:clamp(1.7rem, 3vw, 2.4rem); cursor:pointer; text-align:left; overflow:visible;
  transition:transform .9s var(--pop), border-color .4s, box-shadow .6s var(--ease); }
.pkg:hover { transform:translateY(-6px); }
.pkg[data-pkg="basic"] { --accent:var(--blue); }
.pkg[data-pkg="pro"] { --accent:var(--purple); --on-accent:#0b0d26; }
.pkg.featured { background:radial-gradient(110% 60% at 50% 0%, rgba(74,222,128,.14), transparent 60%), var(--glass-bg); border-color:rgba(74,222,128,.32); }
.pkg.selected { border-color:color-mix(in srgb, var(--accent) 70%, transparent); box-shadow:var(--glass-hi), 0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent), 0 30px 70px -24px color-mix(in srgb, var(--accent) 55%, transparent); }
.pkg-badge { position:absolute; top:-14px; right:1.6rem; height:28px; padding:0 .85rem; border-radius:var(--r-pill); display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; color:#03140a; background:var(--green); box-shadow:0 10px 26px -8px rgba(74,222,128,.8); }
.pkg-eyebrow { font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:.6rem; }
.pkg-name { font-size:1.4rem; font-weight:600; letter-spacing:-.03em; margin-bottom:.4rem; }
.pkg-desc { color:var(--ink-3); font-size:.92rem; line-height:1.6; min-height:4.8em; margin-bottom:1.5rem; }
.pkg-price { display:flex; align-items:baseline; gap:.45rem; margin-bottom:1.2rem; }
.pkg-price-amt { font-size:clamp(2.6rem, 4vw, 3.3rem); font-weight:700; letter-spacing:-.055em; line-height:1; }
.pkg-price-unit { color:var(--ink-3); font-weight:500; }
.pkg-for { font-size:.84rem; line-height:1.55; padding:1rem 0 1.25rem; margin-bottom:1.25rem; border-block:1px solid var(--line); }
.pkg-for-label { color:var(--ink-3); font-weight:600; }
.pkg-for-value { color:var(--ink-2); }
.pkg .ticks { flex:1; margin-bottom:2rem; gap:.7rem; }
.pkg .ticks li { font-size:.92rem; }
.pkg .ticks li.carried { color:var(--ink-3); }
.pkg .ticks li.carried::before { opacity:.45; }
.pkg[data-pkg="basic"] .ticks li::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2338bdf8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); }
.pkg[data-pkg="pro"] .ticks li::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23818cf8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); }
.pkg-btn { width:100%; }
.pkg.selected .pkg-btn.btn-glass { border-color:color-mix(in srgb, var(--accent) 60%, transparent); color:var(--accent); background:color-mix(in srgb, var(--accent) 10%, transparent); }
.pkg-tabs { display:none; max-width:440px; margin:0 auto 1.5rem; }
@media (max-width: 960px) {
  .pkg-tabs { display:grid; }
  .pkgs { grid-template-columns:1fr; max-width:460px; margin-inline:auto; }
  .pkgs.sets { gap:1.6rem; }
  .pkgs:not(.sets) .pkg:not(.selected) { display:none; }
  .pkg:hover { transform:none; }
}

/* konfigurator */
.cfg { display:grid; grid-template-columns:minmax(0, 1fr) 380px; gap:1.5rem; align-items:start; }
.group { padding:clamp(1.5rem, 3vw, 2.2rem); }
.group + .group { margin-top:1.25rem; }
.group-title { display:flex; align-items:center; gap:.75rem; font-size:1.15rem; font-weight:600; letter-spacing:-.025em; }
.group-num { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font-family:var(--mono); font-size:.78rem; color:var(--on-accent); background:var(--accent); }
.group-sub { color:var(--ink-3); font-size:.9rem; margin:.4rem 0 1.4rem 2.6rem; }
.opts { display:grid; gap:.65rem; }
.opts + .opts { margin-top:.65rem; }
.opt { display:flex; align-items:center; gap:1rem; padding:1rem 1.1rem; border-radius:var(--r-row, 16px); background:rgba(255,255,255,.03); border:1px solid var(--line); transition:border-color .35s, background .35s, transform .7s var(--pop); }
.opt-row { cursor:pointer; }
.opt-row:hover { border-color:var(--line-2); }
.opt-row:active { transform:scale(.99); }
.opt-row.active { border-color:rgba(129,140,248,.55); background:linear-gradient(160deg, rgba(129,140,248,.14), rgba(129,140,248,.04)); }
.opt-row.opt-hidden, .step-row.opt-hidden { display:none; }
.opt-box { width:24px; height:24px; flex-shrink:0; border-radius:8px; display:grid; place-items:center; border:1.5px solid var(--line-2); color:#0b0d26; font-size:.85rem; transition:background .3s, border-color .3s; }
.opt-box i { transform:scale(0); transition:transform .6s var(--pop); }
.opt-row.active .opt-box { background:var(--purple); border-color:var(--purple); }
.opt-row.active .opt-box i { transform:none; }
.opt-t { flex:1; display:grid; gap:.15rem; min-width:0; }
.opt-name { font-size:.95rem; font-weight:500; letter-spacing:-.01em; }
.opt-hint { font-size:.8rem; color:var(--ink-3); }
.opt-hint a { color:var(--purple); text-decoration:underline; text-underline-offset:2px; }
.opt-price { font-family:var(--mono); font-size:.82rem; color:var(--purple); white-space:nowrap; }
.opt input { display:none; }
.stepper { display:flex; align-items:center; gap:.4rem; padding:4px; border-radius:var(--r-pill); background:rgba(0,0,0,.25); border:1px solid var(--line); }
.step-btn { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-size:1.05rem; color:var(--ink-2); background:rgba(255,255,255,.06); transition:background .3s, color .3s, transform .5s var(--pop); }
.step-btn:hover { background:rgba(74,222,128,.18); color:var(--green); }
.step-btn:active { transform:scale(.9); }
.step-count { min-width:26px; text-align:center; font-family:var(--mono); font-weight:500; }
.pkg-gap-note { display:flex; align-items:center; gap:.5rem; margin-bottom:.8rem; font-size:.84rem; color:var(--green); }
.pkg-gap-note::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--green); flex-shrink:0; }

.summary { position:sticky; top:6.5rem; padding:1.9rem; border-color:rgba(74,222,128,.22); }
.summary h3 { font-family:var(--mono); font-size:.74rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--green); margin-bottom:1rem; }
.summary-pkg-pill { display:inline-flex; align-items:center; height:30px; padding:0 .85rem; border-radius:var(--r-pill); font-size:.82rem; font-weight:600; color:var(--green); background:rgba(74,222,128,.1); border:1px solid rgba(74,222,128,.25); margin-bottom:1.1rem; }
.summary-list { display:grid; gap:.6rem; }
.summary-item { display:flex; justify-content:space-between; gap:1rem; font-size:.86rem; animation:si-in .6s var(--spring) both; }
@keyframes si-in { from { opacity:0; transform:translateY(6px); filter:blur(4px); } }
.si-name { color:var(--ink-2); } .si-price { color:var(--ink-3); font-family:var(--mono); font-size:.8rem; white-space:nowrap; }
.summary-divider { height:1px; margin:1.2rem 0; background:var(--line); }
.summary-total-row { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; }
.summary-total-label { color:var(--ink-3); font-weight:500; }
.summary-total-amount { display:inline-block; font-size:2.3rem; font-weight:700; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
.summary-total-amount.pulse { animation:pulse .6s var(--pop); }
@keyframes pulse { 40% { transform:scale(1.06); color:var(--green); } }
.summary-onetime { margin-top:.2rem; font-size:.86rem; color:var(--purple); }
.summary-btns { display:grid; gap:.6rem; margin-top:1.5rem; }
.summary-note { margin-top:1rem; font-size:.78rem; color:var(--ink-3); line-height:1.6; text-align:center; }
@media (max-width: 960px) { .cfg { grid-template-columns:1fr; } .summary { position:static; } }
@media (max-width: 600px) {
  .group-sub { margin-left:0; }
  .opt { flex-wrap:wrap; }
  .step-row .opt-t { flex-basis:calc(100% - 140px); }
}
.q-footer { padding:2.5rem var(--gutter); text-align:center; border-top:1px solid var(--line); }
.q-footer > a { color:var(--ink-2); font-weight:500; transition:color .3s; }
.q-footer > a:hover { color:var(--green); }
.q-footer p { margin-top:.8rem; font-size:.8rem; color:var(--ink-3); }
.q-footer p a { color:var(--ink-3); transition:color .3s; } .q-footer p a:hover { color:var(--green); }

/* cennik plakietek */
.page-nfc .pkg.featured { background:radial-gradient(110% 60% at 50% 0%, rgba(129,140,248,.16), transparent 60%), var(--glass-bg); border-color:rgba(129,140,248,.34); }
.page-nfc .pkg-badge { color:var(--on-accent); background:var(--accent); box-shadow:0 10px 26px -8px rgba(129,140,248,.8); }
.page-nfc .pkg-price-amt { color:var(--ink); }
.page-nfc .summary { border-color:rgba(129,140,248,.25); }
.page-nfc .summary h3, .page-nfc .summary-pkg-pill { color:var(--purple); }
.page-nfc .summary-pkg-pill { background:rgba(129,140,248,.1); border-color:rgba(129,140,248,.28); }
.page-nfc .summary-total-amount.pulse { animation:none; }
.pkgs.sets .pkg-name { font-size:1rem; font-weight:500; color:var(--ink-3); letter-spacing:-.01em; margin-bottom:1.4rem; }
.pkgs.sets .pkg-price-amt { font-size:clamp(3rem, 5vw, 4rem); }
.np-each { margin-bottom:1.8rem; color:var(--ink-3); font-size:.95rem; }
.np-each span:first-child { color:var(--accent); font-weight:600; font-family:var(--mono); font-size:.9rem; }
.np-save { position:absolute; top:1.6rem; right:1.6rem; height:28px; padding:0 .7rem; border-radius:var(--r-pill); display:inline-grid; place-items:center;
  font-family:var(--mono); font-size:.74rem; color:var(--green); background:rgba(74,222,128,.1); border:1px solid rgba(74,222,128,.25); }
.pkg.featured .np-save { top:2.1rem; }
.pkgs.sets .pkg-btn { margin-top:auto; }
.pkg:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.np-incl { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.8rem 1.5rem; }
.np-bundle { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap; }
.np-bundle-t { flex:1; min-width:220px; display:grid; gap:.3rem; }
.np-bundle-t .h3 { font-size:1.15rem; }
.group-num .ph { font-size:.9rem; }
@media (max-width: 600px) { .np-incl { grid-template-columns:1fr; } }
