Initial AI-generated site

about.html

@@ -3,9 +3,9 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>אודות - עמוס רוזמרין | מהנדס אריזה</title>
-  <meta name="description" content="הכירו את עמוס רוזמרין - מהנדס ייצור עצמאי מאז 2006, מתמחה בפתרונות אריזה גמישה לתעשייה הישראלית.">
-  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect fill='%231a1a2e' width='100' height='100' rx='12'/><path d='M25 70V30h10l15 25V30h10v40H50L35 45v25H25z' fill='%230ea5e9'/><path d='M65 30h10v40H65V30z' fill='%23d4af37'/></svg>">
+  <title>אודות | עמוס רוזמרין - מהנדס אריזה</title>
+  <meta name="description" content="הכירו את עמוס רוזמרין - מהנדס ייצור עצמאי מאז 2006, מומחה לפתרונות אריזה גמישה לתעשייה הישראלית.">
+  <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect fill='%231a1a2e' width='100' height='100' rx='12'/><path d='M25 70V30h10l15 25 15-25h10v40h-10V45l-15 25-15-25v25z' fill='%230ea5e9'/></svg>">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600&display=swap" rel="stylesheet">
@@ -13,166 +13,118 @@
 </head>
 <body>
   <a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
-
-  <header class="header" id="header">
-    <div class="container header__inner">
+  
+  <header class="site-header">
+    <div class="header-container">
       <a href="index.html" class="logo">
-        <svg class="logo__icon" viewBox="0 0 40 40" aria-hidden="true">
-          <rect fill="var(--accent)" width="40" height="40" rx="6"/>
-          <path d="M10 28V12h4l6 10V12h4v16h-4l-6-10v10H10z" fill="var(--bg-dark)"/>
+        <svg class="logo-icon" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+          <rect x="4" y="8" width="40" height="32" rx="4" stroke="currentColor" stroke-width="2" fill="none"/>
+          <path d="M4 16h40M12 16v24M36 16v24M12 28h24M12 36h24" stroke="currentColor" stroke-width="1.5" opacity="0.6"/>
+          <circle cx="24" cy="22" r="3" fill="currentColor"/>
         </svg>
-        <span class="logo__text">עמוס רוזמרין</span>
+        <span class="logo-text">עמוס רוזמרין</span>
       </a>
-      <button class="nav-toggle" aria-label="תפריט" aria-expanded="false">
-        <span></span><span></span><span></span>
-      </button>
-      <nav class="nav" id="nav">
-        <ul class="nav__list">
-          <li><a href="index.html" class="nav__link">בית</a></li>
-          <li><a href="about.html" class="nav__link active">אודות</a></li>
-          <li><a href="products.html" class="nav__link">מוצרים</a></li>
-          <li><a href="technology.html" class="nav__link">טכנולוגיה</a></li>
-          <li><a href="clients.html" class="nav__link">לקוחות</a></li>
-          <li><a href="contact.html" class="nav__link nav__link--cta">צור קשר</a></li>
+      <nav class="main-nav" role="navigation" aria-label="ניווט ראשי">
+        <ul class="nav-list">
+          <li><a href="index.html" class="nav-link">בית</a></li>
+          <li><a href="about.html" class="nav-link active" aria-current="page">אודות</a></li>
+          <li><a href="products.html" class="nav-link">מוצרים</a></li>
+          <li><a href="technology.html" class="nav-link">טכנולוגיה</a></li>
+          <li><a href="clients.html" class="nav-link">לקוחות</a></li>
+          <li><a href="contact.html" class="nav-link nav-cta">דברו איתי</a></li>
         </ul>
       </nav>
+      <button class="mobile-menu-toggle" aria-label="תפריט" aria-expanded="false">
+        <span></span>
+        <span></span>
+        <span></span>
+      </button>
     </div>
   </header>
 
   <main id="main-content">
     <section class="page-hero">
       <div class="container">
-        <div class="page-hero__content reveal">
-          <span class="section-label">הסיפור שלי</span>
-          <h1 class="page-hero__title">אודות</h1>
-        </div>
+        <span class="section-tag reveal-fade">אודות</span>
+        <h1 class="page-title reveal-fade">הסיפור שלי</h1>
+        <p class="page-subtitle reveal-fade">למעלה מ-18 שנות ניסיון בפיתוח פתרונות אריזה לתעשייה הישראלית</p>
       </div>
     </section>
 
