Files
site-1a835/technology.html
T
ccadmingit1 f3497f0671 AI update: שדרוג ויזואלי מקיף לאתר עמוס רוזמרין - מהנדס אריזה:
## 1. תמונות אמיתיות (הוסף מ-Unsplash/Pexels CDN):

### Hero Sectio
2026-10-11 16:52:56 +00:00

319 lines
14 KiB
HTML

<!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 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">
<link rel="stylesheet" href="style.css">
</head>
<body>
<a href="#main-content" class="skip-link">דלג לתוכן הראשי</a>
<div class="particles-container" aria-hidden="true">
<div class="particle"></div>
<div class="particle"></div>
<div class="particle"></div>
<div class="particle"></div>
</div>
<header class="site-header">
<div class="header-container">
<a href="index.html" class="logo">
<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>
</a>
<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">אודות</a></li>
<li><a href="products.html" class="nav-link">מוצרים</a></li>
<li><a href="technology.html" class="nav-link active" aria-current="page">טכנולוגיה</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">
<span class="section-tag reveal-fade">
<span class="tag-icon">◈</span>
טכנולוגיה
</span>
<h1 class="page-title reveal-fade gradient-text">טכנולוגיה מתקדמת</h1>
<p class="page-subtitle reveal-fade">חדשנות וטכנולוגיה מתקדמת לתוצאות מעולות</p>
</div>
</section>
<section class="tech-details" aria-labelledby="tech-details-heading">
<h2 id="tech-details-heading" class="visually-hidden">פרטי טכנולוגיה</h2>
<div class="container">
<div class="tech-feature reveal-fade">
<div class="tech-feature-visual">
<div class="tech-image-wrapper">
<img
src="https://images.unsplash.com/photo-1565793298595-6a879b1d9492?auto=format&fit=crop&w=600&q=80"
alt="טכנולוגיית שיחול מתקדמת"
loading="lazy"
class="tech-image"
>
<div class="tech-image-overlay"></div>
</div>
<div class="layers-visual">
<div class="layer-bar" style="--delay: 0.1s;"></div>
<div class="layer-bar" style="--delay: 0.2s;"></div>
<div class="layer-bar" style="--delay: 0.3s;"></div>
<div class="layer-bar" style="--delay: 0.4s;"></div>
<div class="layer-bar" style="--delay: 0.5s;"></div>
<div class="layer-bar" style="--delay: 0.6s;"></div>
<div class="layer-bar" style="--delay: 0.7s;"></div>
<div class="layer-bar" style="--delay: 0.8s;"></div>
<div class="layer-bar" style="--delay: 0.9s;"></div>
</div>
</div>
<div class="tech-feature-content">
<h3 class="gradient-text">שיחול עד 9 שכבות</h3>
<p>אנו מייצרים יריעות בנות 9 שכבות בעלות חסם גבוה על בסיס PA ו-EVOH. טכנולוגיה זו מאפשרת לנו לספק פתרונות אריזה מלאים למוצרים הדורשים חסם גבוה, כגון בשר ומוצרי חלב.</p>
<div class="materials-list">
<span class="material">PE</span>
<span class="material">PP</span>
<span class="material">PET</span>
<span class="material">PA</span>
<span class="material">AL</span>
<span class="material">EVOH</span>
<span class="material">PLA</span>
</div>
</div>
</div>
<div class="tech-feature reverse reveal-fade">
<div class="tech-feature-visual">
<div class="tech-image-wrapper">
<img
src="https://images.unsplash.com/photo-1558618666-fcd25c85cd64?auto=format&fit=crop&w=600&q=80"
alt="הדפסה צבעונית באיכות גבוהה"
loading="lazy"
class="tech-image"
>
<div class="tech-image-overlay"></div>
</div>
<div class="color-dots" aria-hidden="true">
<span class="color-dot" style="background: #FF6B6B;"></span>
<span class="color-dot" style="background: #4ECDC4;"></span>
<span class="color-dot" style="background: #45B7D1;"></span>
<span class="color-dot" style="background: #96CEB4;"></span>
<span class="color-dot" style="background: #FFEAA7;"></span>
<span class="color-dot" style="background: #DDA0DD;"></span>
<span class="color-dot" style="background: #98D8C8;"></span>
<span class="color-dot" style="background: #F7DC6F;"></span>
<span class="color-dot" style="background: #BB8FCE;"></span>
<span class="color-dot" style="background: #85C1E9;"></span>
</div>
</div>
<div class="tech-feature-content">
<h3 class="gradient-text">הדפסה עד 10 צבעים</h3>
<p>אנו מציעים טכנולוגיית דפוס חדישה עם ארבע מכונות המסוגלות להדפיס עד 10 צבעים באמצעות גלופות HD NX. איכות דפוס גבוהה במיוחד עם רוחב יריעה של 1,450 מ"מ ופסיעה של 1,250 מ"מ.</p>
<ul class="tech-specs">
<li><strong>רוחב יריעה:</strong> 1,450 מ"מ</li>
<li><strong>פסיעה:</strong> 1,250 מ"מ</li>
<li><strong>צבעים:</strong> עד 10</li>
</ul>
</div>
</div>
<div class="tech-feature reveal-fade">
<div class="tech-feature-visual">
<div class="tech-image-wrapper">
<img
src="https://images.unsplash.com/photo-1532996122724-e3c354a0b15b?auto=format&fit=crop&w=600&q=80"
alt="טכנולוגיה ירוקה וידידותית לסביבה"
loading="lazy"
class="tech-image"
>
<div class="tech-image-overlay"></div>
</div>
</div>
<div class="tech-feature-content">
<h3 class="gradient-text">גלופות HD NX</h3>
<p>אנו מספקים יתרונות ייחודיים ללקוחותינו בכך שיש בבעלותנו אמצעי ייצור גלופות. אנו עושים שימוש בטכנולוגיית HD NX המשדרגת את איכות הדפסת הפלקסו לרמה גבוהה במיוחד.</p>
<div class="eco-badge">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M12 2a10 10 0 100 20 10 10 0 000-20z"/>
<path d="M12 6v6l4 2"/>
</svg>
<span>ללא שפכים • ידידותי לסביבה</span>
</div>
</div>
</div>
</div>
</section>
<section class="advantages" aria-labelledby="advantages-heading">
<div class="container">
<header class="section-header reveal-fade">
<span class="section-tag">
<span class="tag-icon">◈</span>
יתרונות
</span>
<h2 id="advantages-heading" class="section-title gradient-text">למה לעבוד איתנו?</h2>
</header>
<div class="advantages-grid">
<div class="advantage-item reveal-slide glass-card">
<div class="advantage-number" aria-hidden="true">01</div>
<h3>מחירים תחרותיים</h3>
<p>עבודה ישירה עם יצרנים טורקיים מובילים מאפשרת לנו להציע מחירים תחרותיים במיוחד.</p>
</div>
<div class="advantage-item reveal-slide glass-card">
<div class="advantage-number" aria-hidden="true">02</div>
<h3>איכות גבוהה</h3>
<p>טכנולוגיות מתקדמות וחומרים איכותיים לתוצאות מעולות בכל פרויקט.</p>
</div>
<div class="advantage-item reveal-slide glass-card">
<div class="advantage-number" aria-hidden="true">03</div>
<h3>שירות אישי</h3>
<p>ליווי צמוד מהייעוץ הראשוני ועד האספקה הסופית.</p>
</div>
<div class="advantage-item reveal-slide glass-card">
<div class="advantage-number" aria-hidden="true">04</div>
<h3>ידידות לסביבה</h3>
<p>טכנולוגיות ירוקות ללא שפכים ועם צמצום השפעה סביבתית.</p>
</div>
</div>
</div>
</section>
<section class="cta-section" aria-labelledby="tech-cta-heading">
<div class="cta-bg" aria-hidden="true">
<div class="cta-gradient-orb cta-orb-1"></div>
<div class="cta-gradient-orb cta-orb-2"></div>
</div>
<div class="container">
<div class="cta-content reveal-fade">
<h2 id="tech-cta-heading" class="cta-title gradient-text">רוצים לשמוע עוד?</h2>
<p class="cta-desc">נשמח להסביר על הטכנולוגיות שלנו ולהתאים פתרון לצרכים שלכם</p>
<a href="contact.html" class="btn btn-primary btn-large btn-glow">בואו נדבר</a>
</div>
</div>
</section>
</main>
<footer class="site-footer">
<div class="footer-glow" aria-hidden="true"></div>
<div class="container">
<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>ניווט</h4>
<ul>
<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>צור קשר</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>
</div>
</footer>
<script src="script.js"></script>
<style>
.color-dots {
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
display: flex;
justify-content: center;
gap: 8px;
flex-wrap: wrap;
}
.color-dot {
width: 30px;
height: 30px;
border-radius: 50%;
box-shadow: 0 4px 15px rgba(0,0,0,0.3);
transition: transform 0.3s ease;
animation: colorPop 0.5s ease forwards;
opacity: 0;
transform: scale(0);
}
.color-dot:nth-child(1) { animation-delay: 0.1s; }
.color-dot:nth-child(2) { animation-delay: 0.15s; }
.color-dot:nth-child(3) { animation-delay: 0.2s; }
.color-dot:nth-child(4) { animation-delay: 0.25s; }
.color-dot:nth-child(5) { animation-delay: 0.3s; }
.color-dot:nth-child(6) { animation-delay: 0.35s; }
.color-dot:nth-child(7) { animation-delay: 0.4s; }
.color-dot:nth-child(8) { animation-delay: 0.45s; }
.color-dot:nth-child(9) { animation-delay: 0.5s; }
.color-dot:nth-child(10) { animation-delay: 0.55s; }
@keyframes colorPop {
to {
opacity: 1;
transform: scale(1);
}
}
.color-dot:hover {
transform: scale(1.3);
}
.tech-feature-visual {
position: relative;
}
.tech-image-wrapper {
border-radius: var(--radius-xl);
overflow: hidden;
box-shadow: var(--shadow-card);
}
.tech-image {
width: 100%;
height: 350px;
object-fit: cover;
transition: transform var(--transition-slow);
}
.tech-image-wrapper:hover .tech-image {
transform: scale(1.05);
}
</style>
</body>
</html>