:root { --navy:#2C317E; --sky:#009CDD; --steel:#308CBA; --tint:#EAF4F8; }
html { -webkit-text-size-adjust:100%; }
body { overflow-x:hidden; }
.grecaptcha-badge { visibility:hidden; }
.hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* type */
.font-display, .h-hero, .h-display, .h-section, .card-title { font-family:'Archivo',sans-serif; word-spacing:.1em; }
.h-hero { font-weight:900; font-stretch:75%; font-size:clamp(2.9rem, 7.5vw, 6.25rem); line-height:.92; letter-spacing:-.03em; text-transform:uppercase; }
.h-display { font-weight:900; font-stretch:78%; font-size:clamp(2.5rem, 6vw, 4.75rem); line-height:.95; letter-spacing:-.025em; }
.h-section { font-weight:800; font-stretch:80%; font-size:clamp(2rem, 4.2vw, 3.4rem); line-height:1; letter-spacing:-.02em; }
.eyebrow { font-family:'Manrope',sans-serif; font-weight:700; font-size:.8rem; letter-spacing:.18em; text-transform:uppercase; }
.card-title { font-family:'Archivo',sans-serif; font-weight:800; font-stretch:82%; font-size:1.6rem; line-height:1.05; color:var(--navy); letter-spacing:-.01em; }

/* header */
.site-header { background:rgba(255,255,255,.82); backdrop-filter:saturate(1.6) blur(14px); -webkit-backdrop-filter:saturate(1.6) blur(14px); border-bottom:1px solid rgba(44,49,126,.08); transition:box-shadow .3s; }
.site-header.scrolled { box-shadow:0 10px 30px -12px rgba(28,31,85,.25); }
.navlink { position:relative; padding:.6rem .9rem; font-weight:600; color:var(--navy); border-radius:.6rem; transition:color .2s; }
.navlink::after { content:''; position:absolute; left:.9rem; right:.9rem; bottom:.3rem; height:2px; background:var(--sky); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.navlink:hover::after, .navlink[aria-current="page"]::after { transform:scaleX(1); }
.navlink[aria-current="page"] { color:var(--sky); }

/* buttons */
.btn-primary, .btn-navy, .btn-ghost-light, .btn-outline { display:inline-flex; align-items:center; gap:.6rem; min-height:48px; padding:.75rem 1.4rem; border-radius:.9rem; font-weight:700; transition:transform .2s, box-shadow .2s, background .2s, color .2s, gap .2s; }
.btn-lg { min-height:56px; padding:.95rem 1.7rem; font-size:1.05rem; }
.btn-primary { background:var(--sky); color:#fff; box-shadow:0 10px 24px -10px rgba(0,156,221,.7); }
.btn-primary:hover { background:#0088c2; transform:translateY(-2px); gap:.85rem; }
.btn-primary:disabled { opacity:.6; cursor:wait; transform:none; }
.btn-navy { background:var(--navy); color:#fff; }
.btn-navy:hover { background:#1C1F55; transform:translateY(-2px); gap:.85rem; }
.btn-ghost-light { color:#fff; border:2px solid rgba(255,255,255,.5); }
.btn-ghost-light:hover { background:#fff; color:var(--navy); border-color:#fff; }
.btn-outline { color:var(--navy); border:2px solid var(--navy); }
.btn-outline:hover { background:var(--navy); color:#fff; }
.link-underline { background:linear-gradient(var(--sky),var(--sky)) 0 100%/0 2px no-repeat; transition:background-size .3s, gap .2s; padding-bottom:2px; }
.link-underline:hover { background-size:100% 2px; gap:.8rem; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:3px solid var(--sky); outline-offset:3px; }

/* backgrounds */
.hero-mesh { background: radial-gradient(60% 80% at 100% 0%, rgba(0,156,221,.45), transparent 60%), radial-gradient(50% 70% at 0% 100%, rgba(48,140,186,.35), transparent 60%), linear-gradient(135deg,#2C317E,#1C1F55); }
.road-lines { background-image: repeating-linear-gradient(115deg, transparent 0 46px, #fff 46px 48px, transparent 48px 96px); }
.hero-img { animation: heroZoom 18s ease-out both; }
@keyframes heroZoom { from { transform:scale(1.12); } to { transform:scale(1); } }

/* quick facts */
.fact { display:flex; gap:1rem; align-items:center; padding:1.4rem 1.6rem; }
.fact-ic { flex-shrink:0; width:3rem; height:3rem; border-radius:.9rem; display:grid; place-items:center; background:var(--tint); color:var(--sky); }
.fact-k { font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--steel); }
.fact-v { font-family:'Archivo',sans-serif; font-weight:800; font-stretch:85%; font-size:1.15rem; color:var(--navy); line-height:1.2; }

/* cards */
.card-img { position:relative; display:flex; flex-direction:column; min-height:300px; border-radius:1.75rem; overflow:hidden; isolation:isolate; background:var(--navy); }
.card-img .zoom { position:absolute; inset:0; width:100%; height:100%; z-index:-2; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.card-img:hover .zoom { transform:scale(1.07); }
.card-shade { position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, rgba(19,21,58,.97) 0%, rgba(19,21,58,.85) 50%, rgba(19,21,58,.1) 100%); }
.chip { display:inline-block; padding:.3rem .75rem; border-radius:999px; background:var(--sky); color:#fff; font-size:.8rem; font-weight:700; }
.card-plain { display:flex; flex-direction:column; padding:1.9rem; border-radius:1.75rem; background:#fff; box-shadow:0 1px 0 rgba(44,49,126,.06); border:1px solid rgba(44,49,126,.08); transition:transform .3s, box-shadow .3s, border-color .3s; }
.card-plain:hover { transform:translateY(-4px); box-shadow:0 24px 40px -20px rgba(44,49,126,.35); border-color:rgba(0,156,221,.4); }
.card-dark { padding:1.9rem; border-radius:1.75rem; background:linear-gradient(150deg,#2C317E,#13153A); }
.svc-ic { display:inline-grid; place-items:center; width:3.5rem; height:3.5rem; border-radius:1rem; background:var(--tint); color:var(--navy); transition:background .3s, color .3s; }
.card-plain:hover .svc-ic { background:var(--sky); color:#fff; }
.arrow-dot { display:grid; place-items:center; width:2.5rem; height:2.5rem; border-radius:999px; border:1.5px solid rgba(44,49,126,.2); color:var(--navy); transition:all .3s; }
.card-plain:hover .arrow-dot { background:var(--navy); color:#fff; border-color:var(--navy); transform:rotate(-45deg); }

/* steps */
.step { background:var(--navy); padding:2rem; color:rgba(255,255,255,.78); line-height:1.65; transition:background .3s; }
.step:hover { background:#252a72; }
.step-n { font-family:'Archivo',sans-serif; font-weight:900; font-stretch:75%; font-size:3rem; line-height:1; color:var(--sky); }
.step-t { margin-top:.75rem; font-family:'Archivo',sans-serif; font-weight:800; font-stretch:85%; font-size:1.4rem; color:#fff; }

/* accreditation */
.accred { border-radius:1.5rem; background:#fff; border:1px solid rgba(44,49,126,.1); padding:1.25rem; transition:transform .3s, box-shadow .3s; }
.accred:hover { transform:translateY(-4px); box-shadow:0 24px 40px -24px rgba(44,49,126,.4); }
.accred figcaption { margin-top:1rem; font-weight:700; color:var(--navy); }

.extra { display:flex; flex-direction:column; gap:.9rem; padding:1.4rem; border-radius:1.25rem; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); font-weight:600; color:#fff; transition:background .3s, transform .3s; }
.extra:hover { background:rgba(0,156,221,.15); transform:translateY(-3px); }
.extra-light { display:flex; align-items:center; gap:.8rem; padding:1rem 1.2rem; border-radius:1rem; background:var(--tint); font-weight:600; color:var(--navy); }
.svc-pill { display:inline-flex; align-items:center; gap:.4rem; min-height:44px; padding:.55rem 1rem; border-radius:999px; background:#fff; color:var(--navy); font-weight:600; border:1px solid rgba(44,49,126,.12); transition:all .2s; }
.svc-pill:hover { background:var(--navy); color:#fff; }
.cls { padding:1.4rem; border-radius:1.25rem; background:var(--tint); }
.cls-n { font-family:'Archivo',sans-serif; font-weight:900; font-stretch:75%; font-size:3.5rem; line-height:1; color:var(--sky); }
.cls p { margin-top:.4rem; font-weight:700; color:var(--navy); }
.perk { padding:1.8rem; border-radius:1.5rem; background:#fff; border:1px solid rgba(44,49,126,.08); transition:transform .3s; }
.perk:hover { transform:translateY(-4px); }
.stat { background:#fff; padding:2.2rem; display:flex; flex-direction:column; gap:.4rem; }
.stat-n { font-family:'Archivo',sans-serif; font-weight:900; font-stretch:75%; font-size:clamp(3rem,6vw,4.5rem); line-height:1; color:var(--navy); }
.stat-l { font-weight:600; color:var(--steel); }
.contact-card { display:flex; gap:1.1rem; align-items:flex-start; padding:1.5rem; border-radius:1.5rem; background:var(--tint); }
.footer-h { font-family:'Archivo',sans-serif; font-weight:800; font-stretch:85%; color:#fff; font-size:1.1rem; letter-spacing:.02em; }

/* prose */
.prose-rt h2 { font-family:'Archivo',sans-serif; font-weight:800; font-stretch:82%; font-size:clamp(1.6rem,3vw,2.1rem); color:var(--navy); line-height:1.1; margin-top:2.5rem; letter-spacing:-.01em; }
.prose-rt h2:first-child { margin-top:0; }
.prose-rt p { margin-top:1rem; font-size:1.075rem; line-height:1.8; }
.prose-rt a { color:var(--navy); font-weight:700; text-decoration:underline; text-decoration-color:var(--sky); text-decoration-thickness:2px; text-underline-offset:4px; }

/* forms */
.lbl, .lbl-d { display:block; margin-bottom:.4rem; font-weight:700; font-size:.92rem; color:var(--navy); }
.lbl-d { color:#fff; }
.fld, .fld-d { width:100%; min-height:52px; padding:.8rem 1rem; border-radius:.85rem; font-size:1rem; transition:border-color .2s, box-shadow .2s; }
.fld { background:#fff; border:1.5px solid rgba(44,49,126,.18); color:#1f2340; }
.fld-d { background:rgba(255,255,255,.08); border:1.5px solid rgba(255,255,255,.2); color:#fff; }
.fld:focus, .fld-d:focus { outline:none; border-color:var(--sky); box-shadow:0 0 0 4px rgba(0,156,221,.2); }
.form-status.ok { background:#e6f6ee; color:#11603a; border:1px solid #9bd8b6; }
.form-status.err { background:#fdecec; color:#8a1c1c; border:1px solid #f1b0b0; }

/* reveal */
.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity:1; transform:none; }
.no-js .reveal { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
  .reveal { opacity:1; transform:none; }
}

/* MOT reminder tile */
.cal-tile { flex-shrink:0; width:5.5rem; border-radius:1.1rem; overflow:hidden; background:#fff; box-shadow:0 18px 30px -14px rgba(0,0,0,.5); text-align:center; }
.cal-top { display:block; background:var(--sky); color:#fff; font-family:'Archivo',sans-serif; font-weight:900; font-stretch:80%; letter-spacing:.08em; padding:.3rem 0; }
.cal-mid { display:grid; place-items:center; height:4rem; color:var(--navy); }

/* home hero: solid navy copy panel left, angled photo panel right, road tile in the foreground */
.hero { display:flex; flex-direction:column; }
.hero > .relative.z-10 { order:1; }
.hero-photo { order:2; position:relative; overflow:hidden; height:min(78vw, 440px); clip-path:polygon(0 16%, 100% 0, 100% 100%, 0 100%); }
.hero-panel, .hero-spacer { display:none; }
.road-tile { position:absolute; z-index:20; right:1.25rem; bottom:calc(min(78vw, 440px) - 4.5rem); width:7rem; height:7rem; transform:rotate(-8deg); }
.road-tile svg { filter:drop-shadow(0 18px 28px rgba(10,12,40,.55)); }
.road-tile-back { position:absolute; inset:0; border-radius:22%; background:var(--sky); transform:translate(12%, 12%) rotate(10deg); }
@media (min-width:1024px) {
  .hero { display:block; }
  .hero-photo { position:absolute; top:0; right:0; bottom:0; width:56%; height:auto; clip-path:polygon(24% 0, 100% 0, 100% 100%, 0 100%); }
  .hero-panel { display:block; position:absolute; top:0; right:0; bottom:0; width:calc(56% + 18px); background:var(--sky); clip-path:polygon(calc(24% + 0px) 0, 100% 0, 100% 100%, 0 100%); }
  .road-tile { right:auto; left:calc(49% + 1rem); bottom:12%; width:12rem; height:12rem; }
}
@media (min-width:1536px) { .road-tile { width:15rem; height:15rem; } }

/* home MOT card: whole sign, contained on a blue panel */
.mot-card { display:flex; flex-direction:column; border-radius:1.75rem; overflow:hidden; background:#13153A; isolation:isolate; }
.mot-card-sign { flex:none; height:clamp(250px, 26vw, 320px); display:flex; align-items:center; justify-content:center; padding:1.75rem; background:radial-gradient(120% 90% at 50% 30%, #0B6BC4 0%, #2C317E 70%); }
.mot-card > .relative { flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; }

/* contact quick card */
.qc-card { background:#fff; color:#474747; border-radius:1.75rem; padding:1.75rem; box-shadow:0 30px 60px -25px rgba(10,12,40,.6); }
@media (min-width:640px) { .qc-card { padding:2.25rem; } }
.status-dot { width:.8rem; height:.8rem; border-radius:999px; background:#94a3b8; flex-shrink:0; }
.status-dot.open { background:#16a34a; box-shadow:0 0 0 0 rgba(22,163,74,.5); animation:pulse 2s infinite; }
.status-dot.closed { background:#d97706; }
@keyframes pulse { 0% { box-shadow:0 0 0 0 rgba(22,163,74,.45); } 70% { box-shadow:0 0 0 10px rgba(22,163,74,0); } 100% { box-shadow:0 0 0 0 rgba(22,163,74,0); } }