| Server IP : 185.252.147.100 / Your IP : 216.73.216.196 Web Server : nginx/1.27.3 System : Linux mitrofanov.ru 6.1.0-37-amd64 #1 SMP PREEMPT_DYNAMIC Debian 6.1.140-1 (2025-05-22) x86_64 User : mitr ( 1000) PHP Version : 8.2.29 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /www/html/epauto.ru/html/ |
Upload File : |
<!DOCTYPE html>
<html class="light" lang="ru"><head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Inter:wght@400;600&display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
"colors": {
"on-surface": "#191c1e",
"primary-fixed-dim": "#b3c5ff",
"background": "#f7f9fb",
"secondary-fixed-dim": "#4cd6ff",
"inverse-surface": "#2d3133",
"inverse-primary": "#b3c5ff",
"on-tertiary-fixed": "#111c2d",
"on-tertiary-container": "#f6f7ff",
"on-surface-variant": "#424656",
"on-tertiary": "#ffffff",
"secondary-container": "#00ccf9",
"outline": "#727687",
"on-background": "#191c1e",
"surface-container-highest": "#e0e3e5",
"surface-container-low": "#f2f4f6",
"on-tertiary-fixed-variant": "#3c475a",
"surface-container-high": "#e6e8ea",
"on-primary-fixed": "#001849",
"tertiary-container": "#677287",
"surface-dim": "#d8dadc",
"on-primary-fixed-variant": "#003fa4",
"tertiary-fixed-dim": "#bcc7de",
"tertiary": "#4f5a6e",
"on-error": "#ffffff",
"secondary-fixed": "#b7eaff",
"on-primary": "#ffffff",
"primary-fixed": "#dae1ff",
"surface-tint": "#0054d6",
"outline-variant": "#c2c6d8",
"surface": "#f7f9fb",
"on-secondary-container": "#005266",
"on-error-container": "#93000a",
"surface-variant": "#e0e3e5",
"on-secondary-fixed": "#001f28",
"surface-bright": "#f7f9fb",
"primary-container": "#0066ff",
"secondary": "#00677f",
"on-primary-container": "#f8f7ff",
"primary": "#0050cb",
"inverse-on-surface": "#eff1f3",
"error": "#ba1a1a",
"on-secondary": "#ffffff",
"tertiary-fixed": "#d8e3fb",
"surface-container-lowest": "#ffffff",
"on-secondary-fixed-variant": "#004e60",
"surface-container": "#eceef0",
"error-container": "#ffdad6"
},
"borderRadius": {
"DEFAULT": "0.25rem",
"lg": "0.5rem",
"xl": "0.75rem",
"full": "9999px"
},
"spacing": {
"sm": "16px",
"md": "24px",
"gutter": "24px",
"container-max": "1280px",
"base": "4px",
"xl": "80px",
"xs": "8px",
"lg": "48px"
},
"fontFamily": {
"body-md": ["Inter"],
"label-sm": ["Inter"],
"h3": ["Manrope"],
"h1": ["Manrope"],
"h2": ["Manrope"],
"body-lg": ["Inter"]
},
"fontSize": {
"body-md": ["16px", {"lineHeight": "1.5", "fontWeight": "400"}],
"label-sm": ["14px", {"lineHeight": "1", "letterSpacing": "0.05em", "fontWeight": "600"}],
"h3": ["24px", {"lineHeight": "1.3", "fontWeight": "600"}],
"h1": ["48px", {"lineHeight": "1.2", "letterSpacing": "-0.02em", "fontWeight": "700"}],
"h2": ["36px", {"lineHeight": "1.25", "letterSpacing": "-0.01em", "fontWeight": "600"}],
"body-lg": ["18px", {"lineHeight": "1.6", "fontWeight": "400"}]
}
},
},
}
</script>
<style>
.material-symbols-outlined {
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.hero-pattern {
background-color: #f7f9fb;
background-image: radial-gradient(#0050cb 0.5px, transparent 0.5px);
background-size: 24px 24px;
opacity: 0.15;
}
</style>
</head>
<body class="bg-surface text-on-surface font-body-md antialiased selection:bg-primary-fixed selection:text-on-primary-fixed">
<!-- TopNavBar -->
<header class="sticky top-0 w-full z-50 border-b border-slate-100 bg-white/90 backdrop-blur-md font-['Manrope'] antialiased shadow-[0px_4px_20px_rgba(15,23,42,0.05)]">
<div class="flex justify-between items-center max-w-7xl mx-auto px-6 md:px-12 h-20">
<div class="flex items-center">
<img alt="EP Auto Logo" class="h-10 w-auto" data-alt="A clean and professional vector-style corporate logo for EP Auto, featuring a minimalist automotive emblem. The design uses a sophisticated navy blue and white color scheme, emphasizing luxury and precision. The logo is displayed against a crisp white background with soft, natural lighting, conveying a sense of established trust and premium vehicle sourcing services." src="https://lh3.googleusercontent.com/aida/ADBb0ugtNoIjex1BvFilfXrnESbzTAztOId8VBVETsL9vks9k1xgT_8LW4oa_y6UHTB_GTTCAvYJfh3J-c0s2Yx7fou2SvUS4nk4Z0kWq2DysWQ49H3dyu3Vchg3AWwDtKEB4dzead5qTMtKOwgqrh5cICV3_6pgAP1TMXTMZc2xGyIOs-RSfpWHU0351EnmNIP9R7mAOKkUOTy5F7vpEycK-M2eZZeGVxyMgiNlE3JPm95XFFE-qvko17YevLworMPtxuseoCPFqHTrLCA"/>
</div>
</div>
</header>
<main>
<!-- Hero Section -->
<section class="relative min-h-[70vh] flex items-center overflow-hidden py-xl">
<div class="absolute inset-0 hero-pattern"></div>
<div class="absolute inset-0 flex items-center justify-end opacity-[0.03] pointer-events-none pr-12">
<span class="material-symbols-outlined text-[400px]" style="font-variation-settings: 'wght' 100;">directions_car</span>
</div>
<div class="max-w-7xl mx-auto px-6 md:px-12 relative z-10 w-full">
<div class="max-w-3xl">
<div class="inline-flex items-center px-4 py-1.5 rounded-full bg-primary/10 text-primary font-label-sm mb-sm border border-primary/20">
<span class="material-symbols-outlined text-[18px] mr-2">construction</span>
Скоро открытие
</div>
<h1 class="font-h1 text-h1 text-on-surface mb-md">
Сайт находится в <span class="text-primary">разработке</span>
</h1>
<p class="font-body-lg text-body-lg text-on-surface-variant mb-lg leading-relaxed">
Мы готовим для вас нечто масштабное. Скоро здесь будет полный каталог автомобилей из Китая, Кореи и Японии с прозрачной историей и быстрой доставкой.
</p>
</div>
</div>
</section>
<!-- Contact Section -->
<section class="py-xl bg-surface-container-lowest">
<div class="max-w-7xl mx-auto px-6 md:px-12">
<div class="grid gap-16 items-center">
<div class="mx-auto">
<h2 class="font-h2 text-h2 mb-lg text-center">Свяжитесь с нами</h2>
<div class="space-y-8">
<div class="flex items-start gap-4">
<div class="w-12 h-12 rounded-full bg-primary/5 flex items-center justify-center text-primary flex-shrink-0">
<span class="material-symbols-outlined">call</span>
</div>
<div>
<p class="text-on-surface-variant font-label-sm uppercase mb-1">Телефон</p>
<a class="text-body-lg font-semibold hover:text-primary transition-colors" href="tel:+79502878751">+7 950 287 87 51</a>
</div>
</div>
<div class="flex items-start gap-4">
<div class="w-12 h-12 rounded-full bg-primary/5 flex items-center justify-center text-primary flex-shrink-0">
<span class="material-symbols-outlined">location_on</span>
</div>
<div>
<p class="text-on-surface-variant font-label-sm uppercase mb-1">Адрес</p>
<p class="text-body-lg font-semibold">ул. Авраменко, д.2, Владивосток</p>
</div>
</div>
<div class="flex items-start gap-4">
<div class="w-12 h-12 rounded-full bg-primary/5 flex items-center justify-center text-primary flex-shrink-0">
<span class="material-symbols-outlined">mail</span>
</div>
<div>
<p class="text-on-surface-variant font-label-sm uppercase mb-1">Email</p>
<a class="text-body-lg font-semibold hover:text-primary transition-colors" href="mailto:info@epauto.ru">info@epauto.ru</a>
</div>
</div>
<div class="flex items-start gap-4">
<div class="w-12 h-12 rounded-full bg-primary/5 flex items-center justify-center text-primary flex-shrink-0">
<span class="material-symbols-outlined">schedule</span>
</div>
<div>
<p class="text-on-surface-variant font-label-sm uppercase mb-1">Режим работы</p>
<p class="text-body-lg font-semibold">Пн-Пт: 9:00 — 17:00</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<!-- Footer -->
</body></html>