.narocz-pricing {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: clamp(58px, 8vw, 110px) 20px;
  color: var(--narocz-section-text, #fff);
  font-family: var(--narocz-font, inherit);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.16), transparent 34%),
    radial-gradient(circle at 15% 80%, color-mix(in srgb, var(--narocz-accent, #ffc107) 16%, transparent), transparent 28%),
    linear-gradient(135deg, #050505 0%, #101010 45%, #050505 100%);
  border-top: 1px solid rgba(255,255,255,.12);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.narocz-pricing:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .22;
  background-image: linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(circle at center, #000 0%, transparent 72%);
}
.narocz-pricing__glow {
  position: absolute;
  inset: auto 12% -180px 12%;
  height: 320px;
  z-index: -1;
  background: radial-gradient(ellipse at center, rgba(255,255,255,.22), transparent 62%);
  filter: blur(18px);
  animation: naroczPulse 6s ease-in-out infinite;
}
.narocz-pricing__head {
  max-width: 880px;
  margin: 0 auto 38px;
  text-align: center;
}
.narocz-pricing__eyebrow {
  margin: 0 0 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-size: var(--narocz-eyebrow-size, 12px);
  color: var(--narocz-eyebrow, #ffc107);
}
.narocz-pricing h2 {
  margin: 0;
  color: var(--narocz-title, #fff);
  font-family: var(--narocz-heading-font, inherit);
  font-size: clamp(24px, var(--narocz-title-size, 52px), 96px);
  line-height: 1.04;
  letter-spacing: -.04em;
}
.narocz-pricing__head > p:last-child {
  max-width: 760px;
  margin: 18px auto 0;
  color: var(--narocz-subtitle, rgba(255,255,255,.78));
  font-size: var(--narocz-subtitle-size, 18px);
}
.narocz-pricing__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 28px);
  max-width: 1180px;
  margin: 0 auto;
}
.narocz-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 520px;
  padding: 34px 30px 28px;
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.055));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 22px 80px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  transform-style: preserve-3d;
  transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.narocz-card:before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,.45), var(--narocz-accent, #ffc107), rgba(255,255,255,.12));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events: none;
}
.narocz-card:hover {
  transform: translateY(-12px) rotateX(1.5deg);
  border-color: rgba(255,255,255,.38);
  box-shadow: 0 30px 100px rgba(0,0,0,.56), 0 0 44px color-mix(in srgb, var(--narocz-accent, #ffc107) 11%, transparent), inset 0 1px 0 rgba(255,255,255,.25);
}
.narocz-card:hover:before,
.narocz-card.is-featured:before { opacity: 1; }
.narocz-card.is-featured {
  transform: translateY(-10px) scale(1.03);
  border-color: rgba(255,255,255,.44);
  box-shadow: 0 34px 110px rgba(0,0,0,.58), 0 0 60px color-mix(in srgb, var(--narocz-accent, #ffc107) 16%, transparent), inset 0 1px 0 rgba(255,255,255,.24);
}
.narocz-card.is-featured:hover { transform: translateY(-18px) scale(1.035); }
.narocz-card__top {
  text-align: center;
  position: static;
}
.narocz-card__badge {
  position: absolute;
  left: 50%;
  top: 0;
  z-index: 20;
  transform: translate(-50%, -50%);
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin: 0;
  padding: 8px 18px;
  border-radius: 999px;
  color: #161616;
  background: linear-gradient(135deg, var(--narocz-accent, #ffc107), color-mix(in srgb, var(--narocz-accent, #ffc107) 58%, #fff));
  box-shadow: 0 0 25px color-mix(in srgb, var(--narocz-accent, #ffc107) 35%, transparent);
  font-size: var(--narocz-badge-size, 11px);
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.narocz-card__top span {
  display: block;
  margin: 0 0 18px;
  color: var(--narocz-muted, rgba(255,255,255,.62));
  font-size: var(--narocz-package-tag-size, 13px);
  text-align: center;
}
.narocz-card h3 {
  margin: 0 0 18px;
  color: var(--narocz-card-text, #fff);
  font-family: var(--narocz-heading-font, inherit);
  font-size: var(--narocz-package-name-size, 30px);
  letter-spacing: .06em;
}
.narocz-card strong {
  display: block;
  margin-top: 0;
  font-size: var(--narocz-price-size, 42px);
  color: var(--narocz-price, #fff);
  font-family: var(--narocz-heading-font, inherit);
  line-height: 1;
}
.narocz-card__features {
  display: grid;
  gap: 14px;
  margin: 32px 0;
  padding: 0 !important;
  list-style: none !important;
}
.narocz-card__features,
.narocz-card__features li {
  list-style: none !important;
  list-style-type: none !important;
}
.narocz-card__features li::marker {
  content: "" !important;
  font-size: 0 !important;
}
.narocz-card__features li {
  position: relative;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
  padding: 0 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  text-align: left !important;
  color: var(--narocz-card-text, rgba(255,255,255,.86));
  font-size: var(--narocz-features-size, 16px);
  line-height: 1.35;
}
.narocz-card__features li:before,
.narocz-card__features li:after {
  content: none !important;
  display: none !important;
}
.narocz-card__check {
  grid-column: 1;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-top: -1px;
  border-radius: 8px;
  background-color: var(--narocz-check, #20dd52);
  background-image: linear-gradient(135deg, var(--narocz-check, #20dd52), color-mix(in srgb, var(--narocz-check, #20dd52) 70%, #000));
  box-shadow: 0 0 18px color-mix(in srgb, var(--narocz-check, #20dd52) 35%, transparent);
  color: #fff;
  line-height: 1;
}
.narocz-card__check svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.narocz-card__feature-text {
  grid-column: 2;
  min-width: 0;
}
.narocz-card__button {
  margin-top: auto;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 52px;
  padding: 0 22px;
  border-radius: 14px;
  color: var(--narocz-button-text, #111) !important;
  background: var(--narocz-button-bg, #fff);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none !important;
  font-size: var(--narocz-button-size, 13px);
  box-shadow: 0 16px 40px rgba(0,0,0,.24);
  transition: transform .25s ease, background .25s ease;
}
.narocz-card__button:hover {
  transform: translateY(-3px);
  background: var(--narocz-button-hover-bg, #ffc107);
}
.narocz-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .75s ease, transform .75s ease;
  transition-delay: var(--delay, 0ms);
}
.narocz-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@keyframes naroczPulse {
  0%,100% { opacity: .45; transform: scale(.92); }
  50% { opacity: .8; transform: scale(1.06); }
}
@media (max-width: 980px) {
  .narocz-pricing__grid { grid-template-columns: 1fr; max-width: 560px; }
  .narocz-card, .narocz-card.is-featured { min-height: auto; transform: none; }
  .narocz-card:hover, .narocz-card.is-featured:hover { transform: translateY(-8px); }
}
@media (prefers-reduced-motion: reduce) {
  .narocz-pricing__glow, .narocz-reveal, .narocz-card, .narocz-card__button { animation: none; transition: none; }
  .narocz-reveal { opacity: 1; transform: none; }
}

/* v2.3.1 layout fix: keep checkmarks inside cards and place badge on the top edge */
.narocz-card__features {
  width: fit-content;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box;
}
.narocz-card__features li {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
  width: 100%;
  box-sizing: border-box;
  padding: 0 !important;
  margin: 0 !important;
  transform: none !important;
}
.narocz-card__features li:before {
  grid-column: 1;
  grid-row: 1;
  justify-self: start;
  align-self: start;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  margin: 0 !important;
}
.narocz-card__features li > * {
  min-width: 0;
}
.narocz-card.is-featured {
  padding-top: 44px;
}
.narocz-card.is-featured .narocz-card__top {
  padding-top: 8px;
}
.narocz-card.is-featured .narocz-card__badge {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 3;
  transform: translate(-50%, -50%);
  margin: 0;
  white-space: nowrap;
}
.narocz-card.is-featured .narocz-card__top span {
  margin-top: 0;
}
@media (max-width: 980px) {
  .narocz-card.is-featured {
    padding-top: 44px;
  }
}

/* v1.3.3 final layout fix: badge sits on the card border and never covers the tag text */
.narocz-card.has-badge,
.narocz-card.is-featured.has-badge,
.narocz-card:has(.narocz-card__badge) {
  padding-top: 62px !important;
}
.narocz-card__top,
.narocz-card.is-featured .narocz-card__top {
  position: static !important;
  padding-top: 0 !important;
}
.narocz-card__badge,
.narocz-card.is-featured .narocz-card__badge {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  right: auto !important;
  z-index: 6 !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
.narocz-card__top span,
.narocz-card.is-featured .narocz-card__top span {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}
.narocz-card__features {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: visible;
}
.narocz-card__features li {
  width: 100% !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: start !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}
.narocz-card__check {
  flex: 0 0 22px !important;
  justify-self: start !important;
}
.narocz-card__feature-text {
  min-width: 0 !important;
  text-align: left !important;
}
.narocz-admin-preview .narocz-card.has-badge,
.narocz-admin-preview .narocz-card.is-featured.has-badge {
  padding-top: 46px !important;
}


/* v1.3.5 no-shift badge fix: every card reserves the same top space, so typing/removing the badge does not move content */
.narocz-card,
.narocz-card.is-featured,
.narocz-card.has-badge,
.narocz-card.is-featured.has-badge,
.narocz-card:has(.narocz-card__badge) {
  padding-top: 62px !important;
}
.narocz-card__badge,
.narocz-card.is-featured .narocz-card__badge {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 30 !important;
  margin: 0 !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}
.narocz-card__top,
.narocz-card.is-featured .narocz-card__top {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.narocz-card__top span,
.narocz-card.is-featured .narocz-card__top span {
  margin-top: 0 !important;
}
.narocz-admin-preview .narocz-card,
.narocz-admin-preview .narocz-card.is-featured,
.narocz-admin-preview .narocz-card.has-badge,
.narocz-admin-preview .narocz-card.is-featured.has-badge,
.narocz-admin-preview .narocz-card:has(.narocz-card__badge) {
  padding-top: 46px !important;
}


/* v1.3.6 hover scale fix: every pricing card grows on hover, not only the featured one */
.narocz-card:hover,
.narocz-card.is-featured:hover {
  transform: translateY(-14px) scale(1.035) !important;
}

@media (max-width: 980px) {
  .narocz-card:hover,
  .narocz-card.is-featured:hover {
    transform: translateY(-8px) scale(1.015) !important;
  }
}