diff --git a/index.html b/index.html new file mode 100644 index 0000000..cd49a41 --- /dev/null +++ b/index.html @@ -0,0 +1,251 @@ + + + + + + הצעת מחיר עבורך | ניצן בן זאב + + + + + + + + + + + +
+
+ + ינואר 2025 +
+
+ +
+
+
+ הצעת מחיר אישית +

שלום ניצן,

+

+ אחרי העבודה המשותפת שלנו על האתר, ואחרי שהכרתי את העשייה המיוחדת שלך בתחום הייעוץ הארגוני והנחיית קבוצות — הנה הצעה מותאמת אישית שתעזור לך להמשיך לצמוח ולהגיע לעוד מנהלים ומנהלות שמחפשים בדיוק את מה שיש לך להציע. +

+
+
+ +
+
+ חלק ראשון +

חבילת תחזוקת אתר חודשית

+
+
+

+ שמירה על האתר שלך מהיר, מאובטח ופועל כמו שעון — כדי שתוכלי להתמקד בעבודה שלך עם הלקוחות. +

+ +
+
+
+ +
+
+

קאשינג מתקדם

+

טעינה מהירה לכל עמוד באתר — המבקרים לא יחכו

+
+
+ +
+
+ +
+

אופטימיזציית תמונות

+

תמונות קלות שלא מאטות את האתר

+
+ +
+
+ +
+

בדיקת תוספים

+

עדכונים שוטפים ובדיקות אבטחה

+
+ +
+
+ +
+

גיבויים אוטומטיים

+

שקט נפשי עם גיבוי יומי

+
+
+ +
+
הערכת מחיר ראשונית
+
+ + 250–450 + לחודש +
+

* המחיר הסופי ייקבע בהתאם להיקף הצרכים המדויק שלך

+
+
+
+ +
+
+ חלק שני +

קידום אורגני עם SeoPush

+
+
+

+ בעולם שבו מנהלים מחפשים מידע לא רק בגוגל אלא גם ב-ChatGPT, Gemini ו-Perplexity — + חשוב להיות נוכחת בכל המקומות הנכונים. + כשמישהו שואל "מי יועצת ארגונית מומלצת לבתי ספר?" או "ליווי מנהלים בארגוני חינוך" — את צריכה להופיע. +

+ +
+ + קידום במנועי AI + גוגל +
+ +
+
+
+

סטארטר

+

מתאים ליועצת עצמאית

+
+
+ + 59 + /חודש +
+
+ 50 + קרדיטים +
+
    +
  • קידום בגוגל
  • +
  • נוכחות במנועי AI
  • +
  • דוחות חודשיים
  • +
+
+ + +
+
+
+ + + +
+
+

נשמע לך מתאים?

+

אשמח לשמוע ממך ולהתאים את ההצעה לצרכים שלך

+ + אני מאשרת את ההצעה + + +

לחיצה תפתח שיחת WhatsApp

