/* Auto-extracted from index.html — bundle card shared styles */
.bundle-card{position:relative;padding:30px 26px;background:var(--card-bg);
  border:1px solid var(--gb);border-radius:var(--r);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  transition:all 0.3s;display:flex;flex-direction:column;}
.bundle-card:hover{transform:translateY(-3px);border-color:rgba(155,77,202,0.45);
  box-shadow:0 0 0 1px rgba(155,77,202,0.15),0 14px 40px rgba(155,77,202,0.20);}
.bundle-card.featured{border-color:rgba(155,77,202,0.55);
  background:linear-gradient(135deg,rgba(155,77,202,0.10),rgba(91,192,222,0.05));
  box-shadow:0 0 0 1px rgba(155,77,202,0.20),0 0 32px rgba(155,77,202,0.15);}
.bundle-flag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);
  background:linear-gradient(135deg,var(--p),var(--c));color:#fff;
  font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1px;
  padding:5px 14px;border-radius:100px;box-shadow:0 4px 14px rgba(155,77,202,0.4);}
.bundle-icon{width:48px;height:48px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;font-size:24px;
  background:linear-gradient(135deg,rgba(155,77,202,0.18),rgba(91,192,222,0.08));
  border:1px solid var(--gb);margin-bottom:14px;}
.bundle-icon i{background:linear-gradient(135deg,var(--p),var(--c));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.bundle-name{font-size:20px;font-weight:800;letter-spacing:-0.4px;margin-bottom:6px;}
.bundle-desc{font-size:13px;color:var(--text-secondary);line-height:1.55;margin-bottom:16px;flex:1;}
.bundle-price-row{display:flex;align-items:baseline;gap:6px;margin-bottom:4px;}
.bundle-price{font-size:32px;font-weight:800;letter-spacing:-1px;
  font-variant-numeric:tabular-nums;
  background:linear-gradient(135deg,var(--p),var(--c));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.bundle-per{font-size:12px;color:var(--mu);font-weight:600;}
.bundle-monthly{font-size:12px;color:var(--mu);margin-bottom:14px;}
.bundle-feats{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:18px;}
.bundle-feats li{font-size:13px;color:var(--text-secondary);display:flex;align-items:flex-start;gap:8px;line-height:1.5;}
.bundle-feats li i{color:var(--ok);font-size:14px;flex-shrink:0;margin-top:2px;}
.bundle-cta{display:flex;align-items:center;justify-content:center;gap:6px;
  padding:11px 18px;border-radius:var(--rsm);
  background:var(--glass);border:1px solid var(--gb);
  color:var(--tx);text-decoration:none;font-size:13px;font-weight:700;
  transition:all 0.2s;}
.bundle-cta:hover{background:linear-gradient(135deg,var(--p),var(--c));
  color:#fff;border-color:transparent;box-shadow:0 6px 18px rgba(155,77,202,0.35);}
.bundle-card.featured .bundle-cta{background:linear-gradient(135deg,var(--p),var(--c));
  color:#fff;border-color:transparent;box-shadow:0 4px 14px rgba(155,77,202,0.35);}
.bundle-toggle{display:inline-flex;background:var(--glass);border:1px solid var(--gb);
  border-radius:100px;padding:4px;gap:2px;margin-bottom:32px;}
.bundle-strip{margin-top:30px;padding:16px 22px;background:var(--glass);
  border:1px solid var(--gb);border-radius:var(--rsm);
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  font-size:13px;color:var(--text-secondary);max-width:880px;margin-left:auto;margin-right:auto;}
.bundle-strip i{color:var(--c);font-size:18px;}
.bundle-strip strong{color:var(--tx);}
.bundle-promo-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;background:linear-gradient(135deg,rgba(230,126,34,0.18),rgba(245,158,11,0.10));
  border:1px solid rgba(230,126,34,0.40);border-radius:100px;
  font-size:10px;font-weight:700;color:var(--o);letter-spacing:0.5px;
  text-transform:uppercase;margin-bottom:10px;align-self:flex-start;
}
.bundle-promo-badge i{font-size:12px;}
.bundle-price-old{
  font-size:18px;font-weight:600;color:var(--mu);
  text-decoration:line-through;text-decoration-color:rgba(155,77,202,0.6);
  text-decoration-thickness:2px;margin-right:8px;
  font-variant-numeric:tabular-nums;
}
.bundle-tiers{display:flex;flex-direction:column;gap:8px;margin:16px 0;}
.bundle-reg{padding:12px 14px;margin-bottom:10px;border-radius:10px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);}
.bundle-reg-lbl{font-size:10px;font-weight:700;color:var(--mu);text-transform:uppercase;letter-spacing:0.7px;margin-bottom:4px;}
.bundle-ea{padding:12px 14px;margin-bottom:14px;border-radius:10px;background:linear-gradient(135deg,rgba(230,126,34,0.12),rgba(245,158,11,0.05));border:1px solid rgba(230,126,34,0.32);}
.bundle-ea-flag{font-size:10px;font-weight:800;color:var(--o);text-transform:uppercase;letter-spacing:0.7px;margin-bottom:6px;display:flex;align-items:center;gap:6px;}
.bundle-ea-extra{font-size:11px;color:var(--mu);margin-top:6px;}
.bundle-reg-extra{font-size:11px;color:var(--mu);margin-top:6px;}
.bundle-reg-soon{opacity:0.45;filter:grayscale(0.6);}
.bundle-cta-outline{background:transparent!important;color:var(--tx)!important;border:1px solid var(--gb)!important;box-shadow:none!important;margin-top:8px;font-weight:600;}
.bundle-cta-outline:hover{background:var(--glass)!important;border-color:rgba(255,255,255,0.20)!important;transform:none!important;}
.bundle-card.bcard-soon{border:1px solid rgba(245,158,11,0.45);box-shadow:0 0 0 1px rgba(245,158,11,0.15),0 0 24px rgba(245,158,11,0.10);}
.bundle-card .bundle-icon.bi-soon{color:var(--warn);border-color:rgba(245,158,11,0.30);}
.bundle-status-tag{position:absolute;top:14px;right:14px;padding:4px 9px;font-size:10px;font-weight:800;letter-spacing:0.5px;text-transform:uppercase;border-radius:6px;display:inline-flex;align-items:center;gap:4px;z-index:2;}
.bundle-status-tag.live{color:var(--ok);background:rgba(16,185,129,0.15);}
.bundle-status-tag.soon{color:var(--warn);background:rgba(245,158,11,0.18);border:1px solid rgba(245,158,11,0.35);}
.bundle-reg-soon::after{content:"NOT AVAILABLE YET";display:block;font-size:10px;font-weight:800;color:var(--warn);letter-spacing:1px;margin-top:8px;padding-top:8px;border-top:1px dashed rgba(245,158,11,0.30);}
.bundle-save-badge{display:inline-flex;align-items:center;padding:3px 8px;margin-left:8px;font-size:11px;font-weight:700;color:var(--ok);background:rgba(16,185,129,0.15);border-radius:6px;letter-spacing:0.3px;}
.bundle-price-main{font-size:26px;font-weight:800;color:var(--tx);font-variant-numeric:tabular-nums;}
.bundle-price-ea{font-size:30px;font-weight:800;color:var(--o);font-variant-numeric:tabular-nums;}
.bundle-price-per{font-size:12px;color:var(--mu);margin-left:6px;}

/* Toggle Annual / Monthly / Entity */
.bundle-toggle{display:inline-flex;background:var(--glass);border:1px solid var(--gb);border-radius:100px;padding:4px;gap:2px;margin-bottom:32px;}
.bt-btn{padding:8px 18px;border-radius:100px;background:none;border:none;color:var(--mu);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:all 0.2s;}
.bt-btn.on{background:linear-gradient(135deg,var(--p),var(--c));color:#fff;box-shadow:0 2px 10px rgba(155,77,202,0.35);}

/* ===== Responsive: max 6 visible, scroll/swipe overflow ===== */
/* Desktop ≥900px: 3-col grid, vertical scroll if >6 cards (~2 rows visible) */
@media (min-width: 900px) {
  #bundlesGrid,
  #pp-bundles {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-height: 1512px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 18px 8px 4px;
    margin-right: -18px;
    scroll-behavior: smooth;
  }
  #bundlesGrid::-webkit-scrollbar,
  #pp-bundles::-webkit-scrollbar { width: 8px; }
  #bundlesGrid::-webkit-scrollbar-thumb,
  #pp-bundles::-webkit-scrollbar-thumb {
    background: rgba(155, 77, 202, 0.35);
    border-radius: 4px;
  }
  #bundlesGrid::-webkit-scrollbar-thumb:hover,
  #pp-bundles::-webkit-scrollbar-thumb:hover {
    background: rgba(155, 77, 202, 0.55);
  }
}

/* Mobile <900px: horizontal swipe, 1.2 cards peek */
@media (max-width: 899px) {
  #bundlesGrid,
  #pp-bundles {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 14px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 4px 16px 12px 16px;
    margin-left: -16px;
    margin-right: -16px;
  }
  #bundlesGrid::-webkit-scrollbar,
  #pp-bundles::-webkit-scrollbar { display: none; }

  #bundlesGrid > .bundle-card,
  #pp-bundles > .bundle-card {
    flex: 0 0 calc(83.333% - 4px); /* ~1.2 cards visible */
    min-width: calc(83.333% - 4px);
    max-width: calc(83.333% - 4px);
    scroll-snap-align: start;
  }
}