/* The New Reg reskin. Loaded last on every page, so it wins over the legacy CSS.
   Typography, spacing, controls and plates follow PrivatePlates.co.uk; colour is
   New Reg red as the one brand colour, tones of it, and a grey ladder. Plate yellow
   appears only on registration marks. Legacy colours are mapped onto these tokens
   by tools/recolour.py. */

@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-latin.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-latinext.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-symbols.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+2192,U+2713}
@font-face{font-family:'Source Serif 4';src:url('/assets/fonts/SourceSerif4-latin.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';src:url('/assets/fonts/SourceSerif4-latinext.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Serif 4';src:url('/assets/fonts/SourceSerif4-italic-latin.woff2') format('woff2');
  font-weight:400 700;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Every legacy use of the old plate face now draws in Charles Wright, so search boxes, gift
   ideas and any plate the drawing code leaves alone match the drawn plates. */
@font-face{font-family:'registration_plate_ukregular';src:url('/assets/fonts/UKNumberPlate.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}

:root{
  --nr-red-950:#4a0404; --nr-red-900:#7a0000; --nr-red-800:#a30000; --nr-red-700:#cc0000;
  --nr-red-300:#f09999; --nr-red-100:#fde2e2; --nr-red-50:#fef3f2;
  --nr-white:#ffffff; --nr-grey-50:#f9fafb; --nr-grey-100:#f2f4f7; --nr-grey-200:#eaecf0;
  --nr-grey-300:#d0d5dd; --nr-grey-400:#98a2b3; --nr-grey-500:#667085; --nr-grey-600:#475467;
  --nr-grey-700:#344054; --nr-grey-800:#1d2939; --nr-ink:#182230; --nr-black:#000000;
  --nr-ok:#167a3b; --nr-ok-wash:#ecfdf3;

  --brand:var(--nr-red-700); --brand-hover:var(--nr-red-800); --brand-pressed:var(--nr-red-900);
  --brand-ink:var(--nr-red-800); --brand-wash:var(--nr-red-50); --brand-edge:var(--nr-red-100);
  --surface:var(--nr-white); --surface-alt:var(--nr-grey-50); --line:var(--nr-grey-300);
  --line-soft:var(--nr-grey-200); --text:var(--nr-ink); --text-soft:var(--nr-grey-600);
  --text-faint:var(--nr-grey-500); --danger:var(--nr-red-900);
  --plate-yellow:#ffcc00;
  --ring:rgba(204,0,0,.28);

  --font-ui:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-brand:"Source Serif 4",Georgia,"Times New Roman",serif;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;
  --page-max:1000px; --page-pad:20px;
  --radius-ctl:11px; --card-radius:14px; --card-pad:var(--s4);
  --ctl-h:48px; --header-h:64px;
  --fs-input:16px; --fs-hint:13px;
  --motion:150ms; --ease:cubic-bezier(.2,.7,.3,1);
  --measure:34.9em;
}
@media (max-width:600px){ :root{--header-h:56px} }

/* The window scrolls, not the body. The legacy rule gave both html and body
   overflow-x:hidden, which turns body into the scroll container: Back lost its
   place, the iPhone toolbar never collapsed and sticky elements had no viewport. */
html,body{overflow-x:clip!important;overflow-y:visible!important;height:auto!important}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:var(--surface)!important;color:var(--text);font-family:var(--font-ui)!important;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11"}
button,input,select,textarea,optgroup{font-family:var(--font-ui)}
p,li,dd,td,th,span,label,div{font-family:inherit}

/* ---- type -------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{font-family:var(--font-ui)!important;color:var(--text);
  letter-spacing:-.01em;text-transform:none;font-weight:600}
main h1,.maincontentbody h1,article h1{font-size:clamp(26px,4vw,36px)!important;line-height:1.2!important;
  letter-spacing:-.02em;margin:0 0 var(--s3)!important;font-weight:600!important}
main h2,.maincontentbody h2,article h2{font-size:clamp(20px,2.6vw,24px)!important;line-height:1.3!important;
  margin:var(--s6) 0 var(--s2)!important;font-weight:600!important}
main h3,.maincontentbody h3,article h3{font-size:18px!important;line-height:1.35!important;
  margin:var(--s5) 0 var(--s2)!important;font-weight:600!important}
main h4,main h5,main h6{font-size:16px!important;line-height:1.4!important;margin:var(--s4) 0 var(--s2)!important}
:where(h1,h2,h3,h4,h5,h6):where(:not(header *):not(.sidenav *):not(footer *):not(section[style*="--nr-ink"] *)){color:var(--text)!important}

p{margin:0 0 var(--s4)}
main p,main li{color:var(--text-soft)}
main strong,main b{color:var(--text);font-weight:600}
small,.tip,.helper-text{font-size:var(--fs-hint);color:var(--text-faint)}

a{color:var(--brand-ink)}
a:hover{color:var(--brand-pressed)}
main p a:not([class]),main li a:not([class]),main dd a:not([class]),main td a:not([class]),
main figcaption a:not([class]),main blockquote a:not([class]),article p a:not([class]),article li a:not([class]){text-decoration:underline;
  text-underline-offset:2px;text-decoration-thickness:from-font}
::placeholder{color:var(--text-faint);opacity:1}
::selection{background:var(--nr-red-100);color:var(--nr-ink)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* ---- the page grid ----------------------------------------------------- */
.container{width:100%!important;max-width:calc(var(--page-max) + 2 * var(--page-pad))!important;
  padding-left:var(--page-pad)!important;padding-right:var(--page-pad)!important;margin-left:auto;margin-right:auto}
.row{margin-bottom:var(--s5)}
.row .col{padding-left:calc(var(--s5) / 2);padding-right:calc(var(--s5) / 2)}

.maincontentbody,body>main{padding-top:var(--s5)}

/* ---- surfaces: one card, one border, no drop shadows -------------------- */
.card,.card-panel,.collection,.collapsible,.z-depth-1,.z-depth-2,.z-depth-3,.z-depth-4,.z-depth-5{
  box-shadow:none!important}
.card,.card-panel{background:var(--surface)!important;border:1px solid var(--line-soft);
  border-radius:var(--card-radius)!important;padding:var(--card-pad)}
.card .card-content{padding:var(--card-pad)!important}
.card .card-action{border-top:1px solid var(--line-soft)!important;padding:var(--s3) var(--card-pad)!important}
.collection{border:1px solid var(--line-soft)!important;border-radius:var(--card-radius)}
.collection .collection-item{border-bottom:1px solid var(--line-soft)!important}
.collapsible{border:1px solid var(--line-soft)!important;border-radius:var(--card-radius);overflow:hidden}
.collapsible-header{border-bottom:1px solid var(--line-soft)!important;font-weight:600;color:var(--text);
  min-height:44px;align-items:center}
.divider{background:var(--line-soft)!important}
hr{border:0;border-top:1px solid var(--line-soft)}

/* Materialize colour classes, toned down. Backgrounds become surfaces; text
   colours become ink or the brand ink. The header keeps the brand red. */
:is(.red,.green,.blue,.orange,.pink,.teal,.indigo,.light-blue,.cyan,.purple,.deep-orange,.amber):not(.btn):not(button):not(header *):not(.sidenav *):not(nav){
  background-color:var(--surface-alt)!important;color:var(--text)!important}
.green-text,.blue-text,.pink-text,.orange-text,.teal-text,.indigo-text,.light-blue-text,.red-text{
  color:var(--brand-ink)!important}
.white-text:where(:not(header *):not(.sidenav *):not(.nr-wp *):not(.btn):not(.btn *):not(.newSearchGo *):not(section[style*="--nr-ink"] *):not(.category)){color:var(--text)!important}
.grey-text{color:var(--text-soft)!important}
.grey.lighten-4,.grey.lighten-3,.grey.lighten-5,.blue.lighten-5{background-color:var(--surface-alt)!important}

/* ---- controls: one height, one radius, one weight ----------------------- */
.btn,.btn-large,.btn-small,.btn-flat.btn-primary,button.btn,input[type=submit].btn,a.btn,
.waves-effect.waves-light.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);
  height:var(--ctl-h)!important;line-height:1!important;padding:0 var(--s5)!important;
  border-radius:var(--radius-ctl)!important;border:1px solid transparent!important;
  background-color:var(--brand)!important;color:#fff!important;font-family:var(--font-ui)!important;
  font-size:15px!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;
  box-shadow:none!important;transition:background-color var(--motion) var(--ease),border-color var(--motion) var(--ease)}
.btn:hover,.btn-large:hover,.btn-small:hover,a.btn:hover{background-color:var(--brand-hover)!important;color:#fff!important}
.btn:active,.btn-large:active,a.btn:active{background-color:var(--brand-pressed)!important}

.btn[style*="display:block"],.btn[style*="display: block"],.btn.btn-block,.btn.btn-full{display:flex!important;width:100%}
.btn-small{height:40px!important;padding:0 var(--s4)!important;font-size:14px!important}
.btn-flat:not(.btn-primary),.btn.white,.btn.grey,.btn.grey.lighten-3,.btn.grey.lighten-4,.btn-outline{
  background-color:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}
.btn-flat:not(.btn-primary):hover,.btn.white:hover,.btn.grey:hover{background-color:var(--surface-alt)!important;color:var(--text)!important}
.btn[disabled],.btn.disabled,button:disabled{background-color:var(--nr-grey-200)!important;color:var(--nr-grey-500)!important;cursor:not-allowed}
.btn .material-icons,.btn i{font-size:20px!important;margin:0!important;line-height:1!important}
.waves-ripple{display:none!important}

input:not([type]):not(.nr-cat-input):not(.reginput):not(.plateSearchInput),input[type=text]:not(.nr-cat-input):not(.reginput):not(.plateSearchInput),input[type=email],input[type=tel],input[type=number],input[type=password],
input[type=search]:not(.msearch):not(.plateSearchInput):not(.nr-cat-input):not(.reginput),input[type=url],input[type=date],select.browser-default,textarea,
textarea.materialize-textarea{
  min-height:var(--ctl-h);font-size:var(--fs-input)!important;color:var(--text)!important;background:var(--surface)!important;
  border:1px solid var(--line)!important;border-radius:var(--radius-ctl)!important;padding:0 var(--s3)!important;
  box-shadow:none!important;transition:border-color var(--motion) var(--ease),box-shadow var(--motion) var(--ease)}
textarea,textarea.materialize-textarea{padding:var(--s3)!important;min-height:96px}
input:focus,select:focus,textarea:focus{border-color:var(--brand)!important;box-shadow:0 0 0 3px var(--ring)!important;outline:none}
input.invalid,input:invalid:not(:placeholder-shown){border-color:var(--danger)!important}
.input-field label{color:var(--text-soft)}
.input-field label.active{color:var(--text-soft)}
label{color:var(--text-soft)}
[type=checkbox].filled-in:checked+span:not(.lever):after{border-color:var(--brand)!important;background-color:var(--brand)!important}
[type=radio]:checked+span:after,[type=radio].with-gap:checked+span:after{background-color:var(--brand)!important;border-color:var(--brand)!important}

/* ---- tables ------------------------------------------------------------ */
table{border-collapse:collapse;width:100%}
th{font-weight:600;color:var(--text);text-align:left;border-bottom:1px solid var(--line)}
td{color:var(--text-soft);border-bottom:1px solid var(--line-soft)}
th,td{padding:var(--s3) var(--s3)!important}
table.striped>tbody>tr:nth-child(odd){background-color:var(--surface-alt)!important}

/* ---- the header: the brand lives here --------------------------------- */
header.navbar-fixed{position:sticky!important;top:0;z-index:30;height:var(--header-h)!important}
header.navbar-fixed nav,header nav.nav{height:var(--header-h)!important;line-height:var(--header-h)!important;
  background-color:var(--brand)!important;box-shadow:none!important;border-bottom:1px solid var(--nr-red-800)}
header nav .container{position:relative;height:100%;display:flex;align-items:center;gap:var(--s4)}
header nav .brand-logo{position:static!important;flex:0 0 auto;height:100%;display:flex;align-items:center}
header #nr-nav-left{margin-left:var(--s4)!important;display:flex;flex:1 1 auto;height:100%}
header #nr-nav-left>li>a{font-family:var(--font-ui)!important;font-weight:600!important;font-size:15px!important;
  height:var(--header-h)!important;line-height:var(--header-h)!important;padding:0 var(--s3)!important;color:#fff!important}
header #nr-nav-left>li>a:hover{background:rgba(255,255,255,.12)!important}
header #nr-nav-left>li>a>i.material-icons{height:var(--header-h)!important;line-height:var(--header-h)!important}
header nav ul.right{display:flex;align-items:center;height:100%;margin-left:auto}
header nav ul.right>li>a{font-weight:600;font-size:15px!important;color:#fff!important;white-space:nowrap}
header #miniform{height:auto!important;display:flex;align-items:center}
header #miniform .input-field{margin:0!important;height:40px;display:flex;align-items:center;background:#fff;
  border-radius:var(--radius-ctl);padding:0 var(--s1) 0 var(--s3);box-shadow:none!important}
header #miniform input[type=search]{height:40px!important;line-height:40px!important;border:0!important;
  font-size:15px!important;color:var(--text)!important;background:transparent!important;box-shadow:none!important;
  padding:0 0 0 28px!important;margin:0!important}
header #miniform label{top:0!important;height:40px;display:flex;align-items:center;transform:none!important}
header #miniform label i{color:var(--text-faint)!important;font-size:20px!important;line-height:40px!important}
header #miniform input[type=submit]{color:var(--brand)!important;background:transparent!important;border:0;
  font-size:26px;width:36px;height:36px;line-height:36px;cursor:pointer}
header .dropdown-content{border-radius:var(--card-radius);border:1px solid var(--line-soft);
  box-shadow:0 12px 32px rgba(24,34,48,.12)!important;padding:var(--s2) 0;background:var(--surface)}
header .dropdown-content li{min-height:0}
header .dropdown-content li>a{color:var(--text)!important;font-size:15px!important;padding:10px var(--s4)!important;line-height:1.4!important}
header .dropdown-content li>a:hover{background:var(--surface-alt)!important;color:var(--brand-ink)!important}
header .dropdown-content li.divider{display:none}

/* One search on screen at a time: where the page has a search of its own, the
   header's hides until that one has scrolled away (assets/search-one.js). */
body.nr-has-page-search:not(.nr-page-search-away) header #miniform{display:none!important}
header #miniform{transition:opacity var(--motion) var(--ease)}
header nav ul.right>li{float:none!important}
@media (max-width:992px){
  header nav .container{gap:var(--s2)}
  header nav .brand-logo{max-width:110px;overflow:hidden}
  header nav ul.right{flex:1 1 auto;min-width:0;justify-content:flex-end;margin:0!important}
  header nav ul.right>li{min-width:0;display:flex;align-items:center}
  header nav ul.right>li:has(#miniform){flex:1 1 auto;max-width:300px}
  header #miniform{width:100%!important;min-width:0!important;max-width:none!important;flex:1 1 0}
  header #miniform .input-field{width:100%;min-width:0;flex:1 1 0}
  header #miniform input[type=search]{min-width:0!important;width:auto!important;flex:1 1 0}
  header nav .sidenav-trigger{margin-left:0!important;flex:0 0 auto;padding:0 var(--s1)}
}
@media (max-width:600px){
  header #miniform .input-field{width:100%}
  header nav ul.right{flex:1 1 auto;min-width:0;justify-content:flex-end}
  header nav ul.right>li:last-child{flex:1 1 auto;min-width:0;max-width:240px}
}

.sidenav{background:var(--surface)!important;border:0!important;width:min(320px,86vw)!important}
.sidenav li>a{color:var(--text)!important;font-size:15px!important;font-weight:500;height:44px;line-height:44px}
.sidenav li>a.subheader{font-weight:600;color:var(--text-faint)!important;font-size:12px!important;
  text-transform:uppercase;letter-spacing:.06em}
.sidenav li:first-child{background-color:var(--brand)!important}
.sidenav-overlay{background-color:rgba(24,34,48,.45)!important}

/* ---- footer: quiet, grey, the same links -------------------------------- */
footer.new-footer,#inset{background:var(--surface-alt)!important;color:var(--text-soft)!important;
  border-top:1px solid var(--line-soft);padding-top:var(--s6)!important}
footer.new-footer *,#inset *{color:inherit}
footer.new-footer a,#inset a{color:var(--text-soft)!important}
footer.new-footer a:hover,#inset a:hover{color:var(--brand-ink)!important}
footer.new-footer h2,.footer-items-title{font-size:13px!important;font-weight:600!important;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text)!important;margin:0 0 var(--s3)!important}
footer.new-footer svg:not(.nr-brand) path{fill:var(--nr-grey-600)}
section[style*="background-color: var(--nr-grey-800)"],section[style*="background-color: var(--nr-ink)"]{
  background:var(--nr-grey-800)!important}

/* ---- plates as search boxes: plate face, PrivatePlates proportions ------ */
.plateSearchInput,input.herosearch,.nr-cat-input,input.reginput{border-radius:var(--radius-ctl)!important;
  border:2px solid #1d1d1b!important;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08)!important;
  background:linear-gradient(180deg,#ffd84d 0%,#ffcc00 40%,#f5c000 100%)!important;color:#15201a!important}
.plateSearchInput:focus,input.herosearch:focus{box-shadow:0 0 0 3px var(--ring)!important}

/* ---- the home page, toned down ---------------------------------------- */
.home #hero{background:var(--surface)!important;padding:var(--s7) 0 var(--s6)!important;border-bottom:1px solid var(--line-soft)}
.home #hero h1{color:var(--text)!important}
.home #hero .material-icons,.home #hero i{color:var(--brand)!important}
.home #hero .newSearchGo{background:var(--brand)!important;border-radius:var(--radius-ctl)!important;box-shadow:none!important}
.home #hero .newSearchGo i{color:#fff!important}

.home #hero form#platesearch{position:relative;display:flex;align-items:stretch;gap:var(--s2);max-width:560px;margin:0 auto}
.home #hero form#platesearch::after{content:"Price promise"!important;background:var(--brand)!important;color:#fff;
  font:600 13px/1 var(--font-ui);letter-spacing:.01em;width:auto!important;height:auto!important;padding:7px 10px!important;
  border-radius:8px;top:-13px!important;left:12px!important;transform:none!important;filter:none!important;z-index:2;
  box-shadow:0 0 0 3px var(--surface)}
.home #hero input.herosearch{flex:1 1 auto;min-width:0;margin:0!important;height:96px!important;max-height:96px!important;
  font-size:clamp(32px,7vw,56px)!important;padding:0 var(--s4)!important;text-align:center}
.home #hero #mainSearchBtns{flex:0 0 auto;display:flex}
.home #hero .newSearchGo{position:static!important;width:72px!important;height:96px!important;padding:0!important;
  display:flex;align-items:center;justify-content:center;border:0!important}
