*{box-sizing:border-box}body{margin:0;background:#0a264e;color:#fff;font:16px/1.45 Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}.showcase{max-width:1600px;margin:auto;background:#0a264e}.bar{display:flex;align-items:center;gap:28px;padding:16px clamp(20px,4vw,64px);border-bottom:1px solid #343638}.wordmark{font-size:24px;font-weight:900;letter-spacing:-1px}.wordmark span{color:#007dc4}.bar-label{font-size:12px;font-weight:700;letter-spacing:1.7px;color:#ccc}.bar a{margin-left:auto;text-decoration:none;font-weight:700;white-space:nowrap}.stage{position:relative;min-height:500px}.slide{display:grid;grid-template-columns:1fr 1fr;min-height:500px}.copy{padding:clamp(24px,4vw,60px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;border-left:5px solid #007dc4}.eyebrow{color:#007dc4;font-size:14px;font-weight:800;letter-spacing:3px;margin:0 0 12px}h1{font-size:clamp(40px,5.6vw,82px);line-height:1.02;letter-spacing:-2px;margin:0 0 12px;font-weight:900}.variant{font-size:clamp(18px,2vw,24px);color:#ddd;margin:0 0 14px}.colour{display:flex;align-items:center;gap:9px;font-size:14px;color:#ddd}.swatch{width:17px;height:17px;border:1px solid #989898;border-radius:50%;background:#171717}.swatch.grey{background:#686d71}.features{padding:0;margin:22px 0 24px;list-style:none;display:grid;gap:8px;color:#ddd;font-size:16px}.features li{padding-left:18px;position:relative}.features li:before{content:'';position:absolute;left:0;top:.52em;width:6px;height:6px;background:#007dc4}.from{display:block;font-size:12px;letter-spacing:2px;color:#ccc;font-weight:700}.price{font-size:clamp(30px,3vw,42px);font-weight:800;letter-spacing:-1px;margin:0}.price small{font-size:18px;letter-spacing:0;font-weight:400}.inc{display:block;color:#bbb;font-size:14px;margin:0 0 22px}.cta{display:inline-block;background:#007dc4;color:white;text-decoration:none;padding:13px 22px;font-size:14px;font-weight:800;letter-spacing:1px;transition:background .2s}.cta:hover{background:#007dc4}.image-link{display:flex;align-items:center;justify-content:center;background:#0a264e;padding:20px}.image-link img{width:100%;max-width:610px;max-height:610px;object-fit:contain;aspect-ratio:1;display:block}.controls{display:flex;align-items:center;justify-content:space-between;padding:14px clamp(20px,4vw,64px);border-top:1px solid #343638}.transport{display:flex;align-items:center;gap:16px}.transport button{border:1px solid #555;background:transparent;color:white;width:38px;height:38px;font-size:25px}.transport #play{font-size:16px;margin-left:8px}.transport button:hover{background:#007dc4}#counter{font-size:14px;font-variant-numeric:tabular-nums;color:#ccc}.choose{font-size:12px;letter-spacing:2px;color:#ccc}.thumbnails{display:flex;overflow-x:auto;gap:12px;padding:4px clamp(20px,4vw,64px) 14px;scroll-snap-type:x mandatory;scrollbar-color:#007dc4 #0a264e}.thumb{flex:0 0 112px;background:#0a264e;border:2px solid transparent;color:#bbb;padding:0 0 8px;text-align:left;scroll-snap-align:start}.thumb[aria-current=true]{border-color:#007dc4;background:#0a264e;color:white}.thumb img{width:108px;height:82px;object-fit:contain;display:block;background:#0a264e}.thumb strong,.thumb span{display:block;padding:0 7px}.thumb strong{font-size:14px;margin-top:6px}.thumb span{font-size:12px}.note{font-size:12px;color:#bcbcbc;padding:4px clamp(20px,4vw,64px) 20px}.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}.loading{padding:50px}.slide.enter{animation:fade .4s ease-out}@keyframes fade{from{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:none}}@media(min-width:1500px){.slide{grid-template-columns:1.05fr 1fr}}@media(max-width:700px){.bar{padding:12px 18px;gap:12px}.bar-label{display:none}.bar a{font-size:14px}.wordmark{font-size:21px}.slide{grid-template-columns:1fr;min-height:0}.copy{padding:24px 22px;border-left-width:4px}h1{font-size:46px}.variant{font-size:18px;margin-bottom:10px}.eyebrow{margin-bottom:8px}.features{font-size:15px;margin:16px 0;gap:5px}.price{font-size:34px}.inc{margin-bottom:17px}.image-link{padding:14px 22px}.image-link img{max-width:420px;max-height:420px}.controls{padding:12px 20px}.choose{font-size:10px;letter-spacing:1px}.thumbnails{padding-left:20px;padding-right:20px}.stage{min-height:0}.note{padding-left:20px;padding-right:20px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}

/* Align the three price lines with brand, model and variant. */
.product-heading{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto;column-gap:18px;row-gap:9px;align-items:center;margin-bottom:16px}
.product-heading .eyebrow{grid-column:1;grid-row:1;margin:0}
.product-heading h1{grid-column:1;grid-row:2;margin:0;font-size:clamp(30px,3.7vw,56px);letter-spacing:-1px;overflow-wrap:normal}
.product-heading .variant{grid-column:1;grid-row:3;margin:0;font-size:16px}
.product-heading .from{grid-column:2;grid-row:1;text-align:right;align-self:center}
.product-heading .price{grid-column:2;grid-row:2;text-align:right;white-space:nowrap;font-size:clamp(24px,2.5vw,36px);margin:0}
.product-heading .price small{font-size:14px}
.product-heading .inc{grid-column:2;grid-row:3;text-align:right;white-space:nowrap;margin:0;font-size:14px}
@media(max-width:700px){.product-heading{column-gap:12px}.product-heading h1{font-size:clamp(28px,6.5vw,44px)}.product-heading .price{font-size:clamp(23px,5vw,32px)}.product-heading .variant{font-size:14px}.product-heading .inc{font-size:13px}.product-heading .price small{font-size:12px}}

/* The contact bar stays at the viewport bottom while the slides scroll behind it. */
.showcase{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:1000;max-width:1600px;margin:0 auto;background:#0a264e;border-bottom:0;border-top:1px solid #343638;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 24px #0003}
.showcase.embedded{padding-bottom:0}
.showcase.embedded .bar{display:none}
@media(max-width:700px){.bar{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}}

.actions{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%}.actions .colour{margin-left:auto;white-space:nowrap}.actions .cta{white-space:nowrap}@media(max-width:380px){.actions{gap:9px}.actions .cta{padding:12px 13px;font-size:12px}.actions .colour{font-size:13px}}

.bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px}.bar>a{justify-self:end;margin-left:0}.bar-navigation{display:flex;align-items:center;justify-content:center;gap:7px}.bar-navigation button{width:44px;height:44px;display:grid;place-items:center;padding:0;background:transparent;border:1px solid #555;color:#fff;font:24px/1 Arial,Helvetica,sans-serif}.bar-navigation button:hover{background:#007dc4}.bar-navigation>span{color:#777;font-size:20px}@media(max-width:420px){.bar{padding-left:10px;padding-right:10px;gap:6px}.bar .wordmark{font-size:18px}.bar>a{font-size:12px}.bar-navigation{gap:3px}}

.bar>.wordmark{justify-self:start;margin-left:0;text-decoration:none;color:#fff}

.transport #refresh{font-size:24px}.transport button:disabled{opacity:.45;cursor:wait}.choose{text-decoration:none}.choose:hover{text-decoration:underline}.extras{font-size:14px;color:#ccc;margin:0 0 18px}.extras p{margin:5px 0}.image-link.fallback{background:#0a264e}.empty{padding:60px 24px;text-align:center;min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty a{margin-top:18px}.product-heading .price.enquire{font-size:22px;white-space:normal;max-width:145px}.transport{gap:10px}@media(max-width:420px){.controls{flex-wrap:wrap;gap:12px}.transport{gap:8px}.transport button{width:36px}.choose{margin-left:auto}}

/* Secondary amount bold; its VAT suffix stays regular. */
.product-heading .inc{font-weight:400}.product-heading .inc strong{font-weight:700}

/* Colour and availability share a right-aligned row beside the action. */
.actions{flex-wrap:wrap}.actions .colour{justify-content:flex-end;text-align:right}.colour .swatch{flex:0 0 17px}.stock-label{color:#fff;font-weight:700;font-size:12px;letter-spacing:.5px;white-space:nowrap}

/* Keep the upgrade label and price on separate lines for both axle types. */
.alloy-option .alloy-upgrade{display:block;width:fit-content;max-width:100%;padding:7px 10px;border:1px solid #007dc4;color:#fff;font-weight:700}.alloy-option .alloy-price{display:block;margin-top:8px;color:#fff}

/* Image leads the DOM order: left on desktop, first in the mobile stack. */
.image-link{position:relative;align-self:start;width:100%;min-width:0;aspect-ratio:1 / 1;padding:0;overflow:hidden}.image-link img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;padding:20px;object-fit:contain;aspect-ratio:1 / 1}@media(max-width:700px){.image-link img{padding:14px}}

/* Contact details and navigation share one compact mobile row. */
.bar>.wordmark{font-size:34px;line-height:1.1}.bar>a:not(.wordmark){font-size:28px;line-height:1.1;letter-spacing:-.5px}
@media(max-width:700px){
 .showcase{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
 .showcase.embedded{padding-bottom:0}
 .bar{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px;align-items:center;padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))}
 .bar>.wordmark{grid-column:1;grid-row:1;font-size:clamp(20px,5.5vw,28px)}
 .bar>a:not(.wordmark){grid-column:3;grid-row:1;font-size:clamp(20px,6.2vw,28px);justify-self:end}
 .bar-navigation{grid-column:2;grid-row:1;justify-self:center;gap:5px}
}

/* Features on the left; alloy availability below the stock status on the right. */
.detail-row{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:20px;width:100%;padding-top:22px}
.detail-row.with-alloys{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.detail-row .features{margin:0 0 24px}
.detail-row .alloy-option{min-width:0;margin:0 0 18px;text-align:right;justify-self:stretch}
.detail-row .alloy-upgrade{margin-left:auto}
@media(max-width:700px){.detail-row{gap:12px;padding-top:16px}.detail-row .alloy-option{font-size:13px}.detail-row .alloy-upgrade{padding:6px 8px}}

/* Optional product video tops the details pane, between photo and copy on mobile. */
.product-video{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;margin:0 0 24px;overflow:hidden}
.product-video video,.product-video iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border:0;display:block}
.product-video[hidden]{display:none}

@media(max-width:700px){.bar>a.contact-phone{font-size:clamp(10px,3.1vw,14px);text-align:right;justify-self:end;line-height:1.2;letter-spacing:0}.contact-phone .phone-rest{display:block}}

/* Hide the page scrollbar while preserving normal scrolling. */
html,body{scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar,body::-webkit-scrollbar{width:0}

/* CALL balances the wordmark; the number stays stacked beside it on mobile. */
.bar>a.contact-phone{display:flex;align-items:center;justify-content:flex-end;gap:10px}.contact-phone .call-label{font-size:34px;font-weight:900;line-height:1;letter-spacing:-1px}.phone-digits{text-align:right}
@media(max-width:700px){.bar>a.contact-phone{gap:5px}.contact-phone .call-label{font-size:clamp(18px,5.5vw,28px)}}

#stock-ribbon[hidden]{display:none}.transport #ribbon-toggle{font-size:26px;line-height:1}@media(max-width:380px){.controls{padding-left:12px;padding-right:12px}.transport{gap:6px}.transport #play{margin-left:0}}

/* Number and underline together match the desktop CALL label height. */
@media(min-width:701px){.contact-phone .phone-digits{display:inline-block;font-size:28px;line-height:1;padding-bottom:1px;border-bottom:5px solid #007dc4}}

/* Opaque brand tile overlays the upper-left of the in-page video frame. */
.product-video .video-brand{position:absolute;top:0;left:0;z-index:2;width:clamp(64px,22%,110px);height:auto;aspect-ratio:1;object-fit:contain;background:transparent;pointer-events:none;user-select:none}

/* Model search replaces the range link in the carousel controls. */
.controls{gap:16px;flex-wrap:wrap}.model-search{display:block;width:clamp(160px,25vw,280px);max-width:100%;margin-left:auto}.model-search input{display:block;width:100%;min-width:0;padding:9px 12px;border:2px solid #007dc4;border-radius:0;background:#0a264e;color:#fff;font:inherit;font-size:14px}.model-search input::placeholder{color:#ccc;opacity:1}.model-search input:focus-visible{outline:2px solid #fff;outline-offset:3px}@media(max-width:700px){.model-search{width:180px;flex:1 1 150px}.controls{gap:12px}}

.detail-row .stock-options{min-width:0;margin:0 0 18px;text-align:right;justify-self:stretch}.order-colours{margin-top:18px;font-size:12px;line-height:1.5;text-align:right}.order-colours p{margin:0 0 5px}.order-colours ul{margin:0;padding:0;list-style:disc inside}.order-colours li{margin:0}.stock-options>.order-colours:first-child{margin-top:0}

.order-colours ul{list-style:none}.order-colours li{display:flex;align-items:center;justify-content:flex-end;gap:8px}.order-colour-swatch{display:inline-block;width:12px;height:12px;flex:0 0 12px;border:1px solid #989898;border-radius:50%}

/* Alloy details sit below the alternate colours, aligned to the right. */
.alloy-details>span{display:block}.stock-options>.alloy-details{margin:20px 0 0;text-align:right}.alloy-details .alloy-upgrade{margin-top:8px}

/* Desktop: image and its controls share the left column; copy occupies the right. */
@media(min-width:701px){
 .showcase{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:max-content max-content auto;align-items:start}
 .stage,.stage>.slide{display:contents}
 .slide>.image-link{grid-column:1;grid-row:1}
 .slide>.copy{grid-column:2;grid-row:1 / span 3;min-width:0}
 .showcase>.controls{grid-column:1;grid-row:2;min-width:0;padding:14px clamp(12px,2vw,28px)}
 .showcase>#stock-ribbon{grid-column:1;grid-row:3;min-width:0}
 .showcase .thumbnails{padding-left:clamp(12px,2vw,28px);padding-right:clamp(12px,2vw,28px)}
 .showcase .note{padding-left:clamp(12px,2vw,28px);padding-right:clamp(12px,2vw,28px)}
 .stage>.empty,.stage>.loading{grid-column:1 / -1;grid-row:1}
 .slide.enter>.image-link,.slide.enter>.copy{animation:fade .4s ease-out}
}
/* Mobile: controls and the initially minimised ribbon precede the square image. */
@media(max-width:700px){
 .showcase{display:flex;flex-direction:column}
 .showcase>.controls{order:0;width:100%}
 .showcase>#stock-ribbon{order:1;width:100%;min-width:0}
 .showcase>.stage{order:2;width:100%}
}

/* Blank-line separation before the additional same-model price-point bullet. */
.features li.alternative-price{margin-top:1em}

/* Sold stock remains visible, clearly marked across its main image. */
.reserved-ribbon,.coming-soon-ribbon,.next-delivery-ribbon,.invoice-sent-ribbon,.deposit-paid-ribbon{position:absolute;z-index:2;top:50%;left:-15%;width:130%;transform:translateY(-50%) rotate(-25deg);padding:14px 8px;background:#e4b84e;color:#0a264e;text-align:center;font-size:clamp(12px,2.4vw,28px);font-weight:900;line-height:1.3;white-space:nowrap;box-shadow:0 4px 14px #0005;pointer-events:none;border-top:2px solid #f6d886;border-bottom:2px solid #be8b24}
@media(max-width:700px){.reserved-ribbon,.coming-soon-ribbon,.next-delivery-ribbon,.invoice-sent-ribbon,.deposit-paid-ribbon{font-size:clamp(12px,3.7vw,24px);padding:12px 6px}}

.coming-soon-ribbon{background:#9bd9f3;border-top-color:#d1effc;border-bottom-color:#65b7db;color:#0a264e}

.showcase{--stock-highlight:#007dc4}
.next-delivery-ribbon{background:var(--stock-highlight);border-top-color:var(--stock-highlight);border-bottom-color:var(--stock-highlight);color:#fff}

.controls{flex-wrap:wrap}.refresh-feedback{flex-basis:100%;font-size:13px;line-height:1.4;padding-top:5px;color:inherit}.refresh-feedback[hidden]{display:none}

.invoice-sent-ribbon{background:#b8753d;border-top-color:#dfae83;border-bottom-color:#85502a;color:#fff}
.deposit-paid-ribbon{background:#c0c0c0;border-top-color:#ececec;border-bottom-color:#909090;color:#0a264e}
