Files
doormile-site/includes/ev-section.php
2026-04-17 12:47:41 +05:30

122 lines
6.1 KiB
PHP

<!-- Modern EV-Native Design Section -->
<link rel="stylesheet" href="assets/css/ev-section.css">
<section class="ev-section">
<div class="ev-container">
<div class="ev-grid">
<!-- Left Column: Content -->
<div class="ev-content">
<span class="ev-badge">EV-Native Design</span>
<h2 class="ev-title">
BUILT FOR ELECTRIC.
<span class="accent">NOT ADAPTED.</span>
</h2>
<p class="ev-desc">
Most logistics software treats EVs as diesel trucks with a battery.
Doormile was built EV-first—understanding that electric fleets require
fundamentally different intelligence.
</p>
<div class="feature-grid">
<!-- Feature 1 -->
<div class="feature-card">
<div class="feature-icon-box">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#3B82F6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path></svg>
</div>
<h3>Battery-Aware Routing</h3>
<p>Battery level, health, and degradation are inputs to route optimization.</p>
</div>
<!-- Feature 2 -->
<div class="feature-card">
<div class="feature-icon-box">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18.36 6.64a9 9 0 1 1-12.73 0"></path><line x1="12" y1="2" x2="12" y2="12"></line></svg>
</div>
<h3>Charging Integration</h3>
<p>Integrate charging stops without compromising delivery windows.</p>
</div>
<!-- Feature 3 -->
<div class="feature-card">
<div class="feature-icon-box">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 20h20"></path><path d="M5 20V8a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v12"></path><path d="M9 20v-4a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v4"></path></svg>
</div>
<h3>Energy-Optimized Paths</h3>
<p>Consider elevation, speed limits, and weather for maximum efficiency.</p>
</div>
<!-- Feature 4 -->
<div class="feature-card">
<div class="feature-icon-box">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#EF4444" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>
</div>
<h3>Predictable Operations</h3>
<p>EVs become predictable assets, not operational risks.</p>
</div>
</div>
</div>
<!-- Right Column: Dashboard Card -->
<div class="ev-dashboard">
<div class="dashboard-card">
<div class="dashboard-header">
<h3 class="dashboard-title">FLEET STATUS</h3>
<div class="live-indicator">Dashboard Live</div>
</div>
<div class="van-display">
<img src="assets/images/ev-van-dashboard.png" alt="Electric Delivery Van" class="van-image">
<!-- Overlay Status Cards -->
<div class="overlay-card v-status-1">
<div class="status-circle active">85%</div>
<div class="info">
<h4>EV-001</h4>
<p>Route A Active</p>
</div>
</div>
<div class="overlay-card v-status-2">
<div class="status-circle" style="border-color: #F59E0B; color: #F59E0B;">62%</div>
<div class="info">
<h4>EV-002</h4>
<p>Route B 42 min left</p>
</div>
</div>
<div class="overlay-card v-status-3">
<div class="status-circle" style="border-color: #EF4444; color: #EF4444;">20%</div>
<div class="info">
<h4>EV-003</h4>
<p>Charging Required</p>
</div>
</div>
</div>
<!-- Metric Stats Bottom -->
<div class="stats-row">
<div class="stat-metric">
<span class="stat-value">40%</span>
<span class="stat-label">Lower Fuel Cost</span>
</div>
<div class="stat-metric">
<span class="stat-value">ZRO</span>
<span class="stat-label">Tailpipe Emissions</span>
</div>
<div class="stat-metric">
<span class="stat-value">98%</span>
<span class="stat-label">Fleet Uptime</span>
</div>
<div class="stat-metric">
<span class="stat-value">3x</span>
<span class="stat-label">Longer Asset Life</span>
</div>
</div>
</div>
</div>
</div>
</div>
</section>