Initial AI-generated site
This commit is contained in:
+369
@@ -0,0 +1,369 @@
|
||||
<!doctype html>
|
||||
<html lang="he" dir="rtl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>משה האינסטלטור | שירותי אינסטלציה בבני ברק 24/7</title>
|
||||
<meta name="description" content="משה האינסטלטור - שירותי תיקון צנרת דחופים בבני ברק, התקנות אינסטלציה, זמינות מלאה 24 שעות ביממה. התקשרו עכשיו: 052-712-3456">
|
||||
<meta property="og:title" content="משה האינסטלטור | שירותי אינסטלציה בבני ברק 24/7">
|
||||
<meta property="og:description" content="שירותי אינסטלציה מקצועיים בבני ברק - תיקונים דחופים, התקנות, ופתרונות צנרת. זמינים תמיד.">
|
||||
<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'><circle cx='50' cy='50' r='45' fill='%230a1628'/><path d='M30 65 L30 45 Q30 35 40 35 L60 35 Q70 35 70 45 L70 65' stroke='%2300d4ff' stroke-width='6' fill='none' stroke-linecap='round'/><circle cx='35' cy='65' r='5' fill='%2300d4ff'/><circle cx='65' cy='65' r='5' fill='%2300d4ff'/></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&family=Rubik:wght@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="grain-overlay" aria-hidden="true"></div>
|
||||
|
||||
<header class="site-header">
|
||||
<div class="header-container">
|
||||
<a href="#" class="logo">
|
||||
<svg class="logo-icon" viewBox="0 0 40 40" aria-hidden="true">
|
||||
<path d="M8 28 L8 16 Q8 8 16 8 L24 8 Q32 8 32 16 L32 28" stroke="currentColor" stroke-width="3" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="12" cy="28" r="3" fill="currentColor"/>
|
||||
<circle cx="28" cy="28" r="3" fill="currentColor"/>
|
||||
</svg>
|
||||
<span class="logo-text">משה האינסטלטור</span>
|
||||
</a>
|
||||
<nav class="main-nav" aria-label="ניווט ראשי">
|
||||
<ul class="nav-list">
|
||||
<li><a href="#services">שירותים</a></li>
|
||||
<li><a href="#why-us">למה אנחנו</a></li>
|
||||
<li><a href="tel:052-712-3456" class="nav-cta">052-712-3456</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<button class="mobile-menu-toggle" aria-expanded="false" aria-controls="mobile-menu" aria-label="תפריט">
|
||||
<span class="hamburger-line"></span>
|
||||
<span class="hamburger-line"></span>
|
||||
<span class="hamburger-line"></span>
|
||||
</button>
|
||||
</div>
|
||||
<nav id="mobile-menu" class="mobile-nav" aria-label="תפריט נייד" hidden>
|
||||
<ul class="mobile-nav-list">
|
||||
<li><a href="#services">שירותים</a></li>
|
||||
<li><a href="#why-us">למה אנחנו</a></li>
|
||||
<li><a href="#contact">צור קשר</a></li>
|
||||
<li><a href="tel:052-712-3456" class="mobile-phone-link">חייגו 052-712-3456</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main id="main-content">
|
||||
<section class="hero">
|
||||
<div class="hero-content">
|
||||
<div class="hero-badge">
|
||||
<span class="badge-dot" aria-hidden="true"></span>
|
||||
<span>זמינים עכשיו — 24/7</span>
|
||||
</div>
|
||||
<h1 class="hero-title">
|
||||
<span class="title-line">צנרת תקועה?</span>
|
||||
<span class="title-line title-accent">אנחנו בדרך.</span>
|
||||
</h1>
|
||||
<p class="hero-subtitle">שירותי אינסטלציה מקצועיים בבני ברק והסביבה. תיקונים דחופים, התקנות חדשות, ופתרונות מהירים — בכל שעה.</p>
|
||||
<div class="hero-actions">
|
||||
<a href="tel:052-712-3456" class="btn btn-primary">
|
||||
<svg class="btn-icon" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72 12.84 12.84 0 00.7 2.81 2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45 12.84 12.84 0 002.81.7A2 2 0 0122 16.92z" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
התקשרו עכשיו
|
||||
</a>
|
||||
<a href="#contact" class="btn btn-secondary">השאירו פרטים</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-visual" aria-hidden="true">
|
||||
<div class="pipe-system">
|
||||
<svg class="pipe-svg" viewBox="0 0 400 400" preserveAspectRatio="xMidYMid meet">
|
||||
<defs>
|
||||
<linearGradient id="pipeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stop-color="var(--cyan)" stop-opacity="0.8"/>
|
||||
<stop offset="100%" stop-color="var(--cyan-dark)" stop-opacity="0.4"/>
|
||||
</linearGradient>
|
||||
<filter id="glow">
|
||||
<feGaussianBlur stdDeviation="3" result="coloredBlur"/>
|
||||
<feMerge>
|
||||
<feMergeNode in="coloredBlur"/>
|
||||
<feMergeNode in="SourceGraphic"/>
|
||||
</feMerge>
|
||||
</filter>
|
||||
</defs>
|
||||
<path class="pipe pipe-1" d="M50 200 L150 200 L150 100 L250 100" stroke="url(#pipeGradient)" stroke-width="8" fill="none" stroke-linecap="round" stroke-linejoin="round" filter="url(#glow)"/>
|
||||
<path class="pipe pipe-2" d="M250 100 L250 200 L350 200" stroke="url(#pipeGradient)" stroke-width="8" fill="none" stroke-linecap="round" stroke-linejoin="round" filter="url(#glow)"/>
|
||||
<path class="pipe pipe-3" d="M150 200 L150 300 L300 300" stroke="url(#pipeGradient)" stroke-width="8" fill="none" stroke-linecap="round" stroke-linejoin="round" filter="url(#glow)"/>
|
||||
<circle class="joint" cx="150" cy="200" r="12" fill="var(--navy-light)"/>
|
||||
<circle class="joint" cx="250" cy="100" r="12" fill="var(--navy-light)"/>
|
||||
<circle class="joint" cx="150" cy="300" r="12" fill="var(--navy-light)"/>
|
||||
<circle class="water-drop drop-1" cx="0" cy="0" r="6" fill="var(--cyan)"/>
|
||||
<circle class="water-drop drop-2" cx="0" cy="0" r="6" fill="var(--cyan)"/>
|
||||
<circle class="water-drop drop-3" cx="0" cy="0" r="6" fill="var(--cyan)"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="services" class="services">
|
||||
<div class="container">
|
||||
<header class="section-header">
|
||||
<span class="section-tag">השירותים שלנו</span>
|
||||
<h2 class="section-title">פתרונות לכל בעיית אינסטלציה</h2>
|
||||
</header>
|
||||
<div class="services-grid">
|
||||
<article class="service-card service-card-featured">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<circle cx="24" cy="24" r="20" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
<path d="M24 14 L24 24 L32 28" stroke="currentColor" stroke-width="2.5" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="24" cy="24" r="3" fill="currentColor"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">שירות חירום 24/7</h3>
|
||||
<p class="card-text">צינור פרץ באמצע הלילה? אל דאגה. אנחנו זמינים בכל שעה, בכל יום — כולל שבתות וחגים. זמן תגובה מהיר לכל מצב חירום.</p>
|
||||
</div>
|
||||
<div class="card-badge">הכי מבוקש</div>
|
||||
</article>
|
||||
|
||||
<article class="service-card service-card-wide">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<path d="M12 36 L12 20 Q12 12 20 12 L28 12 Q36 12 36 20 L36 36" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="16" cy="36" r="4" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
<circle cx="32" cy="36" r="4" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
<path d="M20 24 L28 24" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">איתור ותיקון נזילות</h3>
|
||||
<p class="card-text">איתור נזילות מדויק בשיטות מתקדמות, ותיקון מקצועי שמונע נזקי מים יקרים. חיסכון בחשבון המים מובטח.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="service-card service-card-half">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<rect x="8" y="20" width="32" height="20" rx="2" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
<path d="M16 20 L16 12 L32 12 L32 20" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="24" cy="30" r="4" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">פתיחת סתימות</h3>
|
||||
<p class="card-text">כיור, אסלה, מקלחת או צינור ראשי — נפתח כל סתימה במהירות וביעילות עם ציוד מקצועי ומתקדם.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="service-card service-card-half">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<path d="M8 40 L8 24 Q8 16 16 16 L24 8 L32 16 Q40 16 40 24 L40 40" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16 40 L16 28 L32 28 L32 40" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">התקנות חדשות</h3>
|
||||
<p class="card-text">התקנה מקצועית של כיורים, אסלות, מקלחונים, דודי שמש, ומערכות צנרת מלאות. עבודה נקייה ומסודרת.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="service-card service-card-half">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<path d="M24 8 L24 16 M24 32 L24 40" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||||
<path d="M8 24 L16 24 M32 24 L40 24" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||||
<circle cx="24" cy="24" r="8" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
<circle cx="24" cy="24" r="3" fill="currentColor"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">תחזוקה מונעת</h3>
|
||||
<p class="card-text">בדיקות תקופתיות ותחזוקה שוטפת שחוסכת לכם כסף וכאב ראש. מניעת תקלות לפני שהן קורות.</p>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="service-card service-card-half">
|
||||
<div class="card-icon">
|
||||
<svg viewBox="0 0 48 48" aria-hidden="true">
|
||||
<path d="M14 8 L14 40 M34 8 L34 40" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||||
<path d="M14 16 L34 16 M14 32 L34 32" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||||
<path d="M8 24 L14 24 M34 24 L40 24" stroke="currentColor" stroke-width="3" stroke-linecap="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h3 class="card-title">החלפת צנרת</h3>
|
||||
<p class="card-text">שדרוג צנרת ישנה לחומרים מודרניים ועמידים. מניעת בעיות עתידיות והעלאת ערך הנכס.</p>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="why-us" class="why-us">
|
||||
<div class="container">
|
||||
<div class="why-us-layout">
|
||||
<div class="why-us-content">
|
||||
<header class="section-header section-header-start">
|
||||
<span class="section-tag">למה לבחור בנו</span>
|
||||
<h2 class="section-title">מקצועיות שמרגישים מהרגע הראשון</h2>
|
||||
</header>
|
||||
<ul class="benefits-list">
|
||||
<li class="benefit-item">
|
||||
<div class="benefit-number" aria-hidden="true">01</div>
|
||||
<div class="benefit-content">
|
||||
<h3>מכירים את בני ברק</h3>
|
||||
<p>גרים ועובדים באזור — מכירים כל סוג בניין וכל אתגר ייחודי של האינסטלציה המקומית.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="benefit-item">
|
||||
<div class="benefit-number" aria-hidden="true">02</div>
|
||||
<div class="benefit-content">
|
||||
<h3>מחירים הוגנים ושקופים</h3>
|
||||
<p>הצעת מחיר מראש, בלי הפתעות. אתם יודעים בדיוק מה אתם משלמים ועל מה.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="benefit-item">
|
||||
<div class="benefit-number" aria-hidden="true">03</div>
|
||||
<div class="benefit-content">
|
||||
<h3>ציוד מקצועי ומתקדם</h3>
|
||||
<p>משתמשים בכלים ובטכנולוגיות העדכניות ביותר לפתרון מהיר ויעיל.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li class="benefit-item">
|
||||
<div class="benefit-number" aria-hidden="true">04</div>
|
||||
<div class="benefit-content">
|
||||
<h3>אחריות על העבודה</h3>
|
||||
<p>עומדים מאחורי כל תיקון והתקנה. שקט נפשי מובטח.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="why-us-visual">
|
||||
<div class="stats-grid" role="list" aria-label="נתונים עלינו">
|
||||
<div class="stat-card stat-card-highlight" role="listitem">
|
||||
<div class="stat-value">24/7</div>
|
||||
<div class="stat-label">זמינות מלאה</div>
|
||||
</div>
|
||||
<div class="stat-card" role="listitem">
|
||||
<div class="stat-value">~30<span class="stat-unit">דק׳</span></div>
|
||||
<div class="stat-label">זמן הגעה ממוצע</div>
|
||||
</div>
|
||||
<div class="stat-card" role="listitem">
|
||||
<div class="stat-value">15+</div>
|
||||
<div class="stat-label">שנות ניסיון</div>
|
||||
</div>
|
||||
<div class="stat-card" role="listitem">
|
||||
<div class="stat-value stat-value-text">בני ברק והסביבה</div>
|
||||
<div class="stat-label">אזור השירות</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="contact" class="contact">
|
||||
<div class="container">
|
||||
<div class="contact-layout">
|
||||
<div class="contact-info">
|
||||
<header class="section-header section-header-start">
|
||||
<span class="section-tag">צרו קשר</span>
|
||||
<h2 class="section-title">בעיה באינסטלציה?<br>אנחנו כאן בשבילכם</h2>
|
||||
</header>
|
||||
<p class="contact-text">התקשרו ישירות או מלאו את הטופס — נחזור אליכם תוך דקות ונתאם הגעה בהקדם האפשרי.</p>
|
||||
<div class="contact-methods">
|
||||
<a href="tel:052-712-3456" class="contact-method contact-method-phone">
|
||||
<div class="method-icon">
|
||||
<svg viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72 12.84 12.84 0 00.7 2.81 2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45 12.84 12.84 0 002.81.7A2 2 0 0122 16.92z" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="method-content">
|
||||
<span class="method-label">טלפון</span>
|
||||
<span class="method-value">052-712-3456</span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="contact-method">
|
||||
<div class="method-icon">
|
||||
<svg viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0118 0z" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<circle cx="12" cy="10" r="3" stroke="currentColor" stroke-width="2" fill="none"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="method-content">
|
||||
<span class="method-label">אזור שירות</span>
|
||||
<span class="method-value">בני ברק, רמת גן, גבעת שמואל</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<form class="contact-form" id="contact-form" novalidate>
|
||||
<div class="form-group">
|
||||
<label for="name" class="form-label">שם מלא</label>
|
||||
<input type="text" id="name" name="name" class="form-input" required autocomplete="name">
|
||||
<span class="form-error" role="alert">נא להזין שם</span>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone" class="form-label">טלפון</label>
|
||||
<input type="tel" id="phone" name="phone" class="form-input" required autocomplete="tel" dir="ltr" placeholder="05X-XXX-XXXX">
|
||||
<span class="form-error" role="alert">נא להזין מספר טלפון תקין</span>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="service" class="form-label">סוג השירות</label>
|
||||
<select id="service" name="service" class="form-input form-select" required>
|
||||
<option value="">בחרו שירות</option>
|
||||
<option value="emergency">שירות חירום דחוף</option>
|
||||
<option value="leak">תיקון נזילה</option>
|
||||
<option value="clog">פתיחת סתימה</option>
|
||||
<option value="install">התקנה חדשה</option>
|
||||
<option value="maintenance">תחזוקה</option>
|
||||
<option value="other">אחר</option>
|
||||
</select>
|
||||
<span class="form-error" role="alert">נא לבחור סוג שירות</span>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message" class="form-label">תיאור הבעיה <span class="label-optional">(רשות)</span></label>
|
||||
<textarea id="message" name="message" class="form-input form-textarea" rows="4" placeholder="ספרו לנו בקצרה מה קורה..."></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-full">
|
||||
<span class="btn-text">שליחת בקשה</span>
|
||||
<svg class="btn-icon btn-icon-arrow" viewBox="0 0 24 24" aria-hidden="true">
|
||||
<path d="M19 12H5M12 5l-7 7 7 7" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</button>
|
||||
<p class="form-note">נחזור אליכם תוך מספר דקות</p>
|
||||
<div aria-live="polite" id="form-status" class="visually-hidden"></div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="site-footer">
|
||||
<div class="container">
|
||||
<div class="footer-content">
|
||||
<div class="footer-main">
|
||||
<div class="footer-brand">
|
||||
<svg class="footer-logo" viewBox="0 0 40 40" aria-hidden="true">
|
||||
<path d="M8 28 L8 16 Q8 8 16 8 L24 8 Q32 8 32 16 L32 28" stroke="currentColor" stroke-width="3" fill="none" stroke-linecap="round"/>
|
||||
<circle cx="12" cy="28" r="3" fill="currentColor"/>
|
||||
<circle cx="28" cy="28" r="3" fill="currentColor"/>
|
||||
</svg>
|
||||
<span>משה האינסטלטור</span>
|
||||
</div>
|
||||
<p class="footer-tagline">שירותי אינסטלציה מקצועיים בבני ברק והסביבה</p>
|
||||
</div>
|
||||
<div class="footer-contact">
|
||||
<a href="tel:052-712-3456" class="footer-phone">052-712-3456</a>
|
||||
<span class="footer-availability">זמינים 24/7</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p class="footer-copy">© 2024 כל הזכויות שמורות</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user