-    <section class="about-intro">
+    <section class="about-content">
       <div class="container">
-        <div class="about-intro__grid">
-          <div class="about-intro__content reveal">
-            <h2 class="about-intro__title">עמוס רוזמרין</h2>
-            <p class="about-intro__subtitle">מהנדס ייצור עצמאי מאז 2006</p>
-            <div class="about-intro__text">
-              <p>אני עמוס רוזמרין, מהנדס ייצור עצמאי עם מעל 18 שנות ניסיון בתחום האריזות הגמישות. מאז 2006 אני מתמחה בייבוא, פיתוח, התאמה ושיפור פתרונות אריזה גמישה וקופסאות קרטון לתעשייה הישראלית.</p>
-              <p>המשימה שלי היא להבטיח אריזה אמינה, יעילה וחסכונית — המשמרת איכות מוצר, עומדת בתקנים ומותאמת לקו הייצור של כל לקוח.</p>
-              <p>אני פועל בשקיפות מלאה, דיוק ושירות אישי, עם דגש על איכות תהליך, צמצום תקלות וקיצור זמני הגעה לשוק.</p>
+        <div class="about-grid">
+          <div class="about-story">
+            <div class="story-block reveal-fade">
+              <h2>מהנדס ייצור עצמאי מאז 2006</h2>
+              <p>שמי עמוס רוזמרין, ואני מהנדס ייצור עצמאי המתמחה בפיתוח, התאמה ושיפור פתרונות אריזה גמישה וקופסאות קרטון לתעשיות המזון והחקלאות, ההיגיינה, הקוסמטיקה וחומרי הניקוי.</p>
+            </div>
+            <div class="story-block reveal-fade">
+              <h2>הגישה שלי</h2>
+              <p>המשימה שלי היא להבטיח אריזה אמינה, יעילה וחסכונית — המשמרת את איכות המוצר, עומדת בתקנים ומותאמת לקו הייצור שלכם.</p>
+              <p>אני פועל בשקיפות, דיוק ושירות אישי, עם דגש על איכות תהליך, צמצום תקלות וקיצור זמני הגעה לשוק.</p>
+            </div>
+            <div class="story-block reveal-fade">
+              <h2>שיתוף פעולה בינלאומי</h2>
+              <p>במהלך השנים פיתחתי שיתופי פעולה הדוקים עם יצרנים טורקיים מובילים, המאפשרים לי להציע מחירים תחרותיים ואיכות גבוהה ללקוחותיי בישראל.</p>
             </div>
           </div>
-          <div class="about-intro__visual reveal reveal--delay">
-            <div class="about-portrait">
-              <svg viewBox="0 0 300 350" aria-label="איור דיוקן">
-                <defs>
-                  <linearGradient id="portrait-bg" x1="0%" y1="0%" x2="100%" y2="100%">
-                    <stop offset="0%" style="stop-color:#16213e"/>
-                    <stop offset="100%" style="stop-color:#1a1a2e"/>
-                  </linearGradient>
-                </defs>
-                <rect width="300" height="350" rx="16" fill="url(#portrait-bg)"/>
-                <circle cx="150" cy="140" r="60" fill="var(--accent)" opacity="0.2"/>
-                <circle cx="150" cy="130" r="45" fill="var(--accent)" opacity="0.3"/>
-                <rect x="100" y="190" width="100" height="120" rx="8" fill="var(--accent)" opacity="0.2"/>
-                <rect x="110" y="200" width="80" height="100" rx="6" fill="var(--gold)" opacity="0.15"/>
-                <text x="150" y="330" text-anchor="middle" fill="var(--gold)" font-size="14" font-weight="500">מהנדס אריזה</text>
-              </svg>
+          <aside class="about-values">
+            <div class="value-card reveal-slide">
+              <div class="value-icon" aria-hidden="true">
+                <svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="2">
+                  <path d="M24 4l6 12 13 2-9 9 2 13-12-6-12 6 2-13-9-9 13-2z"/>
+                </svg>
+              </div>
+              <h3>איכות</h3>
+              <p>מחויבות לאיכות בכל שלב — מהייעוץ הראשוני ועד המשלוח הסופי</p>
             </div>
