Skip to content

Commit 46346b4

Browse files
Spx-expressSpx-express
authored
Create index.html
0 parents  commit 46346b4

1 file changed

Lines changed: 175 additions & 0 deletions

File tree

‎index.html‎

Lines changed: 175 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,175 @@
1+
<!DOCTYPE html>
2+
<html lang="id">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>SPX EXPRESS KOTA PASURUAN WHATSAPP (0818-555-621)</title>
7+
<meta name="description" content="SPX EXPRESS KOTA PASURUAN WHATSAPP (0818-555-621) - Jasa pengiriman paket, cek resi, pickup & retur di Kota Pasuruan, Jawa Timur.">
8+
<meta name="robots" content="index, follow">
9+
<link rel="canonical" href="https://pasuruan.spxexpress.online/">
10+
<meta name="theme-color" content="#ee4d2d">
11+
12+
<style>
13+
*{margin:0; padding:0; box-sizing:border-box;}
14+
html{scroll-behavior:smooth;}
15+
body{font-family:'Segoe UI',Roboto,Arial,sans-serif; background:#f7f8fa; color:#111827; line-height:1.6;}
16+
a{text-decoration:none;}
17+
.container{width:min(1100px,92%); margin:0 auto;}
18+
19+
nav{position:fixed; top:0; left:0; width:100%; z-index:100; padding:16px 0; background:rgba(255,255,255,.95); border-bottom:1px solid #eee; box-shadow:0 2px 10px rgba(0,0,0,.05);}
20+
.nav{display:flex; justify-content:space-between; align-items:center;}
21+
.logo{font-size:16px; font-weight:900; line-height:1.3;}
22+
.logo .spx{color:#ee4d2d;}
23+
.logo .wa{font-size:12px; color:#667085; font-weight:600;}
24+
.nav-links a{margin-left:16px; color:#374151; font-weight:600; font-size:14px;}
25+
.nav-links a:hover{color:#ee4d2d;}
26+
27+
.hero{padding:120px 0 60px; background:linear-gradient(180deg,#fff,#fff5f1); text-align:center;}
28+
.badge{display:inline-block; background:#fff0eb; color:#ee4d2d; padding:6px 14px; border-radius:50px; font-weight:600; font-size:13px; margin-bottom:20px;}
29+
h1{font-size:clamp(32px,5vw,52px); font-weight:900; line-height:1.2; margin-bottom:24px;}
30+
h1 span{color:#ee4d2d;}
31+
.hero p{font-size:16px; color:#667085; margin-bottom:30px; line-height:1.8; max-width:800px; margin-left:auto; margin-right:auto;}
32+
33+
.btn{display:inline-flex; align-items:center; gap:10px; background:linear-gradient(135deg,#ee4d2d,#d73211); color:#fff; padding:14px 24px; border-radius:12px; font-weight:700; font-size:16px; border:none; cursor:pointer; transition:transform .2s ease;}
34+
.btn:hover{transform:translateY(-3px);}
35+
36+
.stats{margin-top:-30px; position:relative; z-index:2;}
37+
.statsBox{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; background:#fff; border-radius:16px; box-shadow:0 4px 20px rgba(0,0,0,.08); padding:30px;}
38+
.statItem{text-align:center;}
39+
.statNum{font-size:28px; font-weight:900; color:#ee4d2d; margin-bottom:6px;}
40+
.statLabel{font-size:14px; color:#667085;}
41+
42+
.section{padding:70px 0;}
43+
.gray{background:#fff;}
44+
h2{font-size:clamp(24px,3vw,36px); font-weight:800; text-align:center; margin-bottom:50px;}
45+
h2 span{color:#ee4d2d;}
46+
47+
.services{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
48+
.serviceCard{background:#fff; border-radius:16px; padding:30px; border:1px solid #f0f0f0; transition:all .3s ease;}
49+
.serviceCard:hover{border-color:#ee4d2d; box-shadow:0 8px 24px rgba(238,77,45,.12); transform:translateY(-5px);}
50+
.serviceIcon{width:56px; height:56px; border-radius:12px; background:#fff0eb; display:flex; align-items:center; justify-content:center; font-size:28px; margin-bottom:20px;}
51+
.serviceCard h3{font-size:18px; font-weight:700; margin-bottom:12px;}
52+
.serviceCard p{font-size:14px; color:#667085; line-height:1.7;}
53+
54+
.cta{background:linear-gradient(135deg,#ee4d2d,#d73211); color:#fff; text-align:center; border-radius:20px; padding:60px 30px;}
55+
.cta h2{color:#fff; margin-bottom:20px;}
56+
.cta p{font-size:16px; max-width:600px; margin:0 auto 30px; opacity:.95;}
57+
.btnWhite{background:#fff; color:#ee4d2d;}
58+
.btnWhite:hover{background:#fef6f4; color:#d73211;}
59+
60+
footer{background:#111827; color:#fff; padding:40px 0; text-align:center; font-size:14px; color:#9ca3af;}
61+
62+
@media(max-width:768px){
63+
.statsBox{grid-template-columns:repeat(2,1fr);}
64+
.services{grid-template-columns:1fr;}
65+
.nav-links{display:none;}
66+
}
67+
</style>
68+
</head>
69+
<body>
70+
71+
<nav>
72+
<div class="container nav">
73+
<div class="logo">
74+
<div class="spx">SPX EXPRESS KOTA PASURUAN</div>
75+
<div class="wa">📞 +62 818-555-621</div>
76+
</div>
77+
<div class="nav-links">
78+
<a href="#layanan">Layanan</a>
79+
<a href="#kontak">Kontak</a>
80+
</div>
81+
</div>
82+
</nav>
83+
84+
<section class="hero">
85+
<div class="container">
86+
<span class="badge">🚀 Siap Melayani 24 Jam</span>
87+
<h1>SPX EXPRESS <span>KOTA PASURUAN</span></h1>
88+
<p>Sering bingung dengan posisi paket belanjaan atau jualan online Anda? Sebagai mitra pendukung layanan SPX Express, saya siap membantu teman-teman seller maupun buyer di seluruh wilayah Kota Pasuruan untuk memastikan proses pengiriman barang berjalan lancar tanpa kendala.</p>
89+
<a href="https://wa.me/62818555621" target="_blank" class="btn">
90+
💬 Hubungi via WhatsApp
91+
</a>
92+
</div>
93+
</section>
94+
95+
<section class="stats">
96+
<div class="container statsBox">
97+
<div class="statItem">
98+
<div class="statNum">📦</div>
99+
<div class="statLabel">Kirim Paket</div>
100+
</div>
101+
<div class="statItem">
102+
<div class="statNum">🔍</div>
103+
<div class="statLabel">Cek Resi</div>
104+
</div>
105+
<div class="statItem">
106+
<div class="statNum">🚚</div>
107+
<div class="statLabel">Pickup</div>
108+
</div>
109+
<div class="statItem">
110+
<div class="statNum">🔄</div>
111+
<div class="statLabel">Retur</div>
112+
</div>
113+
</div>
114+
</section>
115+
116+
<section class="section gray" id="layanan">
117+
<div class="container">
118+
<h2>Layanan <span>Kami</span></h2>
119+
<div class="services">
120+
<div class="serviceCard">
121+
<div class="serviceIcon">📦</div>
122+
<h3>Kirim Paket</h3>
123+
<p>Fasilitas drop-off paket jualan Shopee Anda dengan aman, cepat, dan terpercaya.</p>
124+
</div>
125+
<div class="serviceCard">
126+
<div class="serviceIcon">🔍</div>
127+
<h3>Cek Resi & Pelacakan</h3>
128+
<p>Membantu memantau posisi paket Anda secara real-time agar selalu tahu di mana paket berada.</p>
129+
</div>
130+
<div class="serviceCard">
131+
<div class="serviceIcon">🚚</div>
132+
<h3>Penjemputan Paket</h3>
133+
<p>Butuh dijemput ke rumah? Siap melayani penjemputan paket untuk seller di Kota Pasuruan.</p>
134+
</div>
135+
<div class="serviceCard">
136+
<div class="serviceIcon">🔄</div>
137+
<h3>Retur & Pengembalian</h3>
138+
<p>Membantu proses pengembalian barang yang tidak sesuai atau perlu dikembalikan ke penjual.</p>
139+
</div>
140+
<div class="serviceCard">
141+
<div class="serviceIcon">📍</div>
142+
<h3>Area Kota Pasuruan</h3>
143+
<p>Melayani seluruh wilayah Kota Pasuruan dengan cakupan luas dan cepat.</p>
144+
</div>
145+
<div class="serviceCard">
146+
<div class="serviceIcon">⏰</div>
147+
<h3>Siap 24 Jam</h3>
148+
<p>Butuh bantuan kapan saja? Kami siap melayani Anda 24 jam non-stop.</p>
149+
</div>
150+
</div>
151+
</div>
152+
</section>
153+
154+
<section class="section" id="kontak">
155+
<div class="container">
156+
<div class="cta">
157+
<h2>Butuh Bantuan?</h2>
158+
<p>Jangan bingung lagi soal paket! Langsung hubungi kami via WhatsApp, kami siap bantu secepat mungkin.</p>
159+
<a href="https://wa.me/62818555621" target="_blank" class="btn btnWhite">
160+
💬 WhatsApp +62 818-555-621
161+
</a>
162+
</div>
163+
</div>
164+
</section>
165+
166+
<footer>
167+
<div class="container">
168+
<p>SPX EXPRESS KOTA PASURUAN | 📞 +62 818-555-621 | Kota Pasuruan, Jawa Timur</p>
169+
<p style="margin-top:8px;">© 2026 SPX Express Kota Pasuruan. All rights reserved.</p>
170+
</div>
171+
</footer>
172+
173+
</body>
174+
</html>
175+

0 commit comments

Comments
 (0)