Initial AI-generated site

This commit is contained in:
2026-10-11 13:43:05 +00:00
parent 4211e44dd5
commit 03e7fc0f33
8 changed files with 3354 additions and 0 deletions
+218
View File
@@ -0,0 +1,218 @@
<!doctype html>
<html lang="he" dir="rtl">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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>
</ul>
</nav>
</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>
</div>
</section>
<section class="about-intro">
<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>
</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>
</div>
</div>
</div>
</div>
</section>
<section class="about-values">
<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>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>
+281
View File
@@ -0,0 +1,281 @@
<!doctype html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>לקוחות - עמוס רוזמרין | מהנדס אריזה</title>
<meta name="description" content="לקוחותיי: מאפיית ברמן, דגנית, חסלט, יבולי הכפר, אסיף ועוד מפעלי מזון מובילים בישראל.">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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">אודות</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 active">לקוחות</a></li>
<li><a href="contact.html" class="nav__link nav__link--cta">צור קשר</a></li>
</ul>
</nav>
</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>
<p class="page-hero__subtitle">גאה לעבוד עם מיטב יצרני המזון בישראל</p>
</div>
</div>
</section>
<section class="clients-full">
<div class="container">
<div class="clients-intro reveal">
<p>במשך למעלה מ-18 שנה אני מלווה מפעלי מזון, קוסמטיקה וחקלאות בישראל. הלקוחות שלי סומכים עליי לספק פתרונות אריזה אמינים, איכותיים ובמחירים תחרותיים.</p>
</div>
<div class="clients-cloud reveal">
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<rect x="20" y="20" width="60" height="20" rx="4" fill="var(--accent)" opacity="0.2"/>
</svg>
</div>
<span class="client-block__name">מאפיית ברמן</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<circle cx="50" cy="30" r="15" fill="var(--gold)" opacity="0.2"/>
</svg>
</div>
<span class="client-block__name">דגנית</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<path d="M30 40 L50 20 L70 40" stroke="var(--accent)" stroke-width="3" fill="none"/>
</svg>
</div>
<span class="client-block__name">חסלט</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<circle cx="40" cy="30" r="10" fill="var(--gold)" opacity="0.3"/>
<circle cx="60" cy="30" r="10" fill="var(--accent)" opacity="0.3"/>
</svg>
</div>
<span class="client-block__name">יבולי הכפר</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<rect x="25" y="15" width="50" height="30" rx="6" fill="var(--accent)" opacity="0.2"/>
</svg>
</div>
<span class="client-block__name">אסיף</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<ellipse cx="50" cy="30" rx="25" ry="15" fill="var(--gold)" opacity="0.2"/>
</svg>
</div>
<span class="client-block__name">חטיפי העמק</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<path d="M30 30 Q50 10 70 30 Q50 50 30 30" fill="var(--accent)" opacity="0.2"/>
</svg>
</div>
<span class="client-block__name">פרג</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<rect x="20" y="25" width="15" height="15" rx="2" fill="var(--gold)" opacity="0.3"/>
<rect x="40" y="25" width="15" height="15" rx="2" fill="var(--accent)" opacity="0.3"/>
<rect x="60" y="25" width="15" height="15" rx="2" fill="var(--gold)" opacity="0.3"/>
</svg>
</div>
<span class="client-block__name">שיבולים</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<circle cx="50" cy="30" r="18" fill="none" stroke="var(--accent)" stroke-width="2"/>
<circle cx="50" cy="30" r="8" fill="var(--gold)" opacity="0.4"/>
</svg>
</div>
<span class="client-block__name">מאיר בייגל</span>
</div>
<div class="client-block">
<div class="client-block__logo">
<svg viewBox="0 0 100 60" aria-hidden="true">
<rect width="100" height="60" rx="8" fill="var(--bg-darker)"/>
<path d="M25 35 L40 25 L55 35 L70 25 L85 35" stroke="var(--accent)" stroke-width="2" fill="none"/>
</svg>
</div>
<span class="client-block__name">גילרו</span>
</div>
</div>
</div>
</section>
<section class="industries">
<div class="container">
<div class="section-header reveal">
<span class="section-label">תעשיות</span>
<h2 class="section-title">הענפים שאני משרת</h2>
</div>
<div class="industries-grid">
<div class="industry-card reveal">
<div class="industry-card__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<rect x="12" y="16" width="40" height="36" rx="6" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M12 28h40" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<h3 class="industry-card__title">מזון</h3>
<p class="industry-card__text">מאפיות, חטיפים, ממתקים, קפה, תה, מזון קפוא</p>
</div>
<div class="industry-card reveal">
<div class="industry-card__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<ellipse cx="32" cy="42" rx="18" ry="12" fill="none" stroke="var(--accent)" stroke-width="2"/>
<rect x="24" y="18" width="16" height="26" rx="4" fill="none" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<h3 class="industry-card__title">קוסמטיקה</h3>
<p class="industry-card__text">מוצרי טיפוח, סבונים, קרמים</p>
</div>
<div class="industry-card reveal">
<div class="industry-card__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<circle cx="32" cy="36" r="16" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M32 20 Q36 12 40 20" stroke="var(--gold)" stroke-width="2" fill="none"/>
<circle cx="32" cy="36" r="6" fill="var(--gold)" opacity="0.3"/>
</svg>
</div>
<h3 class="industry-card__title">חקלאות</h3>
<p class="industry-card__text">פירות, ירקות, תוצרת טרייה</p>
</div>
<div class="industry-card reveal">
<div class="industry-card__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<path d="M16 48 L16 24 L32 16 L48 24 L48 48" fill="none" stroke="var(--accent)" stroke-width="2"/>
<rect x="26" y="32" width="12" height="16" fill="var(--gold)" opacity="0.3"/>
</svg>
</div>
<h3 class="industry-card__title">חומרי ניקוי</h3>
<p class="industry-card__text">מגבונים, חומרי ניקוי, מוצרי כביסה</p>
</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>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>
+219
View File
@@ -0,0 +1,219 @@
<!doctype html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>צור קשר - עמוס רוזמרין | מהנדס אריזה</title>
<meta name="description" content="צרו קשר עם עמוס רוזמרין - מהנדס אריזה. טלפון: 054-818-1092, אימייל: amos.rosemarin@gmail.com">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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">אודות</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 active">צור קשר</a></li>
</ul>
</nav>
</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>
<p class="page-hero__subtitle">מוזמנים לפנות בכל שאלה או בקשה</p>
</div>
</div>
</section>
<section class="contact-section">
<div class="container">
<div class="contact-grid">
<div class="contact-info reveal">
<h2 class="contact-info__title">פרטי התקשרות</h2>
<div class="contact-info__items">
<div class="contact-item">
<div class="contact-item__icon">
<svg 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>
</div>
<div class="contact-item__content">
<span class="contact-item__label">טלפון</span>
<a href="tel:054-818-1092" class="contact-item__value">054-818-1092</a>
</div>
</div>
<div class="contact-item">
<div class="contact-item__icon">
<svg 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>
</div>
<div class="contact-item__content">
<span class="contact-item__label">אימייל</span>
<a href="mailto:amos.rosemarin@gmail.com" class="contact-item__value">amos.rosemarin@gmail.com</a>
</div>
</div>
<div class="contact-item">
<div class="contact-item__icon">
<svg 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>
</div>
<div class="contact-item__content">
<span class="contact-item__label">כתובת</span>
<span class="contact-item__value">זרחין 13, רעננה</span>
</div>
</div>
</div>
<div class="contact-map reveal">
<svg viewBox="0 0 400 250" aria-label="מפה - זרחין 13, רעננה">
<defs>
<pattern id="map-grid" width="20" height="20" patternUnits="userSpaceOnUse">
<path d="M 20 0 L 0 0 0 20" fill="none" stroke="rgba(14,165,233,0.1)" stroke-width="0.5"/>
</pattern>
</defs>
<rect width="400" height="250" fill="var(--bg-darker)" rx="12"/>
<rect width="400" height="250" fill="url(#map-grid)"/>
<path d="M0 100 L400 100" stroke="rgba(14,165,233,0.2)" stroke-width="8"/>
<path d="M0 150 L400 150" stroke="rgba(14,165,233,0.15)" stroke-width="6"/>
<path d="M150 0 L150 250" stroke="rgba(14,165,233,0.2)" stroke-width="8"/>
<path d="M250 0 L250 250" stroke="rgba(14,165,233,0.15)" stroke-width="6"/>
<circle cx="200" cy="125" r="30" fill="var(--accent)" opacity="0.2"/>
<circle cx="200" cy="125" r="15" fill="var(--accent)" opacity="0.4"/>
<path d="M200 105 a15 15 0 0 1 0 30 a15 15 0 0 1 0 -30 M200 125 L200 145" fill="var(--gold)" stroke="var(--gold)" stroke-width="3"/>
<circle cx="200" cy="115" r="5" fill="var(--bg-dark)"/>
<rect x="140" y="160" width="120" height="30" rx="4" fill="var(--bg-dark)"/>
<text x="200" y="180" text-anchor="middle" fill="var(--text)" font-size="12">זרחין 13, רעננה</text>
</svg>
</div>
</div>
<form class="contact-form reveal reveal--delay" action="#" method="POST" novalidate>
<h2 class="contact-form__title">שלחו הודעה</h2>
<div aria-live="polite" aria-atomic="true" class="form-status" id="form-status"></div>
<div class="form-group">
<label for="name" class="form-label">שם מלא <span class="required">*</span></label>
<input type="text" id="name" name="name" class="form-input" required autocomplete="name" aria-describedby="name-error">
<span class="form-error" id="name-error"></span>
</div>
<div class="form-group">
<label for="company" class="form-label">חברה</label>
<input type="text" id="company" name="company" class="form-input" autocomplete="organization">
</div>
<div class="form-group">
<label for="email" class="form-label">אימייל <span class="required">*</span></label>
<input type="email" id="email" name="email" class="form-input" required autocomplete="email" aria-describedby="email-error">
<span class="form-error" id="email-error"></span>
</div>
<div class="form-group">
<label for="phone" class="form-label">טלפון</label>
<input type="tel" id="phone" name="phone" class="form-input" autocomplete="tel">
</div>
<div class="form-group form-group--full">
<label for="subject" class="form-label">נושא</label>
<select id="subject" name="subject" class="form-input form-select">
<option value="">בחרו נושא...</option>
<option value="quote">בקשת הצעת מחיר</option>
<option value="info">מידע על מוצרים</option>
<option value="support">תמיכה טכנית</option>
<option value="other">אחר</option>
</select>
</div>
<div class="form-group form-group--full">
<label for="message" class="form-label">הודעה <span class="required">*</span></label>
<textarea id="message" name="message" class="form-input form-textarea" rows="5" required aria-describedby="message-error"></textarea>
<span class="form-error" id="message-error"></span>
</div>
<button type="submit" class="btn btn--primary btn--large form-submit">שלח הודעה</button>
</form>
</div>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>
+341
View File
@@ -0,0 +1,341 @@
<!doctype html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>עמוס רוזמרין - מהנדס אריזה | פתרונות אריזה גמישה לתעשייה</title>
<meta name="description" content="עמוס רוזמרין - מהנדס ייצור עצמאי מאז 2006, מתמחה בייבוא, פיתוח והתאמה של פתרונות אריזה גמישה וקופסאות קרטון לתעשייה הישראלית.">
<meta property="og:title" content="עמוס רוזמרין - מהנדס אריזה">
<meta property="og:description" content="פתרונות אריזה גמישה לתעשייה הישראלית - ניסיון של מעל 18 שנה">
<meta property="og:type" content="website">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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 active">בית</a></li>
<li><a href="about.html" class="nav__link">אודות</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>
</ul>
</nav>
</div>
</header>
<main id="main-content">
<section class="hero">
<div class="hero__bg">
<svg class="hero__pattern" viewBox="0 0 800 600" preserveAspectRatio="xMidYMid slice" aria-hidden="true">
<defs>
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#1a1a2e"/>
<stop offset="100%" style="stop-color:#16213e"/>
</linearGradient>
<pattern id="grid" width="60" height="60" patternUnits="userSpaceOnUse">
<path d="M 60 0 L 0 0 0 60" fill="none" stroke="rgba(14,165,233,0.08)" stroke-width="1"/>
</pattern>
</defs>
<rect fill="url(#grad1)" width="800" height="600"/>
<rect fill="url(#grid)" width="800" height="600"/>
<circle cx="650" cy="150" r="200" fill="rgba(14,165,233,0.05)"/>
<circle cx="100" cy="450" r="150" fill="rgba(212,175,55,0.04)"/>
<g class="hero__boxes" opacity="0.6">
<rect x="500" y="200" width="120" height="80" rx="4" fill="none" stroke="var(--accent)" stroke-width="2"/>
<rect x="540" y="180" width="100" height="70" rx="4" fill="none" stroke="var(--gold)" stroke-width="1.5"/>
<rect x="480" y="240" width="80" height="60" rx="4" fill="none" stroke="var(--accent)" stroke-width="1"/>
<path d="M500 200 L520 180 M620 200 L640 180 M620 280 L640 250 M500 280 L480 300" stroke="var(--accent)" stroke-width="1" opacity="0.5"/>
</g>
</svg>
</div>
<div class="container hero__content">
<div class="hero__text reveal">
<span class="hero__label">מהנדס אריזה עצמאי מאז 2006</span>
<h1 class="hero__title">פתרונות אריזה גמישה<br>לתעשייה הישראלית</h1>
<p class="hero__subtitle">ידע טכני מעמיק, ניסיון של מעל 18 שנה ושיתוף פעולה ישיר עם יצרנים מובילים — הכל מתכנס לפתרון אריזה מדויק עבורכם.</p>
<div class="hero__actions">
<a href="contact.html" class="btn btn--primary">דברו איתי</a>
<a href="products.html" class="btn btn--outline">לכל המוצרים</a>
</div>
</div>
<div class="hero__visual reveal reveal--delay">
<div class="hero__card">
<svg viewBox="0 0 280 320" aria-label="איור אריזה תעשייתית">
<defs>
<linearGradient id="pouch" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#0ea5e9"/>
<stop offset="100%" style="stop-color:#0284c7"/>
</linearGradient>
</defs>
<rect x="40" y="40" width="200" height="260" rx="12" fill="url(#pouch)" opacity="0.9"/>
<rect x="60" y="60" width="160" height="180" rx="8" fill="rgba(255,255,255,0.1)"/>
<rect x="80" y="80" width="120" height="20" rx="4" fill="rgba(255,255,255,0.3)"/>
<rect x="80" y="110" width="80" height="12" rx="3" fill="rgba(255,255,255,0.2)"/>
<rect x="80" y="130" width="100" height="12" rx="3" fill="rgba(255,255,255,0.2)"/>
<circle cx="140" cy="190" r="35" fill="rgba(255,255,255,0.15)" stroke="rgba(255,255,255,0.3)" stroke-width="2"/>
<path d="M125 190 L135 200 L155 180" stroke="#fff" stroke-width="3" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
<rect x="60" y="260" width="160" height="25" rx="4" fill="var(--gold)" opacity="0.8"/>
</svg>
</div>
</div>
</div>
<div class="hero__scroll" aria-hidden="true">
<span>גלול למטה</span>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M12 5v14M5 12l7 7 7-7"/>
</svg>
</div>
</section>
<section class="features">
<div class="container">
<div class="section-header reveal">
<span class="section-label">למה לעבוד איתי</span>
<h2 class="section-title">יתרונות ייחודיים</h2>
</div>
<div class="features__grid">
<article class="feature-card feature-card--highlight reveal">
<div class="feature-card__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<circle cx="24" cy="24" r="20" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M24 14v10l7 7" stroke="var(--gold)" stroke-width="2.5" stroke-linecap="round"/>
</svg>
</div>
<h3 class="feature-card__title">ניסיון של 18+ שנה</h3>
<p class="feature-card__text">מאז 2006 אני מלווה מפעלים ישראליים בפיתוח פתרונות אריזה מותאמים אישית. הניסיון הזה מאפשר לי לזהות בעיות מראש ולחסוך לכם זמן וכסף.</p>
</article>
<article class="feature-card reveal">
<div class="feature-card__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<rect x="8" y="14" width="32" height="24" rx="3" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M8 20h32M16 28h8M16 32h16" stroke="var(--gold)" stroke-width="2" stroke-linecap="round"/>
</svg>
</div>
<h3 class="feature-card__title">עבודה ישירה עם יצרנים</h3>
<p class="feature-card__text">שיתוף פעולה הדוק עם יצרנים טורקיים מובילים למחירים תחרותיים.</p>
</article>
<article class="feature-card reveal">
<div class="feature-card__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<path d="M24 6L6 18v18l18 6 18-6V18L24 6z" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M24 24v18M6 18l18 6 18-6" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<h3 class="feature-card__title">שיחול עד 9 שכבות</h3>
<p class="feature-card__text">טכנולוגיה מתקדמת עם חסם גבוה על בסיס PA ו-EVOH.</p>
</article>
<article class="feature-card reveal">
<div class="feature-card__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<circle cx="24" cy="24" r="18" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M24 12a12 12 0 0 1 0 24" fill="none" stroke="var(--gold)" stroke-width="2.5"/>
<circle cx="24" cy="24" r="4" fill="var(--gold)"/>
</svg>
</div>
<h3 class="feature-card__title">גלופות HD NX</h3>
<p class="feature-card__text">ייצור גלופות עצמי ללא שפכים, ידידותי לסביבה ובאיכות גבוהה.</p>
</article>
</div>
</div>
</section>
<section class="products-preview">
<div class="container">
<div class="section-header reveal">
<span class="section-label">מה אני מציע</span>
<h2 class="section-title">תחומי התמחות</h2>
</div>
<div class="products-grid">
<a href="products.html#food" class="product-card reveal">
<div class="product-card__visual">
<svg viewBox="0 0 120 120" aria-hidden="true">
<rect x="20" y="30" width="80" height="70" rx="8" fill="var(--accent)" opacity="0.2"/>
<rect x="30" y="40" width="60" height="50" rx="4" fill="var(--accent)" opacity="0.4"/>
<circle cx="60" cy="65" r="15" fill="var(--gold)" opacity="0.6"/>
</svg>
</div>
<h3 class="product-card__title">אריזות מזון</h3>
<p class="product-card__text">חטיפים, לחמים, מאפים, קפה, ממתקים ועוד</p>
<span class="product-card__arrow" aria-hidden="true">←</span>
</a>
<a href="products.html#hygiene" class="product-card reveal">
<div class="product-card__visual">
<svg viewBox="0 0 120 120" aria-hidden="true">
<ellipse cx="60" cy="70" rx="35" ry="25" fill="var(--accent)" opacity="0.2"/>
<rect x="45" y="35" width="30" height="50" rx="6" fill="var(--accent)" opacity="0.4"/>
<circle cx="60" cy="50" r="8" fill="var(--gold)" opacity="0.6"/>
</svg>
</div>
<h3 class="product-card__title">היגיינה וניקוי</h3>
<p class="product-card__text">אריזות לחומרי ניקוי ומוצרי היגיינה</p>
<span class="product-card__arrow" aria-hidden="true">←</span>
</a>
<a href="products.html#pouches" class="product-card reveal">
<div class="product-card__visual">
<svg viewBox="0 0 120 120" aria-hidden="true">
<path d="M35 90 L35 40 Q35 30 45 30 L75 30 Q85 30 85 40 L85 90 Q85 95 60 95 Q35 95 35 90" fill="var(--accent)" opacity="0.3"/>
<path d="M40 85 L40 45 Q40 38 48 38 L72 38 Q80 38 80 45 L80 85" fill="var(--accent)" opacity="0.2" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<h3 class="product-card__title">שקיות מוכנות</h3>
<p class="product-card__text">Stand-up pouches, Doypack ועוד</p>
<span class="product-card__arrow" aria-hidden="true">←</span>
</a>
<a href="products.html#produce" class="product-card reveal">
<div class="product-card__visual">
<svg viewBox="0 0 120 120" aria-hidden="true">
<circle cx="45" cy="70" r="20" fill="var(--gold)" opacity="0.3"/>
<circle cx="70" cy="55" r="18" fill="var(--accent)" opacity="0.3"/>
<circle cx="75" cy="80" r="15" fill="var(--gold)" opacity="0.4"/>
<path d="M60 35 Q65 25 70 35" stroke="var(--accent)" stroke-width="2" fill="none"/>
</svg>
</div>
<h3 class="product-card__title">פירות וירקות</h3>
<p class="product-card__text">אריזות לתוצרת חקלאית טרייה</p>
<span class="product-card__arrow" aria-hidden="true">←</span>
</a>
</div>
<div class="products-preview__cta reveal">
<a href="products.html" class="btn btn--outline">צפה בכל המוצרים</a>
</div>
</div>
</section>
<section class="stats">
<div class="container">
<div class="stats__grid">
<div class="stat reveal">
<span class="stat__number">18+</span>
<span class="stat__label">שנות ניסיון</span>
</div>
<div class="stat reveal">
<span class="stat__number">9</span>
<span class="stat__label">שכבות שיחול</span>
</div>
<div class="stat reveal">
<span class="stat__number">10</span>
<span class="stat__label">צבעי הדפסה</span>
</div>
<div class="stat reveal">
<span class="stat__number">10+</span>
<span class="stat__label">לקוחות קבועים</span>
</div>
</div>
</div>
</section>
<section class="clients-preview">
<div class="container">
<div class="section-header reveal">
<span class="section-label">סומכים עליי</span>
<h2 class="section-title">לקוחות נבחרים</h2>
</div>
<div class="clients-logos reveal">
<div class="client-logo">מאפיית ברמן</div>
<div class="client-logo">דגנית</div>
<div class="client-logo">חסלט</div>
<div class="client-logo">יבולי הכפר</div>
<div class="client-logo">אסיף</div>
<div class="client-logo">חטיפי העמק</div>
<div class="client-logo">פרג</div>
<div class="client-logo">שיבולים</div>
<div class="client-logo">מאיר בייגל</div>
<div class="client-logo">גילרו</div>
</div>
<div class="clients-preview__cta reveal">
<a href="clients.html" class="btn btn--outline">לכל הלקוחות</a>
</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>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>
+264
View File
@@ -0,0 +1,264 @@
<!doctype html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>מוצרים - עמוס רוזמרין | מהנדס אריזה</title>
<meta name="description" content="מגוון פתרונות אריזה גמישה: אריזות מזון, היגיינה, שקיות מוכנות, אריזות לפירות וירקות וקופסאות קרטון.">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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">אודות</a></li>
<li><a href="products.html" class="nav__link active">מוצרים</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>
</ul>
</nav>
</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>
<p class="page-hero__subtitle">פתרונות אריזה גמישה מותאמים אישית לכל תעשייה</p>
</div>
</div>
</section>
<section class="products-full" id="food">
<div class="container">
<article class="product-section reveal">
<div class="product-section__header">
<div class="product-section__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<rect x="12" y="16" width="40" height="36" rx="6" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M12 28h40" stroke="var(--accent)" stroke-width="2"/>
<circle cx="32" cy="40" r="8" fill="var(--gold)" opacity="0.4"/>
</svg>
</div>
<div class="product-section__title-wrap">
<h2 class="product-section__title">אריזות מזון</h2>
<p class="product-section__subtitle">פתרונות אריזה למגוון רחב של מוצרי מזון</p>
</div>
</div>
<div class="product-section__content">
<div class="product-tags">
<span class="product-tag">חטיפים ואגוזים</span>
<span class="product-tag">קטניות ופסטה</span>
<span class="product-tag">לחם ומאפים</span>
<span class="product-tag">קפה ותה</span>
<span class="product-tag">ופלים ושוקולד</span>
<span class="product-tag">ממתקים</span>
<span class="product-tag">קמח וסוכר</span>
<span class="product-tag">חטיפי אנרגיה</span>
<span class="product-tag">מזון קפוא</span>
<span class="product-tag">שלגונים</span>
<span class="product-tag">בשר</span>
<span class="product-tag">גבינה ומוצרי חלב</span>
</div>
<p class="product-section__description">אני מציע אריזות גמישות באיכות גבוהה למגוון רחב של מוצרי מזון. האריזות מיוצרות עם שיחול רב-שכבתי המספק חסם מיטבי לשמירה על טריות ואיכות המוצר.</p>
</div>
</article>
<article class="product-section reveal" id="hygiene">
<div class="product-section__header">
<div class="product-section__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<ellipse cx="32" cy="42" rx="18" ry="12" fill="none" stroke="var(--accent)" stroke-width="2"/>
<rect x="24" y="18" width="16" height="26" rx="4" fill="none" stroke="var(--accent)" stroke-width="2"/>
<circle cx="32" cy="28" r="4" fill="var(--gold)" opacity="0.6"/>
</svg>
</div>
<div class="product-section__title-wrap">
<h2 class="product-section__title">היגיינה וחומרי ניקוי</h2>
<p class="product-section__subtitle">אריזות עמידות למוצרי היגיינה וניקוי</p>
</div>
</div>
<div class="product-section__content">
<div class="product-tags">
<span class="product-tag">מגבונים</span>
<span class="product-tag">חומרי ניקוי</span>
<span class="product-tag">סבונים</span>
<span class="product-tag">מוצרי כביסה</span>
<span class="product-tag">מוצרי אמבט</span>
</div>
<p class="product-section__description">אריזות מיוחדות העמידות בפני חומרים כימיים ולחות, מותאמות לדרישות המיוחדות של תעשיית ההיגיינה וחומרי הניקוי.</p>
</div>
</article>
<article class="product-section reveal" id="pouches">
<div class="product-section__header">
<div class="product-section__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<path d="M18 52 L18 20 Q18 12 26 12 L38 12 Q46 12 46 20 L46 52 Q46 56 32 56 Q18 56 18 52" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M22 48 L22 24 Q22 18 28 18 L36 18 Q42 18 42 24 L42 48" fill="var(--gold)" opacity="0.2"/>
<rect x="26" y="22" width="12" height="4" rx="1" fill="var(--gold)" opacity="0.6"/>
</svg>
</div>
<div class="product-section__title-wrap">
<h2 class="product-section__title">שקיות מוכנות</h2>
<p class="product-section__subtitle">Stand-up pouches ו-Doypack</p>
</div>
</div>
<div class="product-section__content">
<div class="product-tags">
<span class="product-tag">Stand-up Pouches</span>
<span class="product-tag">Doypack</span>
<span class="product-tag">שקיות עם זיפר</span>
<span class="product-tag">שקיות עם פיה</span>
<span class="product-tag">שקיות שטוחות</span>
</div>
<p class="product-section__description">שקיות מוכנות בעיצובים מגוונים, כולל שקיות עומדות (Stand-up), שקיות Doypack, שקיות עם סגירת זיפר ושקיות עם פיה למוצרים נוזליים.</p>
</div>
</article>
<article class="product-section reveal" id="produce">
<div class="product-section__header">
<div class="product-section__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<circle cx="24" cy="38" r="12" fill="var(--gold)" opacity="0.3"/>
<circle cx="40" cy="32" r="10" fill="var(--accent)" opacity="0.3"/>
<circle cx="38" cy="44" r="8" fill="var(--gold)" opacity="0.4"/>
<path d="M32 18 Q36 10 40 18" stroke="var(--accent)" stroke-width="2" fill="none"/>
</svg>
</div>
<div class="product-section__title-wrap">
<h2 class="product-section__title">פירות וירקות</h2>
<p class="product-section__subtitle">אריזות לתוצרת חקלאית טרייה</p>
</div>
</div>
<div class="product-section__content">
<div class="product-tags">
<span class="product-tag">פירות טריים</span>
<span class="product-tag">ירקות</span>
<span class="product-tag">סלטים</span>
<span class="product-tag">עשבי תיבול</span>
<span class="product-tag">תוצרת אורגנית</span>
</div>
<p class="product-section__description">אריזות מיוחדות לתוצרת חקלאית טרייה, עם אוורור מבוקר לשמירה על טריות ומראה המוצר. מתאימות גם לתוצרת אורגנית.</p>
</div>
</article>
<article class="product-section reveal" id="carton">
<div class="product-section__header">
<div class="product-section__icon">
<svg viewBox="0 0 64 64" aria-hidden="true">
<path d="M12 22 L32 12 L52 22 L52 46 L32 56 L12 46 Z" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M32 32 L32 56 M12 22 L32 32 L52 22" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<div class="product-section__title-wrap">
<h2 class="product-section__title">קופסאות קרטון</h2>
<p class="product-section__subtitle">קופסאות קרטון מעוצבות</p>
</div>
</div>
<div class="product-section__content">
<div class="product-tags">
<span class="product-tag">קופסאות מזון</span>
<span class="product-tag">אריזות מתנה</span>
<span class="product-tag">קופסאות תצוגה</span>
<span class="product-tag">אריזות משלוח</span>
</div>
<p class="product-section__description">קופסאות קרטון מעוצבות באיכות גבוהה, מותאמות למגוון שימושים — ממזון ועד מוצרי מתנה. הדפסה באיכות גבוהה עם אפשרויות גימור מגוונות.</p>
</div>
</article>
</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>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>
+225
View File
@@ -0,0 +1,225 @@
// ========================================
// HEADER SCROLL EFFECT
// ========================================
const header = document.getElementById('header');
let lastScroll = 0;
function handleScroll() {
const currentScroll = window.pageYOffset;
if (currentScroll > 50) {
header.classList.add('header--scrolled');
} else {
header.classList.remove('header--scrolled');
}
lastScroll = currentScroll;
}
window.addEventListener('scroll', handleScroll, { passive: true });
// ========================================
// MOBILE NAVIGATION
// ========================================
const navToggle = document.querySelector('.nav-toggle');
const nav = document.getElementById('nav');
if (navToggle && nav) {
navToggle.addEventListener('click', () => {
const isExpanded = navToggle.getAttribute('aria-expanded') === 'true';
navToggle.setAttribute('aria-expanded', !isExpanded);
nav.classList.toggle('active');
});
// Close nav when clicking on a link
nav.querySelectorAll('.nav__link').forEach(link => {
link.addEventListener('click', () => {
navToggle.setAttribute('aria-expanded', 'false');
nav.classList.remove('active');
});
});
// Close nav on escape key
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && nav.classList.contains('active')) {
navToggle.setAttribute('aria-expanded', 'false');
nav.classList.remove('active');
navToggle.focus();
}
});
}
// ========================================
// REVEAL ON SCROLL
// ========================================
function initReveal() {
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
if (prefersReducedMotion) {
document.querySelectorAll('.reveal').forEach(el => {
el.classList.add('visible');
});
return;
}
const revealElements = document.querySelectorAll('.reveal');
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
observer.unobserve(entry.target);
}
});
}, {
threshold: 0.1,
rootMargin: '0px 0px -50px 0px'
});
reveal Elements.forEach(el => observer.observe(el));
}
// ========================================
// SMOOTH SCROLL FOR ANCHOR LINKS
// ========================================
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
const href = this.getAttribute('href');
if (href === '#') return;
const target = document.querySelector(href);
if (target) {
e.preventDefault();
const headerHeight = header.offsetHeight;
const targetPosition = target.getBoundingClientRect().top + window.pageYOffset - headerHeight;
window.scrollTo({
top: targetPosition,
behavior: 'smooth'
});
}
});
});
// ========================================
// FORM HANDLING
// ========================================
const contactForm = document.querySelector('.contact-form');
if (contactForm) {
const formStatus = document.getElementById('form-status');
function showError(field, message) {
const errorEl = document.getElementById(field.id + '-error');
field.classList.add('error');
field.setAttribute('aria-invalid', 'true');
if (errorEl) {
errorEl.textContent = message;
}
}
function clearError(field) {
const errorEl = document.getElementById(field.id + '-error');
field.classList.remove('error');
field.removeAttribute('aria-invalid');
if (errorEl) {
errorEl.textContent = '';
}
}
contactForm.addEventListener('submit', function(e) {
e.preventDefault();
let isValid = true;
let firstError = null;
// Validate name
const nameField = this.querySelector('#name');
if (!nameField.value.trim()) {
showError(nameField, 'נא להזין שם מלא');
isValid = false;
if (!firstError) firstError = nameField;
} else {
clearError(nameField);
}
// Validate email
const emailField = this.querySelector('#email');
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailField.value.trim()) {
showError(emailField, 'נא להזין כתובת אימייל');
isValid = false;
if (!firstError) firstError = emailField;
} else if (!emailPattern.test(emailField.value)) {
showError(emailField, 'נא להזין כתובת אימייל תקינה');
isValid = false;
if (!firstError) firstError = emailField;
} else {
clearError(emailField);
}
// Validate message
const messageField = this.querySelector('#message');
if (!messageField.value.trim()) {
showError(messageField, 'נא להזין הודעה');
isValid = false;
if (!firstError) firstError = messageField;
} else {
clearError(messageField);
}
if (!isValid) {
if (firstError) {
firstError.focus();
}
if (formStatus) {
formStatus.textContent = 'יש לתקן את השגיאות בטופס';
}
return;
}
const submitBtn = this.querySelector('.form-submit');
const originalText = submitBtn.textContent;
submitBtn.textContent = 'שולח...';
submitBtn.disabled = true;
// Simulate form submission
setTimeout(() => {
submitBtn.textContent = 'נשלח בהצלחה!';
submitBtn.style.background = 'var(--gold)';
if (formStatus) {
formStatus.textContent = 'ההודעה נשלחה בהצלחה. אחזור אליכם בהקדם.';
}
setTimeout(() => {
submitBtn.textContent = originalText;
submitBtn.style.background = '';
submitBtn.disabled = false;
contactForm.reset();
if (formStatus) {
formStatus.textContent = '';
}
}, 3000);
}, 1500);
});
// Clear error on input
contactForm.querySelectorAll('.form-input').forEach(input => {
input.addEventListener('input', function() {
clearError(this);
});
});
}
// ========================================
// INIT
// ========================================
document.addEventListener('DOMContentLoaded', () => {
initReveal();
});
// Also run on load for images etc
window.addEventListener('load', () => {
setTimeout(initReveal, 100);
});
+1519
View File
File diff suppressed because it is too large Load Diff
+287
View File
@@ -0,0 +1,287 @@
<!doctype html>
<html lang="he" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>טכנולוגיה - עמוס רוזמרין | מהנדס אריזה</title>
<meta name="description" content="טכנולוגיות מתקדמות: שיחול עד 9 שכבות, הדפסה עד 10 צבעים, גלופות HD NX ידידותיות לסביבה.">
<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>">
<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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<header class="header" id="header">
<div class="container header__inner">
<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>
<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">אודות</a></li>
<li><a href="products.html" class="nav__link">מוצרים</a></li>
<li><a href="technology.html" class="nav__link active">טכנולוגיה</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>
</ul>
</nav>
</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>
<p class="page-hero__subtitle">הטכנולוגיות המתקדמות ביותר לייצור אריזות גמישות</p>
</div>
</div>
</section>
<section class="tech-section">
<div class="container">
<article class="tech-card tech-card--large reveal">
<div class="tech-card__visual">
<svg viewBox="0 0 400 300" aria-hidden="true">
<defs>
<linearGradient id="layer-grad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:var(--accent)"/>
<stop offset="100%" style="stop-color:var(--gold)"/>
</linearGradient>
</defs>
<rect width="400" height="300" fill="var(--bg-darker)" rx="12"/>
<!-- 9 layers visualization -->
<g transform="translate(100, 30)">
<rect x="0" y="0" width="200" height="20" rx="2" fill="var(--accent)" opacity="0.9"/>
<text x="210" y="15" fill="var(--text-muted)" font-size="10">PE</text>
<rect x="0" y="25" width="200" height="20" rx="2" fill="var(--accent)" opacity="0.8"/>
<text x="210" y="40" fill="var(--text-muted)" font-size="10">PP</text>
<rect x="0" y="50" width="200" height="20" rx="2" fill="var(--gold)" opacity="0.7"/>
<text x="210" y="65" fill="var(--text-muted)" font-size="10">PET</text>
<rect x="0" y="75" width="200" height="20" rx="2" fill="var(--accent)" opacity="0.6"/>
<text x="210" y="90" fill="var(--text-muted)" font-size="10">PA</text>
<rect x="0" y="100" width="200" height="20" rx="2" fill="var(--gold)" opacity="0.8"/>
<text x="210" y="115" fill="var(--text-muted)" font-size="10">AL</text>
<rect x="0" y="125" width="200" height="20" rx="2" fill="var(--accent)" opacity="0.7"/>
<text x="210" y="140" fill="var(--text-muted)" font-size="10">EVOH</text>
<rect x="0" y="150" width="200" height="20" rx="2" fill="var(--gold)" opacity="0.6"/>
<text x="210" y="165" fill="var(--text-muted)" font-size="10">PLA</text>
<rect x="0" y="175" width="200" height="20" rx="2" fill="var(--accent)" opacity="0.5"/>
<text x="210" y="190" fill="var(--text-muted)" font-size="10">שכבה 8</text>
<rect x="0" y="200" width="200" height="20" rx="2" fill="var(--gold)" opacity="0.5"/>
<text x="210" y="215" fill="var(--text-muted)" font-size="10">שכבה 9</text>
</g>
</svg>
</div>
<div class="tech-card__content">
<span class="tech-card__label">טכנולוגיית ייצור</span>
<h2 class="tech-card__title">שיחול עד 9 שכבות</h2>
<p class="tech-card__text">אני מספק יריעות בנות עד 9 שכבות בעלות חסם גבוה על בסיס PA ו-EVOH. טכנולוגיה זו מאפשרת לי לספק פתרונות אריזה מלאים למוצרים הדורשים אריזה עם חסם גבוה, כגון בשר ומוצרי חלב.</p>
<div class="tech-card__specs">
<div class="spec">
<span class="spec__label">חומרים</span>
<span class="spec__value">PE, PP, PET, PA, AL, EVOH, PLA</span>
</div>
<div class="spec">
<span class="spec__label">יתרון מרכזי</span>
<span class="spec__value">חסם גבוה לשמירת טריות</span>
</div>
</div>
</div>
</article>
<div class="tech-grid">
<article class="tech-card reveal">
<div class="tech-card__icon">
<svg viewBox="0 0 80 80" aria-hidden="true">
<circle cx="40" cy="40" r="30" fill="none" stroke="var(--accent)" stroke-width="2"/>
<circle cx="40" cy="40" r="20" fill="none" stroke="var(--gold)" stroke-width="2"/>
<circle cx="40" cy="40" r="10" fill="var(--accent)" opacity="0.3"/>
<g fill="var(--gold)">
<circle cx="40" cy="15" r="4"/>
<circle cx="61" cy="27" r="4"/>
<circle cx="61" cy="53" r="4"/>
<circle cx="40" cy="65" r="4"/>
<circle cx="19" cy="53" r="4"/>
<circle cx="19" cy="27" r="4"/>
</g>
</svg>
</div>
<span class="tech-card__label">הדפסה</span>
<h3 class="tech-card__title">עד 10 צבעים</h3>
<p class="tech-card__text">טכנולוגיית דפוס חדישה עם ארבע מכונות המסוגלות להדפיס עד 10 צבעים. רוחב יריעה של 1,450 מ"מ ופסיעה של 1,250 מ"מ מאפשרים גמישות מרבית בעיצוב.</p>
<div class="tech-card__specs">
<div class="spec">
<span class="spec__label">רוחב יריעה</span>
<span class="spec__value">1,450 מ"מ</span>
</div>
<div class="spec">
<span class="spec__label">פסיעה</span>
<span class="spec__value">1,250 מ"מ</span>
</div>
</div>
</article>
<article class="tech-card reveal">
<div class="tech-card__icon">
<svg viewBox="0 0 80 80" aria-hidden="true">
<rect x="15" y="20" width="50" height="40" rx="4" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M25 35 h30 M25 45 h20 M25 55 h25" stroke="var(--gold)" stroke-width="2" stroke-linecap="round"/>
<circle cx="55" cy="30" r="8" fill="var(--gold)" opacity="0.3"/>
<path d="M52 30 l3 3 l6-6" stroke="var(--gold)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<span class="tech-card__label">גלופות</span>
<h3 class="tech-card__title">HD NX</h3>
<p class="tech-card__text">ייצור גלופות עצמי בטכנולוגיית HD NX המשדרגת את איכות הדפסת הפלקסו לרמה גבוהה במיוחד. הטכנולוגיה ידידותית לסביבה — ללא שפכים.</p>
<div class="tech-card__specs">
<div class="spec">
<span class="spec__label">יתרון</span>
<span class="spec__value">איכות הדפסה גבוהה</span>
</div>
<div class="spec">
<span class="spec__label">סביבה</span>
<span class="spec__value">ללא שפכים</span>
</div>
</div>
</article>
</div>
</div>
</section>
<section class="tech-benefits">
<div class="container">
<div class="section-header reveal">
<span class="section-label">למה זה חשוב</span>
<h2 class="section-title">יתרונות טכנולוגיים</h2>
</div>
<div class="benefits-grid">
<div class="benefit reveal">
<div class="benefit__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<path d="M24 4 L4 14 v16 l20 10 l20-10 V14 Z" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M4 14 l20 10 l20-10 M24 24 v20" stroke="var(--gold)" stroke-width="2"/>
</svg>
</div>
<h3 class="benefit__title">חסם מיטבי</h3>
<p class="benefit__text">שכבות מרובות מספקות הגנה מקסימלית מפני חמצן, לחות ואור</p>
</div>
<div class="benefit reveal">
<div class="benefit__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<circle cx="24" cy="24" r="18" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M16 24 l6 6 l10-12" stroke="var(--gold)" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</div>
<h3 class="benefit__title">איכות גבוהה</h3>
<p class="benefit__text">הדפסה באיכות גבוהה במיוחד בזכות טכנולוגיית HD NX</p>
</div>
<div class="benefit reveal">
<div class="benefit__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<circle cx="24" cy="24" r="18" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M24 12 a12 12 0 0 1 0 24" fill="none" stroke="var(--gold)" stroke-width="3" stroke-linecap="round"/>
<circle cx="24" cy="24" r="4" fill="var(--gold)"/>
</svg>
</div>
<h3 class="benefit__title">ידידות לסביבה</h3>
<p class="benefit__text">תהליך ייצור ללא שפכים, מפחית את ההשפעה הסביבתית</p>
</div>
<div class="benefit reveal">
<div class="benefit__icon">
<svg viewBox="0 0 48 48" aria-hidden="true">
<rect x="8" y="8" width="32" height="32" rx="4" fill="none" stroke="var(--accent)" stroke-width="2"/>
<path d="M16 24 h16 M24 16 v16" stroke="var(--gold)" stroke-width="3" stroke-linecap="round"/>
</svg>
</div>
<h3 class="benefit__title">גמישות</h3>
<p class="benefit__text">יכולת להתאים כל פתרון לדרישות הספציפיות של הלקוח</p>
</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>
</div>
</section>
</main>
<footer class="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>
<nav class="footer__nav" aria-label="ניווט משני">
<h4 class="footer__heading">ניווט</h4>
<ul class="footer__links">
<li><a href="index.html">בית</a></li>
<li><a href="about.html">אודות</a></li>
<li><a href="products.html">מוצרים</a></li>
<li><a href="technology.html">טכנולוגיה</a></li>
<li><a href="clients.html">לקוחות</a></li>
<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>
</div>
<div class="footer__bottom">
<p>© 2025 עמוס רוזמרין — מהנדס אריזה. כל הזכויות שמורות.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>