@media (max-width:600px){
  .home #hero{padding:var(--s6) 0 var(--s5)!important}
  .home #hero input.herosearch{height:72px!important;max-height:72px!important;font-size:clamp(22px,6.6vw,34px)!important}
  .home #hero .newSearchGo{width:60px!important;height:72px!important}
  .home #hero .newSearchGo i{font-size:30px!important}
}

/* The dark band and other full-width dark sections, brought into the grey ladder. */
main section[style*="--nr-grey-800"],main div[style*="--nr-grey-800"],main section[style*="--nr-ink"],
.home .grey.darken-4,.home .black,.home [class*="darkband"],.home #about,.home .homeabout{
  background:var(--surface-alt)!important;color:var(--text)!important}

header nav .sidenav-trigger{order:9;margin-left:auto!important;align-items:center;height:100%}
@media (max-width:992px){header nav .sidenav-trigger{display:flex!important}}
@media (min-width:993px){header nav .sidenav-trigger{display:none!important}}
header nav .sidenav-trigger i{color:#fff!important}

/* Page title banners: on the page grid, not against the window edge. */
.topbanner{justify-content:center!important;padding:var(--s6) var(--page-pad)!important;min-height:0!important;
  background:var(--surface-alt)!important;border-bottom:1px solid var(--line-soft)}
.topbanner h1{width:100%;max-width:var(--page-max);margin:0 auto!important;justify-content:center}
.colourStrip{background:var(--surface-alt)!important}
.yellow-text{color:var(--brand)!important}
.yellow.darken-2:not(.plate):not(.regf):not(.putregspan){background-color:var(--surface-alt)!important;color:var(--text)!important}
.btn.yellow{background-color:var(--surface)!important;color:var(--text)!important;border-color:var(--line)!important}
.btn.yellow:hover{background-color:var(--surface-alt)!important}

/* Footer legal strip: in normal flow, nothing laid over it. */
.new-footer .policy{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);font-size:13px;line-height:1.6;
  padding-top:var(--s4);border-top:1px solid var(--line-soft);margin-bottom:0}
