/* home-live.css: the 4 home sections below the hero (#whatmot, nearest MOT station, #howitworks, sell your vehicle) copied 1:1 from live checkmot.com.
   Rules read from live's own stylesheets 24 Oct 2026 and scoped to section.lv; images in /img/live/. Layout fix, Gil 15:39 UK. */
.lv{font-family:Lato,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:start;--bs-link-color-rgb:13,110,253;--bs-link-hover-color-rgb:10,88,202;--bs-link-opacity:1}
/* neutralise dev main.css rules that hit the same class names (live sets none of these) */
.container:is(.lv,.lv *){max-width:none}
.mediabox:is(.lv,.lv *),.mediabox:is(.lv,.lv *) .mediabody,.mediabox:is(.lv,.lv *) .mediabody h2{margin:0;padding:0;max-width:none;background:none}
.mediabox:is(.lv,.lv *) .mediabody h2 span{display:inline}
.mediabox:is(.lv,.lv *) .mediabody p{color:inherit}
*:is(.lv,.lv *){box-sizing: border-box;}
h6:is(.lv,.lv *),h4:is(.lv,.lv *),h3:is(.lv,.lv *),h2:is(.lv,.lv *){margin-top: 0px; margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; color: var(--bs-heading-color);}
h2:is(.lv,.lv *){font-size: calc(1.325rem + 0.9vw);}
@media (min-width: 1200px){h2:is(.lv,.lv *){font-size: 2rem;}}
h3:is(.lv,.lv *){font-size: calc(1.3rem + 0.6vw);}
@media (min-width: 1200px){h3:is(.lv,.lv *){font-size: 1.75rem;}}
h4:is(.lv,.lv *){font-size: calc(1.275rem + 0.3vw);}
@media (min-width: 1200px){h4:is(.lv,.lv *){font-size: 1.5rem;}}
h6:is(.lv,.lv *){font-size: 1rem;}
p:is(.lv,.lv *){margin-top: 0px; margin-bottom: 1rem;}
a:is(.lv,.lv *){color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); text-decoration: underline;}
a:hover:is(.lv,.lv *){--bs-link-color-rgb: var(--bs-link-hover-color-rgb);}
a:not([href]):not([class]):is(.lv,.lv *),a:not([href]):not([class]):hover:is(.lv,.lv *){color: inherit; text-decoration: none;}
img:is(.lv,.lv *){vertical-align: middle;}
.img-fluid:is(.lv,.lv *){max-width: 100%; height: auto;}
.container:is(.lv,.lv *){--bs-gutter-x: 1.5rem; --bs-gutter-y: 0; width: 100%; padding-right: calc(var(--bs-gutter-x) * 0.5); padding-left: calc(var(--bs-gutter-x) * 0.5); margin-right: auto; margin-left: auto;}
@media (min-width: 576px){.container:is(.lv,.lv *){max-width: 540px;}}
@media (min-width: 768px){.container:is(.lv,.lv *){max-width: 720px;}}
@media (min-width: 992px){.container:is(.lv,.lv *){max-width: 960px;}}
@media (min-width: 1200px){.container:is(.lv,.lv *){max-width: 1140px;}}
@media (min-width: 1400px){.container:is(.lv,.lv *){max-width: 1320px;}}
.row:is(.lv,.lv *){--bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-0.5 * var(--bs-gutter-x)); margin-left: calc(-0.5 * var(--bs-gutter-x));}
.row > *:is(.lv,.lv *){flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * 0.5); padding-left: calc(var(--bs-gutter-x) * 0.5); margin-top: var(--bs-gutter-y);}
.col-12:is(.lv,.lv *){flex: 0 0 auto; width: 100%;}
.offset-1:is(.lv,.lv *){margin-left: 8.33333%;}
.gy-4:is(.lv,.lv *){--bs-gutter-y: 1.5rem;}
@media (min-width: 768px){.col-md-4:is(.lv,.lv *){flex: 0 0 auto; width: 33.3333%;}}
@media (min-width: 768px){.offset-md-3:is(.lv,.lv *){margin-left: 25%;}}
.mx-0:is(.lv,.lv *){margin-right: 0px !important; margin-left: 0px !important;}
.mx-auto:is(.lv,.lv *){margin-right: auto !important; margin-left: auto !important;}
.my-5:is(.lv,.lv *){margin-top: 3rem !important; margin-bottom: 3rem !important;}
.mt-0:is(.lv,.lv *){margin-top: 0px !important;}
.mb-0:is(.lv,.lv *){margin-bottom: 0px !important;}
.mb-2:is(.lv,.lv *){margin-bottom: 0.5rem !important;}
.mb-3:is(.lv,.lv *){margin-bottom: 1rem !important;}
.mb-4:is(.lv,.lv *){margin-bottom: 1.5rem !important;}
.mb-5:is(.lv,.lv *){margin-bottom: 3rem !important;}
.text-center:is(.lv,.lv *){text-align: center !important;}
@media (min-width: 768px){.mx-md-5:is(.lv,.lv *){margin-right: 3rem !important; margin-left: 3rem !important;}}
@media (min-width: 992px){.me-lg-0:is(.lv,.lv *){margin-right: 0px !important;}}
@media (min-width: 992px){.mb-lg-0:is(.lv,.lv *){margin-bottom: 0px !important;}}
@media (min-width: 992px){.ms-lg-auto:is(.lv,.lv *){margin-left: auto !important;}}
@media (min-width: 992px){.text-lg-end:is(.lv,.lv *){text-align: right !important;}}
*:is(.lv,.lv *){box-sizing: border-box;}
h2:is(.lv,.lv *),h3:is(.lv,.lv *),h4:is(.lv,.lv *),h6:is(.lv,.lv *){margin-top: 0px; margin-bottom: 0.5rem; font-weight: 500; line-height: 1.2; color: var(--bs-heading-color, inherit);}
h2:is(.lv,.lv *){font-size: calc(1.325rem + 0.9vw);}
@media (min-width: 1200px){h2:is(.lv,.lv *){font-size: 2rem;}}
h3:is(.lv,.lv *){font-size: calc(1.3rem + 0.6vw);}
@media (min-width: 1200px){h3:is(.lv,.lv *){font-size: 1.75rem;}}
h4:is(.lv,.lv *){font-size: calc(1.275rem + 0.3vw);}
@media (min-width: 1200px){h4:is(.lv,.lv *){font-size: 1.5rem;}}
h6:is(.lv,.lv *){font-size: 1rem;}
p:is(.lv,.lv *){margin-top: 0px; margin-bottom: 1rem;}
a:is(.lv,.lv *){color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); text-decoration: underline;}
a:hover:is(.lv,.lv *){--bs-link-color-rgb: var(--bs-link-hover-color-rgb);}
a:not([href]):not([class]):is(.lv,.lv *),a:not([href]):not([class]):hover:is(.lv,.lv *){color: inherit; text-decoration: none;}
img:is(.lv,.lv *){vertical-align: middle;}
.img-fluid:is(.lv,.lv *){max-width: 100%; height: auto;}
.container:is(.lv,.lv *){--bs-gutter-x: 1.5rem; --bs-gutter-y: 0; width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-right: auto; margin-left: auto;}
@media (min-width: 576px){.container:is(.lv,.lv *){max-width: 540px;}}
@media (min-width: 768px){.container:is(.lv,.lv *){max-width: 720px;}}
@media (min-width: 992px){.container:is(.lv,.lv *){max-width: 960px;}}
@media (min-width: 1200px){.container:is(.lv,.lv *){max-width: 1140px;}}
@media (min-width: 1400px){.container:is(.lv,.lv *){max-width: 1320px;}}
.row:is(.lv,.lv *){--bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-.5 * var(--bs-gutter-x)); margin-left: calc(-.5 * var(--bs-gutter-x));}
.row > *:is(.lv,.lv *){flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-top: var(--bs-gutter-y);}
.col-12:is(.lv,.lv *){flex: 0 0 auto; width: 100%;}
.offset-1:is(.lv,.lv *){margin-left: 8.33333%;}
.gy-4:is(.lv,.lv *){--bs-gutter-y: 1.5rem;}
@media (min-width: 768px){.col-md-4:is(.lv,.lv *){flex: 0 0 auto; width: 33.3333%;}}
@media (min-width: 768px){.offset-md-3:is(.lv,.lv *){margin-left: 25%;}}
.mx-0:is(.lv,.lv *){margin-right: 0px !important; margin-left: 0px !important;}
.mx-auto:is(.lv,.lv *){margin-right: auto !important; margin-left: auto !important;}
.my-5:is(.lv,.lv *){margin-top: 3rem !important; margin-bottom: 3rem !important;}
.mt-0:is(.lv,.lv *){margin-top: 0px !important;}
.mb-0:is(.lv,.lv *){margin-bottom: 0px !important;}
.mb-2:is(.lv,.lv *){margin-bottom: 0.5rem !important;}
.mb-3:is(.lv,.lv *){margin-bottom: 1rem !important;}
.mb-4:is(.lv,.lv *){margin-bottom: 1.5rem !important;}
.mb-5:is(.lv,.lv *){margin-bottom: 3rem !important;}
.text-center:is(.lv,.lv *){text-align: center !important;}
@media (min-width: 768px){.mx-md-5:is(.lv,.lv *){margin-right: 3rem !important; margin-left: 3rem !important;}}
@media (min-width: 992px){.me-lg-0:is(.lv,.lv *){margin-right: 0px !important;}}
@media (min-width: 992px){.mb-lg-0:is(.lv,.lv *){margin-bottom: 0px !important;}}
@media (min-width: 992px){.ms-lg-auto:is(.lv,.lv *){margin-left: auto !important;}}
@media (min-width: 992px){.text-lg-end:is(.lv,.lv *){text-align: right !important;}}
p:is(.lv,.lv *){text-align: justify;}
@media (min-width: 1200px){.container:is(.lv,.lv *){max-width: 1450px;}}
*:is(.lv,.lv *){font-family: Lato, sans-serif;}
section.spacer:is(.lv,.lv *){margin-top: 100px;}
@media (max-width: 575px){section.spacer:is(.lv,.lv *){margin-top: 40px;}}
section.spacer--bottom:is(.lv,.lv *){margin-bottom: 100px;}
@media (max-width: 575px){section.spacer--bottom:is(.lv,.lv *){margin-top: 40px;}}
*:is(.lv,.lv *),h2:is(.lv,.lv *),h3:is(.lv,.lv *),h4:is(.lv,.lv *),h6:is(.lv,.lv *),p:is(.lv,.lv *),a:is(.lv,.lv *){margin: 0px; padding: 0px;}
*:is(.lv,.lv *){outline: none !important;}
a:is(.lv,.lv *){text-decoration: none;}
.sprites001-manufacturing:is(.lv,.lv *),.sprites002-exam:is(.lv,.lv *),.sprites003-check:is(.lv,.lv *){max-width: 100%; background-size: 100% auto; background-image: url("/img/live/sprites.e63c308.webp");}
.sprites001-manufacturing:is(.lv,.lv *){background-position: 0px 30.4444%; background-size: 281.169% auto;}
.sprites002-exam:is(.lv,.lv *){background-position: 0px 47.7778%; background-size: 300.694% auto;}
.sprites003-check:is(.lv,.lv *){background-position: 0px 65.1111%; background-size: 373.276% auto;}
.locate-btn:is(.lv,.lv *){background-color: rgb(0, 58, 255); border: 0px; border-radius: 0px; padding: 15px 20px; color: rgb(255, 255, 255); font-weight: bold; display: block; max-width: 250px;}
.locate-btn:hover:is(.lv,.lv *){color: rgb(255, 255, 255);}
a:hover:is(.lv,.lv *){cursor: pointer;}
.mediabox[data-v-950ac824]:is(.lv,.lv *){background-image: url("/img/live/checked-car.7f68625.webp"); background-position: left top; background-size: contain; background-repeat: no-repeat;}
.mediabox .mediabody[data-v-950ac824]:is(.lv,.lv *){background-color: rgb(255, 255, 255); padding: 40px;}
@media (max-width: 575px){.mediabox .mediabody[data-v-950ac824]:is(.lv,.lv *){background-color: rgba(255, 255, 255, 0.69);}}
.mediabox .mediabody p[data-v-950ac824]:is(.lv,.lv *){max-width: 500px; font-style: normal; font-weight: normal; line-height: 28px; font-size: 16px; color: rgb(74, 74, 74);}
.mediabox .mediabody h2[data-v-950ac824]:is(.lv,.lv *){max-width: 470px; font-weight: 700; font-size: 36px;}
.mediabox .mediabody h2 span[data-v-950ac824]:is(.lv,.lv *){color: rgb(75, 142, 255);}
@media (max-width: 575px){.mediabox .mediabody h2[data-v-950ac824]:is(.lv,.lv *){font-size: 24px;}}
.mediabox .mediaouter[data-v-950ac824]:is(.lv,.lv *){padding: 0px 0px 185px 19px;}
@media (max-width: 575px){.mediabox .mediaouter[data-v-950ac824]:is(.lv,.lv *){padding-top: 80%; padding-bottom: 0px;}}
#howitworks h4[data-v-950ac824]:is(.lv,.lv *){font-style: normal; font-weight: bold; line-height: 44px; font-size: 36px; text-align: center; color: rgb(0, 41, 73);}
@media (max-width: 575px){.imagebox[data-v-950ac824]:is(.lv,.lv *){margin-bottom: 50px;}}
.imagebox img[data-v-950ac824]:is(.lv,.lv *){height: 77px; margin-bottom: 46px;}
.imagebox span[data-v-950ac824]:is(.lv,.lv *){font-style: normal; font-weight: normal; line-height: 21px; font-size: 13px; text-align: center; color: rgb(74, 74, 74); display: block; margin: auto; max-width: 194px;}
.imagebox h6[data-v-950ac824]:is(.lv,.lv *){font-style: normal; font-weight: bold; line-height: 22px; font-size: 18px; text-align: center; color: rgb(0, 41, 73); margin-top: 0em !important;}
#map_location[data-v-950ac824]:is(.lv,.lv *){margin-top: -120px; padding-bottom: 120px; display: block;}
.nearest-station[data-v-950ac824]:is(.lv,.lv *){position: relative; max-width: 1010px; margin: auto !important;}
.nearest-station__text-box[data-v-950ac824]:is(.lv,.lv *){max-width: 380px; margin: auto;}
@media (min-width: 992px){.nearest-station__text-box[data-v-950ac824]:is(.lv,.lv *){position: absolute; right: 0px;}}
.nearest-station__text-box h3[data-v-950ac824]:is(.lv,.lv *){font-size: 36px; line-height: 44px; color: rgb(0, 41, 73); font-weight: 700;}
.nearest-station__text-box h3 span[data-v-950ac824]:is(.lv,.lv *){color: rgb(0, 58, 255);}
@media (min-width: 992px){.nearest-station__img[data-v-950ac824]:is(.lv,.lv *){padding-left: 80px;}}
.map-section[data-v-950ac824]:is(.lv,.lv *){margin: 150px 0px;}

/* Lato with swap (live loads Lato with display=swap; dev entry css uses optional, so first visits could fall back) */
@font-face{font-family:Lato;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/lato-400.woff2) format("woff2")}
@font-face{font-family:Lato;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/lato-700.woff2) format("woff2")}
@font-face{font-family:Lato;font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/lato-900.woff2) format("woff2")}
/* Gil's layout audit 24 Oct (deliberate): keep "MOT station" together. (Phone spacing tweak removed 24 Oct 16:35 UK: home spacing = live exactly, Gil "Make sure the homepage flow is not touched") */
.nearest-station__text-box:is(.lv *) h3 span{white-space:nowrap}
/* compact TEST SITE banner on phones (Gil's audit) */
@media (max-width:600px){.test-banner{padding:2px 30px!important;font-size:11px!important;line-height:14px!important}.test-banner .tb-long{display:none!important}.tb-x{height:18px!important;width:28px!important;font-size:16px!important;right:2px!important}}
