File "007-20260907120241-20260907174828.html"
Full Path: /home/chawlag2/public_html/cars/admin/js/007-20260907120241-20260907174828.html
File size: 8 KB
MIME-type: text/html
Charset: utf-8
<!DOCTYPE html>
<html data-wf-domain="www.dongfeng-nammi-box.ch" data-wf-page="007-page"
data-wf-site="6673de3350ec9a81ecfa64a2" lang="en" data-wf-locale="en">
<head>
<meta charset="utf-8">
<title>Dongfeng 007 | CHAWLA GREEN MOTORS</title>
<meta name="description"
content="Smart, Serene, Sensory – Dongfeng 007 is an all-electric fastback sedan with frameless windows, 15.6” display, wireless charging and immersive 19-speaker audio.">
<meta property="og:title" content="Dongfeng 007 – Smart, Serene, Sensory">
<meta property="og:description"
content="All-electric fastback sedan with 650 km range*, frameless doors, 15.6” display and 19-speaker audio – brought to Pakistan by Chawla Green Motors.">
<meta property="og:image" content="images/007-hero-share.webp">
<meta property="og:type" content="website">
<meta property="twitter:title" content="Dongfeng 007 – Smart, Serene, Sensory">
<meta property="twitter:description"
content="Electric sport sedan with intelligent design, advanced cabin tech and long-range EV performance.">
<meta property="twitter:image" content="images/007-hero-share.webp">
<meta name="twitter:card" content="summary_large_image">
<meta content="width=device-width, initial-scale=1" name="viewport">
<!-- main Webflow stylesheet from Box page -->
<link href="css/dongfeng-nammi-box.webflow.7ffe7ed09.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
!function (o, c) {
var n = c.documentElement, t = " w-mod-";
n.className += t + "js", ("ontouchstart" in o || o.DocumentTouch && c instanceof DocumentTouch) && (n.className += t + "touch")
}(window, document);
</script>
<link href="images/6675a83c20d748b3dea3be18_Favicon.png" rel="shortcut icon" type="image/x-icon">
<link href="images/6675a84021eb67bac0af9632_Webclip.png" rel="apple-touch-icon">
<script id="Cookiebot" src="js/uc.js" data-cbid="d7888c28-abe6-4050-b8bb-a20ac72085b2" data-blockingmode="auto"
type="text/javascript"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-BX12GEE1BJ"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-BX12GEE1BJ');
</script>
<link href="css/floating.css" rel="stylesheet">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- 007–specific tweaks -->
<!-- Vendor CSS Files -->
<link href="../bikes/assets/vendor/animate.css/animate.min.css" rel="stylesheet">
<link href="../bikes/assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="../bikes/assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="../bikes/assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="../bikes/assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="../bikes/assets/vendor/remixicon/remixicon.css" rel="stylesheet">
<link href="../bikes/assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="../bikes/assets/css/style.css" rel="stylesheet">
<style>
/* HERO LAYOUT -------------------------------------------------- */
.title-section--007 {
background: radial-gradient(circle at top left, #1b1c2f 0, #050814 55%, #050814 100%);
position: relative;
overflow: hidden;
padding: 130px 5vw 60px;
height: 150vh;
width: 100% !important;
}
#footer p a{
color: #2e4155 !important;
}
#footer .footer-top .footer-links ul a,i{
color: #2e4155 !important;
}
.hero-007-inner {
max-width: 1200px;
margin: 0 auto;
text-align: center;
position: relative;
}
.hero-007-heading {
position: relative;
z-index: 1;
}
.title-section--007 .title {
letter-spacing: 0.18em;
text-transform: uppercase;
font-size: clamp(52px, 8vw, 100px);
opacity: 1; /* title behind car but still visible */
margin-bottom: 0;
}
/* car image below title, on top */
.title-section--007 .title-image {
position: relative;
display: block;
margin: -40px auto 0;
max-width: 900px;
width: min(85vw, 900px);
z-index: 2;
filter: drop-shadow(0 35px 60px rgba(0, 0, 0, 0.9));
}
.hero-007-meta {
margin-top: 24px;
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
position: relative;
z-index: 3;
}
.title-section--007 .title-subline {
margin-top: 0;
font-size: 18px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: #a5b4fc;
}
.badge-007-spec {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
border-radius: 999px;
border: 1px solid rgba(148, 163, 184, 0.7);
background: rgba(15, 23, 42, 0.7);
color: #e5e7eb;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.14em;
}
.badge-007-spec span {
font-weight: 600;
color: #a5b4fc;
}
.top-cta-007 {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.8rem;
margin-top: 4px;
}
.top-cta-007 a {
border-radius: 999px;
padding-inline: 22px;
padding-block: 10px;
font-size: 13px;
letter-spacing: 0.16em;
text-transform: uppercase;
}
.btn-007-primary {
background: linear-gradient(135deg, #22c55e, #15803d);
color: #fff;
border: none;
}
.btn-007-primary:hover {
background: linear-gradient(135deg, #16a34a, #166534);
color: #fff;
}
.btn-007-outline {
border: 1px solid #ffffff;
color: #ffffff;
background: transparent;
}
.btn-007-outline:hover {
background: #ffffff;
color: #020617;
}
/* HEADER MAIN MENU --------------------------------------------- */
/* WRAPPER FOR MAIN MENU */
.header-main-menu {
display: flex;
align-items: center;
gap: 24px;
margin-right: 24px;
position: relative;
z-index: 1000; /* ensures dropdown appears ABOVE hero image */
}
/* TOP-LEVEL LINKS */
.header-link-007 {
font-size: 13px;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #ffffff;
text-decoration: none;
padding: 6px 4px;
display: inline-block;
}
.header-link-007:hover {
color: #38bdf8;
}
/* PARENT ITEM */
.menu-item-007 {
position: relative;
}
/* DROPDOWN PANEL */
.menu-dropdown-007 {
position: absolute;
top: 30px;
left: 0;
min-width: 190px;
background: rgba(15, 23, 42, 0.98);
border-radius: 12px;
padding: 8px 0;
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.75);
opacity: 0;
visibility: hidden;
transform: translateY(8px);
transition: all 0.20s ease;
z-index: 2000;
pointer-events: none; /* prevents accidental hovering when hidden */
}
/* SHOW DROPDOWN ON HOVER */
.menu-item-007:hover .menu-dropdown-007 {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto; /* enables clicking */
}
/* DROPDOWN LINKS */
.dropdown-link-007 {
display: block;
padding: 10px 16px;
font-size: 12px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #e5e7eb;
text-decoration: none;
white-space: nowrap;
transition: background 0.18s ease, color 0.18s ease;
}
.dropdown-link-007:hover {
background: rgba(55, 65, 81, 0.85);
color: #ffffff;
}
/* COMING SOON BADGE */
.badge-coming-soon {
display: inline-block;
margin-left: 6px;
padding: 2px 7px;
border-radius: 999px;
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.14em;
background: rgba(251, 191, 36, 0