Removed unused files
This commit is contained in:
R-Bharathraj
@@ -1,264 +0,0 @@
|
|||||||
<?php
|
|
||||||
$page_title = 'How It Works — Doormile';
|
|
||||||
$page_desc = 'See how Doormile connects first, mid, and last mile into one seamless delivery experience powered by MileTruth™ AI.';
|
|
||||||
$current_page = 'how-it-works';
|
|
||||||
$depth = '';
|
|
||||||
?>
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<?php include 'includes/layout/head.php'; ?>
|
|
||||||
<body>
|
|
||||||
<?php include 'includes/layout/header.php'; ?>
|
|
||||||
|
|
||||||
<main id="main-content">
|
|
||||||
|
|
||||||
<?php include 'includes/sections/hero/howits-hero-section.php'; ?>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
/* Global page fix to prevent horizontal scroll */
|
|
||||||
html, body {
|
|
||||||
overflow-x: hidden !important;
|
|
||||||
width: 100% !important;
|
|
||||||
position: relative !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--dm-red: #c01227;
|
|
||||||
--dm-dark: #0a0a0a;
|
|
||||||
--dm-gray: #1a1a1a;
|
|
||||||
--dm-text-gray: #999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-steps {
|
|
||||||
background-color: var(--dm-dark);
|
|
||||||
padding: 100px 0 !important;
|
|
||||||
overflow-x: hidden !important; /* Prevent any grid overflow */
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-container {
|
|
||||||
max-width: 1440px !important;
|
|
||||||
margin: 0 auto !important;
|
|
||||||
padding: 0 40px !important;
|
|
||||||
width: 100% !important;
|
|
||||||
box-sizing: border-box !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-steps__header {
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 60px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-steps__header h2 {
|
|
||||||
color: #fff;
|
|
||||||
font-size: 48px;
|
|
||||||
font-weight: 700;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-steps__grid {
|
|
||||||
display: grid !important;
|
|
||||||
grid-template-columns: repeat(3, 1fr) !important;
|
|
||||||
gap: 30px !important;
|
|
||||||
overflow: hidden !important; /* Force no horizontal overflow */
|
|
||||||
width: 100% !important;
|
|
||||||
cursor: default !important; /* Kill grab cursor */
|
|
||||||
touch-action: auto !important;
|
|
||||||
-webkit-user-drag: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-steps__grid * {
|
|
||||||
cursor: auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card {
|
|
||||||
background: #141414 !important;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.05) !important;
|
|
||||||
border-radius: 20px !important;
|
|
||||||
overflow: hidden !important;
|
|
||||||
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card:hover {
|
|
||||||
transform: translateY(-10px) !important;
|
|
||||||
border-color: var(--dm-red) !important;
|
|
||||||
box-shadow: 0 20px 40px rgba(192, 18, 39, 0.15) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__image {
|
|
||||||
width: 100%;
|
|
||||||
height: 240px;
|
|
||||||
overflow: hidden;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__image img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
transition: transform 0.6s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card:hover .dm-step-card__image img {
|
|
||||||
transform: scale(1.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__body {
|
|
||||||
padding: 40px !important;
|
|
||||||
flex-grow: 1;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__num {
|
|
||||||
color: var(--dm-red);
|
|
||||||
font-family: 'Space Grotesk', sans-serif;
|
|
||||||
font-weight: 600;
|
|
||||||
font-size: 14px;
|
|
||||||
text-transform: uppercase;
|
|
||||||
letter-spacing: 2px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__title {
|
|
||||||
color: #fff;
|
|
||||||
font-size: 28px;
|
|
||||||
font-weight: 700;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
line-height: 1.2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__text {
|
|
||||||
color: var(--dm-text-gray);
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 1.6;
|
|
||||||
margin-bottom: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__list {
|
|
||||||
list-style: none !important;
|
|
||||||
padding: 0 !important;
|
|
||||||
margin: 0 !important;
|
|
||||||
margin-top: auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__list li {
|
|
||||||
color: #fff;
|
|
||||||
font-size: 15px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
padding-left: 25px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dm-step-card__list li::before {
|
|
||||||
content: "→";
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
color: var(--dm-red);
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1100px) {
|
|
||||||
.dm-steps__grid {
|
|
||||||
grid-template-columns: repeat(2, 1fr) !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.dm-steps__grid {
|
|
||||||
grid-template-columns: 1fr !important;
|
|
||||||
}
|
|
||||||
.dm-steps__header h2 {
|
|
||||||
font-size: 32px;
|
|
||||||
}
|
|
||||||
.dm-step-card__body {
|
|
||||||
padding: 30px !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<!-- Three-mile journey -->
|
|
||||||
<section class="dm-steps dm-section" aria-label="The three-mile journey">
|
|
||||||
<div class="dm-container">
|
|
||||||
|
|
||||||
<div class="dm-steps__header">
|
|
||||||
<p class="dm-label logico-title">/ The Journey /</p>
|
|
||||||
<h2>Three Miles. One System.</h2>
|
|
||||||
<p style="color:var(--gray-text);max-width:520px;margin:var(--sp-4) auto 0;">
|
|
||||||
Every shipment travels through three critical phases. Doormile owns and optimises all of them.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="dm-steps__grid">
|
|
||||||
|
|
||||||
<!-- Step 1: First Mile -->
|
|
||||||
<div class="dm-step-card">
|
|
||||||
<div class="dm-step-card__image">
|
|
||||||
<img src="<?php echo $depth; ?>assets/images/home2-step1.png"
|
|
||||||
alt="First mile pickup" loading="lazy">
|
|
||||||
</div>
|
|
||||||
<div class="dm-step-card__body">
|
|
||||||
<p class="dm-step-card__num">01 / First Mile</p>
|
|
||||||
<p class="dm-step-card__title">Origin to Hub</p>
|
|
||||||
<p class="dm-step-card__text">We collect freight directly from your facility, optimise vehicle assignment in real time, and consolidate loads for maximum efficiency before they reach the hub.</p>
|
|
||||||
<ul class="dm-step-card__list">
|
|
||||||
<li>AI-scheduled pickups</li>
|
|
||||||
<li>Dynamic load consolidation</li>
|
|
||||||
<li>Yard & dock management</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Step 2: Mid Mile -->
|
|
||||||
<div class="dm-step-card">
|
|
||||||
<div class="dm-step-card__image">
|
|
||||||
<img src="<?php echo $depth; ?>assets/images/home2-step2.png"
|
|
||||||
alt="Mid mile transit" loading="lazy">
|
|
||||||
</div>
|
|
||||||
<div class="dm-step-card__body">
|
|
||||||
<p class="dm-step-card__num">02 / Mid Mile</p>
|
|
||||||
<p class="dm-step-card__title">Hub to Hub Transit</p>
|
|
||||||
<p class="dm-step-card__text">Freight moves between hubs on optimised line-haul routes. Real-time tracking, cross-docking, and SLA monitoring keep every shipment on schedule.</p>
|
|
||||||
<ul class="dm-step-card__list">
|
|
||||||
<li>Optimised line-haul routing</li>
|
|
||||||
<li>Cross-docking & sortation</li>
|
|
||||||
<li>Live SLA monitoring</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Step 3: Last Mile -->
|
|
||||||
<div class="dm-step-card">
|
|
||||||
<div class="dm-step-card__image">
|
|
||||||
<img src="<?php echo $depth; ?>assets/images/home2-step3.png"
|
|
||||||
alt="Last mile delivery" loading="lazy">
|
|
||||||
</div>
|
|
||||||
<div class="dm-step-card__body">
|
|
||||||
<p class="dm-step-card__num">03 / Last Mile</p>
|
|
||||||
<p class="dm-step-card__title">Hub to Doorstep</p>
|
|
||||||
<p class="dm-step-card__text">The final and most complex phase. We optimise multi-stop routes, deliver within precise windows, and capture digital proof of delivery at every door.</p>
|
|
||||||
<ul class="dm-step-card__list">
|
|
||||||
<li>Multi-stop route optimisation</li>
|
|
||||||
<li>Precise delivery windows</li>
|
|
||||||
<li>Digital proof of delivery</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<?php include 'includes/sections/logistics/connected-logistics-section.php'; ?>
|
|
||||||
|
|
||||||
<?php include 'includes/sections/miles/doormile-way.php'; ?>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<?php include 'includes/layout/footer.php'; ?>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user