.new-footer .policy>div{float:none!important;width:auto!important;padding:0!important}
.new-footer .dvla,.dvla{position:static!important;height:auto!important;background:var(--nr-grey-800)!important;
  color:var(--nr-grey-300)!important;font-size:12px;line-height:1.6;padding:var(--s4) 0!important;margin:0!important}
.dvla *{color:inherit!important}
.cd-top{background:var(--nr-grey-700)!important;border-radius:var(--radius-ctl)!important;color:#fff!important}

/* Content blocks that sit straight in the page: on the page grid. */
.nr-dvla-sources,.nr-related-guides,.faqWrap,.npl-faqwrap{width:100%;max-width:calc(var(--page-max) + 2 * var(--page-pad))!important;
  margin-left:auto!important;margin-right:auto!important;padding-left:var(--page-pad)!important;padding-right:var(--page-pad)!important}
.nr-dvla-sources,.nr-related-guides{margin-top:var(--s6)!important;margin-bottom:var(--s6)!important}
:is(.blue-grey,.brown,.deep-purple,.lime,.light-green,.purple,.cyan,.amber):not(.btn):not(button):not(header *){
  background-color:var(--surface-alt)!important;color:var(--text)!important}
:is(.blue-grey-text,.brown-text,.deep-purple-text,.lime-text,.light-green-text,.purple-text,.cyan-text,.amber-text){color:var(--brand)!important}

/* Wide tables scroll inside their own box on a phone instead of being clipped. */
@media (max-width:768px){
  main table,.maincontentbody table,article table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
.follow-us-wrapper .items{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--s2) var(--s4)}
.follow-us-wrapper .items a{display:inline-flex;align-items:center;gap:6px;font-size:14px}
.follow-us-wrapper .items svg{width:18px!important;height:18px!important}
header #miniform .input-field{overflow:hidden}
header #miniform input[type=search]{flex:1 1 0;min-width:0!important;width:auto!important}
header #miniform label{position:static!important;flex:0 0 auto;width:24px;margin:0!important}
header #miniform input[type=search]{padding-left:var(--s1)!important}
header #miniform input[type=submit]{flex:0 0 auto}
@media (max-width:600px){header #miniform label{display:none!important}}

/* Contrast: footer copy at the supporting-text grey (7:1 on the footer surface). */
footer.new-footer *:not(a):not(svg):not(path):not(h2),#inset *:not(a):not(svg):not(path):not(h2){color:var(--text-soft)!important}
footer.new-footer .item-list a,#inset .item-list a{display:inline-block;min-height:24px;padding:2px 0;line-height:20px}
.white-text:not(header *):not(.sidenav *) strong,.white-text:not(header *):not(.sidenav *) b{color:inherit!important}
.card .category,.nr-wp .category{color:#fff!important;background:var(--nr-grey-700)!important}

/* 993 to 1240px: the desktop row must fit the page grid. */
@media (min-width:993px) and (max-width:1240px){
  header #nr-nav-left{margin-left:var(--s2)!important}
  header #nr-nav-left>li>a{padding:0 var(--s2)!important;font-size:14px!important}
  header #nr-nav-left>li>a>i.material-icons.left{display:none}
  header #miniform{max-width:220px}
  header nav ul.right>li>a i.material-icons{display:none}
}
header nav form#miniform .input-field input#search,header nav form#miniform .input-field input.msearch{
  box-sizing:border-box!important;width:100%!important;max-width:100%!important;padding:0 40px 0 30px!important}
@media (max-width:600px){header nav form#miniform .input-field input#search{padding-left:var(--s3)!important}}
.new-footer .policy a{display:inline-block;min-height:24px;line-height:24px;padding:0 2px}
body footer#inset.new-footer a,body footer#inset.new-footer .policy a,body footer#inset.new-footer .item-list a{color:var(--text-soft)!important}
body footer#inset.new-footer a:hover{color:var(--brand-ink)!important}
body .nr-wp .card .category,body .card-image .category.grey{color:#fff!important}
body main .homeBannerWrap p.white-text strong,body main .homeBannerWrap p strong{color:var(--text)!important}
body footer#inset.new-footer .container>span,body footer#inset.new-footer span{color:var(--text-soft)!important}
body footer#inset.new-footer .dvla,body footer#inset.new-footer .dvla *,body footer#inset.new-footer .dvla span{color:var(--nr-grey-300)!important}
body .homeBannerWrap .white-text,body .homeBannerWrap .white-text *{color:var(--text)!important}
body :is([style*="background:var(--nr-grey-700)"],[style*="background-color:var(--nr-grey-700)"],[style*="background: var(--nr-grey-700)"],[style*="background-color: var(--nr-grey-700)"],
  [style*="var(--nr-grey-800)"],[style*="var(--nr-ink)"],[style*="var(--nr-black)"]):is(section,div),
body :is([style*="var(--nr-grey-800)"],[style*="var(--nr-ink)"],[style*="background:var(--nr-grey-700)"],[style*="background-color: var(--nr-grey-700)"]):is(section,div) *{color:#fff!important}
body section.grey.darken-3,body section.grey.darken-3 *{color:#fff!important}
body .homepageWrap .homeBannerWrap.cheap-banner h2,body .homepageWrap .homeBannerWrap.cheap-banner h2.white-text,
body .homepageWrap .homeBannerWrap.cheap-banner h2 b,body .homepageWrap .homeBannerWrap.cheap-banner p,
body .homepageWrap .homeBannerWrap.cheap-banner p.white-text,body .homepageWrap .homeBannerWrap.cheap-banner p strong{color:var(--text)!important}
body .homepageWrap .homeBannerWrap.cheap-banner p,body .homepageWrap .homeBannerWrap.cheap-banner p.white-text{color:var(--text-soft)!important}

/* One control height. The hero's go button matches its 96px plate box on purpose. */
body #nr-cat-search-wrap .nr-cat-btn,body .homepageWrap .btn.grey,body .seemore .btn,body form .nr-il-login{
  height:var(--ctl-h)!important;min-height:var(--ctl-h)!important;border-radius:var(--radius-ctl)!important;font-weight:600!important;text-transform:none!important}
body #nr-cat-search-wrap .nr-cat-btn{background:var(--brand)!important;letter-spacing:0!important}
body #nr-cat-search-wrap .nr-cat-btn:hover{background:var(--brand-hover)!important}
body form .nr-il-forgot{min-height:24px;padding:2px 0!important}

/* Search boxes that look like plates use the plate face's own font. */
.plateSearchInput,input.herosearch,.nr-cat-input,input.reginput,.searchbox-plate{font-family:'UKNumberPlate',registration_plate_ukregular,sans-serif!important}
.plateSearchInput::placeholder,input.herosearch::placeholder,.nr-cat-input::placeholder{font-family:'UKNumberPlate',registration_plate_ukregular,sans-serif}
#nr-cat-search-wrap .nr-cat-input::placeholder{font-family:var(--font-ui)!important}
.home #hero input.herosearch{font-size:clamp(26px,4.2vw,46px)!important;letter-spacing:.02em}
.home #hero .row,.home #hero .featurerow{margin-top:var(--s6)!important}
.home #hero :is(h2,h3,h4,h5){font-size:18px!important;line-height:1.4!important;margin-top:var(--s3)!important}

/* One mechanism keeps the header on screen: the header is sticky at the top and the bar sits in
   it in normal flow. Materialize also fixed the bar with no offset, which iOS Safari places
   wherever the bar was when layout ran, so it drifted down the page as the toolbar collapsed. */
body header.navbar-fixed{position:-webkit-sticky!important;position:sticky!important;top:0!important;z-index:30}
body header.navbar-fixed>nav,body header nav.nav{position:relative!important;top:auto!important;left:auto!important;
  right:auto!important;transform:none!important;width:100%}

/* One left edge. A container inside a container adds no second gutter, and a grid row pulls
   out by half a gap so the text in its columns lines up with text outside the grid. */
.container .container{padding-left:0!important;padding-right:0!important;max-width:none!important;width:100%!important}
.container .row,.container>.row{margin-left:calc(var(--s5) / -2)!important;margin-right:calc(var(--s5) / -2)!important}
.row .col.s12:only-child{padding-left:calc(var(--s5) / 2);padding-right:calc(var(--s5) / 2)}

/* The phone header: a narrower wordmark so the search box can show its whole prompt. */
@media (max-width:600px){
  header nav .brand-logo{max-width:92px!important}
  header nav form#miniform .input-field input#search{font-size:14px!important;padding:0 34px 0 var(--s3)!important}
  header #miniform input[type=submit]{width:30px!important;height:30px!important;line-height:30px!important;font-size:22px!important}
  header nav ul.right>li:has(#miniform){max-width:none}
}
@media (max-width:600px){
  header nav .brand-logo{max-width:none!important;width:96px!important;background-size:contain!important;background-position:left center!important}
  header nav form#miniform .input-field input#search{font-size:16px!important;padding:0 var(--s3)!important}
  header #miniform input[type=submit]{display:none!important}
}
footer.new-footer,#inset{text-align:left!important}
body footer#inset.new-footer .policy{height:auto!important;min-height:0!important;overflow:visible}
body footer#inset.new-footer .policy>div{text-align:left!important}
body footer#inset.new-footer .dvla .container{height:auto!important;line-height:1.6!important}
body footer#inset.new-footer .dvla span{display:block;line-height:1.6!important;padding:0!important;margin:0!important;font-size:12px!important}
@media (max-width:600px){
  header nav .brand-logo{width:88px!important}
  header nav form#miniform .input-field{padding:0 var(--s2)!important}
  header nav form#miniform .input-field input#search{padding:0 var(--s1)!important}
}


/* Footer link columns on a grid, so long labels wrap inside their own column. */
@media (min-width:993px){
  body footer#inset.new-footer>.container.row:first-of-type{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));
    gap:var(--s5) var(--s4);align-items:start}
  body footer#inset.new-footer>.container.row:first-of-type>.col{float:none!important;width:auto!important;margin:0!important;
    padding:0!important;min-width:0}
  body footer#inset.new-footer>.container.row:first-of-type>.col.l4{grid-column:1 / -1;max-width:var(--measure)}
  body footer#inset.new-footer .item-list{display:block;overflow-wrap:anywhere}
}
body footer#inset.new-footer .item-list,body footer#inset.new-footer .item-list a{white-space:normal!important;line-height:1.4!important}

/* A drawn plate keeps its own size. The legacy fit-text script writes a font size onto every
   .plate to stretch its letters to the box, which an em-sized drawing turned into a giant. */
.plate:has(> svg.nrp){font-size:16px!important}
td .plate:has(> svg.nrp),th .plate:has(> svg.nrp){display:inline-block!important;width:auto!important}
td .plate > svg.nrp{width:120px!important;height:auto!important}

/* Tick lists: the icon in the margin, the words in one flowing line. */
li:has(> i.material-icons:first-child + strong),li:has(> i.material-icons:first-child + b){display:block!important;
  position:relative;padding-left:30px!important;margin-bottom:var(--s2)}
li:has(> i.material-icons:first-child + strong) > i.material-icons:first-child,
li:has(> i.material-icons:first-child + b) > i.material-icons:first-child{position:absolute;left:0;top:2px;font-size:20px!important}

/* Phones: columns stack, so they carry no side gutters and every block shares the page edge. */
@media (max-width:600px){
  .row .col{padding-left:0!important;padding-right:0!important}
  .container .row,.container>.row,.row{margin-left:0!important;margin-right:0!important}
}
@media (max-width:600px){
  .row>.col:is(.s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10,.s11):has(>p,>h2,>h3,>h4,>h5,>form,>div>p,>div>form,>label,>.content){
    width:100%!important;margin-left:0!important;left:auto!important;right:auto!important;float:none!important}
  .row>.col:is(.s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10,.s11):has(>img:only-child){width:100%!important;float:none!important}
}
@media (max-width:600px){
  .content.border[style*="background:url"]{background-image:none!important;padding:var(--s4)!important}
  .content.border[style*="background:url"] > *{margin-left:0!important;padding-left:0!important;width:auto!important;max-width:100%!important}
  .row>.col:is(.s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10,.s11):has(>button,>.btn,>input:not([type=hidden])){width:100%!important;float:none!important}
  form .btn,form button.btn{max-width:100%;white-space:normal}
}
.builderWrap .hideme p{width:auto!important;max-width:100%;box-sizing:border-box}
.featureblock.content.right{position:relative;z-index:1;background:var(--surface)!important;margin:0 0 var(--s4) var(--s5)!important;
  border:1px solid var(--line-soft);border-radius:var(--card-radius);padding:var(--s4)!important}
.typeSideBar dt{border:0!important;margin:0 0 var(--s2)!important;font-weight:600;color:var(--text)!important;font-size:16px}
@media (max-width:600px){.featureblock.content.right{float:none!important;width:auto!important;margin:0 0 var(--s4)!important}}
:is(h1,h2,h3,h4,h5,h6).red-text:not(header *),:is(h1,h2,h3,h4,h5,h6):not(header *) .red-text{color:var(--text)!important}