+
+
+
+ + + + + + \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..6d0eafa --- /dev/null +++ b/script.js @@ -0,0 +1,68 @@ +(function() { + 'use strict'; + + // Check for reduced motion preference + const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches; + + // Reveal on scroll + function initReveal() { + const revealElements = document.querySelectorAll('[data-reveal]'); + + if (prefersReducedMotion) { + revealElements.forEach(el => el.classList.add('revealed')); + return; + } + + const observerOptions = { + root: null, + rootMargin: '0px 0px -80px 0px', + threshold: 0.1 + }; + + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('revealed'); + observer.unobserve(entry.target); + } + }); + }, observerOptions); + + revealElements.forEach((el, index) => { + el.style.transitionDelay = `${index * 0.1}s`; + observer.observe(el); + }); + } + + // Header background on scroll + function initHeaderScroll() { + const header = document.querySelector('.header'); + if (!header) return; + + let ticking = false; + + window.addEventListener('scroll', () => { + if (!ticking) { + window.requestAnimationFrame(() => { + if (window.scrollY > 100) { + header.style.background = 'rgba(248, 246, 241, 0.95)'; + header.style.backdropFilter = 'blur(10px)'; + header.style.webkitBackdropFilter = 'blur(10px)'; + } else { + header.style.background = 'linear-gradient(to bottom, var(--cream), transparent)'; + header.style.backdropFilter = 'none'; + header.style.webkitBackdropFilter = 'none'; + } + ticking = false; + }); + ticking = true; + } + }, { passive: true }); + } + + // Initialize everything when DOM is ready + document.addEventListener('DOMContentLoaded', () => { + initReveal(); + initHeaderScroll(); + }); +})(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..812614d --- /dev/null +++ b/style.css @@ -0,0 +1,728 @@ +:root { + --cream: #F8F6F1; + --cream-dark: #EDE9E0; + --sage: #7D9B8A; + --sage-light: #A8C5B5; + --sage-dark: #4A6B5A; + --sage-darker: #3D5A4A; + --beige: #D4C8B8; + --beige-light: #E8E0D4; + --text: #3D3D3D; + --text-light: #5a5a5a; + --white: #FFFFFF; + + --font-display: 'Secular One', sans-serif; + --font-body: 'Heebo', sans-serif; + + --space-xs: 0.5rem; + --space-sm: 1rem; + --space-md: 1.5rem; + --space-lg: 2.5rem; + --space-xl: 4rem; + --space-2xl: 6rem; + + --radius-sm: 8px; + --radius-md: 16px; + --radius-lg: 24px; + --radius-full: 9999px; + + --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} + +*, +*::before, +*::after { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +html { + font-size: 16px; + scroll-behavior: smooth; +} + +@media (prefers-reduced-motion: reduce) { + html { + scroll-behavior: auto; + } + + *, + *::before, + *::after { + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + transition-duration: 0.01ms !important; + } +} + +body { + font-family: var(--font-body); + font-weight: 400; + line-height: 1.7; + color: var(--text); + background-color: var(--cream); + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + overflow-x: hidden; +} + +/* Removed grain overlay - too noisy for a personal quote */ + +/* Typography */ +h1, h2, h3, h4 { + font-family: var(--font-display); + font-weight: 400; + line-height: 1.2; +} + +h1 { + font-size: clamp(2.5rem, 6vw, 4rem); + color: var(--sage-dark); +} + +h2 { + font-size: clamp(1.75rem, 4vw, 2.5rem); + color: var(--text); +} + +h3 { + font-size: clamp(1.25rem, 2.5vw, 1.5rem); + font-family: var(--font-body); + font-weight: 500; +} + +p { + font-size: 1.0625rem; + max-width: 65ch; +} + +strong { + font-weight: 600; + color: var(--sage-dark); +} + +/* Header */ +.header { + position: fixed; + inset-block-start: 0; + inset-inline: 0; + z-index: 100; + padding: var(--space-md) var(--space-lg); + background: linear-gradient(to bottom, var(--cream), transparent); +} + +.header-inner { + max-width: 1200px; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + width: 40px; + height: 40px; + color: var(--sage); +} + +.header-date { + font-size: 0.875rem; + color: var(--text-light); + letter-spacing: 0.05em; +} + +/* Hero Section */ +.hero { + min-height: 70vh; + display: flex; + align-items: center; + padding: var(--space-2xl) var(--space-lg); + padding-block-start: calc(var(--space-2xl) + 80px); +} + +.hero-content { + max-width: 700px; + margin: 0 auto; + text-align: center; +} + +.hero-tag { + display: inline-block; + padding: var(--space-xs) var(--space-md); + background: var(--sage-dark); + color: var(--white); + font-size: 0.875rem; + font-weight: 500; + border-radius: var(--radius-full); + margin-block-end: var(--space-lg); + letter-spacing: 0.02em; +} + +.hero h1 { + margin-block-end: var(--space-md); +} + +.hero-lead { + font-size: 1.25rem; + color: var(--text-light); + line-height: 1.8; +} + +/* Sections */ +.section { + padding: var(--space-2xl) var(--space-lg); + max-width: 1000px; + margin: 0 auto; +} + +.section-header { + margin-block-end: var(--space-xl); +} + +.section-number { + display: block; + font-family: var(--font-body); + font-size: 0.8125rem; + font-weight: 500; + color: var(--sage); + margin-block-end: var(--space-xs); + letter-spacing: 0.05em; +} + +.section-intro { + font-size: 1.125rem; + color: var(--text-light); + margin-block-end: var(--space-xl); + max-width: 600px; +} + +/* Features Grid - Breaking the equal-cards monotony */ +.features-grid { + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: auto auto; + gap: var(--space-md); + margin-block-end: var(--space-xl); +} + +.feature-card { + background: var(--white); + padding: var(--space-lg); + border-radius: var(--radius-md); + transition: transform var(--transition), box-shadow var(--transition); +} + +.feature-card--primary { + grid-column: 1 / -1; + background: var(--sage-darker); + color: var(--white); + display: grid; + grid-template-columns: auto 1fr; + gap: var(--space-md); + align-items: center; + padding: var(--space-xl); +} + +.feature-card--primary .feature-icon { + color: var(--beige-light); + width: 56px; + height: 56px; + margin-block-end: 0; +} + +.feature-card--primary .feature-text h3 { + margin-block-end: var(--space-xs); +} + +.feature-card--primary .feature-text p { + color: rgba(255, 255, 255, 0.9); + margin: 0; +} + +.feature-card:not(.feature-card--primary):hover { + transform: translateY(-4px); + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08); +} + +.feature-icon { + width: 48px; + height: 48px; + color: var(--sage); + margin-block-end: var(--space-md); +} + +.feature-card h3 { + margin-block-end: var(--space-xs); + font-weight: 500; +} + +.feature-card p { + font-size: 0.9375rem; + color: var(--text-light); + margin: 0; +} + +/* Price Estimate */ +.price-estimate { + background: var(--sage-darker); + padding: var(--space-xl); + border-radius: var(--radius-lg); + text-align: center; + color: var(--white); +} + +.estimate-label { + font-size: 0.9375rem; + margin-block-end: var(--space-sm); + color: rgba(255, 255, 255, 0.9); +} + +.estimate-range { + display: flex; + align-items: baseline; + justify-content: center; + gap: var(--space-xs); + margin-block-end: var(--space-sm); +} + +.estimate-range .currency { + font-size: 1.5rem; + font-weight: 500; +} + +.estimate-range .amount { + font-family: var(--font-display); + font-size: 3rem; +} + +.estimate-range .period { + font-size: 1rem; +} + +.estimate-note { + font-size: 0.875rem; + color: rgba(255, 255, 255, 0.9); +} + +/* Section Highlight */ +.section--highlight { + background: var(--white); + border-radius: var(--radius-lg); + margin: var(--space-xl) auto; + box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04); +} + +/* AI Badge */ +.ai-badge { + display: inline-flex; + align-items: center; + gap: var(--space-sm); + padding: var(--space-sm) var(--space-md); + background: var(--sage-darker); + color: var(--white); + border-radius: var(--radius-full); + margin-block-end: var(--space-xl); + font-size: 0.9375rem; + font-weight: 500; +} + +.ai-badge svg { + width: 24px; + height: 24px; + color: var(--beige-light); +} + +/* Pricing Table */ +.pricing-table { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: var(--space-lg); +} + +.plan-card { + background: var(--cream); + padding: var(--space-xl); + border-radius: var(--radius-lg); + position: relative; + transition: transform var(--transition); +} + +.plan-card:hover { + transform: translateY(-4px); +} + +.plan-card--featured { + background: var(--sage-darker); + color: var(--white); +} + +.plan-badge { + position: absolute; + inset-block-start: calc(-1 * var(--space-sm)); + inset-inline-end: var(--space-lg); + background: var(--beige); + color: var(--text); + padding: var(--space-xs) var(--space-md); + border-radius: var(--radius-full); + font-size: 0.8125rem; + font-weight: 500; +} + +.plan-header h3 { + font-family: var(--font-display); + font-size: 1.5rem; + margin-block-end: var(--space-xs); + font-weight: 400; +} + +.plan-header p { + font-size: 0.9375rem; + margin-block-end: var(--space-md); +} + +.plan-card:not(.plan-card--featured) .plan-header p { + color: var(--text-light); +} + +.plan-card--featured .plan-header p { + color: rgba(255, 255, 255, 0.9); +} + +.plan-price { + display: flex; + align-items: baseline; + gap: 4px; + margin-block-end: var(--space-md); +} + +.plan-price .currency { + font-size: 1.25rem; + font-weight: 500; +} + +.plan-price .amount { + font-family: var(--font-display); + font-size: 2.5rem; +} + +.plan-price .period { + font-size: 1rem; +} + +.plan-card--featured .plan-price .period { + color: rgba(255, 255, 255, 0.9); +} + +.plan-credits { + display: flex; + align-items: center; + gap: var(--space-xs); + padding: var(--space-sm) var(--space-md); + background: rgba(255, 255, 255, 0.15); + border-radius: var(--radius-sm); + margin-block-end: var(--space-lg); + width: fit-content; +} + +.plan-card:not(.plan-card--featured) .plan-credits { + background: var(--white); +} + +.credits-number { + font-family: var(--font-display); + font-size: 1.25rem; +} + +.credits-label { + font-size: 0.875rem; +} + +.plan-features { + list-style: none; +} + +.plan-features li { + padding: var(--space-xs) 0; + font-size: 0.9375rem; + position: relative; + padding-inline-start: var(--space-lg); +} + +.plan-features li::before { + content: "✓"; + position: absolute; + inset-inline-start: 0; + color: var(--sage); + font-weight: 600; +} + +.plan-card--featured .plan-features li::before { + color: var(--beige-light); +} + +/* Recommended Section */ +.section--recommended { + background: var(--beige-light); + border-radius: var(--radius-lg); + margin: var(--space-xl) auto; +} + +.combined-package { + display: grid; + grid-template-columns: 180px 1fr; + gap: var(--space-xl); + align-items: start; +} + +@media (max-width: 700px) { + .combined-package { + grid-template-columns: 1fr; + } + + .package-visual { + display: none; + } +} + +.package-visual { + position: relative; + height: 160px; +} + +.package-circle { + position: absolute; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 0.75rem; + font-weight: 500; +} + +.package-circle--outer { + width: 140px; + height: 140px; + border: 2px dashed var(--sage); + inset-block-start: 10px; + inset-inline-start: 20px; +} + +.package-circle--maintenance { + width: 70px; + height: 70px; + background: var(--sage-light); + border: 1.5px solid var(--sage); + color: var(--text); + inset-block-start: 20px; + inset-inline-start: 10px; +} + +.package-circle--seo { + width: 85px; + height: 85px; + background: var(--cream); + border: 1.5px solid var(--sage); + color: var(--text); + inset-block-start: 70px; + inset-inline-start: 75px; +} + +.package-details h3 { + font-family: var(--font-display); + font-size: 1.5rem; + margin-block-end: var(--space-md); + font-weight: 400; +} + +.package-details > p { + margin-block-end: var(--space-lg); +} + +.keywords-section, +.target-audience { + margin-block-end: var(--space-lg); +} + +.keywords-section h4, +.target-audience h4 { + font-size: 0.9375rem; + font-weight: 500; + margin-block-end: var(--space-sm); + color: var(--sage-dark); +} + +.keywords-list { + display: flex; + flex-wrap: wrap; + gap: var(--space-xs); +} + +.keyword { + display: inline-block; + padding: var(--space-xs) var(--space-md); + background: var(--sage-darker); + color: var(--white); + font-size: 0.875rem; + border-radius: var(--radius-full); +} + +.target-audience ul { + list-style: none; + display: flex; + flex-wrap: wrap; + gap: var(--space-sm); +} + +.target-audience li { + padding: var(--space-xs) var(--space-md); + background: var(--white); + border-radius: var(--radius-sm); + font-size: 0.9375rem; +} + +/* CTA Section */ +.cta-section { + background: var(--sage-darker); + padding: var(--space-2xl) var(--space-lg); + text-align: center; + margin-block-start: var(--space-2xl); +} + +.cta-content { + max-width: 600px; + margin: 0 auto; +} + +.cta-section h2 { + color: var(--white); + margin-block-end: var(--space-sm); +} + +.cta-section > .cta-content > p { + color: rgba(255, 255, 255, 0.9); + margin-block-end: var(--space-lg); + font-size: 1.125rem; +} + +.cta-button { + display: inline-flex; + align-items: center; + gap: var(--space-sm); + padding: var(--space-md) var(--space-xl); + background: var(--white); + color: var(--sage-darker); + text-decoration: none; + font-size: 1.125rem; + font-weight: 500; + border-radius: var(--radius-full); + transition: transform var(--transition), box-shadow var(--transition); +} + +.cta-button:hover, +.cta-button:focus { + transform: translateY(-2px) scale(1.02); + box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2); + outline: none; +} + +.cta-button:focus-visible { + outline: 3px solid var(--beige); + outline-offset: 4px; +} + +.cta-note { + margin-block-start: var(--space-md); + font-size: 0.875rem; + color: rgba(255, 255, 255, 0.9); +} + +/* Footer */ +.footer { + padding: var(--space-xl) var(--space-lg); + text-align: center; + background: var(--cream-dark); +} + +.footer-inner p { + font-size: 0.9375rem; + color: var(--text-light); + margin: 0 auto; +} + +.footer-year { + margin-block-start: var(--space-xs); + font-size: 0.8125rem; + opacity: 0.7; +} + +/* Reveal Animation */ +[data-reveal] { + opacity: 0; + transform: translateY(30px); + transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), + transform 0.8s cubic-bezier(0.4, 0, 0.2, 1); +} + +[data-reveal].revealed { + opacity: 1; + transform: translateY(0); +} + +/* Responsive */ +@media (max-width: 768px) { + :root { + --space-lg: 1.5rem; + --space-xl: 2.5rem; + --space-2xl: 4rem; + } + + .hero { + min-height: auto; + padding-block-start: calc(var(--space-2xl) + 60px); + padding-block-end: var(--space-xl); + } + + .features-grid { + grid-template-columns: 1fr; + } + + .feature-card--primary { + grid-template-columns: 1fr; + text-align: center; + } + + .feature-card--primary .feature-icon { + margin: 0 auto var(--space-md); + } + + .pricing-table { + grid-template-columns: 1fr; + } + + .plan-card--featured { + order: -1; + } + + .section--highlight, + .section--recommended { + border-radius: 0; + margin-inline: calc(-1 * var(--space-lg)); + padding-inline: var(--space-lg); + } +} + +@media (max-width: 480px) { + .estimate-range .amount { + font-size: 2.25rem; + } + + .plan-price .amount { + font-size: 2rem; + } + + .cta-button { + padding: var(--space-md) var(--space-lg); + font-size: 1rem; + } +} \ No newline at end of file