driven.co.nz Ads.txt file
<!doctype html>
<html lang="en-nz">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="manifest" href="/resources/manifest/manifest.json">
<meta name="theme-color" content="#9FBE39" />
<link rel="apple-touch-icon" href="/resources/manifest/icons/ios/192.png">
<link rel="icon" href="/favicon.ico">
<meta name="robots" content="max-image-preview:large">
<meta name="facebook-domain-verification" content="81290gpz8nbox4jhhfsrgrgrhrfixc" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Alumni+Sans:wght@800&family=Nunito+Sans:wght@300;400;600;700&family=Poppins:wght@400;700&display=swap">
<link rel="stylesheet" href="/dist/tailwind.cfcb31ba01c88767b465.css">
<script type="text/javascript">
!(function (cfg) { function e() { cfg.onInit && cfg.onInit(i) } var S, u, D, t, n, i, C = window, x = document, w = C.location, I = "script", b = "ingestionendpoint", E = "disableExceptionTracking", A = "ai.device."; "instrumentationKey"[S = "toLowerCase"](), u = "crossOrigin", D = "POST", t = "appInsightsSDK", n = cfg.name || "appInsights", (cfg.name || C[t]) && (C[t] = n), i = C[n] || function (l) { var d = !1, g = !1, f = { initialize: !0, queue: [], sv: "7", version: 2, config: l }; function m(e, t) { var n = {}, i = "Browser"; function a(e) { e = "" + e; return 1 === e.length ? "0" + e : e } return n[A + "id"] = i[S](), n[A + "type"] = i, n["ai.operation.name"] = w && w.pathname || "_unknown_", n["ai.internal.sdkVersion"] = "javascript:snippet_" + (f.sv || f.version), { time: (i = new Date).getUTCFullYear() + "-" + a(1 + i.getUTCMonth()) + "-" + a(i.getUTCDate()) + "T" + a(i.getUTCHours()) + ":" + a(i.getUTCMinutes()) + ":" + a(i.getUTCSeconds()) + "." + (i.getUTCMilliseconds() / 1e3).toFixed(3).slice(2, 5) + "Z", iKey: e, name: "Microsoft.ApplicationInsights." + e.replace(/-/g, "") + "." + t, sampleRate: 100, tags: n, data: { baseData: { ver: 2 } }, ver: 4, seq: "1", aiDataContract: undefined } } var h = -1, v = 0, y = ["js.monitor.azure.com", "js.cdn.applicationinsights.io", "js.cdn.monitor.azure.com", "js0.cdn.applicationinsights.io", "js0.cdn.monitor.azure.com", "js2.cdn.applicationinsights.io", "js2.cdn.monitor.azure.com", "az416426.vo.msecnd.net"], k = l.url || cfg.src; if (k) { if ((n = navigator) && (~(n = (n.userAgent || "").toLowerCase()).indexOf("msie") || ~n.indexOf("trident/")) && ~k.indexOf("ai.3") && (k = k.replace(/(\/)(ai\.3\.)([^\d]*)$/, function (e, t, n) { return t + "ai.2" + n })), !1 !== cfg.cr) for (var e = 0; e < y.length; e++)if (0 < k.indexOf(y[e])) { h = e; break } var i = function (e) { var a, t, n, i, o, r, s, c, p, u; f.queue = [], g || (0 <= h && v + 1 < y.length ? (a = (h + v + 1) % y.length, T(k.replace(/^(.*\/\/)([\w\.]*)(\/.*)$/, function (e, t, n, i) { return t + y[a] + i })), v += 1) : (d = g = !0, o = k, c = (p = function () { var e, t = {}, n = l.connectionString; if (n) for (var i = n.split(";"), a = 0; a < i.length; a++) { var o = i[a].split("="); 2 === o.length && (t[o[0][S]()] = o[1]) } return t[b] || (e = (n = t.endpointsuffix) ? t.location : null, t[b] = "https://" + (e ? e + "." : "") + "dc." + (n || "services.visualstudio.com")), t }()).instrumentationkey || l.instrumentationKey || "", p = (p = p[b]) ? p + "/v2/track" : l.endpointUrl, (u = []).push((t = "SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details)", n = o, r = p, (s = (i = m(c, "Exception")).data).baseType = "ExceptionData", s.baseData.exceptions = [{ typeName: "SDKLoadFailed", message: t.replace(/\./g, "-"), hasFullStack: !1, stack: t + "\nSnippet failed to load [" + n + "] -- Telemetry is disabled\nHelp Link: https://go.microsoft.com/fwlink/?linkid=2128109\nHost: " + (w && w.pathname || "_unknown_") + "\nEndpoint: " + r, parsedStack: [] }], i)), u.push((s = o, t = p, (r = (n = m(c, "Message")).data).baseType = "MessageData", (i = r.baseData).message = 'AI (Internal): 99 message:"' + ("SDK LOAD Failure: Failed to load Application Insights SDK script (See stack for details) (" + s + ")").replace(/\"/g, "") + '"', i.properties = { endpoint: t }, n)), o = u, c = p, JSON && ((r = C.fetch) && !cfg.useXhr ? r(c, { method: D, body: JSON.stringify(o), mode: "cors" }) : XMLHttpRequest && ((s = new XMLHttpRequest).open(D, c), s.setRequestHeader("Content-type", "application/json"), s.send(JSON.stringify(o)))))) }, a = function (e, t) { g || setTimeout(function () { !t && f.core || i() }, 500), d = !1 }, T = function (e) { var n = x.createElement(I), e = (n.src = e, cfg[u]); return !e && "" !== e || "undefined" == n[u] || (n[u] = e), n.onload = a, n.onerror = i, n.onreadystatechange = function (e, t) { "loaded" !== n.readyState && "complete" !== n.readyState || a(0, t) }, cfg.ld && cfg.ld < 0 ? x.getElementsByTagName("head")[0].appendChild(n) : setTimeout(function () { x.getElementsByTagName(I)[0].parentNode.appendChild(n) }, cfg.ld || 0), n }; T(k) } try { f.cookie = x.cookie } catch (p) { } function t(e) { for (; e.length;)!function (t) { f[t] = function () { var e = arguments; d || f.queue.push(function () { f[t].apply(f, e) }) } }(e.pop()) } var r, s, n = "track", o = "TrackPage", c = "TrackEvent", n = (t([n + "Event", n + "PageView", n + "Exception", n + "Trace", n + "DependencyData", n + "Metric", n + "PageViewPerformance", "start" + o, "stop" + o, "start" + c, "stop" + c, "addTelemetryInitializer", "setAuthenticatedUserContext", "clearAuthenticatedUserContext", "flush"]), f.SeverityLevel = { Verbose: 0, Information: 1, Warning: 2, Error: 3, Critical: 4 }, (l.extensionConfig || {}).ApplicationInsightsAnalytics || {}); return !0 !== l[E] && !0 !== n[E] && (t(["_" + (r = "onerror")]), s = C[r], C[r] = function (e, t, n, i, a) { var o = s && s(e, t, n, i, a); return !0 !== o && f["_" + r]({ message: e, url: t, lineNumber: n, columnNumber: i, error: a, evt: C.event }), o }, l.autoExceptionInstrumented = !0), f }(cfg.cfg), (C[n] = i).queue && 0 === i.queue.length ? (i.queue.push(e), i.trackPageView({})) : e(); })({
src: "https://js.monitor.azure.com/scripts/b/ai.3.gbl.min.js",
crossOrigin: "anonymous",
onInit: function (sdk) {
// This filter will block successful remote dependency requests being logged.
sdk.addTelemetryInitializer(function (envelope) {
if (envelope.baseType === 'RemoteDependencyData') {
if (envelope.baseData.success) {
return false;
}
}
});
},
cfg: {
connectionString: "InstrumentationKey=87293971-ca0b-4de0-a6c7-dd41312c0ce5;IngestionEndpoint=https://australiaeast-0.in.applicationinsights.azure.com/;LiveEndpoint=https://australiaeast.livediagnostics.monitor.azure.com/;ApplicationId=e6126098-e670-47be-8e86-853642631274"
}
});
window.appInsights.trackPageView();
</script>
<script type="text/javascript">
var dfp_manual_start = true;
var dfp_site = "driven";
var dfp_path = "/home";
var dfp_tags={};
dfp_tags.pt = "home";
dfp_tags.oid = "01a81616-270c-40a5-8db5-79c16789b1b7";
</script>
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
<script type="text/javascript">
(function (c, l, a, r, i, t, y) {
c[a] = c[a] || function () { (c[a].q = c[a].q || []).push(arguments) };
t = l.createElement(r); t.async = 1; t.src = "https://www.clarity.ms/tag/" + i;
y = l.getElementsByTagName(r)[0]; y.parentNode.insertBefore(t, y);
})(window, document, "clarity", "script", "g8pp3y2fp3");
</script>
<!-- Google Tag Manager -->
<script>
(function (w, d, s, l, i) {
w[l] = w[l] || []; w[l].push({
'gtm.start':
new Date().getTime(), event: 'gtm.js'
}); var f = d.getElementsByTagName(s)[0],
j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-WHJP3JJ');</script>
<!-- End Google Tag Manager -->
<script type="text/javascript">
+function (a, p, P, b, y) {
a.braze = {}; a.brazeQueue = []; for (var s = "BrazeSdkMetadata DeviceProperties Card Card.prototype.dismissCard Card.prototype.removeAllSubscriptions Card.prototype.removeSubscription Card.prototype.subscribeToClickedEvent Card.prototype.subscribeToDismissedEvent Card.fromContentCardsJson ImageOnly CaptionedImage ClassicCard ControlCard ContentCards ContentCards.prototype.getUnviewedCardCount Feed Feed.prototype.getUnreadCardCount ControlMessage InAppMessage InAppMessage.SlideFrom InAppMessage.ClickAction InAppMessage.DismissType InAppMessage.OpenTarget InAppMessage.ImageStyle InAppMessage.Orientation InAppMessage.TextAlignment InAppMessage.CropType InAppMessage.prototype.closeMessage InAppMessage.prototype.removeAllSubscriptions InAppMessage.prototype.removeSubscription InAppMessage.prototype.subscribeToClickedEvent InAppMessage.prototype.subscribeToDismissedEvent InAppMessage.fromJson FullScreenMessage ModalMessage HtmlMessage SlideUpMessage User User.Genders User.NotificationSubscriptionTypes User.prototype.addAlias User.prototype.addToCustomAttributeArray User.prototype.addToSubscriptionGroup User.prototype.getUserId User.prototype.getUserId User.prototype.incrementCustomUserAttribute User.prototype.removeFromCustomAttributeArray User.prototype.removeFromSubscriptionGroup User.prototype.setCountry User.prototype.setCustomLocationAttribute User.prototype.setCustomUserAttribute User.prototype.setDateOfBirth User.prototype.setEmail User.prototype.setEmailNotificationSubscriptionType User.prototype.setFirstName User.prototype.setGender User.prototype.setHomeCity User.prototype.setLanguage User.prototype.setLastKnownLocation User.prototype.setLastName User.prototype.setPhoneNumber User.prototype.setPushNotificationSubscriptionType InAppMessageButton InAppMessageButton.prototype.removeAllSubscriptions InAppMessageButton.prototype.removeSubscription InAppMessageButton.prototype.subscribeToClickedEvent FeatureFlag FeatureFlag.prototype.getStringProperty FeatureFlag.prototype.getNumberProperty FeatureFlag.prototype.getBooleanProperty FeatureFlag.prototype.getImageProperty FeatureFlag.prototype.getJsonProperty FeatureFlag.prototype.getTimestampProperty automaticallyShowInAppMessages destroyFeed hideContentCards showContentCards showFeed showInAppMessage deferInAppMessage toggleContentCards toggleFeed changeUser destroy getDeviceId getDeviceId initialize isPushBlocked isPushPermissionGranted isPushSupported logCardClick logCardDismissal logCardImpressions logContentCardImpressions logContentCardClick logCustomEvent logFeedDisplayed logInAppMessageButtonClick logInAppMessageClick logInAppMessageHtmlClick logInAppMessageImpression logPurchase openSession requestPushPermission removeAllSubscriptions removeSubscription requestContentCardsRefresh requestFeedRefresh refreshFeatureFlags requestImmediateDataFlush enableSDK isDisabled setLogger setSdkAuthenticationSignature addSdkMetadata disableSDK subscribeToContentCardsUpdates subscribeToFeedUpdates subscribeToInAppMessage subscribeToSdkAuthenticationFailures toggleLogging unregisterPush wipeData handleBrazeAction subscribeToFeatureFlagsUpdates getAllFeatureFlags logFeatureFlagImpression isInitialized".split(" "), i = 0; i < s.length; i++) { for (var m = s[i], k = a.braze, l = m.split("."), j = 0; j < l.length - 1; j++)k = k[l[j]]; k[l[j]] = (new Function("return function " + m.replace(/\./g, "_") + "(){window.brazeQueue.push(arguments); return true}"))() } window.braze.getDeferredInAppMessage = function () { return new window.braze.InAppMessage }; window.braze.getCachedContentCards = function () { return new window.braze.ContentCards }; window.braze.getCachedFeed = function () { return new window.braze.Feed }; window.braze.getUser = function () { return new window.braze.User }; window.braze.getFeatureFlag = function () { return new window.braze.FeatureFlag }; (y = p.createElement(P)).type = 'text/javascript';
y.src = 'https://js.appboycdn.com/web-sdk/5.5/braze.min.js';
y.async = 1; (b = p.getElementsByTagName(P)[0]).parentNode.insertBefore(y, b)
}(window, document, 'script');
</script>
<script>
braze.initialize("c7a2d591-04ae-444e-b506-f44144abda2d", {
baseUrl: "https://sdk.iad-03.braze.com",
enableHtmlInAppMessages: true
});
braze.automaticallyShowInAppMessages();
braze.openSession();
</script>
<script async defer src="https://challenges.cloudflare.com/turnstile/v0/api.js"></script>
<script type="text/javascript">
var loopaData = {
"ProductId": "01a81616-270c-40a5-8db5-79c16789b1b7",
"Title": "Driven Car Guide - Reviews, Comparisons and Automotive News",
"Excerpt": "Get in-depth vehicle reviews, latest motoring news, car comparisons, and ask an expert. Find your next car.",
"Image": "",
};
</script>
<link rel="canonical" href="https://www.drivencarguide.co.nz/" />
<meta property="og:site_name" content="Home Page" />
<meta property="og:locale" content="en_NZ" />
<meta property="og:title" content="Driven Car Guide - Reviews, Comparisons and Automotive News" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://www.drivencarguide.co.nz/" />
<meta property="og:image" content="https://www.drivencarguide.co.nz/media/fdvley2v/untitled-design-43.png?v=1d9af783c9d7a30" />
<meta property="og:image:type" content="application/octet-stream" />
<meta property="og:image:width" content="710" />
<meta property="og:image:height" content="476" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@DrivenNZ">
<meta name="twitter:title" content="Driven Car Guide - Reviews, Comparisons and Automotive News">
<meta name="twitter:description" content="Get in-depth vehicle reviews, latest motoring news, car comparisons, and ask an expert. Find your next car.">
<meta name="twitter:image:src" content="/media/fdvley2v/untitled-design-43.png">
<meta name="twitter:domain" content="https://www.drivencarguide.co.nz">
<title>Driven Car Guide - Reviews, Comparisons and Automotive News - Driven Car Guide</title>
<meta name="description" content="Get in-depth vehicle reviews, latest motoring news, car comparisons, and ask an expert. Find your next car." />
<meta name="keywords" content="driven, car, guide, reviews, motoring, automotive, news, buying, nz, new zealand" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"WebSite","name":"Driven Car Guide","potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://www.drivencarguide.co.nz/article-search?term={search_term_string}"},"query-input":"required name=search_term_string"},"url":"https://www.drivencarguide.co.nz"}
</script>
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"Organization","name":"Driven Car Guide","url":"https://www.drivencarguide.co.nz/","logo":"https://www.drivencarguide.co.nz/resources/svg-files/DrivenLogoBlack.svg"}
</script>
</head>
<body id="page" class="tw-bg-gray-100">
<a class="tw-sr-only" href="#main">Skip to main content</a>
<!-- Google Tag Manager (noscript) -->
<noscript>
<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WHJP3JJ"
height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<!-- End Google Tag Manager (noscript) -->
<header class="tw-sticky tw-top-0 tw-inset-x-0 tw-z-10" role="banner" data-test-ui="site-header">
<div x-data="HeaderMenuOverlay" x-bind="container" class="tw-relative xl:tw-hidden tw-bg-gray-100 tw-text-gray-900" data-test-ui="site-header-small">
<div class="tw-flex tw-items-center tw-justify-between tw-gap-4 tw-py-3 tw-px-6">
<div class="tw-flex tw-justify-start tw-items-center tw-gap-2 xl:tw-w-0 xl:tw-flex-1">
<button x-on:click="toggleMenu" type="button" class="tw-p-1.5 tw--ml-2" aria-expanded="false">
<span class="tw-sr-only">Open menu</span>
<svg class="tw-w-5 tw-h-5" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Menu" /></svg>
</button>
<a class="tw-block tw-py-2" href="/">
<span class="tw-sr-only">Driven</span>
<img class="tw-w-[5rem]" src="/resources/svg-files/DrivenLogoBlack.svg" aria-hidden="true">
</a>
</div>
<div class="tw-flex tw-items-center tw-justify-end tw-gap-2">
<ul class="tw-flex tw-items-center tw-justify-end tw-gap-2">
<li>
<button class="tw-w-full c-btn c-btn--small" aria-expanded="false" x-data="globalSearchModalButton" x-bind="openButton" data-test-ui="button"><i class="c-btn__icon"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Search"></use></svg></i><span class="c-btn__label tw-sr-only sm:tw-not-sr-only">Search</span></button>
</li>
<li class="tw-shrink-0 md:tw-hidden">
<a href="/my-account/login/" class="c-btn c-btn--dark c-btn--small" target="_self" data-test-ui="button"><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#User"></use></svg></i><span class="c-btn__label">Sign in</span></a>
</li>
<li class="tw-hidden tw-shrink-0 md:tw-block">
<a href="/my-account/login/" x-data="loginButton" x-bind="loginButtonElm" class="c-btn c-btn--dark c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">Sign in</span></a>
</li>
</ul>
</div>
</div>
<div x-show="open" x-on:click.outside="closeMenu" class="tw-fixed tw-inset-x-0 tw-inset-y-0 tw-z-10 tw-scroll-smooth tw-overflow-auto tw-transform tw-transition xl:tw-hidden tw-bg-gray-900 tw-text-base-white" x-cloak style="display: none;">
<div class="tw-sticky tw-inset-x-0 tw-top-0 tw-z-10">
<div class="tw-flex tw-items-center tw-justify-between tw-gap-4 tw-py-3 tw-px-6 tw-bg-gray-900">
<div class="tw-flex tw-justify-start tw-items-center tw-gap-2 xl:tw-w-0 xl:tw-flex-1">
<button x-on:click="toggleMenu" type="button" class="tw-p-1.5 tw--ml-2" aria-expanded="false">
<span class="tw-sr-only">Close menu</span>
<svg class="tw-w-5 tw-h-5" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Close" /></svg>
</button>
<a class="tw-block tw-py-2" href="/">
<span class="tw-sr-only">Driven</span>
<img class="tw-w-[5rem]" src="/resources/svg-files/DrivenLogoWhite.svg" aria-hidden="true">
</a>
</div>
</div>
</div>
<nav class="tw-mt-6 tw-px-16">
<ul class="tw-text-xl tw-font-semibold">
<li>
<a href="/reviews/" class="tw-inline-block tw-w-full tw-py-3 hover:tw-text-base-white">Reviews</a>
</li>
<li>
<a href="/news/" class="tw-inline-block tw-w-full tw-py-3 hover:tw-text-base-white">News</a>
</li>
<li>
<a href="/advice/" class="tw-inline-block tw-w-full tw-py-3 hover:tw-text-base-white">Advice</a>
</li>
<li>
<a href="/collections/ev-news-reviews" class="tw-inline-block tw-w-full tw-py-3 hover:tw-text-base-white">Hybrid/EV</a>
</li>
<li>
<a href="/compare-cars/" class="tw-inline-block tw-w-full tw-py-3 hover:tw-text-base-white">Compare Cars</a>
</li>
</ul>
</nav>
</div>
</div>
<div class="tw-hidden tw-relative xl:tw-block tw-bg-gray-100 tw-text-gray-900" data-test-ui="site-header-large">
<div class="tw-container tw-flex tw-items-center tw-justify-between tw-py-4.5">
<div class="tw-flex tw-items-center tw-justify-start tw-gap-10">
<a class="tw-block" href="/">
<span class="tw-sr-only">Driven</span>
<img class="tw-w-[9.375rem] tw-h-[2.65rem]" src="/resources/svg-files/DrivenLogoBlack.svg" aria-hidden="true">
</a>
<nav>
<ul class="tw-flex tw-items-center tw-justify-start tw-gap-7">
<li>
<a class="tw-inline-block tw-p-1.25 tw-px-1 hover:tw-underline hover:tw-text-gray-900" href="/reviews/" class="tw-text-base tw-font-medium tw-text-gray-900">Reviews</a>
</li>
<li>
<a class="tw-inline-block tw-p-1.25 tw-px-1 hover:tw-underline hover:tw-text-gray-900" href="/news/" class="tw-text-base tw-font-medium tw-text-gray-900">News</a>
</li>
<li>
<a class="tw-inline-block tw-p-1.25 tw-px-1 hover:tw-underline hover:tw-text-gray-900" href="/advice/" class="tw-text-base tw-font-medium tw-text-gray-900">Advice</a>
</li>
<li>
<a class="tw-inline-block tw-p-1.25 tw-px-1 hover:tw-underline hover:tw-text-gray-900" href="/collections/ev-news-reviews" class="tw-text-base tw-font-medium tw-text-gray-900">Hybrid/EV</a>
</li>
<li>
<a class="tw-inline-block tw-p-1.25 tw-px-1 hover:tw-underline hover:tw-text-gray-900" href="/compare-cars/" class="tw-text-base tw-font-medium tw-text-gray-900">Compare Cars</a>
</li>
</ul>
</nav>
</div>
<div class="tw-flex tw-items-center tw-justify-end tw-gap-2">
<ul class="tw-flex tw-items-center tw-justify-end tw-gap-2">
<li>
<button class="tw-w-full c-btn c-btn--small" aria-expanded="false" x-data="globalSearchModalButton" x-bind="openButton" data-test-ui="button"><i class="c-btn__icon"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Search"></use></svg></i><span class="c-btn__label tw-sr-only sm:tw-not-sr-only">Search</span></button>
</li>
<li class="tw-shrink-0 md:tw-hidden">
<a href="/my-account/login/" class="c-btn c-btn--dark c-btn--small" target="_self" data-test-ui="button"><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#User"></use></svg></i><span class="c-btn__label">Sign in</span></a>
</li>
<li class="tw-hidden tw-shrink-0 md:tw-block">
<a href="/my-account/login/" x-data="loginButton" x-bind="loginButtonElm" class="c-btn c-btn--dark c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">Sign in</span></a>
</li>
</ul>
</div>
</div>
</div>
</header>
<aside id="ad_pushdown"
class="tw-px-[1.6875rem] md:tw-px-8"
data-test-ui="adunit"></aside>
<main id="main" role="main">
<div class="tw-hidden tw-items-center tw-justify-center tw-min-h-[23.25rem] tw-py-10 tw-bg-gray-200 lg:tw-flex">
<aside class="o-adunit"
aria-label="Advertisement leaderboard 1"
data-media-query="(min-width: 1024px)"
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-min-w-[728px] tw-min-h-[90px]"
data-adsize='[[728,90],[970,250]]'
data-adunit="leaderboard"
data-adpos="1"
data-test-ui="adunit"
id="ad_leaderboard1_1049696382"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
<div class="tw-bg-gray-100 tw-relative" x-data="searchCarGuide" id="Search">
<!-- Background Image -->
<div class="tw-hidden lg:tw-block tw-absolute tw-inset-0">
<div class="tw-grid tw-grid-cols-12 tw-relative tw-gap-4 tw-h-full">
<div class="tw-col-start-5 tw-col-end-13 tw-bg-gray-700 tw-relative">
<picture class="tw-absolute tw-inset-0 tw-w-full tw-h-full tw-object-cover tw-object-center">
<source media="(max-width: 639px)"
srcset="/media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=639&quality=95&v=1d9faab6fd6a5b0 1x, /media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=1278&quality=90&v=1d9faab6fd6a5b0 2x">
<source media="(max-width: 1023px)"
srcset="/media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=1023&quality=95&v=1d9faab6fd6a5b0 1x, /media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=2046&quality=90&v=1d9faab6fd6a5b0 2x">
<source media="(max-width: 1303px)"
srcset="/media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=1303&quality=95&v=1d9faab6fd6a5b0 1x, /media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?width=2606&quality=90&v=1d9faab6fd6a5b0 2x">
<img src="/media/ddgbe0vp/gc12284_drivencarguide_homepageimagery_1208x805-copy-2.png?height=805&quality=95&v=1d9faab6fd6a5b0"
alt="Hero Block Default"
class="tw-absolute tw-inset-0 tw-w-full tw-h-full tw-object-cover tw-object-center">
</picture>
</div>
</div>
</div>
<!-- Form Content -->
<div class="tw-container tw-mx-auto tw-py-8 tw-relative lg:tw-flex">
<div class="tw-bg-gray-100 lg:tw-p-6 lg:tw-rounded-2xl lg:tw-shadow-formContainer lg:tw-box-content">
<div class="tw-flex tw-flex-col tw-gap-y-4 lg:tw-gap-y-8">
<div>
<h2 class="tw-pb-1.5 tw-border-b-2 tw-border-b-primary-500 tw-font-semibold lg:tw-text-display-xs lg:tw-font-bold lg:tw-font-heading lg:tw-border-none lg:tw-pb-0">
Search Car Guide
</h2>
</div>
<!-- Search Inputs -->
<form action="/search" method="get" class="tw-max-w-[58.75rem]">
<div x-bind="searchContainer" class="tw-grid tw-gap-y-2 lg:tw-grid lg:tw-gap-x-8 lg:tw-grid-cols-1 lg:tw-w-[26.875rem]">
<!-- Search -->
<div class="tw-flex tw-flex-col tw-gap-y-3">
<div>
<label for="globalSearchArticleKeywords" class="tw-sr-only">Enter keyword/s</label>
<div data-test-ui="field" class="tw-relative tw-flex lg:tw-min-w-[26.625rem] tw-w-full" x-data="password"><input id="globalSearchArticleKeywords" class="tw-w-full tw-bg-white c-input c-input--light tw-peer tw-pl-10.5" name="term" type="search" autocomplete="off" placeholder="Search cars, news, reviews and advice" value="" data-focus-visible="false" data-test-ui="field-input" /><i class="c-input__icon c-input__icon-left tw-text-primary-500"><svg aria-hidden="true" class="tw-w-4.5 tw-h-4.5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Search"></use></svg></i></div>
</div>
<div class="tw-flex tw-flex-col tw-gap-2 md:tw-grid md:tw-grid-cols-2" x-data="selectVehicle">
<div class="c-select " x-data="selectVehicleMake">
<label class="tw-sr-only" for="make">Make</label>
<select id="make" class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
name="make"
autocomplete="off"
data-selected=""
tabindex="0"
x-bind="selectVehicleMakeElm">
<option value="">Any make</option>
<template x-for="make in makeList">
<option :value="getOptionMakeValue" x-text="getOptionMakeName"></option>
</template>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i class="tw-hidden peer-[&[data-loading=true]]:tw-block">
<span class="tw-sr-only">Loading</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" alt="loading" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
<div class="c-select " x-data="selectVehicleModel">
<label class="tw-sr-only" for="model"></label>
<select id="model" class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
name="model"
autocomplete="off"
data-selected=""
tabindex="0"
x-bind="selectVehicleModelElm">
<option value="">Any model</option>
<template x-for="model in modelList">
<option :value="getOptionModelValue" x-text="getOptionModelName"></option>
</template>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i class="tw-hidden peer-[&[data-loading=true]]:tw-block">
<span class="tw-sr-only">Loading</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" alt="loading" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
<button type="button" x-bind="toggleMoreOptionsTrigger" class="tw-hidden tw-items-center tw-font-semibold tw-gap-x-2 lg:tw-flex lg:tw-pb-4">
<span x-bind="moreOptions" class="tw-flex tw-items-center tw-gap-x-2 tw-mb-0.25">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span>More options</span>
</span>
<span x-bind="lessOptions" class="tw-flex tw-items-center tw-gap-x-2 tw-mb-0.25">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Minus" /></svg>
<span>Less options</span>
</span>
</button>
</div>
<!-- More options -->
<div x-bind="moreOptionsContainer">
<div class="tw-flex tw-flex-col tw-gap-2 md:tw-grid md:tw-grid-cols-2">
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any body type">Any body type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="hatchback_68bf466d21f16dfa" name="body" value="hatchback" data-label="Hatchback" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="hatchback_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="hatchback_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Hatchback</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="peoplemover_68bf466d21f16dfa" name="body" value="peoplemover" data-label="People Mover" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="peoplemover_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="peoplemover_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">People Mover</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="sedan_68bf466d21f16dfa" name="body" value="sedan" data-label="Sedan" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="sedan_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="sedan_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Sedan</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="sport_68bf466d21f16dfa" name="body" value="sport" data-label="Sport" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="sport_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="sport_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Sport</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="suv_68bf466d21f16dfa" name="body" value="suv" data-label="SUV" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="suv_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="suv_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">SUV</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="ute_68bf466d21f16dfa" name="body" value="ute" data-label="Ute" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="ute_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="ute_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Ute</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="van_68bf466d21f16dfa" name="body" value="van" data-label="Van" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="van_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="van_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Van</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="wagon_68bf466d21f16dfa" name="body" value="wagon" data-label="Wagon" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="wagon_68bf466d21f16dfa" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="wagon_68bf466d21f16dfa" data-disabled="false" data-test-ui="checkbox-label">Wagon</label>
</div>
</li>
</ul>
</div>
</div>
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any fuel type">Any fuel type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="petrol_322ad4e644bfe017" name="fuel" value="petrol" data-label="Petrol" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="petrol_322ad4e644bfe017" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="petrol_322ad4e644bfe017" data-disabled="false" data-test-ui="checkbox-label">Petrol</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="diesel_322ad4e644bfe017" name="fuel" value="diesel" data-label="Diesel" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="diesel_322ad4e644bfe017" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="diesel_322ad4e644bfe017" data-disabled="false" data-test-ui="checkbox-label">Diesel</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="hybrid_322ad4e644bfe017" name="fuel" value="hybrid" data-label="Hybrid" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="hybrid_322ad4e644bfe017" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="hybrid_322ad4e644bfe017" data-disabled="false" data-test-ui="checkbox-label">Hybrid</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="electric_322ad4e644bfe017" name="fuel" value="electric" data-label="Electric" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="electric_322ad4e644bfe017" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="electric_322ad4e644bfe017" data-disabled="false" data-test-ui="checkbox-label">Electric</label>
</div>
</li>
</ul>
</div>
</div>
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any usage type">Any usage type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="off-road_3171732188c04b8" name="usageType" value="off-road" data-label="Off-road" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="off-road_3171732188c04b8" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="off-road_3171732188c04b8" data-disabled="false" data-test-ui="checkbox-label">Off-road</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="family_3171732188c04b8" name="usageType" value="family" data-label="Family" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="family_3171732188c04b8" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="family_3171732188c04b8" data-disabled="false" data-test-ui="checkbox-label">Family</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="performance_3171732188c04b8" name="usageType" value="performance" data-label="Performance" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="performance_3171732188c04b8" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="performance_3171732188c04b8" data-disabled="false" data-test-ui="checkbox-label">Performance</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="luxury_3171732188c04b8" name="usageType" value="luxury" data-label="Luxury" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="luxury_3171732188c04b8" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="luxury_3171732188c04b8" data-disabled="false" data-test-ui="checkbox-label">Luxury</label>
</div>
</li>
</ul>
</div>
</div>
<div class="c-select ">
<label class="tw-sr-only" for="safety">Choose a safety rating</label>
<select class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
id="safety"
name="safety"
autocomplete="off">
<option value="">Any safety rating</option>
<option value="5">5 stars</option>
<option value="4">4 stars or more</option>
<option value="3">3 stars or more</option>
<option value="2">2 stars or more</option>
<option value="1">1 star or more</option>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</div>
<div class="md:tw-col-span-2">
<div class="tw-relative tw-grid tw-grid-cols-2 tw-gap-2">
<div class="c-dropdown-container"><select ds-dropdown aria-label="Year" name="fromYear" tabindex="0" autocomplete="off" class="c-dropdown-control c-dropdown-control--light tw-peer">
<option value="0">From any year</option>
<option value="2026">2026</option>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
</select><i class="c-dropdown-control__icon peer-disabled:tw-text-gray-500"><svg aria-hidden="true" class="tw-w-5 tw-h-5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown"></use></svg></i></div>
<div class="c-dropdown-container"><select ds-dropdown aria-label="To any year" name="toYear" tabindex="0" autocomplete="off" class="c-dropdown-control c-dropdown-control--light tw-peer">
<option value="0">To any year</option>
<option value="2026">2026</option>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
</select><i class="c-dropdown-control__icon peer-disabled:tw-text-gray-500"><svg aria-hidden="true" class="tw-w-5 tw-h-5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown"></use></svg></i></div>
<div class="tw-absolute tw-inset-0 tw-flex tw-items-center tw-justify-center tw-pointer-events-none">
<div class="tw-flex tw-items-center tw-justify-center tw-outline-4 tw-outline tw-border-2 tw-outline-gray-100 tw-bg-gray-100 tw-border-primary-700 tw-text-primary-700 tw-p-0.5 tw-rounded-full tw-pointer-events-none">
<svg class="tw-w-4 tw-h-4 tw-text-current" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowRightSmall" /></svg>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Checkboxes and Buttons -->
<div class="tw-flex tw-flex-col tw-gap-y-4">
<button type="button" x-bind="toggleMoreOptionsTrigger" class="tw-flex tw-items-center tw-font-semibold tw-gap-x-2 lg:tw-hidden">
<span x-bind="moreOptions" class="tw-flex tw-items-center tw-gap-x-2">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span>More options</span>
</span>
<span x-bind="lessOptions" class="tw-flex tw-items-center tw-gap-x-2">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span>Less options</span>
</span>
</button>
<div class="tw-flex tw-flex-wrap tw-gap-2 tw-justify-between">
<div class="tw-flex tw-items-center tw-gap-x-2">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="carProfiles_7434BD5B" value="car-profiles" type="checkbox" checked data-reset-checked autocomplete="off" class="tw-peer c-input-checkbox__element c-input" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label for="carProfiles_7434BD5B" for="carProfiles_7434BD5B" class="tw-m-0" data-test-ui="checkbox-label">Car Profiles</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="reviews_7434BD5B" value="reviews" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label for="reviews_7434BD5B" for="reviews_7434BD5B" class="tw-m-0" data-test-ui="checkbox-label">Reviews</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="news_7434BD5B" value="news" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label for="news_7434BD5B" for="news_7434BD5B" class="tw-m-0" data-test-ui="checkbox-label">News</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="advice_7434BD5B" value="advice" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label for="advice_7434BD5B" for="advice_7434BD5B" class="tw-m-0" data-test-ui="checkbox-label">Advice</label>
</div>
</div>
</div>
<div class="tw-flex tw-gap-x-2 tw-justify-between">
<button class="tw-flex-1 c-btn" data-test-ui="button">
Search
</button>
<button type="reset" x-bind="resetBtnElm" class="c-btn c-btn--dark" data-test-ui="button">
Reset
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div>
<div class="md:tw-container tw-relative tw-isolate swiper tw-px-6 tw-mt-12 md:tw-mt-16 lg:tw-mt-20 xl:tw-mt-24 c-portrait-carousel" data-slider="portraitCarouselBlock" data-test-ui="portrait-carousel-block">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash tw-text-display-sm lg:tw-text-display-md xl:tw-text-display-lg" data-test-ui="header-title">New on DRIVEN Car Guide</h2>
</div>
<div class="tw-py-10 swiper-wrapper">
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/ywfhdtzy/speed-001.jpg?height=351&quality=95&v=1dbcd96e235d990 1x,
/media/ywfhdtzy/speed-001.jpg?height=702&quality=90&v=1dbcd96e235d990 2x">
<source media="(max-width: 1023px)"
srcset="/media/ywfhdtzy/speed-001.jpg?height=210&quality=95&v=1dbcd96e235d990 1x,
/media/ywfhdtzy/speed-001.jpg?height=420&quality=90&v=1dbcd96e235d990 2x">
<source media="(max-width: 1303px)"
srcset="/media/ywfhdtzy/speed-001.jpg?height=333&quality=95&v=1dbcd96e235d990 1x,
/media/ywfhdtzy/speed-001.jpg?height=666&quality=90&v=1dbcd96e235d990 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/ywfhdtzy/speed-001.jpg?height=438&v=1dbcd96e235d990" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/nz-motorway-speed-limit-increase-tomorrow-110kmh-for-sh1-section-north-of-orewa/">Speed limit increase: 110km/h north of Orewa</a>
</h3>
</div>
</div>
<a href="/news/nz-motorway-speed-limit-increase-tomorrow-110kmh-for-sh1-section-north-of-orewa/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Speed limit increase: 110km/h north of Orewa</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=351&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=702&quality=90&v=1dbc9a3e677e170 2x">
<source media="(max-width: 1023px)"
srcset="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=210&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=420&quality=90&v=1dbc9a3e677e170 2x">
<source media="(max-width: 1303px)"
srcset="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=333&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=666&quality=90&v=1dbc9a3e677e170 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?height=438&v=1dbc9a3e677e170" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</h3>
</div>
</div>
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/qzgfczke/roller-003.jpg?height=351&quality=95&v=1dbcbbc9e752890 1x,
/media/qzgfczke/roller-003.jpg?height=702&quality=90&v=1dbcbbc9e752890 2x">
<source media="(max-width: 1023px)"
srcset="/media/qzgfczke/roller-003.jpg?height=210&quality=95&v=1dbcbbc9e752890 1x,
/media/qzgfczke/roller-003.jpg?height=420&quality=90&v=1dbcbbc9e752890 2x">
<source media="(max-width: 1303px)"
srcset="/media/qzgfczke/roller-003.jpg?height=333&quality=95&v=1dbcbbc9e752890 1x,
/media/qzgfczke/roller-003.jpg?height=666&quality=90&v=1dbcbbc9e752890 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/qzgfczke/roller-003.jpg?height=438&v=1dbcbbc9e752890" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/">Rolls-Royce Auckland showroom: purple perfection?</a>
</h3>
</div>
</div>
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Rolls-Royce Auckland showroom: purple perfection?</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/geydxbbw/ariya-006.jpg?height=351&quality=95&v=1dbb8e60d62cfd0 1x,
/media/geydxbbw/ariya-006.jpg?height=702&quality=90&v=1dbb8e60d62cfd0 2x">
<source media="(max-width: 1023px)"
srcset="/media/geydxbbw/ariya-006.jpg?height=210&quality=95&v=1dbb8e60d62cfd0 1x,
/media/geydxbbw/ariya-006.jpg?height=420&quality=90&v=1dbb8e60d62cfd0 2x">
<source media="(max-width: 1303px)"
srcset="/media/geydxbbw/ariya-006.jpg?height=333&quality=95&v=1dbb8e60d62cfd0 1x,
/media/geydxbbw/ariya-006.jpg?height=666&quality=90&v=1dbb8e60d62cfd0 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/geydxbbw/ariya-006.jpg?height=438&v=1dbb8e60d62cfd0" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/reviews/nissan-ariya-engage-review-green-effect/">Nissan Ariya Engage review: green effect</a>
</h3>
</div>
</div>
<a href="/reviews/nissan-ariya-engage-review-green-effect/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Nissan Ariya Engage review: green effect</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=351&quality=95&v=1dbcb89fd137330 1x,
/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=702&quality=90&v=1dbcb89fd137330 2x">
<source media="(max-width: 1023px)"
srcset="/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=210&quality=95&v=1dbcb89fd137330 1x,
/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=420&quality=90&v=1dbcb89fd137330 2x">
<source media="(max-width: 1303px)"
srcset="/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=333&quality=95&v=1dbcb89fd137330 1x,
/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=666&quality=90&v=1dbcb89fd137330 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/iotd5ze5/hyundai-obsidian-car-design-event-2025-2.webp?height=438&v=1dbcb89fd137330" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/hyundai-obsidian-is-a-concept-ev-that-skips-the-classroom-rules/">Hyundai Obsidian is sharp, sleek & just for show</a>
</h3>
</div>
</div>
<a href="/news/hyundai-obsidian-is-a-concept-ev-that-skips-the-classroom-rules/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Hyundai Obsidian is sharp, sleek & just for show</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/5cllxwbe/audi-s5-avant-002.jpg?height=351&quality=95&v=1dbc994adf32ee0 1x,
/media/5cllxwbe/audi-s5-avant-002.jpg?height=702&quality=90&v=1dbc994adf32ee0 2x">
<source media="(max-width: 1023px)"
srcset="/media/5cllxwbe/audi-s5-avant-002.jpg?height=210&quality=95&v=1dbc994adf32ee0 1x,
/media/5cllxwbe/audi-s5-avant-002.jpg?height=420&quality=90&v=1dbc994adf32ee0 2x">
<source media="(max-width: 1303px)"
srcset="/media/5cllxwbe/audi-s5-avant-002.jpg?height=333&quality=95&v=1dbc994adf32ee0 1x,
/media/5cllxwbe/audi-s5-avant-002.jpg?height=666&quality=90&v=1dbc994adf32ee0 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/5cllxwbe/audi-s5-avant-002.jpg?height=438&v=1dbc994adf32ee0" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/reviews/audi-s5-avant-review-numbers-game/">Audi S5 Avant review: numbers game</a>
</h3>
</div>
</div>
<a href="/reviews/audi-s5-avant-review-numbers-game/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Audi S5 Avant review: numbers game</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/25xbij5h/disco-006.jpg?height=351&quality=95&v=1dbcbc54a556d70 1x,
/media/25xbij5h/disco-006.jpg?height=702&quality=90&v=1dbcbc54a556d70 2x">
<source media="(max-width: 1023px)"
srcset="/media/25xbij5h/disco-006.jpg?height=210&quality=95&v=1dbcbc54a556d70 1x,
/media/25xbij5h/disco-006.jpg?height=420&quality=90&v=1dbcbc54a556d70 2x">
<source media="(max-width: 1303px)"
srcset="/media/25xbij5h/disco-006.jpg?height=333&quality=95&v=1dbcbc54a556d70 1x,
/media/25xbij5h/disco-006.jpg?height=666&quality=90&v=1dbcbc54a556d70 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/25xbij5h/disco-006.jpg?height=438&v=1dbcbc54a556d70" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/land-rover-discovery-tempest-for-nz-4x4-7-seater-goes-further-down-the-luxury-route/">Land Rover Discovery Tempest for NZ</a>
</h3>
</div>
</div>
<a href="/news/land-rover-discovery-tempest-for-nz-4x4-7-seater-goes-further-down-the-luxury-route/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Land Rover Discovery Tempest for NZ</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/5j3ht10o/20250424_140234.jpg?height=351&quality=95&v=1dbbf521c985390 1x,
/media/5j3ht10o/20250424_140234.jpg?height=702&quality=90&v=1dbbf521c985390 2x">
<source media="(max-width: 1023px)"
srcset="/media/5j3ht10o/20250424_140234.jpg?height=210&quality=95&v=1dbbf521c985390 1x,
/media/5j3ht10o/20250424_140234.jpg?height=420&quality=90&v=1dbbf521c985390 2x">
<source media="(max-width: 1303px)"
srcset="/media/5j3ht10o/20250424_140234.jpg?height=333&quality=95&v=1dbbf521c985390 1x,
/media/5j3ht10o/20250424_140234.jpg?height=666&quality=90&v=1dbbf521c985390 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/5j3ht10o/20250424_140234.jpg?height=438&v=1dbbf521c985390" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/reviews/ram-1500-limited-hurricane-ho-review-straight-talking-turbo-6-is-superb/">Ram Hurricane review: straight talking</a>
</h3>
</div>
</div>
<a href="/reviews/ram-1500-limited-hurricane-ho-review-straight-talking-turbo-6-is-superb/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Ram Hurricane review: straight talking</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/fvjl1mpo/p90598614_highres.jpg?height=351&quality=95&v=1dbcb8785a0e820 1x,
/media/fvjl1mpo/p90598614_highres.jpg?height=702&quality=90&v=1dbcb8785a0e820 2x">
<source media="(max-width: 1023px)"
srcset="/media/fvjl1mpo/p90598614_highres.jpg?height=210&quality=95&v=1dbcb8785a0e820 1x,
/media/fvjl1mpo/p90598614_highres.jpg?height=420&quality=90&v=1dbcb8785a0e820 2x">
<source media="(max-width: 1303px)"
srcset="/media/fvjl1mpo/p90598614_highres.jpg?height=333&quality=95&v=1dbcb8785a0e820 1x,
/media/fvjl1mpo/p90598614_highres.jpg?height=666&quality=90&v=1dbcb8785a0e820 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/fvjl1mpo/p90598614_highres.jpg?height=438&v=1dbcb8785a0e820" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/bmw-begins-all-solid-state-battery-tests-in-i7-prototype/">BMW i7 begins testing all-solid-state battery tech</a>
</h3>
</div>
</div>
<a href="/news/bmw-begins-all-solid-state-battery-tests-in-i7-prototype/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">BMW i7 begins testing all-solid-state battery tech</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=351&quality=95&v=1dbcb359692cd30 1x,
/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=702&quality=90&v=1dbcb359692cd30 2x">
<source media="(max-width: 1023px)"
srcset="/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=210&quality=95&v=1dbcb359692cd30 1x,
/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=420&quality=90&v=1dbcb359692cd30 2x">
<source media="(max-width: 1303px)"
srcset="/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=333&quality=95&v=1dbcb359692cd30 1x,
/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=666&quality=90&v=1dbcb359692cd30 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/5ckdkh2t/2025-nissan-micra-1-2048x1353.webp?height=438&v=1dbcb359692cd30" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/news/nissan-micra-returns-as-all-electric-hatchback-with-suv-looks/">Nissan Micra returns as all-electric hatchback</a>
</h3>
</div>
</div>
<a href="/news/nissan-micra-returns-as-all-electric-hatchback-with-suv-looks/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Nissan Micra returns as all-electric hatchback</a>
</div>
</div>
</div>
<button class="c-portrait-carousel-slide-button c-portrait-carousel-slide-button-prev c-btn-icon c-btn-icon--white-transparent c-btn-icon--small" data-test-ui="button-icon"><i><svg aria-hidden="true" class="tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltLeft"></use></svg></i><span class="tw-sr-only">Previous</span></button>
<button class="c-portrait-carousel-slide-button c-portrait-carousel-slide-button-next c-btn-icon c-btn-icon--white-transparent c-btn-icon--small" data-test-ui="button-icon"><i><svg aria-hidden="true" class="tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i><span class="tw-sr-only">Next</span></button>
</div>
</div>
<div class="tw-bg-gray-900" data-test-ui="call-to-action">
<div class="tw-container tw-py-12 lg:tw-py-8 xl:tw-py-12">
<div class="tw-mx-auto">
<dl class="tw-grid tw-grid-cols-1 tw-gap-x-8 tw-gap-y-8 lg:tw-grid-cols-3">
<div class="tw-flex tw-flex-col tw-text-center lg:tw-text-left u-blocklink">
<dt class=" tw-text-2xl tw-font-bold tw-leading-8 tw-font-heading tw-text-base-white xl:tw-text-3xl">
<a href="/news/">
Latest News
</a>
</dt>
<dd class="tw-flex-auto tw-flex-col tw-text-base tw-font-normal tw-font-sans tw-text-base-white">
<p class="tw-mt-2">Local & global automotive news</p>
<p class="tw-mt-6">
<a href="/news/" class="tw-inline-flex tw-gap-2 tw-items-center tw-text-sm tw-font-semibold tw-text-primary-500">
<span>
News
</span>
<svg class="tw-w-4 tw-h-4 tw-inline-block" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowNarrowRight" /></svg>
</a>
</p>
</dd>
<a href="/news/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">
News
</a>
</div>
<div class="tw-flex tw-flex-col tw-text-center lg:tw-text-left u-blocklink">
<dt class=" tw-text-2xl tw-font-bold tw-leading-8 tw-font-heading tw-text-base-white xl:tw-text-3xl">
<a href="/reviews/">
Car Reviews
</a>
</dt>
<dd class="tw-flex-auto tw-flex-col tw-text-base tw-font-normal tw-font-sans tw-text-base-white">
<p class="tw-mt-2">Behind-the-wheel in the latest models</p>
<p class="tw-mt-6">
<a href="/reviews/" class="tw-inline-flex tw-gap-2 tw-items-center tw-text-sm tw-font-semibold tw-text-primary-500">
<span>
Reviews
</span>
<svg class="tw-w-4 tw-h-4 tw-inline-block" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowNarrowRight" /></svg>
</a>
</p>
</dd>
<a href="/reviews/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">
Reviews
</a>
</div>
<div class="tw-flex tw-flex-col tw-text-center lg:tw-text-left u-blocklink">
<dt class=" tw-text-2xl tw-font-bold tw-leading-8 tw-font-heading tw-text-base-white xl:tw-text-3xl">
<a href="/advice/">
Car Advice
</a>
</dt>
<dd class="tw-flex-auto tw-flex-col tw-text-base tw-font-normal tw-font-sans tw-text-base-white">
<p class="tw-mt-2">Tips and tricks for smooth motoring</p>
<p class="tw-mt-6">
<a href="/advice/" class="tw-inline-flex tw-gap-2 tw-items-center tw-text-sm tw-font-semibold tw-text-primary-500">
<span>
Advice
</span>
<svg class="tw-w-4 tw-h-4 tw-inline-block" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowNarrowRight" /></svg>
</a>
</p>
</dd>
<a href="/advice/" class="u-blocklink__link" tabindex="-1" aria-hidden="true">
Advice
</a>
</div>
</dl>
</div>
</div>
</div>
<div class="tw-hidden lg:tw-block tw-py-10 tw-bg-gray-200">
<aside class="o-adunit"
aria-label="Advertisement leaderboard 2"
data-media-query="(min-width: 1024px)"
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-min-w-[728px] tw-min-h-[90px]"
data-adsize='[728,90]'
data-adunit="leaderboard"
data-adpos="2"
data-test-ui="adunit"
id="ad_leaderboard2_1506911608"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
<section data-test-ui="compare-block" id="carComparison">
<header class="tw-my-10 tw-mb-10">
<div class="tw-container">
<div class="tw-flex tw-flex-col tw-gap-y-8 lg:tw-grid lg:tw-grid-cols-12 lg:tw-gap-x-6 xl:tw-gap-x-8">
<div class="tw-flex tw-flex-col tw-gap-y-8 lg:tw-col-span-8 xl:tw-col-span-8">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h1 class="c-header-title o-slash tw-font-bold tw-text-display-xs md:tw-text-display-sm lg:tw-text-display-md xl:tw-text-display-lg" data-test-ui="header-title" x-bind="titleElm">Compare Cars</h1>
<p class="c-header-tagline tw-text-sm md:tw-text-md xl:tw-text-lg" data-test-ui="header-tagline" x-bind="taglineElm">Need helping choosing the right car? Use our comparison tool to see how different cars stack up in the areas that matter most to you. You can compare up to three cars at a time!</p>
</div>
</div>
</div>
</div>
</header>
<div class="tw-scroll-smooth tw-overflow-x-auto md:tw-overflow-visible">
<div class="tw-flex tw-flex-col tw-min-w-[36.875rem]">
<section class="tw-top-[-7rem] tw-w-full tw-pb-6 tw-bg-gradient-to-b tw-from-transparent tw-from-40% tw-to-gray-900 tw-to-40%
md:tw-sticky md:tw-z-1 md:tw-top-[-8rem] md:tw-inset-x-0
lg:tw-top-[-9rem]
xl:tw-top-[-11.5rem]">
<div class="tw-container tw-flex tw-flex-col tw-gap-10">
<div class="tw-flex tw-justify-center tw-gap-4">
<div class="tw-relative tw-items-stretch tw-w-[16.875rem] tw-pointer-events-auto"
data-profile-index="0"
data-has-profile="false">
<div class="tw-h-full">
<button class="tw-h-full tw-min-h-[16.25rem] md:tw-min-h-[18.125rem] xl:tw-min-h-[20.75rem] tw-w-full tw-max-w-[18.75rem] tw-px-2 tw-py-4 tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-bg-white disabled:tw-bg-gray-200 disabled:tw-text-gray-400 tw-group tw-transition-opacity"
x-bind="addVehicleButtonElm" x-data="CompareBlockAddbutton">
<svg class="tw-inline tw-w-10.5 tw-h-10.5 tw-text-primary-800 group-disabled:tw-text-gray-400
)" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span class="tw-font-bold tw-text-md">Add a car</span>
</button>
</div>
</div>
<div class="tw-relative tw-items-stretch tw-w-[16.875rem] tw-pointer-events-auto"
data-profile-index="1"
data-has-profile="false">
<div class="tw-h-full">
<button class="tw-h-full tw-min-h-[16.25rem] md:tw-min-h-[18.125rem] xl:tw-min-h-[20.75rem] tw-w-full tw-max-w-[18.75rem] tw-px-2 tw-py-4 tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-bg-white disabled:tw-bg-gray-200 disabled:tw-text-gray-400 tw-group tw-transition-opacity"
x-bind="addVehicleButtonElm" x-data="CompareBlockAddbutton" disabled="true">
<svg class="tw-inline tw-w-10.5 tw-h-10.5 tw-text-primary-800 group-disabled:tw-text-gray-400
)" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span class="tw-font-bold tw-text-md">Add a car</span>
</button>
</div>
</div>
<div class="tw-relative tw-items-stretch tw-w-[16.875rem] tw-pointer-events-auto"
data-profile-index="2"
data-has-profile="false">
<div class="tw-h-full">
<button class="tw-h-full tw-min-h-[16.25rem] md:tw-min-h-[18.125rem] xl:tw-min-h-[20.75rem] tw-w-full tw-max-w-[18.75rem] tw-px-2 tw-py-4 tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-flex tw-flex-col tw-gap-y-4 tw-justify-center tw-items-center tw-bg-white disabled:tw-bg-gray-200 disabled:tw-text-gray-400 tw-group tw-transition-opacity"
x-bind="addVehicleButtonElm" x-data="CompareBlockAddbutton" disabled="true">
<svg class="tw-inline tw-w-10.5 tw-h-10.5 tw-text-primary-800 group-disabled:tw-text-gray-400
)" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span class="tw-font-bold tw-text-md">Add a car</span>
</button>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<div class="tw-flex tw-justify-center tw-bg-gray-900 tw-pb-10 tw-pt-4">
<a href="/compare-cars/" class="tw-w-[16.875rem] c-btn" target="_self" data-test-ui="button">Compare Now</a>
</div>
<div class="tw-h-full" data-test-ui="modal-wrapper" x-data="modal" x-cloak="" data-modal-id="modal.compareblock.add.vehicle" aria-labelledby="modal.compareblock.add.vehicle">
<div role="dialog" aria-modal="true" data-test-ui="modal-container" aria-labelledby="AddCarModalTitle" aria-describedby="AddCarModalDesc" x-bind="modalContainer" class="tw-relative tw-z-10"><div class="o-modal-background tw-bg-base-white md:tw-bg-base-black md:tw-bg-opacity-60"></div><div class="o-modal"> <div class="o-modal__container"> <aside class="o-modal__inner-container md:tw-max-w-[25.875rem] lg:tw-max-w-[29.25rem] xl:tw-max-w-[37.75rem] tw-h-full md:tw-h-auto" x-bind="modalContent"><div class="o-modal__close"><button class="tw-p-2" x-bind="modalClose"><span class="tw-sr-only">Close</span><i><svg aria-hidden="true" class="tw-w-5.5 tw-h-5.5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Close"></use></svg></i></button></div><div data-has-image="false" class="o-modal__content data-[has-image=true]:tw-pt-6 lg:tw-px-10 lg:tw-pb-10 lg:data-[has-image=true]:tw-pt-10">
<div>
<h2 id="AddCarTitle" class="tw-text-display-xs lg:tw-text-display-sm tw-font-bold tw-font-heading tw-text-gray-900 tw-text-center tw-mb-8">
Add a car
</h2>
<form autocomplete="off" action="" method="post">
<div class="tw-flex tw-flex-col tw-gap-8 tw-w-full"
x-data="CompareBlockAddmodal" data-path="/compare-cars/">
<div class="tw-flex tw-flex-col tw-gap-y-6 -lg:tw-grow -lg:tw-rounded-r-none">
<div class="tw-relative tw-w-full tw-rounded tw-bg-gray-100">
<label for="globalSearchVehicleProfileMake" class="tw-sr-only">Make</label>
<div class="c-select">
<select id="globalSearchVehicleProfileMake" class="c-select__control tw-w-full
lg:tw-rounded lg:tw-rounded-r-none tw-pr-12"
x-bind="makeSelectElm"
name="make"
autocomplete="off">
<option value="" disabled selected>Choose a make</option>
<template x-for="option in vehicleMakeList">
<option :value="getOptionValue" x-text="getOptionName"></option>
</template>
</select>
<i x-bind="makeIndicatorElm">
<svg aria-hidden="false" class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i x-bind="makeLoadingElm">
<span class="tw-sr-only">Loading makes</span>
<svg aria-hidden="true" class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
<div class="tw-relative tw-w-full tw-rounded tw-bg-gray-100">
<label for="globalSearchVehicleProfileModel" class="tw-sr-only">Model</label>
<div class="c-select">
<select id="globalSearchVehicleProfileModel" class="c-select__control tw-w-full tw-bg-transparent
lg:tw-rounded-none tw-pr-12"
x-bind="modelSelectElm"
name="model"
autocomplete="off">
<option value="" disabled="true" selected>Choose a model</option>
<template x-for="option in vehicleModelList">
<option :value="getOptionValue" x-text="getOptionName"></option>
</template>
</select>
<i x-bind="modelIndicatorElm">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i x-bind="modelLoadingElm">
<span class="tw-sr-only">Loading models</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
<div class="tw-relative tw-w-full tw-rounded tw-bg-gray-100">
<label for="globalSearchVehicleProfileModel" class="tw-sr-only">Year</label>
<div class="c-select">
<select id="globalSearchVehicleProfileYear" class="c-select__control tw-w-full tw-bg-transparent
lg:tw-rounded-none tw-pr-12"
x-bind="yearSelectElm"
name="year"
autocomplete="off">
<option value="" disabled="true" selected>Choose a year</option>
<template x-for="option in vehicleYearList">
<option :value="getOptionValue" x-text="getOptionName"></option>
</template>
</select>
<i x-bind="yearIndicatorElm">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i x-bind="yearLoadingElm">
<span class="tw-sr-only">Loading years</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
<div class="tw-relative tw-w-full tw-rounded tw-bg-gray-100">
<label for="globalSearchVehicleProfileModel" class="tw-sr-only">Variant</label>
<div class="c-select">
<select id="globalSearchVehicleProfileYear" class="c-select__control tw-w-full tw-bg-transparent
lg:tw-rounded-none tw-pr-12"
x-bind="modelVariantSelectElm"
name="modelVariant"
autocomplete="off">
<option value="" disabled="true" selected>Choose a model variant</option>
<template x-for="option in vehicleModelVariantList">
<option :value="getOptionKey" x-text="getOptionLabel"></option>
</template>
</select>
<i x-bind="modelVariantIndicatorElm">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i x-bind="modelVariantLoadingElm">
<span class="tw-sr-only">Loading years</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
</div>
<button x-bind="addToCompareButtonElm" class="tw-shrink-0
lg:tw-rounded-l-none c-btn" data-test-ui="button">
Add to Comparison
</button>
</div>
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8F5Iz3HUtb5AujLSxCKKhc8giJFlniRsanLV9ch2kFUzRwpSMQ5A1cTOrXrlRMBt8zuPvGX47aJL8vCerzkb5LdlmG-nIpbble_c-m7rFlUJCgeomk_x9FsYhepZjdmVJw5-slAJTm_fHhF-yU9ODaU" /></form>
</div>
</div> </aside> </div></div></div>
</div>
</section>
<div data-test-ui="story-list-5-block-element">
<section class="tw-text-gray-900 tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Primary"
data-test-ui="story-list-5-block">
<div class="tw-container tw-flex tw-flex-col
tw-items-center tw-gap-8 tw-py-10
md:tw-justify-center md:tw-gap-10 md:tw-py-16">
<div
class="tw-flex tw-flex-row tw-items-start tw-gap-6 tw-w-full">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Latest News</h2>
</div>
<div
class="
tw-hidden tw-ml-auto
md:tw-block
"
>
<a href="https://www.drivencarguide.co.nz/article-search/?pt=news&sort=latest" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More News</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-8 tw-w-full
md:tw-grid md:tw-grid-cols-2 md:tw-gap-4
lg:tw-grid-cols-3 lg:tw-gap-6
xl:tw-gap-8">
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/ywfhdtzy/speed-001.jpg?width=365&quality=95&v=1dbcd96e235d990 1x,
/media/ywfhdtzy/speed-001.jpg?width=730&quality=90&v=1dbcd96e235d990 2x">
<source media="(max-width: 639px)"
srcset="
/media/ywfhdtzy/speed-001.jpg?width=591&quality=95&v=1dbcd96e235d990 1x,
/media/ywfhdtzy/speed-001.jpg?width=1182&quality=90&v=1dbcd96e235d990 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/ywfhdtzy/speed-001.jpg?width=392&v=1dbcd96e235d990" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/nz-motorway-speed-limit-increase-tomorrow-110kmh-for-sh1-section-north-of-orewa/" class="u-blocklink__lift">Speed limit increase: 110km/h north of Orewa</a>
</p>
</div>
<a href="/news/nz-motorway-speed-limit-increase-tomorrow-110kmh-for-sh1-section-north-of-orewa/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Speed limit increase: 110km/h north of Orewa</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/bwaih3kf/roller-001.jpg?width=365&quality=95&v=1dbcbbc9e8702e0 1x,
/media/bwaih3kf/roller-001.jpg?width=730&quality=90&v=1dbcbbc9e8702e0 2x">
<source media="(max-width: 639px)"
srcset="
/media/bwaih3kf/roller-001.jpg?width=591&quality=95&v=1dbcbbc9e8702e0 1x,
/media/bwaih3kf/roller-001.jpg?width=1182&quality=90&v=1dbcbbc9e8702e0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/bwaih3kf/roller-001.jpg?width=392&v=1dbcbbc9e8702e0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/" class="u-blocklink__lift">Rolls-Royce Auckland showroom: purple perfection?</a>
</p>
</div>
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Rolls-Royce Auckland showroom: purple perfection?</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/l5qokrcy/hyundai-obsidian-car-design-event-2025-1-copy-2048x1152.webp?width=365&quality=95&v=1dbcb89fd952650 1x,
/media/l5qokrcy/hyundai-obsidian-car-design-event-2025-1-copy-2048x1152.webp?width=730&quality=90&v=1dbcb89fd952650 2x">
<source media="(max-width: 639px)"
srcset="
/media/l5qokrcy/hyundai-obsidian-car-design-event-2025-1-copy-2048x1152.webp?width=591&quality=95&v=1dbcb89fd952650 1x,
/media/l5qokrcy/hyundai-obsidian-car-design-event-2025-1-copy-2048x1152.webp?width=1182&quality=90&v=1dbcb89fd952650 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/l5qokrcy/hyundai-obsidian-car-design-event-2025-1-copy-2048x1152.webp?width=392&v=1dbcb89fd952650" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/hyundai-obsidian-is-a-concept-ev-that-skips-the-classroom-rules/" class="u-blocklink__lift">Hyundai Obsidian is sharp, sleek & just for show</a>
</p>
</div>
<a href="/news/hyundai-obsidian-is-a-concept-ev-that-skips-the-classroom-rules/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Hyundai Obsidian is sharp, sleek & just for show</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/jpdh4it4/disco-002.jpg?width=365&quality=95&v=1dbcbc3652a64e0 1x,
/media/jpdh4it4/disco-002.jpg?width=730&quality=90&v=1dbcbc3652a64e0 2x">
<source media="(max-width: 639px)"
srcset="
/media/jpdh4it4/disco-002.jpg?width=591&quality=95&v=1dbcbc3652a64e0 1x,
/media/jpdh4it4/disco-002.jpg?width=1182&quality=90&v=1dbcbc3652a64e0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/jpdh4it4/disco-002.jpg?width=392&v=1dbcbc3652a64e0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/land-rover-discovery-tempest-for-nz-4x4-7-seater-goes-further-down-the-luxury-route/" class="u-blocklink__lift">Land Rover Discovery Tempest for NZ</a>
</p>
</div>
<a href="/news/land-rover-discovery-tempest-for-nz-4x4-7-seater-goes-further-down-the-luxury-route/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Land Rover Discovery Tempest for NZ</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/5zdpljto/p90598622_highres.jpg?width=365&quality=95&v=1dbcb8785bcd490 1x,
/media/5zdpljto/p90598622_highres.jpg?width=730&quality=90&v=1dbcb8785bcd490 2x">
<source media="(max-width: 639px)"
srcset="
/media/5zdpljto/p90598622_highres.jpg?width=591&quality=95&v=1dbcb8785bcd490 1x,
/media/5zdpljto/p90598622_highres.jpg?width=1182&quality=90&v=1dbcb8785bcd490 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/5zdpljto/p90598622_highres.jpg?width=392&v=1dbcb8785bcd490" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/bmw-begins-all-solid-state-battery-tests-in-i7-prototype/" class="u-blocklink__lift">BMW i7 begins testing all-solid-state battery tech</a>
</p>
</div>
<a href="/news/bmw-begins-all-solid-state-battery-tests-in-i7-prototype/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">BMW i7 begins testing all-solid-state battery tech</a>
</article>
</div>
<div class="tw-flex tw-justify-center tw-text-sm md:tw-hidden">
<a href="https://www.drivencarguide.co.nz/article-search/?pt=news&sort=latest" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More News</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
<div>
<aside class="o-adunit"
aria-label="Advertisement rectangle 1"
data-media-query=""
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-w-[300px] tw-h-[250px]"
data-adsize='[300,250]'
data-adunit="rectangle"
data-adpos="1"
data-test-ui="adunit"
id="ad_rectangle1_2109215468"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
</div>
</div>
</section>
</div>
<div class="tw-hidden lg:tw-block tw-py-10 tw-bg-gray-200">
<aside class="o-adunit"
aria-label="Advertisement leaderboard 3"
data-media-query="(min-width: 1024px)"
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-min-w-[728px] tw-min-h-[90px]"
data-adsize='[728,90]'
data-adunit="leaderboard"
data-adpos="3"
data-test-ui="adunit"
id="ad_leaderboard3_692561179"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
<div data-test-ui="story-list-5-block-element">
<section class="tw-text-gray-900 tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Primary"
data-test-ui="story-list-5-block">
<div class="tw-container tw-flex tw-flex-col
tw-items-center tw-gap-8 tw-py-10
md:tw-justify-center md:tw-gap-10 md:tw-py-16">
<div
class="tw-flex tw-flex-row tw-items-start tw-gap-6 tw-w-full">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Latest Reviews</h2>
</div>
<div
class="
tw-hidden tw-ml-auto
md:tw-block
"
>
<a href="https://www.drivencarguide.co.nz/reviews/" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More Reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-8 tw-w-full
md:tw-grid md:tw-grid-cols-2 md:tw-gap-4
lg:tw-grid-cols-3 lg:tw-gap-6
xl:tw-gap-8">
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=365&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=730&quality=90&v=1dbc9a3e677e170 2x">
<source media="(max-width: 639px)"
srcset="
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=591&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=1182&quality=90&v=1dbc9a3e677e170 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=392&v=1dbc9a3e677e170" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/" class="u-blocklink__lift">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</p>
</div>
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/ycxh50o0/ariya-012.jpg?width=365&quality=95&v=1dbb8e60e386f50 1x,
/media/ycxh50o0/ariya-012.jpg?width=730&quality=90&v=1dbb8e60e386f50 2x">
<source media="(max-width: 639px)"
srcset="
/media/ycxh50o0/ariya-012.jpg?width=591&quality=95&v=1dbb8e60e386f50 1x,
/media/ycxh50o0/ariya-012.jpg?width=1182&quality=90&v=1dbb8e60e386f50 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/ycxh50o0/ariya-012.jpg?width=392&v=1dbb8e60e386f50" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/nissan-ariya-engage-review-green-effect/" class="u-blocklink__lift">Nissan Ariya Engage review: green effect</a>
</p>
</div>
<a href="/reviews/nissan-ariya-engage-review-green-effect/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Nissan Ariya Engage review: green effect</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/5cllxwbe/audi-s5-avant-002.jpg?width=365&quality=95&v=1dbc994adf32ee0 1x,
/media/5cllxwbe/audi-s5-avant-002.jpg?width=730&quality=90&v=1dbc994adf32ee0 2x">
<source media="(max-width: 639px)"
srcset="
/media/5cllxwbe/audi-s5-avant-002.jpg?width=591&quality=95&v=1dbc994adf32ee0 1x,
/media/5cllxwbe/audi-s5-avant-002.jpg?width=1182&quality=90&v=1dbc994adf32ee0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/5cllxwbe/audi-s5-avant-002.jpg?width=392&v=1dbc994adf32ee0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/audi-s5-avant-review-numbers-game/" class="u-blocklink__lift">Audi S5 Avant review: numbers game</a>
</p>
</div>
<a href="/reviews/audi-s5-avant-review-numbers-game/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Audi S5 Avant review: numbers game</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/nyzpdxe2/ram-002.jpg?width=365&quality=95&v=1dbbe810f58d460 1x,
/media/nyzpdxe2/ram-002.jpg?width=730&quality=90&v=1dbbe810f58d460 2x">
<source media="(max-width: 639px)"
srcset="
/media/nyzpdxe2/ram-002.jpg?width=591&quality=95&v=1dbbe810f58d460 1x,
/media/nyzpdxe2/ram-002.jpg?width=1182&quality=90&v=1dbbe810f58d460 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/nyzpdxe2/ram-002.jpg?width=392&v=1dbbe810f58d460" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/ram-1500-limited-hurricane-ho-review-straight-talking-turbo-6-is-superb/" class="u-blocklink__lift">Ram Hurricane review: straight talking</a>
</p>
</div>
<a href="/reviews/ram-1500-limited-hurricane-ho-review-straight-talking-turbo-6-is-superb/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Ram Hurricane review: straight talking</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/qrdl0123/cxthreelongtwo-007.jpg?width=365&quality=95&v=1dbcafa0c3d2490 1x,
/media/qrdl0123/cxthreelongtwo-007.jpg?width=730&quality=90&v=1dbcafa0c3d2490 2x">
<source media="(max-width: 639px)"
srcset="
/media/qrdl0123/cxthreelongtwo-007.jpg?width=591&quality=95&v=1dbcafa0c3d2490 1x,
/media/qrdl0123/cxthreelongtwo-007.jpg?width=1182&quality=90&v=1dbcafa0c3d2490 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/qrdl0123/cxthreelongtwo-007.jpg?width=392&v=1dbcafa0c3d2490" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/mazda-cx-3-sp20-long-term-test-revive-the-drive/" class="u-blocklink__lift">Mazda CX-3 long term: revive the drive</a>
</p>
</div>
<a href="/reviews/mazda-cx-3-sp20-long-term-test-revive-the-drive/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Mazda CX-3 long term: revive the drive</a>
</article>
</div>
<div class="tw-flex tw-justify-center tw-text-sm md:tw-hidden">
<a href="https://www.drivencarguide.co.nz/reviews/" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More Reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
<div>
<aside class="o-adunit"
aria-label="Advertisement rectangle 2"
data-media-query=""
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-w-[300px] tw-h-[250px]"
data-adsize='[300,250]'
data-adunit="rectangle"
data-adpos="2"
data-test-ui="adunit"
id="ad_rectangle2_125188570"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
</div>
</div>
</section>
</div>
<div>
<section class="tw-text-gray-900 tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Secondary"
data-test-ui="story-list-block">
<div class="tw-container tw-flex tw-flex-col
tw-items-center tw-gap-8 tw-py-10
md:tw-justify-center md:tw-gap-10 md:tw-py-16
lg:tw-flex-row lg:tw-items-start lg:tw-gap-6 lg:tw-grid lg:tw-grid-cols-3
xl:tw-gap-8
">
<div class="tw-flex tw-flex-col tw-gap-4 tw-w-full">
<div class="tw-flex tw-flex-row tw-items-start tw-gap-6 tw-w-full
lg:tw-flex-col lg:tw-col-span-1">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Hybrid/EV</h2>
</div>
<div class="tw-hidden
md:tw-block md:tw-ml-auto
lg:tw-pl-7 lg:tw-ml-0
xl:tw-pl-8">
<a href="https://www.drivencarguide.co.nz/collections/clean-cars" class="c-btn c-btn--dark c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">More hybrid and EV news and reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-8 tw-w-full
md:tw-grid md:tw-grid-cols-2 md:tw-gap-4
lg:tw-col-span-2 lg:tw-gap-6
xl:tw-gap-8">
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=365&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=730&quality=90&v=1dbc9a3e677e170 2x">
<source media="(max-width: 639px)"
srcset="
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=591&quality=95&v=1dbc9a3e677e170 1x,
/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=1182&quality=90&v=1dbc9a3e677e170 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/owofqzun/leapmotor-c10-ultra-hybrid-003.jpg?width=392&v=1dbc9a3e677e170" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-200 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-200 tw-text-gray-900 tw-bg-gray-200">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/" class="u-blocklink__lift">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</p>
</div>
<a href="/reviews/leapmotor-c10-ultra-hybrid-review-but-wait-theres-more/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Leapmotor C10 Ultra Hybrid review: but wait, there's more</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/bwaih3kf/roller-001.jpg?width=365&quality=95&v=1dbcbbc9e8702e0 1x,
/media/bwaih3kf/roller-001.jpg?width=730&quality=90&v=1dbcbbc9e8702e0 2x">
<source media="(max-width: 639px)"
srcset="
/media/bwaih3kf/roller-001.jpg?width=591&quality=95&v=1dbcbbc9e8702e0 1x,
/media/bwaih3kf/roller-001.jpg?width=1182&quality=90&v=1dbcbbc9e8702e0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/bwaih3kf/roller-001.jpg?width=392&v=1dbcbbc9e8702e0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-200 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-200 tw-text-gray-900 tw-bg-gray-200">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/" class="u-blocklink__lift">Rolls-Royce Auckland showroom: purple perfection?</a>
</p>
</div>
<a href="/news/rolls-royce-aucklands-new-showroom-aiming-for-purple-perfection/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Rolls-Royce Auckland showroom: purple perfection?</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/ycxh50o0/ariya-012.jpg?width=365&quality=95&v=1dbb8e60e386f50 1x,
/media/ycxh50o0/ariya-012.jpg?width=730&quality=90&v=1dbb8e60e386f50 2x">
<source media="(max-width: 639px)"
srcset="
/media/ycxh50o0/ariya-012.jpg?width=591&quality=95&v=1dbb8e60e386f50 1x,
/media/ycxh50o0/ariya-012.jpg?width=1182&quality=90&v=1dbb8e60e386f50 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/ycxh50o0/ariya-012.jpg?width=392&v=1dbb8e60e386f50" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-200 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-200 tw-text-gray-900 tw-bg-gray-200">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/nissan-ariya-engage-review-green-effect/" class="u-blocklink__lift">Nissan Ariya Engage review: green effect</a>
</p>
</div>
<a href="/reviews/nissan-ariya-engage-review-green-effect/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Nissan Ariya Engage review: green effect</a>
</article>
</div>
<div class="tw-flex tw-justify-center tw-text-sm md:tw-hidden">
<a href="https://www.drivencarguide.co.nz/collections/clean-cars">
<button class="c-btn c-btn--dark c-btn--small" data-test-ui="button"><span class="c-btn__label">More hybrid and EV news and reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></button>
</a>
</div>
<div>
<aside class="o-adunit"
aria-label="Advertisement rectangle 3"
data-media-query=""
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-w-[300px] tw-h-[250px]"
data-adsize='[300,250]'
data-adunit="rectangle"
data-adpos="3"
data-test-ui="adunit"
id="ad_rectangle3_767645933"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
</div>
</div>
</section>
</div><div>
<div class="md:tw-container tw-relative tw-isolate swiper tw-px-6 tw-mt-12 md:tw-mt-16 lg:tw-mt-20 xl:tw-mt-24 c-portrait-carousel" data-slider="portraitCarouselBlock" data-test-ui="portrait-carousel-block">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash tw-text-display-sm lg:tw-text-display-md xl:tw-text-display-lg" data-test-ui="header-title">Collections</h2>
<p class="c-header-tagline tw-text-md xl:tw-text-lg" data-test-ui="header-tagline">Expert advice, tailored to your lifestyle</p>
</div>
<div class="tw-py-10 swiper-wrapper">
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/vcyf53hg/154338974_l_normal_none1.jpg?height=351&quality=95&v=1d99e09741d93d0 1x,
/media/vcyf53hg/154338974_l_normal_none1.jpg?height=702&quality=90&v=1d99e09741d93d0 2x">
<source media="(max-width: 1023px)"
srcset="/media/vcyf53hg/154338974_l_normal_none1.jpg?height=210&quality=95&v=1d99e09741d93d0 1x,
/media/vcyf53hg/154338974_l_normal_none1.jpg?height=420&quality=90&v=1d99e09741d93d0 2x">
<source media="(max-width: 1303px)"
srcset="/media/vcyf53hg/154338974_l_normal_none1.jpg?height=333&quality=95&v=1d99e09741d93d0 1x,
/media/vcyf53hg/154338974_l_normal_none1.jpg?height=666&quality=90&v=1d99e09741d93d0 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/vcyf53hg/154338974_l_normal_none1.jpg?height=438&v=1d99e09741d93d0" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/collections/family">Family Car Guide</a>
</h3>
</div>
</div>
<a href="/collections/family" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Family Car Guide</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/05wi4hy5/163269665_l_normal_none1.jpg?height=351&quality=95&v=1d99e09f051d790 1x,
/media/05wi4hy5/163269665_l_normal_none1.jpg?height=702&quality=90&v=1d99e09f051d790 2x">
<source media="(max-width: 1023px)"
srcset="/media/05wi4hy5/163269665_l_normal_none1.jpg?height=210&quality=95&v=1d99e09f051d790 1x,
/media/05wi4hy5/163269665_l_normal_none1.jpg?height=420&quality=90&v=1d99e09f051d790 2x">
<source media="(max-width: 1303px)"
srcset="/media/05wi4hy5/163269665_l_normal_none1.jpg?height=333&quality=95&v=1d99e09f051d790 1x,
/media/05wi4hy5/163269665_l_normal_none1.jpg?height=666&quality=90&v=1d99e09f051d790 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/05wi4hy5/163269665_l_normal_none1.jpg?height=438&v=1d99e09f051d790" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/collections/enthusiast">Enthusiast Guide</a>
</h3>
</div>
</div>
<a href="/collections/enthusiast" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Enthusiast Guide</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/02affnn4/164684543_l_normal_none1.jpg?height=351&quality=95&v=1d99e0aa0e20990 1x,
/media/02affnn4/164684543_l_normal_none1.jpg?height=702&quality=90&v=1d99e0aa0e20990 2x">
<source media="(max-width: 1023px)"
srcset="/media/02affnn4/164684543_l_normal_none1.jpg?height=210&quality=95&v=1d99e0aa0e20990 1x,
/media/02affnn4/164684543_l_normal_none1.jpg?height=420&quality=90&v=1d99e0aa0e20990 2x">
<source media="(max-width: 1303px)"
srcset="/media/02affnn4/164684543_l_normal_none1.jpg?height=333&quality=95&v=1d99e0aa0e20990 1x,
/media/02affnn4/164684543_l_normal_none1.jpg?height=666&quality=90&v=1d99e0aa0e20990 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/02affnn4/164684543_l_normal_none1.jpg?height=438&v=1d99e0aa0e20990" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/collections/adventure">Adventure Guide</a>
</h3>
</div>
</div>
<a href="/collections/adventure" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Adventure Guide</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/czel244b/31097573_l_normal_none1.jpg?height=351&quality=95&v=1d99e0c44867940 1x,
/media/czel244b/31097573_l_normal_none1.jpg?height=702&quality=90&v=1d99e0c44867940 2x">
<source media="(max-width: 1023px)"
srcset="/media/czel244b/31097573_l_normal_none1.jpg?height=210&quality=95&v=1d99e0c44867940 1x,
/media/czel244b/31097573_l_normal_none1.jpg?height=420&quality=90&v=1d99e0c44867940 2x">
<source media="(max-width: 1303px)"
srcset="/media/czel244b/31097573_l_normal_none1.jpg?height=333&quality=95&v=1d99e0c44867940 1x,
/media/czel244b/31097573_l_normal_none1.jpg?height=666&quality=90&v=1d99e0c44867940 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/czel244b/31097573_l_normal_none1.jpg?height=438&v=1d99e0c44867940" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/collections/budget">Budget Guide</a>
</h3>
</div>
</div>
<a href="/collections/budget" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Budget Guide</a>
</div>
</div>
<div class="swiper-slide c-portrait-carousel-slide tw-w-auto">
<div class="tw-flex tw-relative tw-shadow-collectionCard tw-group tw-w-58.5 md:tw-w-auto u-block-link">
<picture>
<source media="(max-width: 639px)"
srcset="/media/socps4ut/reviews.jpg?height=351&quality=95&v=1d98984e474f9a0 1x,
/media/socps4ut/reviews.jpg?height=702&quality=90&v=1d98984e474f9a0 2x">
<source media="(max-width: 1023px)"
srcset="/media/socps4ut/reviews.jpg?height=210&quality=95&v=1d98984e474f9a0 1x,
/media/socps4ut/reviews.jpg?height=420&quality=90&v=1d98984e474f9a0 2x">
<source media="(max-width: 1303px)"
srcset="/media/socps4ut/reviews.jpg?height=333&quality=95&v=1d98984e474f9a0 1x,
/media/socps4ut/reviews.jpg?height=666&quality=90&v=1d98984e474f9a0 2x">
<img width="292" height="438" class="tw-aspect-2/3 tw-object-cover" loading="lazy" src="/media/socps4ut/reviews.jpg?height=438&v=1d98984e474f9a0" alt="" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-inset-x-0 tw-flex tw-items-end tw-px-3 tw-py-4 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-b tw-from-transparent tw-to-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs md:tw-text-xl xl:tw-text-display-xs tw-font-heading tw-font-bold tw-text-white tw-line-clamp-5">
<a href="/reviews/owner-reviews">Owner Reviews</a>
</h3>
</div>
</div>
<a href="/reviews/owner-reviews" class="u-blocklink__link" tabindex="-1" aria-hidden="true">Owner Reviews</a>
</div>
</div>
</div>
<button class="c-portrait-carousel-slide-button c-portrait-carousel-slide-button-prev c-btn-icon c-btn-icon--white-transparent c-btn-icon--small" data-test-ui="button-icon"><i><svg aria-hidden="true" class="tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltLeft"></use></svg></i><span class="tw-sr-only">Previous</span></button>
<button class="c-portrait-carousel-slide-button c-portrait-carousel-slide-button-next c-btn-icon c-btn-icon--white-transparent c-btn-icon--small" data-test-ui="button-icon"><i><svg aria-hidden="true" class="tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i><span class="tw-sr-only">Next</span></button>
</div>
</div>
<div>
<section class="
data-[variant=Primary]:tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Dark"
data-test-ui="hero-story-block">
<div class="tw-container tw-py-10">
<div class="tw-flex tw-flex-col tw-gap-10 lg:tw-grid lg:tw-grid-cols-12 lg:tw-gap-x-6 xl:tw-gap-x-8">
<div class="tw-flex tw-flex-col tw-items-start tw-gap-6 lg:tw-col-span-4">
<div class="tw-flex tw-flex-row tw-items-start tw-gap-6 lg:tw-col-span-4 lg:tw-flex-col tw-w-full">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash tw-pl-6 md:tw-pl-6.5 md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Expert Advice</h2>
</div>
<div class="tw-hidden md:tw-block md:tw-ml-auto lg:tw-pl-7 lg:tw-ml-0 xl:tw-pl-8">
<a href="/advice/" class="c-btn c-btn--light c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">More Advice</span><i class="c-btn__icon tw-text-primary-500"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-6 md:tw-grid md:tw-grid-cols-2 md:tw-gap-4 lg:tw-col-span-8 lg:tw-gap-6 xl:tw-gap-8">
<div class="md:tw-col-span-full">
<div class="max-md:tw-hidden">
<a href="/advice/no-pressure-but-do-you-know-how-to-check-and-adjust-your-tyres/" class="tw-relative tw-group tw-overflow-hidden tw-block">
<img loading="lazy" src="/media/0mgjo5v2/20250504_095448-2.jpg?width=960&v=1dbc013f600f0d0"
alt=""
class="tw-w-full tw-aspect-3/2 tw-object-cover tw-object-center">
<div class="tw-absolute tw-inset-x-0 tw-bottom-0 tw-flex tw-items-end tw-p-10 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-t tw-from-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<h3 class="tw-text-display-xs lg:tw-text-display-sm tw-font-heading tw-font-bold tw-text-white tw-line-clamp-2">
Why you need to know about tyre pressures
</h3>
</div>
</div>
</a>
</div>
<div class="md:tw-hidden">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/0mgjo5v2/20250504_095448-2.jpg?width=365&quality=95&v=1dbc013f600f0d0 1x,
/media/0mgjo5v2/20250504_095448-2.jpg?width=730&quality=90&v=1dbc013f600f0d0 2x">
<source media="(max-width: 639px)"
srcset="
/media/0mgjo5v2/20250504_095448-2.jpg?width=591&quality=95&v=1dbc013f600f0d0 1x,
/media/0mgjo5v2/20250504_095448-2.jpg?width=1182&quality=90&v=1dbc013f600f0d0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/0mgjo5v2/20250504_095448-2.jpg?width=392&v=1dbc013f600f0d0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#BulbFilled" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Advice</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/advice/no-pressure-but-do-you-know-how-to-check-and-adjust-your-tyres/" class="u-blocklink__lift">Why you need to know about tyre pressures</a>
</p>
</div>
<a href="/advice/no-pressure-but-do-you-know-how-to-check-and-adjust-your-tyres/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Why you need to know about tyre pressures</a>
</article>
</div>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/xa1fcqcx/123935725_l_normal_none.jpg?width=365&quality=95&v=1da76b69ad819b0 1x,
/media/xa1fcqcx/123935725_l_normal_none.jpg?width=730&quality=90&v=1da76b69ad819b0 2x">
<source media="(max-width: 639px)"
srcset="
/media/xa1fcqcx/123935725_l_normal_none.jpg?width=591&quality=95&v=1da76b69ad819b0 1x,
/media/xa1fcqcx/123935725_l_normal_none.jpg?width=1182&quality=90&v=1da76b69ad819b0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/xa1fcqcx/123935725_l_normal_none.jpg?width=392&v=1da76b69ad819b0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#BulbFilled" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Advice</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/advice/7-fluids-you-should-check-in-your-car-during-winter/" class="u-blocklink__lift">7 fluids you should check in your car during winter</a>
</p>
</div>
<a href="/advice/7-fluids-you-should-check-in-your-car-during-winter/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">7 fluids you should check in your car during winter</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/zyzjd5wr/weather.jpeg?width=365&quality=95&v=1dbb13bff5a81f0 1x,
/media/zyzjd5wr/weather.jpeg?width=730&quality=90&v=1dbb13bff5a81f0 2x">
<source media="(max-width: 639px)"
srcset="
/media/zyzjd5wr/weather.jpeg?width=591&quality=95&v=1dbb13bff5a81f0 1x,
/media/zyzjd5wr/weather.jpeg?width=1182&quality=90&v=1dbb13bff5a81f0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/zyzjd5wr/weather.jpeg?width=392&v=1dbb13bff5a81f0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#BulbFilled" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Advice</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/advice/heres-a-severe-weather-checklist-to-help-you-stay-safe-on-the-roads/" class="u-blocklink__lift">Here's a severe weather checklist to help you stay safe on the roads</a>
</p>
</div>
<a href="/advice/heres-a-severe-weather-checklist-to-help-you-stay-safe-on-the-roads/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Here's a severe weather checklist to help you stay safe on the roads</a>
</article>
</div>
</div>
<div class="tw-flex tw-items-start tw-justify-center md:tw-hidden">
<a href="/advice/" class="c-btn c-btn--light c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">More Advice</span><i class="c-btn__icon tw-text-primary-500"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
</div>
</section>
</div>
<div data-test-ui="story-list-5-block-element">
<section class="tw-text-gray-900 tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Primary"
data-test-ui="story-list-5-block">
<div class="tw-container tw-flex tw-flex-col
tw-items-center tw-gap-8 tw-py-10
md:tw-justify-center md:tw-gap-10 md:tw-py-16">
<div
class="tw-flex tw-flex-row tw-items-start tw-gap-6 tw-w-full">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Owner Reviews</h2>
</div>
<div
class="
tw-hidden tw-ml-auto
md:tw-block
"
>
<a href="https://www.drivencarguide.co.nz/reviews/owner-reviews" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More Owner Reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-8 tw-w-full
md:tw-grid md:tw-grid-cols-2 md:tw-gap-4
lg:tw-grid-cols-3 lg:tw-gap-6
xl:tw-gap-8">
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/s1kmhwdz/owner-review-hyundai.jpg?width=365&quality=95&v=1d9a37ad4b54f50 1x,
/media/s1kmhwdz/owner-review-hyundai.jpg?width=730&quality=90&v=1d9a37ad4b54f50 2x">
<source media="(max-width: 639px)"
srcset="
/media/s1kmhwdz/owner-review-hyundai.jpg?width=591&quality=95&v=1d9a37ad4b54f50 1x,
/media/s1kmhwdz/owner-review-hyundai.jpg?width=1182&quality=90&v=1d9a37ad4b54f50 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/s1kmhwdz/owner-review-hyundai.jpg?width=392&v=1d9a37ad4b54f50" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/hyundai-ioniq-5-58kw-2021/" class="u-blocklink__lift">Hyundai Ioniq 5 58kW 2021 👍</a>
</p>
</div>
<a href="/reviews/hyundai-ioniq-5-58kw-2021/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Hyundai Ioniq 5 58kW 2021 👍</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/td4m3t4l/owner-review-subaru.jpg?width=365&quality=95&v=1d9a37b98b2cd60 1x,
/media/td4m3t4l/owner-review-subaru.jpg?width=730&quality=90&v=1d9a37b98b2cd60 2x">
<source media="(max-width: 639px)"
srcset="
/media/td4m3t4l/owner-review-subaru.jpg?width=591&quality=95&v=1d9a37b98b2cd60 1x,
/media/td4m3t4l/owner-review-subaru.jpg?width=1182&quality=90&v=1d9a37b98b2cd60 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/td4m3t4l/owner-review-subaru.jpg?width=392&v=1d9a37b98b2cd60" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/subaru-outback-36-premium-2010/" class="u-blocklink__lift">Subaru Outback 3.6 Premium 2010 👍</a>
</p>
</div>
<a href="/reviews/subaru-outback-36-premium-2010/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Subaru Outback 3.6 Premium 2010 👍</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/3muftzqy/owner-review-nissan.jpg?width=365&quality=95&v=1d9a37b8afd47e0 1x,
/media/3muftzqy/owner-review-nissan.jpg?width=730&quality=90&v=1d9a37b8afd47e0 2x">
<source media="(max-width: 639px)"
srcset="
/media/3muftzqy/owner-review-nissan.jpg?width=591&quality=95&v=1d9a37b8afd47e0 1x,
/media/3muftzqy/owner-review-nissan.jpg?width=1182&quality=90&v=1d9a37b8afd47e0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/3muftzqy/owner-review-nissan.jpg?width=392&v=1d9a37b8afd47e0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/nissan-e-note-2017/" class="u-blocklink__lift">Nissan e-Note 2017 👍</a>
</p>
</div>
<a href="/reviews/nissan-e-note-2017/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Nissan e-Note 2017 👍</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/crwbkz5u/owner-review-mg.jpg?width=365&quality=95&v=1d9a37b846a3c80 1x,
/media/crwbkz5u/owner-review-mg.jpg?width=730&quality=90&v=1d9a37b846a3c80 2x">
<source media="(max-width: 639px)"
srcset="
/media/crwbkz5u/owner-review-mg.jpg?width=591&quality=95&v=1d9a37b846a3c80 1x,
/media/crwbkz5u/owner-review-mg.jpg?width=1182&quality=90&v=1d9a37b846a3c80 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/crwbkz5u/owner-review-mg.jpg?width=392&v=1d9a37b846a3c80" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/mg-zs-ev-2023/" class="u-blocklink__lift">MG ZS EV 2023 👍</a>
</p>
</div>
<a href="/reviews/mg-zs-ev-2023/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">MG ZS EV 2023 👍</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/qzdbfvkf/owner-review-polestar.jpeg?width=365&quality=95&v=1d9da7181c68150 1x,
/media/qzdbfvkf/owner-review-polestar.jpeg?width=730&quality=90&v=1d9da7181c68150 2x">
<source media="(max-width: 639px)"
srcset="
/media/qzdbfvkf/owner-review-polestar.jpeg?width=591&quality=95&v=1d9da7181c68150 1x,
/media/qzdbfvkf/owner-review-polestar.jpeg?width=1182&quality=90&v=1d9da7181c68150 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/qzdbfvkf/owner-review-polestar.jpeg?width=392&v=1d9da7181c68150" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-100 tw-text-gray-900">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 tw-text-primary-700" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Annotation" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">Review</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-100 tw-text-gray-900 tw-bg-gray-100">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/reviews/polestar-2-standard-range-single-motor-2022/" class="u-blocklink__lift">Polestar 2 Standard Range Single Motor 2022 👍</a>
</p>
</div>
<a href="/reviews/polestar-2-standard-range-single-motor-2022/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Polestar 2 Standard Range Single Motor 2022 👍</a>
</article>
</div>
<div class="tw-flex tw-justify-center tw-text-sm md:tw-hidden">
<a href="https://www.drivencarguide.co.nz/reviews/owner-reviews" class="c-btn c-btn--dark" target="_self" data-test-ui="button"><span class="c-btn__label">More Owner Reviews</span><i class="c-btn__icon tw-text-inheirt"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
<div>
<aside class="o-adunit"
aria-label="Advertisement rectangle 4"
data-media-query=""
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-w-[300px] tw-h-[250px]"
data-adsize='[300,250]'
data-adunit="rectangle"
data-adpos="4"
data-test-ui="adunit"
id="ad_rectangle4_1709292596"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
</div>
</div>
</section>
</div>
<div>
<section class="
data-[variant=Primary]:tw-bg-gray-100
data-[variant=Secondary]:tw-bg-gray-200
data-[variant=Dark]:tw-text-white
data-[variant=Dark]:tw-bg-gray-900"
data-variant="Dark"
data-test-ui="hero-story-block">
<div class="tw-container tw-py-10">
<div class="tw-flex tw-flex-col tw-gap-10 lg:tw-grid lg:tw-grid-cols-12 lg:tw-gap-x-6 xl:tw-gap-x-8">
<div class="tw-flex tw-flex-col tw-items-start tw-gap-6 lg:tw-col-span-4">
<div class="tw-flex tw-flex-row tw-items-start tw-gap-6 lg:tw-col-span-4 lg:tw-flex-col tw-w-full">
<div class="tw-flex tw-flex-col tw-gap-y-1">
<h2 class="c-header-title o-slash tw-pl-6 md:tw-pl-6.5 md:tw-text-display-sm lg:tw-text-display-md" data-test-ui="header-title">Latest Videos</h2>
</div>
<div class="tw-hidden md:tw-block md:tw-ml-auto lg:tw-pl-7 lg:tw-ml-0 xl:tw-pl-8">
<a href="/videos/" class="c-btn c-btn--light c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">More Videos</span><i class="c-btn__icon tw-text-primary-500"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
</div>
<div class="tw-flex tw-flex-col tw-gap-6 md:tw-grid md:tw-grid-cols-2 md:tw-gap-4 lg:tw-col-span-8 lg:tw-gap-6 xl:tw-gap-8">
<div class="md:tw-col-span-full">
<div class="max-md:tw-hidden">
<a href="/news/speeder-dreams-jet-powered-airbike-takes-flight-with-200kmh-hover-thrills/" class="tw-relative tw-group tw-overflow-hidden tw-block">
<img loading="lazy" src="/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=960&v=1dbbfdaf9567450"
alt=""
class="tw-w-full tw-aspect-3/2 tw-object-cover tw-object-center">
<div class="tw-absolute tw-inset-x-0 tw-bottom-0 tw-flex tw-items-end tw-p-10 tw-overflow-hidden">
<div aria-hidden="true" class="tw-absolute tw-inset-0 tw-bg-gradient-to-t tw-from-black">
</div>
<div class="tw-relative tw-flex tw-flex-col tw-gap-y-6 tw-transition group-hover:-tw-translate-y-2">
<div
class="tw-flex tw-w-16 tw-h-16 tw-rounded-full tw-border-2 tw-border-white tw-items-center tw-justify-center tw-transition group-hover:tw-bg-primary-500">
<svg class="tw-w-5 tw-h-5 tw-text-white tw-relative -tw-right-[2px]" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#PlayAlt" /></svg>
</div>
<h3 class="tw-text-display-xs lg:tw-text-display-sm tw-font-heading tw-font-bold tw-text-white tw-line-clamp-2">
Jet-powered ‘Airbike’ takes flight at 200km/h
</h3>
</div>
</div>
</a>
</div>
<div class="md:tw-hidden">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=365&quality=95&v=1dbbfdaf9567450 1x,
/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=730&quality=90&v=1dbbfdaf9567450 2x">
<source media="(max-width: 639px)"
srcset="
/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=591&quality=95&v=1dbbfdaf9567450 1x,
/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=1182&quality=90&v=1dbbfdaf9567450 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/3t4id13j/volonaut-airbike-00009-2048x922.webp?width=392&v=1dbbfdaf9567450" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/speeder-dreams-jet-powered-airbike-takes-flight-with-200kmh-hover-thrills/" class="u-blocklink__lift">Jet-powered ‘Airbike’ takes flight at 200km/h</a>
</p>
</div>
<a href="/news/speeder-dreams-jet-powered-airbike-takes-flight-with-200kmh-hover-thrills/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Jet-powered ‘Airbike’ takes flight at 200km/h</a>
</article>
</div>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/obdbn13y/rrelectric-006.jpg?width=365&quality=95&v=1dbbd9cfb3d2d80 1x,
/media/obdbn13y/rrelectric-006.jpg?width=730&quality=90&v=1dbbd9cfb3d2d80 2x">
<source media="(max-width: 639px)"
srcset="
/media/obdbn13y/rrelectric-006.jpg?width=591&quality=95&v=1dbbd9cfb3d2d80 1x,
/media/obdbn13y/rrelectric-006.jpg?width=1182&quality=90&v=1dbbd9cfb3d2d80 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/obdbn13y/rrelectric-006.jpg?width=392&v=1dbbd9cfb3d2d80" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/range-rover-electric-on-test-in-sweden-hurtling-around-the-arctic-circle/" class="u-blocklink__lift">Range Rover Electric on test in Sweden</a>
</p>
</div>
<a href="/news/range-rover-electric-on-test-in-sweden-hurtling-around-the-arctic-circle/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Range Rover Electric on test in Sweden</a>
</article>
</div>
<div class="md:tw-col-span-1">
<article class="u-blocklink tw-block hover:tw-shadow-storyCard tw-group">
<div class="tw-relative tw-overflow-hidden">
<picture>
<source media="(max-width: 413px)"
srcset="
/media/mf5owwyv/ford-mustang-gtd-1.jpg?width=365&quality=95&v=1d9d1fad08c5ff0 1x,
/media/mf5owwyv/ford-mustang-gtd-1.jpg?width=730&quality=90&v=1d9d1fad08c5ff0 2x">
<source media="(max-width: 639px)"
srcset="
/media/mf5owwyv/ford-mustang-gtd-1.jpg?width=591&quality=95&v=1d9d1fad08c5ff0 1x,
/media/mf5owwyv/ford-mustang-gtd-1.jpg?width=1182&quality=90&v=1d9d1fad08c5ff0 2x">
<img class="tw-w-full tw-h-full tw-max-h-[16.313rem]
tw-aspect-[392/261] tw-object-cover
tw-transition tw-duration-700 group-hover:tw-scale-105"
src="/media/mf5owwyv/ford-mustang-gtd-1.jpg?width=392&v=1d9d1fad08c5ff0" alt=""
loading="lazy" />
</picture>
<div class="tw-absolute tw-bottom-0 tw-left-0 tw-w-[81px] tw-h-[28px]">
<dl class="tw-inline-flex tw-gap-1 tw-py-1 tw-px-2 tw-text-sm tw-items-center tw-bg-gray-900 tw-text-primary-600">
<dt class="tw-sr-only">Icon</dt>
<dd>
<svg class="tw-w-4.5 tw-h-4.5 " role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Newspaper" /></svg>
</dd>
<dt class="tw-sr-only">T</dt>
<dd class="tw-font-semibold tw-uppercase">News</dd>
</dl>
</div>
</div>
<div class="tw-text-lg tw-font-semibold tw-line-clamp-2 tw-border-b-[15px] tw-border-gray-900 tw-text-base-white tw-bg-gray-900">
<p class="tw-m-3.75 tw-mb-0 tw-min-h-[56px]">
<a href="/news/ford-mustang-gtd-smashes-its-own-nurburgring-lap-record/" class="u-blocklink__lift">Ford Mustang GTD smashes its own Nurburgring lap</a>
</p>
</div>
<a href="/news/ford-mustang-gtd-smashes-its-own-nurburgring-lap-record/" class="u-blocklink__link" aria-hidden="true" tabindex="-1" data-test-ui="block-link">Ford Mustang GTD smashes its own Nurburgring lap</a>
</article>
</div>
</div>
<div class="tw-flex tw-items-start tw-justify-center md:tw-hidden">
<a href="/videos/" class="c-btn c-btn--light c-btn--small" target="_self" data-test-ui="button"><span class="c-btn__label">More Videos</span><i class="c-btn__icon tw-text-primary-500"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowAltRight"></use></svg></i></a>
</div>
</div>
</div>
</section>
</div>
<div class="tw-hidden tw-items-center tw-justify-center tw-min-h-[23.25rem] tw-py-10 tw-bg-gray-200 lg:tw-flex">
<aside class="o-adunit"
aria-label="Advertisement leaderboard 4"
data-media-query="(min-width: 1024px)"
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-min-w-[728px] tw-min-h-[90px]"
data-adsize='[[728,90],[970,250]]'
data-adunit="leaderboard"
data-adpos="4"
data-test-ui="adunit"
id="ad_leaderboard4_1296762384"
x-bind="unit"
x-ref="unit">
</div>
<strong class="o-adunit__title peer-[&[style*=none]]:tw-hidden peer-[&[data-adsize-actual='0,0']]:tw-hidden">Advertisement</strong>
<p class="o-adunit__info peer-[&[style*=none]]:tw-hidden">
<a class="o-adunit__link" target="_blank" rel="noopener" href="https://www.nzme.co.nz/advertise/" target="_blank">Advertise with NZME.</a>
</p>
</aside>
</div>
</main>
<aside class="o-adunit"
aria-label="Advertisement showcase 1"
data-media-query="(max-width:639px)"
x-cloak
x-data="adunit"
x-bind="container"
x-ref="container">
<div class="o-adunit__unit tw-peer tw-w-[1px] tw-h-[1px]"
data-adsize='[1,1]'
data-adunit="showcase"
data-adpos="1"
data-test-ui="adunit"
id="ad_showcase1_683623632"
x-bind="unit"
x-ref="unit">
</div>
</aside>
<div x-data="trackAppInsights" x-bind="listener"></div>
<div x-data="trackBraze" x-bind="listener"></div>
<div x-data="trackDataLayer" x-bind="listener"></div>
<div x-data="event"></div>
<section class="tw-relative tw-z-10">
<div class="tw-fixed tw-overflow-auto tw-overscroll-contain tw-scroll-smooth tw-inset-0 tw-text-base-white tw-bg-gray-900
lg:tw-overflow-visible lg:tw-bottom-auto"
aria-modal="true"
aria-labelledby="global-search-header-title"
x-data="globalSearchModalForm"
x-cloak
x-bind="containerElm">
<div class="tw-container tw-relative tw-flex tw-flex-col tw-gap-8 tw-justify-between tw-min-h-svh tw-mx-auto tw-py-8 lg:tw-min-h-min">
<div class="tw-flex tw-flex-col tw-gap-y-4 lg:tw-gap-y-8">
<div class="tw-flex tw-justify-between">
<h2 id="global-search-header-title" class="tw-pb-1.5 tw-border-b-2 tw-border-b-primary-500 tw-font-semibold lg:tw-text-display-xs lg:tw-font-bold lg:tw-font-heading lg:tw-border-none lg:tw-pb-0">
Search Car Guide
</h2>
<div class="tw-hidden lg:tw-block">
<button class="tw-hidden lg:tw-inline-block" x-bind="closeButtonElm">
<span class="tw-sr-only">Close</span>
<i>
<svg class="tw-w-8 tw-h-8" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Close" /></svg>
</i>
</button>
</div>
</div>
<form action="/search" method="get" class="tw-flex tw-flex-col tw-gap-y-4">
<div class="tw-flex tw-flex-col tw-gap-y-2 lg:tw-grid lg:tw-gap-x-8 lg:tw-grid-cols-2">
<fieldset class="tw-flex tw-flex-col tw-gap-y-2">
<div class="tw-flex">
<div data-test-ui="field" class="tw-relative tw-flex tw-w-full" x-data="password"><input class="tw-w-full tw-bg-white c-input c-input--light tw-peer tw-pl-10.5" name="term" type="search" aria-label="keywords" autocomplete="off" placeholder="Search cars, news, reviews and advice" value="" data-focus-visible="false" data-test-ui="field-input" /><i class="c-input__icon c-input__icon-left tw-text-primary-500"><svg aria-hidden="true" class="tw-w-4.5 tw-h-4.5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Search"></use></svg></i></div>
</div>
<div class="tw-grid tw-grid-cols-1 tw-gap-2 md:tw-grid-cols-2" x-data="selectVehicle">
<div>
<div class="c-select " x-data="selectVehicleMake">
<label class="tw-sr-only" for="make">Make</label>
<select id="make" class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
name="make"
autocomplete="off"
data-selected=""
tabindex="0"
x-bind="selectVehicleMakeElm">
<option value="">Any make</option>
<template x-for="make in makeList">
<option :value="getOptionMakeValue" x-text="getOptionMakeName"></option>
</template>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i class="tw-hidden peer-[&[data-loading=true]]:tw-block">
<span class="tw-sr-only">Loading</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" alt="loading" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
<div>
<div class="c-select " x-data="selectVehicleModel">
<label class="tw-sr-only" for="model"></label>
<select id="model" class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
name="model"
autocomplete="off"
data-selected=""
tabindex="0"
x-bind="selectVehicleModelElm">
<option value="">Any model</option>
<template x-for="model in modelList">
<option :value="getOptionModelValue" x-text="getOptionModelName"></option>
</template>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
<i class="tw-hidden peer-[&[data-loading=true]]:tw-block">
<span class="tw-sr-only">Loading</span>
<svg class="c-select__loading tw-text-gray-300 tw-fill-primary-900 tw-animate-spin" alt="loading" x-cloak="" aria-hidden="true" data-test-ui="icon-loading" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
</i>
</div>
</div>
</div>
</fieldset>
<fieldset class="lg:tw-row-span-3">
<div x-bind="moreOptionsContainerElm">
<div class="tw-grid tw-grid-cols-1 tw-gap-2 md:tw-grid-cols-2">
<div>
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any body type">Any body type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="hatchback_4873d6a03ec7ac59" name="body" value="hatchback" data-label="Hatchback" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="hatchback_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="hatchback_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Hatchback</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="peoplemover_4873d6a03ec7ac59" name="body" value="peoplemover" data-label="People Mover" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="peoplemover_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="peoplemover_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">People Mover</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="sedan_4873d6a03ec7ac59" name="body" value="sedan" data-label="Sedan" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="sedan_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="sedan_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Sedan</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="sport_4873d6a03ec7ac59" name="body" value="sport" data-label="Sport" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="sport_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="sport_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Sport</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="suv_4873d6a03ec7ac59" name="body" value="suv" data-label="SUV" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="suv_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="suv_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">SUV</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="ute_4873d6a03ec7ac59" name="body" value="ute" data-label="Ute" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="ute_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="ute_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Ute</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="van_4873d6a03ec7ac59" name="body" value="van" data-label="Van" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="van_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="van_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Van</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="wagon_4873d6a03ec7ac59" name="body" value="wagon" data-label="Wagon" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="wagon_4873d6a03ec7ac59" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="wagon_4873d6a03ec7ac59" data-disabled="false" data-test-ui="checkbox-label">Wagon</label>
</div>
</li>
</ul>
</div>
</div>
</div>
<div>
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any fuel type">Any fuel type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="petrol_2d7209185aa239a5" name="fuel" value="petrol" data-label="Petrol" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="petrol_2d7209185aa239a5" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="petrol_2d7209185aa239a5" data-disabled="false" data-test-ui="checkbox-label">Petrol</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="diesel_2d7209185aa239a5" name="fuel" value="diesel" data-label="Diesel" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="diesel_2d7209185aa239a5" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="diesel_2d7209185aa239a5" data-disabled="false" data-test-ui="checkbox-label">Diesel</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="hybrid_2d7209185aa239a5" name="fuel" value="hybrid" data-label="Hybrid" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="hybrid_2d7209185aa239a5" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="hybrid_2d7209185aa239a5" data-disabled="false" data-test-ui="checkbox-label">Hybrid</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="electric_2d7209185aa239a5" name="fuel" value="electric" data-label="Electric" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="electric_2d7209185aa239a5" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="electric_2d7209185aa239a5" data-disabled="false" data-test-ui="checkbox-label">Electric</label>
</div>
</li>
</ul>
</div>
</div>
</div>
<div>
<div class="tw-relative"
data-theme="Light"
data-test-ui="dropdown"
data-default-open="false"
x-data="dropdownMultiSelect"
x-bind="container">
<button type="button"
class="
tw-border tw-border-solid tw-text-gray-800 tw-bg-base-white tw-border-gray-200 hover:tw-bg-base-white hover:tw-border-gray-900 focus:tw-bg-base-white focus:tw-border-gray-900 tw-text-lg tw-w-full tw-flex tw-flex-row tw-justify-between tw-items-center tw-px-4 tw-py-2.5 tw-gap-6 tw-rounded disabled:tw-text-gray-500 disabled:tw-cursor-not-allowed disabled:focus:tw-border-gray-100 data-[has-selected=true]:tw-text-gray-800 data-[has-selected=true]:tw-not-italic disabled:data-[has-selected=true]:tw-text-gray-500
"
tabindex="0"
data-test-ui="dropdown-button"
data-has-selected="false"
aria-label="dropdown input"
aria-disabled="false"
x-bind="button">
<span class="tw-grow tw-truncate tw-text-left" data-test-ui="dropdown-button-title" x-bind="multiLabel" data-placeholder="Any usage type">Any usage type</span>
<i data-test-ui="dropdown-button-icon">
<svg class="tw-w-5 tw-h-5 tw-text-primary-500 data-[disabled=true]:tw-text-gray-500" data-disabled="false" x-bind="toggleIcon" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</button>
<div class="tw-absolute tw-z-20 tw-w-full tw-max-h-64 tw-mt-1 tw-py-2 tw-overflow-auto tw-text-gray-800 tw-bg-base-white tw-shadow-[0_8px_12px_rgba(0,0,0,0.05)]"
data-test-ui="dropdown-panel"
x-cloak
x-bind="panel">
<ul data-test-ui="dropdown-menu"
tabindex="-1">
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="off-road_3a8ba43b23ca51ba" name="usageType" value="off-road" data-label="Off-road" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="off-road_3a8ba43b23ca51ba" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="off-road_3a8ba43b23ca51ba" data-disabled="false" data-test-ui="checkbox-label">Off-road</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="family_3a8ba43b23ca51ba" name="usageType" value="family" data-label="Family" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="family_3a8ba43b23ca51ba" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="family_3a8ba43b23ca51ba" data-disabled="false" data-test-ui="checkbox-label">Family</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="performance_3a8ba43b23ca51ba" name="usageType" value="performance" data-label="Performance" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="performance_3a8ba43b23ca51ba" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="performance_3a8ba43b23ca51ba" data-disabled="false" data-test-ui="checkbox-label">Performance</label>
</div>
</li>
<li class="
tw-pl-6
tw-pr-2
hover:tw-bg-gray-100
data-[selected=true]:tw-bg-primary-100
data-[selected=true]:hover:tw-bg-primary-200
data-[disabled=true]:tw-text-gray-500
data-[disabled=true]:hover:tw-text-gray-500
data-[disabled=true]:hover:hover:tw-bg-base-white
data-[disabled=true]:hover:tw-cursor-not-allowed
"
data-selected="false"
data-disabled="false"
aria-disabled="false"
x-data="dropdownMutliSelectItem"
x-bind="multiItem">
<div class="tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><input type="checkbox" id="luxury_3a8ba43b23ca51ba" name="usageType" value="luxury" data-label="Luxury" tabindex="0" autocomplete="off" x-bind="multiCheckboxInput" class="tw-peer c-input-checkbox__element" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div>
<label for="luxury_3a8ba43b23ca51ba" class="tw-grow data-[disabled=true]:hover:tw-cursor-not-allowed tw-m-0" data-disabled="false" for="luxury_3a8ba43b23ca51ba" data-disabled="false" data-test-ui="checkbox-label">Luxury</label>
</div>
</li>
</ul>
</div>
</div>
</div>
<div>
<div class="c-select ">
<label class="tw-sr-only" for="safety">Choose a safety rating</label>
<select class="c-select__control tw-peer tw-w-full tw-pr-12 c-select__control--light"
id="safety"
name="safety"
autocomplete="off">
<option value="">Any safety rating</option>
<option value="5">5 stars</option>
<option value="4">4 stars or more</option>
<option value="3">3 stars or more</option>
<option value="2">2 stars or more</option>
<option value="1">1 star or more</option>
</select>
<i class="peer-[&[data-loading=true]]:tw-hidden" aria-hidden="false">
<svg class="c-select__indicator" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown" /></svg>
</i>
</div>
</div>
<div class="md:tw-col-span-2">
<div class="tw-relative tw-grid tw-grid-cols-2 tw-gap-2">
<div class="c-dropdown-container"><select ds-dropdown aria-label="Year" name="fromYear" tabindex="0" autocomplete="off" class="c-dropdown-control c-dropdown-control--light tw-peer">
<option value="0">From any year</option>
<option value="2026">2026</option>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
</select><i class="c-dropdown-control__icon peer-disabled:tw-text-gray-500"><svg aria-hidden="true" class="tw-w-5 tw-h-5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown"></use></svg></i></div>
<div class="c-dropdown-container"><select ds-dropdown aria-label="To any year" name="toYear" tabindex="0" autocomplete="off" class="c-dropdown-control c-dropdown-control--light tw-peer">
<option value="0">To any year</option>
<option value="2026">2026</option>
<option value="2025">2025</option>
<option value="2024">2024</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
</select><i class="c-dropdown-control__icon peer-disabled:tw-text-gray-500"><svg aria-hidden="true" class="tw-w-5 tw-h-5" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ChevronDown"></use></svg></i></div>
<div class="tw-absolute tw-inset-0 tw-flex tw-items-center tw-justify-center tw-pointer-events-none">
<div class="tw-flex tw-items-center tw-justify-center tw-outline-4 tw-outline tw-border-2 tw-outline-gray-900 tw-text-gray-900 tw-bg-white tw-border-white tw-p-0.5 tw-rounded-full tw-pointer-events-none">
<svg class="tw-w-4 tw-h-4 tw-text-current" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#ArrowRightSmall" /></svg>
</div>
</div>
</div>
</div>
</div>
</div>
</fieldset>
<div class="tw-flex">
<button x-bind="moreOptionsButtonElm" class="tw-inline-flex tw-gap-x-2 tw-py-2 tw-items-center tw-font-semibold" type="button">
<span class="tw-flex tw-items-center tw-gap-x-2" x-bind="moreLabelElm">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Plus" /></svg>
<span>More options</span>
</span>
<span class="tw-flex tw-items-center tw-gap-x-2" x-bind="lessLabelElm">
<svg class="tw-w-4 tw-h-4" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Minus" /></svg>
<span>Less options</span>
</span>
</button>
</div>
<fieldset class="tw-flex tw-flex-col tw-gap-y-4">
<div class="tw-flex tw-flex-wrap tw-gap-2 tw-justify-between">
<div class="tw-flex tw-items-center tw-gap-x-2">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="carProfiles_64EE7FAD" value="car-profiles" type="checkbox" checked data-reset-checked autocomplete="off" class="tw-peer c-input-checkbox__element c-input" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label class="tw-text-base-white tw-m-0" for="carProfiles_64EE7FAD" for="carProfiles_64EE7FAD" data-test-ui="checkbox-label">Car Profiles</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="reviews_64EE7FAD" value="reviews" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label class="tw-text-base-white tw-m-0" for="reviews_64EE7FAD" for="reviews_64EE7FAD" data-test-ui="checkbox-label">Reviews</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="news_64EE7FAD" value="news" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label class="tw-text-base-white tw-m-0" for="news_64EE7FAD" for="news_64EE7FAD" data-test-ui="checkbox-label">News</label>
</div>
</div>
<div class="tw-flex tw-items-center">
<div ds-checkbox class="tw-py-0 tw-flex tw-items-start tw-gap-2 tw-py-2 tw-text-gray-900" data-test-ui="checkbox">
<div class="c-input-checkbox"><div data-test-ui="checkbox" class="tw-relative tw-flex" x-data="password"><input name="pt" id="advice_64EE7FAD" value="advice" type="checkbox" class="tw-mr-2 tw-peer c-input-checkbox__element c-input" checked data-reset-checked autocomplete="off" data-focus-visible="false" data-test-ui="checkbox-input" /><i class="c-input-checkbox__ui"><svg aria-hidden="true" class="c-input-checkbox__ui-icon" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Check"></use></svg></i></div></div>
<label class="tw-text-base-white tw-m-0" for="advice_64EE7FAD" for="advice_64EE7FAD" data-test-ui="checkbox-label">Advice</label>
</div>
</div>
</div>
<div class="tw-flex tw-gap-x-2 tw-justify-between">
<button class="tw-flex-1 c-btn" data-test-ui="button">
Search
</button>
<button type="reset" x-bind="resetBtnElm" class="c-btn c-btn--light" data-test-ui="button">
Reset
</button>
</div>
</fieldset>
</div>
</form>
</div>
<div class="tw-flex tw-justify-center lg:tw-hidden">
<button class="tw-mx-auto xl:tw-hidden c-btn c-btn--light" x-bind="closeButtonElm" data-test-ui="button"><i class="c-btn__icon tw-text-primary-500"><svg aria-hidden="true" class="tw-inline-block tw-w-4 tw-h-4" data-test-ui="icon" role="img"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Close"></use></svg></i><span class="c-btn__label">Close</span></button>
</div>
</div>
</div>
</section>
<script src="/dist/app.3cc9f33ea3262152506f.js"></script>
<script src="/dist/jquery.84c630ba4ea98a709b54.js"></script>
<script async src="https://nzme-ads.co.nz/js/nzmedfp.js"></script>
<script async src="https://nzme-ads.co.nz/js/postm-lw-dfp.js"></script>
<footer class="tw-bg-gray-900 tw-text-base-white" aria-labelledby="footer-heading" role="contentinfo" data-test-ui="page-footer">
<h2 id="footer-heading" class="tw-sr-only">Driven Car Guide</h2>
<div class="tw-max-w-[414px] md:tw-max-w-none lg:tw-max-w-[1294px] tw-mx-auto md:tw-mx-auto tw-px-10 tw-py-12 md:tw-px-8">
<div class="md:tw-grid md:tw-grid-cols-3 md:tw-gap-8 lg:tw-grid-cols-6">
<div class="tw-flex tw-justify-center md:tw-justify-start lg:tw-col-span-6" data-test-ui="page-footer-driven-brand">
<a href="/">
<img loading="lazy" class="tw-w-[114px] md:tw-w-[142px]" src="/resources/svg-files/Colour-White.svg" width="142" height="39" alt="Driven Car Guide">
</a>
</div>
<div class="tw-hidden lg:tw-block lg:tw-col-span-2" data-test-ui="page-footer-description">
<p class="tw-m-0 tw-text-base tw-text-base-white lg:tw-max-w-[285px]">DRIVEN Car Guide is the first stop for any Kiwi looking to buy their next car. With in-depth vehicle reviews, latest motoring news, car comparisons, and ask an expert - drivencarguide.co.nz has all you need to know to buy your next car.</p>
</div>
<div class="tw-grid md:tw-grid-cols-2 md:tw-col-span-2 md:tw-gap-8 lg:tw-gap-8 tw-mt-8 md:tw-mt-0 md:tw-text-left lg:tw-col-span-4">
<div class="lg:tw-grid lg:tw-grid-cols-2 lg:tw-gap-8">
<ul role="list" class="tw-mb-0 tw-space-y-4 md:tw-space-y-1 tw-text-center md:tw-text-left" data-test-ui="page-footer-pages">
<li>
<a href="/reviews/" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Car Reviews</a>
</li>
<li>
<a href="/news/" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">News</a>
</li>
<li>
<a href="/advice/" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Advice</a>
</li>
<li>
<a href="/collections/ev-news-reviews" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Hybrid Cars</a>
</li>
<li>
<a href="/collections/ev-news-reviews" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Electric Cars</a>
</li>
<li>
<a href="/vehicle-search/" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Vehicle Search</a>
</li>
<li>
<a href="/collections/family" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Family Cars</a>
</li>
<li>
<a href="/collections/enthusiast" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Enthusiast</a>
</li>
<li>
<a href="/collections/adventure" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Adventure</a>
</li>
<li>
<a href="/collections/budget" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Budget Cars</a>
</li>
<li>
<a href="/compare-cars/" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Compare Cars</a>
</li>
<li>
<a href="/about-driven/contact" class="tw-text-base-white hover:tw-text-base-white hover:tw-underline">Contact Us</a>
</li>
</ul>
<div class="tw-mt-4 md:tw-mt-1 lg:tw-mt-0">
<ul role="list" class="tw-mb-0 tw-space-y-4 md:tw-space-y-1 tw-text-center md:tw-text-left" data-test-ui="page-footer-legal">
<li data-test-ui="page-footer-legal-terms-conditions">
<a class="tw-text-base-white hover:tw-text-base-white hover:tw-underline" href="/terms-conditions" >Terms & Conditions</a>
</li>
<li data-test-ui="page-footer-legal-privacy">
<a class="tw-text-base-white hover:tw-text-base-white hover:tw-underline" href="https://www.nzme.co.nz/about-nzme/privacy-policy/" target="_blank" rel="noopener">Privacy Policy</a>
</li>
<li data-test-ui="page-footer-advertise">
<a class="tw-text-base-white hover:tw-text-base-white hover:tw-underline" href="https://www.nzme.co.nz/advertise/" target="_blank" rel="noopener">Advertise with Us</a>
</li>
</ul>
<ul class="tw-flex tw-justify-center md:tw-justify-start tw-mt-8 tw-mb-0 tw--ml-1" data-test-ui="page-footer-social">
<li data-test-ui="page-footer-social-facebook">
<a class="tw-block tw-min-w-[24px] tw-p-1 tw-text-center hover:tw-text-base-white" href="https://www.facebook.com/DrivenNZ" target="_blank" rel="noopener">
<span class="tw-sr-only">Facebook</span>
<i aria-hidden="true">
<svg class="tw-w-7 tw-h-7 lg:tw-w-5 lg:tw-h-5" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Facebook" /></svg>
</i>
</a>
</li>
<li data-test-ui="page-footer-social-youtube">
<a class="tw-block tw-min-w-[24px] tw-p-1 tw-text-center hover:tw-text-base-white" href="https://www.youtube.com/c/DRIVENNZ" target="_blank" rel="noopener">
<span class="tw-sr-only">Youtube</span>
<i aria-hidden="true">
<svg class="tw-w-7 tw-h-7 lg:tw-w-5 lg:tw-h-5" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Youtube" /></svg>
</i>
</a>
</li>
<li data-test-ui="page-footer-social-instagram">
<a class="tw-block tw-min-w-[24px] tw-p-1 tw-text-center hover:tw-text-base-white" href="https://www.instagram.com/driven.nz/" target="_blank" rel="noopener">
<span class="tw-sr-only">Instagram</span>
<i aria-hidden="true">
<svg class="tw-w-7 tw-h-7 lg:tw-w-5 lg:tw-h-5" role="img" aria-hidden="true" data-test-ui="icon"><use href="/dist/icons.a132e96467e8d487c4bb17c5f39dc6d5.svg#Instagram" /></svg>
</i>
</a>
</li>
</ul>
</div>
</div>
<div class="tw-flex tw-gap-8 md:tw-gap-6 md:tw-flex-col md:tw-grow-0 tw-mt-8 md:tw-mt-0 tw-justify-between md:tw-justify-start tw-items-end md:tw-items-start" data-test-ui="page-footer-powered">
<div data-test-ui="page-footer-powered-nzme">
<span class="tw-block tw-mb-2">Powered By</span>
<a href="https://www.nzme.co.nz" target="_blank" rel="noopener">
<img loading="lazy" class="tw-w-[133px] md:tw-w-[172px]" src="/resources/static-images/NZME.png" width="172" height="31" alt="NZME Logo">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="tw-bg-base-black tw-py-4">
<p class="tw-flex tw-justify-center tw-text-base-white tw-text-center tw-gap-4 tw-mb-0">
<span data-test-ui="page-footer-copy">
© NZME Publishing Limited 2025
</span>
<a href="#" id="shielded-logo" data-test-ui="page-footer-shielded">
<img loading="lazy" class="tw-inline-block" alt="shielded" src="/resources/static-images/custom-logo.png" height="20" width="20">
</a>
</p>
</div>
</footer>
<script src="https://staticcdn.co.nz/embed/embed.js"></script>
<script>
(function () {
window.onload = function () {
var frameName = new ds07o6pcmkorn({
openElementId: "#shielded-logo",
modalID: "shieldedmodal",
});
frameName.init();
}
})();
</script>
<script>window.loopa=window.loopa||[];!function(){if("undefined"==typeof window._loopaSmartEvents){window._loopaSmartEvents={};var e="5e30dca28bdad407a0a48a26",t=function(){var t=document.createElement("script");t.src="//rtb.loopa.net.au/Pub/SmartEvents?pId="+e,t.setAttribute("async","true"),t.type="text/javascript";var a=document.createElement("script");a.src="https://ads-cdn.loopaautomate.com/scripts/static/loopaSmartEvents.min.js",a.setAttribute("async","true"),a.type="text/javascript";var n=document.getElementsByTagName("head")[0];if(n||(n=document.getElementsByTagName("script")[0].parentNode),n.appendChild(t),n.appendChild(a),!document.getElementById("___lpHead")){var d=document.createElement("span");d.id="___lpHead",d.setAttribute("style","display:none;"),n=document.getElementsByTagName("body")[0],n||(n=document.getElementsByTagName("head")[0]),n.appendChild(d)}};"complete"===document.readyState?t():window.addEventListener?window.addEventListener("load",t,!1):window.attachEvent?window.attachEvent("onload",t):t()}}();</script>
</body>
</html>