-          </div>
+            <div class="value-card reveal-slide">
+              <div class="value-icon" aria-hidden="true">
+                <svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="2">
+                  <circle cx="24" cy="24" r="20"/>
+                  <path d="M24 14v10l7 7"/>
+                </svg>
+              </div>
+              <h3>אמינות</h3>
+              <p>עמידה בלוחות זמנים ובהתחייבויות — יום אחר יום, שנה אחר שנה</p>
+            </div>
+            <div class="value-card reveal-slide">
+              <div class="value-icon" aria-hidden="true">
+                <svg viewBox="0 0 48 48" fill="none" stroke="currentColor" stroke-width="2">
+                  <path d="M8 24h32M24 8v32"/>
+                  <circle cx="24" cy="24" r="8"/>
+                </svg>
+              </div>
+              <h3>שירות אישי</h3>
+              <p>ליווי צמוד והתאמה מדויקת לצרכים הייחודיים של כל לקוח</p>
+            </div>
+          </aside>
         </div>
       </div>
     </section>
 
-    <section class="about-values">
+    <section class="cta-section" aria-labelledby="about-cta-heading">
       <div class="container">
-        <div class="section-header reveal">
-          <span class="section-label">העקרונות שלי</span>
-          <h2 class="section-title">גישה מקצועית</h2>
-        </div>
-        <div class="values-grid">
-          <article class="value-card reveal">
-            <div class="value-card__number">01</div>
-            <h3 class="value-card__title">שקיפות מלאה</h3>
-            <p class="value-card__text">אני מאמין בתקשורת פתוחה וישירה עם כל לקוח. אתם תמיד יודעים בדיוק מה קורה עם ההזמנה שלכם.</p>
-          </article>
-          <article class="value-card reveal">
-            <div class="value-card__number">02</div>
-            <h3 class="value-card__title">דיוק בפרטים</h3>
-            <p class="value-card__text">כל אריזה עוברת בדיקה קפדנית. אני לא מתפשר על איכות ומוודא שכל מוצר עומד בסטנדרטים הגבוהים ביותר.</p>
-          </article>
-          <article class="value-card reveal">
-            <div class="value-card__number">03</div>
-            <h3 class="value-card__title">שירות אישי</h3>
-            <p class="value-card__text">אני מלווה כל פרויקט באופן אישי מההתחלה ועד הסוף. יש לכם שאלה? אני זמין עבורכם.</p>
-          </article>
-          <article class="value-card reveal">
-            <div class="value-card__number">04</div>
-            <h3 class="value-card__title">חדשנות מתמדת</h3>
-            <p class="value-card__text">אני מתעדכן כל הזמן בטכנולוגיות החדשות ביותר כדי להציע לכם את הפתרונות המתקדמים ביותר בשוק.</p>
-          </article>
-        </div>
-      </div>
-    </section>
-
-    <section class="about-partnership">
-      <div class="container">
-        <div class="partnership-content reveal">
-          <div class="partnership-text">
-            <span class="section-label">שיתוף פעולה בינלאומי</span>
-            <h2 class="section-title">עבודה ישירה עם יצרנים טורקיים</h2>
-            <p>אני שומר על שיתוף פעולה הדוק עם יצרנים טורקיים מובילים, המשרתים את מיטב יצרני המזון הישראליים. קשרים אלו מאפשרים לי להציע:</p>
-            <ul class="partnership-list">
-              <li>מחירים תחרותיים בזכות עבודה ישירה</li>
-              <li>גישה לטכנולוגיות מתקדמות</li>
-              <li>זמני אספקה קצרים</li>
-              <li>גמישות בהתאמה אישית</li>
-            </ul>
-          </div>
-          <div class="partnership-visual">
-            <svg viewBox="0 0 400 300" aria-hidden="true">
-              <rect width="400" height="300" fill="var(--bg-dark)"/>
-              <circle cx="120" cy="150" r="60" fill="none" stroke="var(--accent)" stroke-width="2"/>
-              <circle cx="280" cy="150" r="60" fill="none" stroke="var(--gold)" stroke-width="2"/>
-              <path d="M180 150 L220 150" stroke="var(--accent)" stroke-width="3" stroke-dasharray="8,4"/>
-              <text x="120" y="155" text-anchor="middle" fill="var(--text)" font-size="12">ישראל</text>
-              <text x="280" y="155" text-anchor="middle" fill="var(--text)" font-size="12">טורקיה</text>
-              <circle cx="200" cy="150" r="15" fill="var(--accent)" opacity="0.3"/>
-              <path d="M195 150 L205 150 M200 145 L200 155" stroke="var(--gold)" stroke-width="2"/>
-            </svg>
-          </div>
-        </div>
-      </div>
-    </section>
-
-    <section class="cta-section">
-      <div class="container">
-        <div class="cta-box reveal">
-          <div class="cta-box__content">
-            <h2 class="cta-box__title">בואו נדבר על הפרויקט שלכם</h2>
-            <p class="cta-box__text">אשמח לשמוע על הצרכים שלכם ולהציע פתרון מותאם</p>
-          </div>
-          <a href="contact.html" class="btn btn--primary btn--large">צור קשר</a>
+        <div class="cta-content reveal-fade">
+          <h2 id="about-cta-heading" class="cta-title">בואו נדבר על הפרויקט שלכם</h2>
+          <p class="cta-desc">אשמח לשמוע על הצרכים שלכם ולהציע פתרון אריזה מותאם</p>
+          <a href="contact.html" class="btn btn-primary btn-large">בואו נדבר</a>
         </div>
       </div>
     </section>
   </main>
 
