AI update: בדוק בדף הבית ובכל דף רלוונטי באתר את קוד הפופ-אפ/הכפתור לרכישה. אם קיימים יותר מעותק אחד של סקריפט תשלום (למשל שילוב של

style.css

@@ -184,6 +184,11 @@ button {
   outline-offset: 2px;
 }
 
+.nav-pricing-link {
+  color: var(--color-accent) !important;
+  font-weight: 500 !important;
+}
+
 .nav-cta {
   display: none;
   padding: var(--space-xs) var(--space-md);
@@ -885,6 +890,160 @@ button {
   }
 }
 
+/* Pricing */
+.pricing {
+  padding: var(--space-2xl) 0;
+  background: linear-gradient(180deg, var(--color-cream) 0%, var(--color-bg) 100%);
+}
+
+.pricing-grid {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: var(--space-lg);
+  max-width: 800px;
+  margin-inline: auto;
+}
+
+@media (min-width: 600px) {
+  .pricing-grid {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+
+.pricing-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  padding: var(--space-lg);
+  background: var(--color-white);
+  border-radius: var(--radius-lg);
+  box-shadow: 0 4px 24px rgba(61, 50, 41, 0.08);
+  transition: transform var(--transition-fast), box-shadow var(--transition-fast);
+}
+
+.pricing-card:hover {
+  transform: translateY(-5px);
+  box-shadow: 0 12px 40px rgba(61, 50, 41, 0.12);
+}
+
+.pricing-card-featured {
+  border: 2px solid var(--color-accent);
+  box-shadow: 0 8px 32px rgba(139, 105, 20, 0.15);
+}
+
+.pricing-card-featured:hover {
+  box-shadow: 0 16px 48px rgba(139, 105, 20, 0.2);
+}
+
+.pricing-badge {
+  position: absolute;
+  top: -12px;
+  inset-inline-start: 50%;
+  transform: translateX(50%);
+  padding: var(--space-xs) var(--space-md);
+  font-size: 0.8rem;
+  font-weight: 600;
+  color: var(--color-white);
+  background: var(--color-accent);
+  border-radius: var(--radius-full);
+  white-space: nowrap;
+}
+
+.pricing-header {
+  text-align: center;
+  margin-block-end: var(--space-md);
+}
+
+.pricing-header h3 {
+  font-size: 1.5rem;
+  font-weight: 600;
+  color: var(--color-text);
+  margin-block-end: var(--space-xs);
+}
+
+.pricing-desc {
+  font-size: 0.95rem;
+  color: var(--color-text-light);
+}
+
+.pricing-price {
+  text-align: center;
+  margin-block-end: var(--space-lg);
+  padding-block: var(--space-md);
+  border-block: 1px solid rgba(201, 168, 124, 0.2);
+}
+
+.price-amount {
+  font-size: 2.5rem;
+  font-weight: 600;
+  color: var(--color-accent);
+}
+
+.pricing-features {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-sm);
+  margin-block-end: var(--space-lg);
+  flex-grow: 1;
+}
+
+.pricing-features li {
+  display: flex;
+  align-items: center;
+  gap: var(--space-sm);
+  font-size: 0.95rem;
+  color: var(--color-text);
+}
+
+.pricing-features svg {
+  width: 18px;
+  height: 18px;
+  color: var(--color-sage);
+  flex-shrink: 0;
+}
+
+.pricing-cta {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--space-sm);
+  padding: var(--space-md);
+  font-size: 1rem;
+  font-weight: 500;
+  color: var(--color-text);
+  background: var(--color-cream);
+  border-radius: var(--radius-md);
+  transition: background var(--transition-fast), color var(--transition-fast);
+}
+
+.pricing-cta:hover {
+  background: rgba(201, 168, 124, 0.3);
+}
+
+.pricing-cta:focus-visible {
+  outline: 3px solid var(--color-accent);
+  outline-offset: 2px;
+}
+
+.pricing-cta svg {
+  width: 18px;
+  height: 18px;
+  transition: transform var(--transition-fast);
+}
+
+.pricing-cta:hover svg {
+  transform: translateX(-4px);
+}
+
+.pricing-cta-featured {
+  color: var(--color-white);
+  background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-warm) 100%);
+}
+
+.pricing-cta-featured:hover {
+  background: linear-gradient(135deg, var(--color-accent-light) 0%, var(--color-warm) 100%);
+}
+
 /* Contact */
 .contact {
   padding: var(--space-2xl) 0;
@@ -1084,4 +1243,4 @@ button:focus-visible {
 /* Body scroll lock when popup is open */
 body.popup-open {
   overflow: hidden;
-}
+}