@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body {
	font-family: "Barlow", sans-serif;
	font-weight: 400;
	font-size: 18px;
	font-style: normal;
}
h1, h2, h3, h4, h5, h6 {
	font-family: "Barlow", sans-serif;
	font-weight: 500;
	font-style: normal;
}
.navbar-brand {
	max-width: 210px;
}
.navbar-toggler-icon {
	background-image: url(../images/iconbar.png);
	cursor: pointer;
}
.pagetop {
	background: #212529;
	background-image: url(../images/topbg.png);
	color: #FFFFFF;
	padding: 5px;
}
.pagetop a{
	color: #FFFFFF;
	text-decoration:none;
}
.pagetop a:hover{
	color: #CCCCCC;
}
.header {
	background: #F5F5F5;
	position: absolute;
	width: 100%;
	z-index: 999;
	transition: 0.3s;
}
.sticky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	animation: slideDown 0.4s ease;
}
.header.sticky {
	background: #212529;
	background-image: url(../images/topbg.png);
}
@keyframes slideDown {
from {
	transform:translateY(-100%);
}
to {
	transform: translateY(0);
}
}
.social-icons a {
	width: 25px;
	height: 25px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #fff;
	margin-right: 8px;
	text-decoration: none;
}
.facebook {
	background: #1877f2;
}
.twitter {
	background: #1da1f2;
}
.instagram {
	background: #e4405f;
}
.linkedin {
	background: #0077b5;
}
.youtube {
	background: #ff0000;
}
.whatsapp {
	background: #25d366;
}
.nav-item {
	padding-left: 10px;
	padding-right: 10px;
}
.nav-link {
	color: #212529;
	font-weight: 500;
	text-transform: uppercase;
}
.header.sticky .nav-link {
	color: #FFF;
}
.nav-link:hover {
	color: #D12323;
}
.header.sticky .nav-link:hover {
	color: #D12323;
}
.navbar-text .btn {
	background-color: #D12323;
	color: #FFF;
	font-size: 14px;
	border-radius: 999px;
	text-transform: uppercase;
	margin-left: 15px;
	background: linear-gradient(to left, #D12323 50%, #000 50%);
	background-size: 200% 100%;
	background-position: right;
	transition: all 0.4s ease;
	border: solid 1px #FFFFFF;
}
.navbar-text .btn:hover {
	background-position: left;
	color: #FFF;
}
.content h1 {
	font-weight: 800;
}
.content h6, .cars h6, .testdrive h6 {
	color: #D12323;
	text-transform: uppercase;
}
.cars {
	padding: 40px 0px 60px 0px;
}
.cars h1, .cars h2 {
	font-weight: 800;
}
.conttab {
	border: solid 1px #212529;
	border-top: solid 5px #212529;
	border-radius: 25px;
	padding: 15px;
	background: #FFF;
	margin-top: 15px;
}
.conttab:hover {
	border: solid 1px #D12323;
	border-top: solid 5px #D12323;
	border-radius: 25px;
	padding: 15px;
	background: #FFF;
	margin-top: 15px;
}
.conttab h5 {
	font-weight: 700;
}
.conttab h5 a{
	color:#212529;
	text-decoration:none;
}
.conttab h5 a:hover{
	color:#D12323;
	text-decoration:none;
}
.conttab p {
	font-size: 16px;
}
.cars .btn {
	background-color: #D12323;
	color: #FFF;
	font-size: 14px;
	border-radius: 999px;
	text-transform: uppercase;
	padding: 15px 25px;
	margin-top: 15px;
	background: linear-gradient(to left, #D12323 50%, #000 50%);
	background-size: 200% 100%;
	background-position: right;
	transition: all 0.4s ease;
	border: solid 1px #FFFFFF;
}
.cars .btn:hover {
	background-position: left;
	color: #FFF;
}
.cardetails {
	background: #f8f9fa;
	 transition: all 0.3s ease;
}
.cardetails:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

.carshadow {
	box-shadow: 0 8px 40px rgba(0,0,0,0.2);
}
.carimg {
	border:solid 1px #CCC;
}
.cardetails h3 {
	font-weight: 800;
}
.cardetails h3 small {
	font-size: 18px;
	color: #D12323;
}
.cardetails p {
	margin: 0;
	font-size: 14px;
	display:block;
	min-height:40px;
}
.cardetails .info-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-bottom: 1.6rem;
}
.cardetails .info-pill {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #222732;
	border: 1px solid #CCCCCC;
	border-radius: 50px;
	padding: 5px 15px;
	font-size: 0.75rem;
	color: #FFFFFF;
	text-decoration: none;
	transition: border-color 0.2s, color 0.2s;
}
.testdrive {
	background: #212529;
	background-image: url(../images/testdrivebg.jpg);
	background-position: center center;
	color: #FFFFFF;
	padding: 80px 0px;
}
.testdrive h6 {
	font-weight: 600;
	text-transform: uppercase;
}
.testdrive h1 {
	font-weight: 800;
}
.testdrive .formbtn {
	border-radius: 999px;
	width: 220px;
	text-align: center;
	padding: 15px 0px;
	color: #fff;
	margin-top: 15px;
	background: linear-gradient(to left, #D12323 50%, #FFF 50%);
	background-size: 200% 100%;
	background-position: right;
	transition: all 0.4s ease;
	border: solid 1px #FFFFFF;
	text-transform: uppercase;
	font-weight: 600;
	margin: 0px 10px;
}
/* Hover Effect */
.testdrive .formbtn:hover {
	background-position: left;
	color: #000;
}
.testdrive .formbtn2 {
	border-radius: 999px;
	width: 220px;
	text-align: center;
	padding: 15px 0px;
	color: #fff;
	margin-top: 15px;
	background: #000000;
	background-size: 200% 100%;
	background-position: right;
	transition: all 0.4s ease;
	border: solid 1px #FFFFFF;
	text-transform: uppercase;
	font-weight: 600;
	margin: 0px 10px;
}
/* Hover Effect */
.testdrive .formbtn2:hover {
	background-position: left;
	color: #D12323;
	border: solid 1px #D12323;
}
.faq {
	background: #f8f9fa;
	padding: 80px 0px;
}
.faq h1, .faq h2, .faq h3 {
	font-weight: 600;
}
.accordion-button {
	font-weight: 600;
}
.accordion-button:not(.collapsed) {
	background: #000;
	color: #fff;
}
.carcolors h6{
	font-weight: 600;
	color: #D12323;
}
.carcolors h2{
	font-weight: 800;
}
.carslider {
	padding:50px 0px;
}
.accordion-body {
	padding:0;
}
.carspecification{
	padding:50px 0px;
}
.carspecification h6{
	font-weight: 600;
	color: #D12323;
}
.carspecification h1{
	font-weight: 800;
}
.specs-table .spec-row {
    display: flex;
    border-bottom: 1px solid #adadad;
    padding: 24px 16px;
}
.specs-table .spec-name{
	width:40%;
}
.specs-table .spec-value{
	width:60%;
}
.footer {
	background: #212529;
	background-image: url(../images/topbg.png);
	color: #FFFFFF;
	font-size: 16px;
}
.footer p {
	padding-right: 10px;
}
.footer-title {
	color: #fff;
	margin-bottom: 20px;
	font-weight: 600;
}
.footer-links {
	list-style: none;
	padding: 0;
}
.footer-links li {
	margin-bottom: 8px;
}
.footer-links a {
	color: #ccc;
	text-decoration: none;
	transition: 0.3s;
}
.footer-links a:hover {
	color: #D12323;
	padding-left: 5px;
}
.footer .social-icons a {
	display: inline-block;
	margin-right: 10px;
	color: #fff;
	font-size: 18px;
}
.footer .social-icons a:hover {
	color: #D12323;
}
.copyrights {
	font-size: 13px;
}
.copyrights a {
	color: #ccc;
	text-decoration: none;
	transition: 0.3s;
}
.copyrights a:hover {
	color: #D12323;
}
.testimonial-box {
	max-width: 700px;
	margin: auto;
}
.testimonial-img {
	width: 90px;
	height: 90px;
	border-radius: 50%;
	margin-bottom: 15px;
}
.testimonial-text {
	font-size: 18px;
	color: #555;
	margin-bottom: 15px;
}
.testimonials h5 {
	margin-bottom: 5px;
	font-weight: 600;
}
.testimonials span {
	color: #888;
}
.testdriveform {
	background: #FFFFFF;
	padding: 25px;
	box-shadow: 0 8px 40px rgba(0,0,0,0.2);
	border-radius: 10px;
}
label {
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 5px;
}
.form-control, .form-select {
	margin-bottom: 20px;
}
.submit {
	background: #D12323;
	color: #FFFFFF;
	font-weight: bold;
	padding: 15px 0px;
}
.gmap {
	background: #D12323;
}
.inner-banner {
	background: #212529;
	background-image: url(../images/testdrivebg.jpg);
	background-position: center center;
	color: #FFFFFF;
	padding: 80px;
}
.inner-banner h1 {
	font-weight: 800;
}
.dealer-card {
	background: var(--card-bg);
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 2.5rem;
	max-width: 620px;
	width: 100%;
	box-shadow: 0 8px 40px rgba(0,0,0,0.2);
	transition: box-shadow 0.3s ease;
}
.dealer-card:hover {
	box-shadow: 0 12px 60px rgba(0,0,0, 0.4);
}
.region-badge {
	display: inline-block;
	background: rgba(0, 200, 160, 0.15);
	color: var(--teal);
	font-family: 'Syne', sans-serif;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 5px 14px;
	border-radius: 50px;
	margin-bottom: 1.2rem;
}
.region-badge i {
	font-size: 28px;
}
.dealer-name {
	font-weight: 800;
	line-height: 1.2;
	color: #000;
	margin-bottom: 0.6rem;
}
.dealer-address {
	color: var(--muted);
	font-size: 0.92rem;
	line-height: 1.6;
	margin-bottom: 1.6rem;
}
.info-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-bottom: 1.6rem;
}
.info-pill {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #222732;
	border: 1px solid #CCCCCC;
	border-radius: 50px;
	padding: 8px 18px;
	font-size: 0.87rem;
	color: #FFFFFF;
	text-decoration: none;
	transition: border-color 0.2s, color 0.2s;
}
.info-pill:hover {
	border-color: #CCC;
	color: #FFF;
}
.info-pill .icon {
	width: 18px;
	height: 18px;
	opacity: 0.75;
}
.rating-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 0.8rem;
}
.stars {
	color: #22c55e;
	font-size: 1.1rem;
	letter-spacing: 2px;
}
.rating-score {
	font-family: 'Syne', sans-serif;
	font-size: 1.1rem;
	font-weight: 700;
	color: #000;
}
.rating-count {
	color: #000;
	font-size: 0.85rem;
}
.serving-row {
	color: #000;
	font-size: 0.85rem;
	margin-bottom: 1.8rem;
}
.serving-row span {
	color: var(--text);
}
.divider {
	border: none;
	border-top: 1px solid #666;
	margin-bottom: 1.5rem;
}
.btn-directions {
	background: transparent;
	border: none;
	color: var(--teal);
	font-family: 'Syne', sans-serif;
	font-weight: 700;
	font-size: 0.95rem;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	transition: gap 0.2s ease;
	text-decoration: none;
}
.btn-directions:hover {
	gap: 10px;
	color: var(--teal);
}
.btn-directions .arrow {
	transition: transform 0.2s ease;
}
.btn-directions:hover .arrow {
	transform: translateX(4px);
}
.fixed-whatsapp {
	position:fixed;
	right:0;
	bottom:0;
	width:50px;
}
/* Center Card Highlight */
.owl-item.center .cardetails {
  transform: scale(1.05);
}

/* Navigation Arrows */
.owl-nav button {
  position: absolute;
  top: 40%;
  background: #000 !important;
  color: #fff !important;
  border-radius: 50% !important;
  width: 40px;
  height: 40px;
}

.owl-nav .owl-prev { left: -20px; }
.owl-nav .owl-next { right: -20px; }