-  <footer class="footer">
+  <footer class="site-footer">
     <div class="container">
-      <div class="footer__grid">
-        <div class="footer__brand">
-          <a href="index.html" class="logo logo--footer">
-            <svg class="logo__icon" viewBox="0 0 40 40" aria-hidden="true">
-              <rect fill="var(--accent)" width="40" height="40" rx="6"/>
-              <path d="M10 28V12h4l6 10V12h4v16h-4l-6-10v10H10z" fill="var(--bg-dark)"/>
-            </svg>
-            <span class="logo__text">עמוס רוזמרין</span>
-          </a>
-          <p class="footer__tagline">מהנדס אריזה — פתרונות אריזה גמישה לתעשייה הישראלית</p>
+      <div class="footer-grid">
+        <div class="footer-brand">
+          <a href="index.html" class="footer-logo">עמוס רוזמרין</a>
+          <p class="footer-tagline">מהנדס אריזה<br>פתרונות אריזה גמישה לתעשייה</p>
         </div>
-        <nav class="footer__nav" aria-label="ניווט משני">
-          <h4 class="footer__heading">ניווט</h4>
-          <ul class="footer__links">
+        <nav class="footer-nav" aria-label="ניווט תחתון">
+          <h4>ניווט</h4>
+          <ul>
             <li><a href="index.html">בית</a></li>
             <li><a href="about.html">אודות</a></li>
             <li><a href="products.html">מוצרים</a></li>
@@ -181,34 +133,17 @@
             <li><a href="contact.html">צור קשר</a></li>
           </ul>
         </nav>
-        <div class="footer__contact">
-          <h4 class="footer__heading">צור קשר</h4>
-          <ul class="footer__links">
-            <li>
-              <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                <path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z"/>
-              </svg>
-              <a href="tel:054-818-1092">054-818-1092</a>
-            </li>
-            <li>
-              <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                <path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/>
-                <polyline points="22,6 12,13 2,6"/>
-              </svg>
-              <a href="mailto:amos.rosemarin@gmail.com">amos.rosemarin@gmail.com</a>
-            </li>
-            <li>
-              <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
-                <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/>
-                <circle cx="12" cy="10" r="3"/>
-              </svg>
-              <span>זרחין 13, רעננה</span>
-            </li>
-          </ul>
+        <div class="footer-contact">
+          <h4>צור קשר</h4>
+          <address>
+            <p>זרחין 13, רעננה</p>
+            <p><a href="tel:054-818-1092">054-818-1092</a></p>
+            <p><a href="mailto:amos.rosemarin@gmail.com">amos.rosemarin@gmail.com</a></p>
+          </address>
         </div>
       </div>
-      <div class="footer__bottom">
-        <p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
+      <div class="footer-bottom">
+        <p>עמוס רוזמרין - מהנדס אריזה © 2025. כל הזכויות שמורות.</p>
       </div>
     </div>
   </footer>