/*
 * Link Chart design: the site-wide header and footer, and the home page.
 * Loaded after main.css and brand.css. Every class is prefixed lc- so it never collides with the old styles,
 * which still lay out the inner pages. Colours are the Allied Universal palette (see DESIGN.md).
 */

:root {
	--lc-blue: #005f90;
	--lc-blue-deep: #004a70;
	--lc-sky: #0089c7;
	--lc-grey: #495965;
	--lc-ink: #231f20;
	--lc-ink-deep: #121011;
	--lc-slate: #dfe1df;
	--lc-off: #f6f6f6;
	--lc-white: #fff;
	--lc-reversed: #e9ebec;          /* Reversed Body: small text on Black and the blue bands */
	--lc-on-blue-rule: rgba(255, 255, 255, 0.4); /* dividers inside the Specialist band */
	--lc-cond: "Trade Gothic Next Cond", "Trade Gothic LT Std", "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
	--lc-body: "Trade Gothic Next", "Trade Gothic LT Std", Barlow, Arial, sans-serif;
	--lc-gutter: clamp(20px, 4vw, 56px);
	--lc-width: 1200px;
}

/* Base: the home page doesn't load main.css, so the few resets the new parts rely on live here too */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: #fff; color: var(--lc-grey); font: 400 15px/1.5 var(--lc-body); -webkit-text-size-adjust: 100%; }
img { border: 0; }
.lc-signup .hide-this { display: none !important; }

/* Browser surfaces: main.css removes every focus outline (* { outline: none }), so put a visible one back */
:focus-visible, a:focus-visible, a:focus-visible:hover { outline: 3px solid var(--lc-blue); outline-offset: 3px; }
::selection { background: var(--lc-blue); color: #fff; }
html { scrollbar-color: var(--lc-blue) var(--lc-off); }

.lc-wrap { max-width: calc(var(--lc-width) + 2 * var(--lc-gutter)); margin: 0 auto; padding: 0 var(--lc-gutter); }
.lc-skip { position: absolute; left: var(--lc-gutter); top: -60px; z-index: 100; padding: 12px 16px; background: var(--lc-blue); color: #fff; font: 600 16px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; }
a.lc-skip:focus-visible { top: 12px; color: #fff; outline-color: var(--lc-ink); }
.lc-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Header ---------- */

.lc-header { position: relative; z-index: 50; background: #fff; border-bottom: 1px solid var(--lc-slate); }
.lc-bar { display: flex; align-items: center; gap: 28px; min-height: 92px; }
.lc-brand { flex: none; display: block; }
.lc-brand img { display: block; width: 236px; height: auto; }
.lc-header ul { list-style: none; margin: 0; padding: 0; }
.lc-header li { margin: 0; }

.lc-nav { margin-left: auto; }
.lc-nav > ul { display: flex; gap: 24px; }
.lc-nav > ul > li { position: relative; }
.lc-nav > ul > li > a { display: block; padding: 10px 0 8px; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-grey); text-decoration: none; border-bottom: 2px solid transparent; transition: color .2s ease-out, border-color .2s ease-out; }
.lc-nav > ul > li > a:hover,
.lc-nav > ul > li > a[aria-current] { color: var(--lc-blue); border-bottom-color: var(--lc-blue); }

/* main.css colours every a:link and a:visited AU Grey, so the coloured links below are qualified with a */

/* Services panel: opens on hover and when keyboard focus moves into it */
.lc-menu { position: absolute; left: -24px; top: 100%; width: 620px; padding: 22px 24px 18px; background: #fff; border-top: 3px solid var(--lc-blue); box-shadow: 0 14px 28px rgba(35, 31, 32, 0.14); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s ease-out, transform .2s ease-out, visibility 0s linear .2s; }
.lc-has-menu:hover .lc-menu,
.lc-has-menu:focus-within .lc-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.lc-has-menu.is-dismissed .lc-menu { opacity: 0; visibility: hidden; transform: translateY(6px); }
.lc-menu ul { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 24px; }
.lc-menu a { display: flex; align-items: center; gap: 12px; padding: 8px 0; font: 400 15px/1.3 var(--lc-body); color: var(--lc-ink); text-decoration: none; }
.lc-menu .lc-ico { width: 22px; height: 22px; }
.lc-menu a:hover span { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-menu-all { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--lc-slate); }
.lc-menu-all a { font: 600 16px/1 var(--lc-cond); text-transform: uppercase; letter-spacing: 0.04em; color: var(--lc-blue); }

.lc-utility { display: flex; align-items: center; gap: 18px; }
a.lc-tel { font: 600 17px/1 var(--lc-cond); letter-spacing: 0.02em; color: var(--lc-blue); text-decoration: none; white-space: nowrap; }
a.lc-tel:hover { text-decoration: underline; text-underline-offset: 0.2em; }
a.lc-portal { display: inline-block; padding: 13px 16px; background: var(--lc-ink); color: #fff; font: 600 16px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background .2s ease-out; }
.lc-portal:hover, .lc-portal:focus-visible { background: var(--lc-blue); color: #fff; }
.lc-menu-btn { display: none; }

/* ---------- Home: lead and chart ---------- */

.lc-hero { display: grid; grid-template-columns: minmax(320px, 5fr) 8fr; gap: 32px; align-items: center; padding-top: clamp(40px, 6vh, 64px); padding-bottom: 40px; }
.lc-lead h1 { margin: 0; max-width: 13ch; font: 700 clamp(42px, 4.4vw, 66px)/0.96 var(--lc-cond); letter-spacing: -0.005em; text-transform: uppercase; color: var(--lc-blue); text-wrap: balance; }
.lc-lead p { margin: 22px 0 0; max-width: 36ch; font: 400 18px/1.55 var(--lc-body); color: var(--lc-grey); }
.lc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 32px; }
a.lc-btn { display: inline-flex; align-items: center; gap: 12px; padding: 17px 26px; background: var(--lc-blue); color: #fff; font: 600 20px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; transition: background .2s ease-out; }
.lc-btn:hover, .lc-btn:focus-visible { background: var(--lc-ink); color: #fff; }
.lc-btn svg { width: 18px; height: 18px; flex: none; }
a.lc-call { display: inline-block; font: 600 20px/1.2 var(--lc-cond); color: var(--lc-ink); text-decoration: none; border-bottom: 2px solid var(--lc-sky); padding-bottom: 2px; }
.lc-call small { display: block; font: 400 14px/1.4 var(--lc-body); color: var(--lc-grey); }
.lc-call:hover { border-bottom-color: var(--lc-blue); }

.lc-chart { position: relative; height: 620px; }
.lc-links { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.lc-links line { stroke-linecap: round; transition: opacity .25s ease-out, stroke-width .25s ease-out; }
.lc-links .lc-l-statement { stroke: var(--lc-blue); stroke-width: 2.5; }
.lc-links .lc-l-value { stroke: var(--lc-sky); stroke-width: 2; }
.lc-links .lc-l-credential { stroke: var(--lc-grey); stroke-width: 1.75; stroke-dasharray: 6 6; }
.lc-chart.is-tracing .lc-links line { opacity: 0.14; }
.lc-chart.is-tracing .lc-links line.is-on { opacity: 1; stroke-width: 3.5; }
.lc-chart.is-tracing .lc-node { opacity: 0.3; }
.lc-chart.is-tracing .lc-node.is-on { opacity: 1; }

.lc-nodes { list-style: none; margin: 0; padding: 0; }
.lc-node { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%); margin: 0; transition: opacity .25s ease-out; }
.lc-node a { display: flex; align-items: center; gap: 12px; background: #fff; text-decoration: none; }
.lc-glyph { flex: none; width: 34px; height: 34px; }
.lc-label { font: 600 21px/1.08 var(--lc-cond); letter-spacing: 0.01em; text-transform: uppercase; color: var(--lc-ink); }
.lc-meta { display: block; margin-top: 4px; font: 400 13px/1.3 var(--lc-body); letter-spacing: 0; text-transform: none; color: var(--lc-grey); }
.lc-node a:hover .lc-label, .lc-node a:focus-visible .lc-label { color: var(--lc-blue); }

.lc-core a { justify-content: center; width: 210px; height: 210px; padding: 28px; border-radius: 50%; background: var(--lc-blue); text-align: center; box-shadow: 0 0 0 10px #fff, 0 0 0 12px var(--lc-blue); }
.lc-core .lc-label, .lc-core a:hover .lc-label, .lc-core a:focus-visible .lc-label { font-size: 24px; line-height: 1.02; color: #fff; }
.lc-statement a { width: 300px; padding: 14px 18px 14px 14px; border: 2px solid var(--lc-blue); }
.lc-value a { padding: 10px 16px 10px 10px; border: 2px solid var(--lc-sky); }
.lc-value .lc-label { font-size: 24px; color: var(--lc-blue); }
.lc-credential a { width: 240px; padding: 10px 14px; border: 1.75px dashed var(--lc-grey); }
.lc-credential .lc-label { font-size: 17px; }

.lc-legend { position: absolute; left: 0; bottom: 0; display: flex; gap: 26px; margin: 0; padding: 0; list-style: none; font: 500 15px/1 var(--lc-cond); letter-spacing: 0.08em; text-transform: uppercase; color: var(--lc-grey); }
.lc-legend li { display: inline-flex; align-items: center; gap: 10px; margin: 0; }
.lc-legend i { width: 28px; border-top: 3px solid var(--lc-blue); }
.lc-legend i.lc-v { border-top-color: var(--lc-sky); }
.lc-legend i.lc-c { border-top: 2px dashed var(--lc-grey); }

/* Links draw in once on load, from an already visible chart, and not at all for visitors who ask for less motion */
@media (prefers-reduced-motion: no-preference) {
	.lc-chart.is-drawing .lc-links line { stroke-dasharray: var(--len); stroke-dashoffset: var(--len); animation: lc-draw 1.1s cubic-bezier(.16, 1, .3, 1) var(--delay) forwards; }
	@keyframes lc-draw { to { stroke-dashoffset: 0; } }
}

/* ---------- Home: values key ---------- */

.lc-key { background: var(--lc-off); }
.lc-key .lc-wrap, .lc-creds { display: grid; grid-template-columns: minmax(320px, 5fr) 8fr; gap: 32px; }
.lc-key .lc-wrap { padding-top: 88px; padding-bottom: 72px; }
.lc-key h2, .lc-creds h2 { margin: 0; max-width: 12ch; font: 700 clamp(32px, 3vw, 46px)/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-blue); }
.lc-key-intro { margin: 18px 0 0; max-width: 34ch; color: var(--lc-grey); }
.lc-rows { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--lc-blue); }
.lc-row { display: grid; grid-template-columns: 52px 190px 1fr auto; gap: 18px; align-items: start; margin: 0; padding: 26px 0; border-bottom: 1px solid var(--lc-slate); }
.lc-row h3 { margin: 0; font: 600 30px/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-row p { margin: 0; max-width: 56ch; font: 400 15px/1.6 var(--lc-body); color: var(--lc-grey); }
.lc-row a { margin-top: 6px; padding-bottom: 3px; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-blue); white-space: nowrap; text-decoration: none; border-bottom: 2px solid var(--lc-blue); }
.lc-row a:hover { color: var(--lc-ink); border-bottom-color: var(--lc-ink); }

/* ---------- Home: certifications ---------- */

.lc-creds { align-items: center; padding-top: 80px; padding-bottom: 80px; }
.lc-cred-list { display: grid; gap: 32px; margin: 0; padding: 0; list-style: none; }
.lc-cred-list li { display: flex; align-items: center; gap: 28px; margin: 0; }
/* LRQA requires its mark to be clearly legible: 180px keeps the standards line inside it readable */
.lc-cred-list img { flex: none; width: 180px; height: auto; border: 1px solid var(--lc-slate); }
.lc-cred-list strong { display: block; font: 600 22px/1.15 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-cred-list p { margin: 4px 0 0; color: var(--lc-grey); }
.lc-cred-list a { font: 600 16px/1.9 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-blue); text-decoration: none; border-bottom: 2px solid var(--lc-blue); }
.lc-cred-list a:hover { color: var(--lc-ink); border-bottom-color: var(--lc-ink); }

/* ---------- Footer ---------- */

.lc-footer { padding: 0; background: var(--lc-ink) radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1.6px) 0 0 / 9px 9px; color: #fff; }
.lc-footer :focus-visible, .lc-footer a:focus-visible, .lc-footer a:focus-visible:hover { outline-color: #fff; }
.lc-f-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.4fr; gap: 40px; padding-top: 60px; padding-bottom: 44px; }
.lc-footer h2 { margin: 0 0 18px; font: 600 20px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: #fff; }
.lc-footer p, .lc-footer li, .lc-footer address { margin: 0; font: 400 15px/1.75 var(--lc-body); font-style: normal; color: #e9ebec; }
.lc-footer p + p { margin-top: 10px; }
.lc-footer ul { list-style: none; margin: 0; padding: 0; }
.lc-footer a { color: #fff; text-decoration: none; }
.lc-footer a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
/* In the contact column, links sit among plain text, so they are underlined rather than told apart by colour */
.lc-footer .lc-contact a { text-decoration: underline; text-underline-offset: 0.2em; }

/* Campaign Monitor form: field names and js-cm classes must stay as they are; main.css floats every form field */
.lc-signup label, .lc-signup input, .lc-signup button { float: none; clear: none; width: auto; margin: 0; }
.lc-signup label { display: block; padding: 0; margin-bottom: 14px; font: 400 15px/1.6 var(--lc-body); color: #e9ebec; }
.lc-signup .lc-field { display: flex; }
.lc-signup input[type="email"] { flex: 1; min-width: 0; padding: 13px 14px; border: 0; background: #fff; color: var(--lc-ink); font: 400 16px/1.2 var(--lc-body); }
.lc-signup input[type="email"]:focus-visible { outline: 3px solid var(--lc-sky); outline-offset: 0; }
.lc-signup button { display: inline-flex; align-items: center; gap: 8px; padding: 0 18px; border: 0; background: var(--lc-blue); color: #fff; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; transition: background .2s ease-out; }
.lc-signup button:hover { background: var(--lc-blue-deep); }
.lc-signup button svg { width: 16px; height: 16px; }

.lc-legal { background: var(--lc-ink-deep); }
.lc-legal .lc-wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 22px; padding-bottom: 22px; }
.lc-legal img { display: block; width: 210px; height: auto; }
.lc-legal p { margin: 0; font: 400 14px/1.5 var(--lc-body); color: #d6d9db; }
.lc-legal-text { max-width: 760px; text-align: right; }
.lc-legal-text p + p { margin-top: 4px; font-size: 13px; }
/* The company number links to Companies House; underline it, as it sits among plain text */
.lc-legal-text a { text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------- Narrower screens ---------- */

/* The header bar needs about 1040px with the phone number and 870px without it */
@media (max-width: 1240px) {
	a.lc-tel { display: none; }
}

/* Below this the chart moves under the lead at full width, and the lead sets its heading beside its
   text and actions so the chart still starts in the first screen */
@media (max-width: 1080px) {
	.lc-hero { grid-template-columns: 1fr; gap: 28px; }
	.lc-lead { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; align-items: end; }
	.lc-lead h1 { grid-row: 1 / 3; max-width: 13ch; }
	.lc-lead p { margin-top: 0; }
	.lc-actions { margin-top: 20px; }
}

/* 1081-1220px: the chart column is about 600-670px, so the nodes and disc come in further */
@media (min-width: 1081px) and (max-width: 1220px) {
	.lc-statement a { width: 220px; padding: 12px 14px 12px 12px; }
	.lc-statement .lc-label { font-size: 19px; }
	.lc-value a { padding: 8px 12px 8px 8px; }
	.lc-value .lc-label { font-size: 20px; }
	.lc-credential a { width: 190px; }
	.lc-credential .lc-label { font-size: 16px; }
	.lc-core a { width: 156px; height: 156px; padding: 18px; }
	.lc-core .lc-label, .lc-core a:hover .lc-label, .lc-core a:focus-visible .lc-label { font-size: 18px; }
}

/* Between the single-column switch and the full 1200px container the chart column is narrower than its
   designed 720px, so the widest nodes and the company disc come in a little */
@media (min-width: 1221px) and (max-width: 1320px) {
	.lc-statement a { width: 260px; }
	.lc-credential a { width: 210px; }
	.lc-core a { width: 180px; height: 180px; padding: 22px; }
	.lc-core .lc-label, .lc-core a:hover .lc-label, .lc-core a:focus-visible .lc-label { font-size: 21px; }
}

@media (max-width: 1080px) {
	.lc-nav > ul { gap: 18px; }
	.lc-key .lc-wrap, .lc-creds { grid-template-columns: 1fr; }
	.lc-f-grid { grid-template-columns: 1fr 1fr; }
}

/* Phones and small tablets: menu button, and the chart becomes a list of links on a rail */
/* Below this the header bar can't fit the navigation beside the logo, so a menu button takes over */
@media (max-width: 1150px) {
	.lc-utility { margin-left: auto; gap: 10px; }
	.lc-menu-btn { display: grid; place-items: center; width: 46px; height: 46px; margin: 0; padding: 0; border: 2px solid var(--lc-blue); background: #fff; color: var(--lc-blue); cursor: pointer; }
	.lc-menu-btn svg { width: 22px; height: 22px; }
	.lc-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; margin: 0; padding: 8px var(--lc-gutter) 20px; background: #fff; border-bottom: 3px solid var(--lc-blue); box-shadow: 0 14px 28px rgba(35, 31, 32, 0.14); }
	.lc-header.is-open .lc-nav { display: block; }
	.lc-nav > ul { flex-direction: column; gap: 0; }
	.lc-nav > ul > li > a { padding: 14px 0; font-size: 19px; border-bottom: 1px solid var(--lc-slate); }
	.lc-nav > ul > li > a[aria-current] { border-bottom-color: var(--lc-slate); }
	.lc-menu { display: none; }
	.lc-nav-tel { display: block !important; }
}

@media (max-width: 980px) {
	.lc-bar { min-height: 72px; gap: 12px; }
	.lc-brand img { width: 160px; }
	a.lc-portal { padding: 12px; font-size: 15px; }
	.lc-portal .lc-long { position: absolute; left: -9999px; }

	.lc-hero { padding-top: 32px; gap: 32px; }
	.lc-chart { height: auto; }
	.lc-links, .lc-legend { display: none; }
	.lc-nodes { position: relative; }
	.lc-nodes::before { content: ""; position: absolute; left: 16px; top: 24px; bottom: 24px; width: 2px; background: var(--lc-blue); } /* the rail the nodes hang from */
	.lc-node { position: static; transform: none; margin: 0 0 14px; }
	.lc-node a { position: relative; z-index: 1; }
	.lc-core a { width: auto; height: auto; justify-content: flex-start; padding: 16px 18px; border-radius: 0; text-align: left; box-shadow: none; }
	.lc-core .lc-label { font-size: 22px; }
	.lc-statement a, .lc-value a, .lc-credential a { width: auto; margin-left: 32px; }
	.lc-statement a::before, .lc-value a::before, .lc-credential a::before { content: ""; position: absolute; left: -18px; top: 50%; width: 16px; border-top: 2px solid var(--lc-blue); }

	.lc-key .lc-wrap { padding-top: 56px; padding-bottom: 48px; }
	.lc-row { grid-template-columns: 40px 1fr; gap: 10px 14px; }
	.lc-row p, .lc-row a { grid-column: 2; }
	.lc-row a { justify-self: start; }
	.lc-creds { padding-top: 56px; padding-bottom: 56px; }
	.lc-cred-list li { flex-direction: column; align-items: flex-start; gap: 14px; }
	.lc-f-grid { grid-template-columns: 1fr; gap: 32px; padding-top: 48px; padding-bottom: 32px; }
	.lc-legal .lc-wrap { flex-direction: column; align-items: flex-start; }
	.lc-legal-text { text-align: left; }
}

/* Phones: the lead stacks, and the primary action spans the width */
@media (max-width: 640px) {
	.lc-lead { display: block; }
	.lc-lead h1 { font-size: 44px; max-width: 16ch; }
	.lc-lead p { margin-top: 22px; font-size: 17px; }
	.lc-actions { margin-top: 32px; }
	a.lc-btn { width: 100%; justify-content: center; }
}

.lc-nav-tel { display: none; }

/* ---------- Inner pages: path title ---------- */

.lc-pagehead .lc-wrap { padding-top: 40px; padding-bottom: 36px; }
.lc-pathrail { position: relative; padding-left: 30px; }
.lc-path ol { list-style: none; margin: 0; padding: 0; }
.lc-path li, .lc-title { position: relative; margin: 0; }
.lc-path li { padding: 5px 0; }
/* The rail: each step draws its own stretch of line and a tick into its node, so the line runs unbroken */
.lc-path li::before, .lc-title::before { content: ""; position: absolute; left: -22px; top: 0; bottom: 0; width: 2px; background: var(--lc-blue); }
.lc-path li:first-child::before { top: 50%; }
.lc-path--end li:last-child::before { bottom: 50%; }
.lc-path li::after, .lc-title::after { content: ""; position: absolute; left: -22px; top: 50%; width: 16px; height: 2px; background: var(--lc-blue); }
.lc-path li.lc-visually-hidden::before, .lc-path li.lc-visually-hidden::after { content: none; }
.lc-path a { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px; border: 2px solid var(--lc-blue); background: #fff; font: 600 15px/1.15 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-ink); text-decoration: none; transition: color .2s ease-out; }
.lc-path a:hover { color: var(--lc-blue); }
.lc-path-company a { padding-left: 0; border-color: transparent; }
.lc-path-disc { flex: none; width: 16px; height: 16px; margin-left: 6px; border-radius: 50%; background: var(--lc-blue); box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--lc-blue); }
.lc-title { padding-top: 12px; max-width: 26ch; font: 700 clamp(34px, 3.8vw, 54px)/1 var(--lc-cond); letter-spacing: -0.005em; text-transform: uppercase; color: var(--lc-blue); text-wrap: balance; }
/* The line ends at the middle of the title's first line */
.lc-title::before { bottom: auto; height: calc(12px + 0.5em); }
.lc-title::after { top: calc(12px + 0.5em); }

/* ---------- Inner pages: reading column and rail (scoped to lc-inner; main.css still styles the special parts) ---------- */

.lc-inner .pagecontent { padding: 8px 0 88px; }
.lc-inner .pagecontent > .grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(260px, 4fr); gap: 56px; align-items: start; width: auto; max-width: calc(var(--lc-width) + 2 * var(--lc-gutter)); margin: 0 auto; padding: 0 var(--lc-gutter); overflow: visible; }
.lc-inner .pagecontent > .grid::before, .lc-inner .pagecontent > .grid::after { content: none; display: none; }
.lc-inner .leftpanel, .lc-inner .rightpanel, .lc-inner .fullpanel { float: none; width: auto; margin: 0; padding: 0; background: none; border-radius: 0; display: block; }
.lc-inner .fullpanel { grid-column: 1 / -1; }

.lc-inner .leftpanel { font: 400 16px/1.65 var(--lc-body); color: var(--lc-grey); }
.lc-inner .leftpanel p, .lc-inner .cktext p, .lc-inner .cktext li { max-width: 58ch; font-family: var(--lc-body); font-size: 16px; line-height: 1.65; }
/* The intro opens the column as the lead */
.lc-inner .leftpanel > p:first-child, .lc-inner .leftpanel > h1 + p, .lc-inner .leftpanel > h2:first-child + p { margin: 0 0 24px; max-width: 56ch; font-size: 19px; line-height: 1.55; color: var(--lc-ink); }
.lc-inner .fullpanel > .col > p:first-child { margin: 0 0 24px; max-width: 56ch; font: 400 19px/1.55 var(--lc-body); color: var(--lc-ink); }
.lc-inner .leftpanel > p:first-child strong, .lc-inner .leftpanel > h1 + p strong, .lc-inner .leftpanel > h2:first-child + p strong, .lc-inner .fullpanel > .col > p:first-child strong { font-weight: 400; }
/* About pages repeat their subpage list in the content; the rail already carries it at every width */
.lc-inner.s-about .leftpanel > nav { display: none; }
/* A page that sets its own H1 in the content (news articles) gives it the title style */
.lc-inner .leftpanel > h1 { margin: 0 0 24px; max-width: 26ch; font: 700 clamp(30px, 3.2vw, 46px)/1.02 var(--lc-cond); text-transform: uppercase; color: var(--lc-blue); text-wrap: balance; }
.lc-inner .leftpanel > h2:first-child { margin-top: 0; }
.lc-inner .cktext h2, .lc-inner .sozo-content h2, .lc-inner .leftpanel > h2 { margin: 40px 0 14px; font: 700 30px/1.05 var(--lc-cond); text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .cktext h3, .lc-inner .sozo-content h3, .lc-inner .leftpanel > h3 { margin: 32px 0 10px; font: 600 22px/1.15 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-inner .cktext h4, .lc-inner .cktext h5 { margin: 24px 0 8px; font: 600 18px/1.2 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-inner .cktext ul, .lc-inner .cktext ol { margin: 16px 0; padding-left: 1.3em; color: var(--lc-grey); }
.lc-inner .cktext ul { list-style: square; }
.lc-inner .cktext li::marker { color: var(--lc-blue); }
.lc-inner .leftpanel a:not([class]), .lc-inner .cktext a { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-inner .leftpanel a:not([class]):hover, .lc-inner .cktext a:hover { color: var(--lc-ink); }
/* Old editor content carries inline colours (including light blue text); the reading colours win */
.lc-inner .cktext [style*="color"] { color: inherit !important; }
.lc-inner .imgright { float: right; width: auto; max-width: min(45%, 320px); height: auto; margin: 4px 0 20px 32px; border: 1px solid var(--lc-slate); border-radius: 0; }
.lc-inner .radius1 { border-radius: 0; }
.lc-inner .keyfeatures { border-radius: 0; background: var(--lc-off); }

/* Form fields sat on the old grey panel; on white they need their own boundary (AU Grey, well over 3:1 against white) */
.lc-inner .pagecontent form input:not([type="radio"]):not([type="checkbox"]):not(.hide-this),
.lc-inner .pagecontent form select,
.lc-inner .pagecontent form textarea { border: 1px solid var(--lc-grey); border-radius: 0; background: #fff; }

.lc-inner .rightpanel :is(h2, h3) { margin: 0 0 12px; padding: 0; font: 600 20px/1.1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .rightpanel nav { margin: 0 0 32px; }
.lc-inner .rightpanel nav ul { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--lc-blue); }
.lc-inner .rightpanel nav li { margin: 0; border-bottom: 1px solid var(--lc-slate); }
.lc-inner .rightpanel nav a { position: static; display: flex; align-items: center; gap: 10px; padding: 10px 0; background: none; font: 400 15px/1.4 var(--lc-body); color: var(--lc-ink); text-decoration: none; }
.lc-inner .rightpanel nav a:hover { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-inner .rightpanel nav a[aria-current] { font-weight: 600; color: var(--lc-blue); }
.lc-inner .rightpanel nav a[aria-current]::before { content: ""; position: static; flex: none; width: 8px; height: 8px; background: var(--lc-blue); }

.lc-railbox { margin: 0 0 24px; padding: 18px 20px 20px; border: 1px solid var(--lc-slate); background: #fff; }
.lc-railbox-contact { border: 2px solid var(--lc-blue); }
.lc-railbox p { margin: 0 0 10px; font: 400 15px/1.55 var(--lc-body); color: var(--lc-grey); }
a.lc-railbox-tel { font: 600 22px/1.1 var(--lc-cond); color: var(--lc-ink); text-decoration: none; }
a.lc-railbox-tel:hover { text-decoration: underline; text-underline-offset: 0.2em; }
a.lc-railbox-action { display: inline-flex; align-items: center; gap: 10px; margin-top: 6px; padding: 12px 16px; background: var(--lc-blue); color: #fff; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; transition: background .2s ease-out; }
a.lc-railbox-action:hover, a.lc-railbox-action:focus-visible { background: var(--lc-ink); color: #fff; }
a.lc-railbox-action svg { width: 16px; height: 16px; }
.lc-downloads ul { list-style: none; margin: 0; padding: 0; }
.lc-downloads li { margin: 0; border-top: 1px solid var(--lc-slate); }
.lc-downloads a { display: flex; align-items: center; gap: 12px; padding: 10px 0; font: 600 16px/1.2 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-ink); text-decoration: none; }
.lc-downloads a:hover { color: var(--lc-blue); }
.lc-doc { flex: none; width: 28px; height: 28px; }

@media (max-width: 980px) {
	.lc-inner .pagecontent > .grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
	/* Once the rail drops below the content, the enquiry exit comes first, ahead of the section list */
	.lc-inner .rightpanel { display: flex; flex-direction: column; }
	.lc-inner .rightpanel .lc-railbox-contact { order: -1; }
	.lc-inner .imgright { float: none; display: block; max-width: 100%; margin: 8px 0 20px; }
}

@media (max-width: 640px) {
	.lc-inner .fullpanel > .col > p:first-child { font-size: 17px; }
	.lc-pagehead .lc-wrap { padding-top: 28px; padding-bottom: 24px; }
	.lc-title, .lc-inner .leftpanel > h1 { font-size: 34px; }
	.lc-inner .leftpanel > p:first-child, .lc-inner .leftpanel > h1 + p, .lc-inner .leftpanel > h2:first-child + p { font-size: 17px; }
}

/* ---------- Home: keep Make an enquiry clear of the fold on short desktop screens (1366x768 and similar) ---------- */

@media (min-width: 1081px) and (max-height: 860px) {
	.lc-hero { align-items: start; padding-top: 32px; }
	.lc-chart { height: clamp(540px, calc(100vh - 160px), 620px); }
}

/* ---------- Inner pages: buttons (replace the old skewed .bt) ---------- */

button.lc-btn { border: 0; border-radius: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 12px; padding: 17px 26px; background: var(--lc-blue); color: #fff; font: 600 20px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; transition: background .2s ease-out; }
a.lc-btn--portal { background: var(--lc-ink); }
a.lc-btn--portal:hover, a.lc-btn--portal:focus-visible { background: var(--lc-blue); }
.lc-actions-inline { margin: 32px 0 12px; }
/* main.css floats every form button into the field column at 60%; the action sits under the fields instead */
.lc-inner .pagecontent form button.lc-btn--form { float: none; clear: both; width: auto; height: auto; margin: 12px 0 0 40%; padding: 17px 26px; background: var(--lc-blue); color: #fff; box-shadow: none; }
.lc-inner .pagecontent form button.lc-btn--form:hover, .lc-inner .pagecontent form button.lc-btn--form:focus-visible { background: var(--lc-ink); }
.lc-inner .pagecontent form :is(input, select, textarea) { font: 400 16px/1.4 var(--lc-body); color: var(--lc-ink); }
.lc-inner .pagecontent form select { -webkit-appearance: none; appearance: none; padding-right: 40px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005f90' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px 18px; cursor: pointer; }
.lc-inner .pagecontent form :is(input, select, textarea):focus { background-color: #fff; box-shadow: none; }
.lc-inner .pagecontent form input[type="radio"], .lc-inner .pagecontent form input[type="checkbox"] { accent-color: var(--lc-blue); }

/* The consent notice inside forms: its heading takes the rail heading, its links read as links */
.lc-inner .consent-notice :is(h2, h3, h4, h5) { margin: 32px 0 10px; font: 600 20px/1.1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .consent-notice p { font: 400 15px/1.55 var(--lc-body); color: var(--lc-grey); }
.lc-inner .pagecontent .consent-notice a { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------- Inner pages: ruled link ---------- */

a.lc-ruled { display: inline-block; padding-bottom: 3px; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-blue); text-decoration: none; border-bottom: 2px solid var(--lc-blue); transition: color .2s ease-out, border-color .2s ease-out; }
a.lc-ruled:hover { color: var(--lc-ink); border-bottom-color: var(--lc-ink); }

/* ---------- FAQs: ruled disclosure rows ---------- */

.lc-faqs { margin: 8px 0 0; border-top: 2px solid var(--lc-blue); }
.lc-faq { border-bottom: 1px solid var(--lc-slate); }
.lc-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 0; cursor: pointer; list-style: none; }
.lc-faq summary::-webkit-details-marker { display: none; }
.lc-faq-q { font: 600 20px/1.2 var(--lc-cond); letter-spacing: 0.01em; text-transform: uppercase; color: var(--lc-ink); text-wrap: pretty; transition: color .2s ease-out; }
.lc-faq-mark { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border: 2px solid var(--lc-blue); color: var(--lc-blue); transition: background .2s ease-out, color .2s ease-out; }
.lc-faq-mark svg { width: 18px; height: 18px; transition: transform .3s cubic-bezier(.16, 1, .3, 1); }
.lc-faq summary:hover .lc-faq-q, .lc-faq[open] .lc-faq-q { color: var(--lc-blue); }
.lc-faq summary:hover .lc-faq-mark, .lc-faq[open] .lc-faq-mark { background: var(--lc-blue); color: #fff; }
.lc-faq[open] .lc-faq-mark svg { transform: rotate(180deg); }
.lc-faq-a { padding: 0 56px 24px 0; font: 400 16px/1.65 var(--lc-body); color: var(--lc-grey); }
.lc-inner .lc-faq-a p, .lc-inner .lc-faq-a li { max-width: 58ch; margin: 0 0 12px; font: inherit; color: inherit; }
.lc-faq-a > :last-child { margin-bottom: 0; }
.lc-faq-a [style*="color"], .lc-faq-a [style*="font"] { color: inherit !important; font-family: inherit !important; }
.lc-inner .leftpanel .lc-faq-a a { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------- News: ruled rows ---------- */

.lc-newslist { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--lc-blue); }
.lc-newsrow { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 28px; align-items: start; margin: 0; padding: 28px 0; border-bottom: 1px solid var(--lc-slate); }
.lc-newsrow--text { grid-template-columns: minmax(0, 1fr); }
.lc-newsrow-img { display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--lc-slate); background: #fff; }
.lc-newsrow-img img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0; }
.lc-newsrow h2 { margin: 0 0 10px; font: 600 24px/1.08 var(--lc-cond); letter-spacing: 0.005em; text-transform: uppercase; color: var(--lc-ink); text-wrap: balance; }
.lc-inner .leftpanel .lc-newsrow h2 a { color: inherit; text-decoration: none; }
.lc-inner .leftpanel .lc-newsrow h2 a:hover { color: var(--lc-blue); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.15em; }
.lc-inner .lc-newsrow-summary p { margin: 0 0 14px; max-width: 56ch; font: 400 15px/1.6 var(--lc-body); color: var(--lc-grey); }

/* main.css pads and fills every nav in the column */
.lc-inner .leftpanel nav.lc-pager { margin: 0; padding: 0; background: none; border-radius: 0; }
.lc-pager ul { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 32px 0 0; padding: 0; list-style: none; }
.lc-pager li { margin: 0; }
.lc-inner .leftpanel .lc-pager a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid var(--lc-slate); font: 600 16px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-ink); text-decoration: none; transition: border-color .2s ease-out, color .2s ease-out; }
.lc-inner .leftpanel .lc-pager a:hover { border-color: var(--lc-blue); color: var(--lc-blue); }
.lc-inner .leftpanel .lc-pager a[aria-current] { border-color: var(--lc-blue); background: var(--lc-blue); color: #fff; }
.lc-inner .leftpanel .lc-pager .lc-pager-step a { border-color: transparent; color: var(--lc-blue); }
.lc-inner .leftpanel .lc-pager .lc-pager-step a:hover { color: var(--lc-ink); }
.lc-pager svg { width: 16px; height: 16px; }

@media (max-width: 650px) {
	.lc-inner .pagecontent form button.lc-btn--form { margin-left: 0; }
}

@media (max-width: 640px) {
	button.lc-btn, .lc-inner .pagecontent form button.lc-btn--form, .lc-actions-inline a.lc-btn { width: 100%; justify-content: center; }
	.lc-actions-inline a.lc-btn { padding: 16px 18px; font-size: 17px; line-height: 1.15; }
	.lc-faq-q { font-size: 18px; }
	.lc-faq-a { padding-right: 0; }
	.lc-newsrow { grid-template-columns: 88px minmax(0, 1fr); gap: 14px 16px; padding: 22px 0; }
	.lc-newsrow-text { display: contents; }
	.lc-newsrow h2 { grid-column: 2; align-self: center; margin: 0; font-size: 20px; }
	.lc-newsrow-summary, .lc-newsrow .lc-ruled { grid-column: 1 / -1; justify-self: start; }
	.lc-newsrow--text h2 { grid-column: 1 / -1; }
	.lc-inner .lc-newsrow-summary p:last-child { margin-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.lc-faq-mark svg { transition: none; }
}

/* ---------- Expertise: people as ruled rows ---------- */

.lc-people { list-style: none; margin: 8px 0 0; padding: 0; border-top: 2px solid var(--lc-blue); }
.lc-person { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 28px; align-items: start; margin: 0; padding: 28px 0; border-bottom: 1px solid var(--lc-slate); }
.lc-person-img { display: grid; place-items: center; aspect-ratio: 1; overflow: hidden; border: 1px solid var(--lc-slate); background: #fff; }
.lc-person-img img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0; }
/* No photo: the person's initials in a square, as the chart names its entities */
.lc-person-img--initials { background: var(--lc-off); font: 600 44px/1 var(--lc-cond); letter-spacing: 0.02em; color: var(--lc-blue); }
.lc-person h2 { margin: 0; font: 600 24px/1.08 var(--lc-cond); letter-spacing: 0.005em; text-transform: uppercase; color: var(--lc-ink); }
.lc-inner .leftpanel .lc-person-role { margin: 6px 0 12px; font: 600 16px/1.2 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .lc-person-text p { margin: 0 0 12px; max-width: 56ch; font: 400 15px/1.6 var(--lc-body); color: var(--lc-grey); }

/* Read more on a profile: a native disclosure drawn as a ruled link */
.lc-more summary { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 3px; border-bottom: 2px solid var(--lc-blue); cursor: pointer; list-style: none; font: 600 17px/1 var(--lc-cond); letter-spacing: 0.04em; text-transform: uppercase; color: var(--lc-blue); transition: color .2s ease-out, border-color .2s ease-out; }
.lc-more summary::-webkit-details-marker { display: none; }
.lc-more summary:hover { color: var(--lc-ink); border-bottom-color: var(--lc-ink); }
.lc-more summary svg { width: 16px; height: 16px; transition: transform .3s cubic-bezier(.16, 1, .3, 1); }
.lc-more[open] summary svg { transform: rotate(180deg); }
.lc-more-close, .lc-more[open] .lc-more-open { display: none; }
.lc-more[open] .lc-more-close { display: inline; }
.lc-more-body { margin-top: 16px; }
.lc-inner .lc-more-body p, .lc-inner .lc-more-body li { max-width: 56ch; margin: 0 0 12px; font: 400 15px/1.6 var(--lc-body); color: var(--lc-grey); }
.lc-inner .leftpanel .lc-more-body > :last-child { margin-bottom: 0; }
.lc-more-body [style*="color"], .lc-more-body [style*="font"] { color: inherit !important; font-family: inherit !important; }

/* ---------- Careers: vacancies as news rows with a wide image ---------- */

.lc-newsrow--wide { grid-template-columns: 260px minmax(0, 1fr); }
.lc-newsrow--wide .lc-newsrow-img { aspect-ratio: auto; }
.lc-newsrow--wide .lc-newsrow-img img { height: auto; }
.lc-inner .leftpanel .lc-job-where { margin: 0 0 10px; max-width: 56ch; font: 600 15px/1.45 var(--lc-body); color: var(--lc-grey); }
.lc-inner .leftpanel .lc-empty { margin: 8px 0 0; padding: 18px 20px; border: 1px solid var(--lc-slate); border-top: 2px solid var(--lc-blue); font: 400 16px/1.55 var(--lc-body); color: var(--lc-ink); }

@media (max-width: 640px) {
	.lc-person { grid-template-columns: 88px minmax(0, 1fr); gap: 14px 16px; padding: 22px 0; }
	.lc-person-img { grid-row: span 2; }
	.lc-person-img--initials { font-size: 24px; }
	.lc-person-text { display: contents; }
	.lc-person h2 { grid-column: 2; align-self: end; font-size: 20px; }
	.lc-inner .leftpanel .lc-person-role { grid-column: 2; align-self: start; margin: 0; }
	.lc-person-text > p:not(.lc-person-role), .lc-person .lc-more { grid-column: 1 / -1; }
	.lc-inner .lc-person-text > p:not(.lc-person-role) { margin: 0; }
	.lc-newsrow--wide { grid-template-columns: minmax(0, 1fr); }
	.lc-newsrow--wide h2, .lc-newsrow--wide .lc-job-where { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
	.lc-more summary svg { transition: none; }
}

/* ---------- Inner-page forms: one framed panel that ends in its submit row ---------- */

/* The frame groups every field with its button; the Off-white strip at the foot marks the form's last step */
.lc-inner .pagecontent form.lc-form { display: flow-root; margin: 8px 0 0; padding: 28px 28px 0; border: 1px solid var(--lc-slate); border-top: 2px solid var(--lc-blue); background: #fff; }
.lc-inner .pagecontent .lc-form-actions { clear: both; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 28px -28px 0; padding: 20px 28px; border-top: 1px solid var(--lc-slate); background: var(--lc-off); }
.lc-inner .pagecontent form .lc-form-actions button.lc-btn--form { margin: 0; }
.lc-inner .pagecontent .lc-form-note { margin: 0; font: 400 14px/1.4 var(--lc-body); color: var(--lc-grey); }

@media (max-width: 640px) {
	.lc-inner .pagecontent form.lc-form { padding: 20px 20px 0; }
	.lc-inner .pagecontent .lc-form-actions { margin: 24px -20px 0; padding: 16px 20px 20px; }
}

/* ==========================================================================
   Audit fixes: the inner pages no longer load main.css, so the parts it still dressed live here
   ========================================================================== */

.lc-brand picture { display: block; }
:root { --lc-error: #b42318; }
::placeholder { color: var(--lc-grey); opacity: 1; }

/* Fields the visitor never sees: the spam trap and the consent record Campaign Monitor needs */
.hide-this, #sozo-protection { display: none !important; }

/* ---------- Forms: a label column and a field column inside the framed panel ---------- */

.lc-inner .pagecontent form.lc-form { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); column-gap: 24px; row-gap: 14px; align-items: start; }
.lc-inner .pagecontent form.lc-form > *, .lc-inner .pagecontent form.lc-form > div:not([class]) > * { grid-column: 1 / -1; }
.lc-inner .pagecontent form.lc-form > div:not([class]) { display: contents; }
.lc-inner .pagecontent form.lc-form label:not(.is-label) { grid-column: 1; margin: 0; padding-top: 11px; font: 400 15px/1.4 var(--lc-body); color: var(--lc-ink); }
.lc-inner .pagecontent form.lc-form label small { font-size: 13px; color: var(--lc-grey); }
.lc-inner .pagecontent form.lc-form :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select, textarea) { grid-column: 2; width: 100%; min-height: 44px; margin: 0; padding: 10px 12px; }
.lc-inner .pagecontent form.lc-form select { padding-right: 40px; }
.lc-inner .pagecontent form.lc-form textarea { min-height: 120px; resize: vertical; }
.lc-inner .pagecontent .lc-form-actions { margin-top: 14px; }

/* Consent: the notice and its two choices span the panel */
.lc-inner .consent-notice > :first-child { margin-top: 18px; }
.lc-inner .consent-options { list-style: none; margin: 0; padding: 0; }
.lc-inner .consent-option { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 10px; }
.lc-inner .pagecontent form .consent-option input[type="radio"] { flex: none; width: 20px; height: 20px; margin: 1px 0 0; }
.lc-inner .consent-option label { font: 400 15px/1.45 var(--lc-body); color: var(--lc-ink); cursor: pointer; }

/* Errors: a summary that takes focus, then each problem under its own field */
.lc-inner .lc-form-errors { margin: 0 0 6px; padding: 16px 20px 18px; border: 1px solid var(--lc-slate); border-top: 3px solid var(--lc-error); background: #fff; }
.lc-inner .lc-form-errors:focus-visible { outline-offset: 2px; }
.lc-inner .leftpanel .lc-form-errors h2, .lc-inner .lc-form-errors h2 { margin: 0 0 8px; font: 600 20px/1.1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-error); }
.lc-inner .lc-form-errors ul { margin: 0; padding-left: 1.2em; list-style: square; }
.lc-inner .lc-form-errors li { margin: 4px 0; font: 400 15px/1.5 var(--lc-body); color: var(--lc-ink); }
.lc-inner .pagecontent .lc-form-errors a { color: var(--lc-error); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-inner .pagecontent form.lc-form :is(input, select, textarea)[aria-invalid="true"][aria-describedby] { border: 2px solid var(--lc-error); }
.lc-inner .pagecontent form.lc-form .lc-field-error { grid-column: 2; display: flex; align-items: flex-start; gap: 6px; margin: -6px 0 0; font: 600 14px/1.4 var(--lc-body); color: var(--lc-error); }
.lc-field-error::before { content: ""; flex: none; width: 16px; height: 16px; margin-top: 1px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.01'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Confirmation after a form is sent */
.lc-inner .sozo-message { margin: 8px 0 0; padding: 18px 20px; border: 1px solid var(--lc-slate); border-top: 2px solid var(--lc-blue); font: 400 16px/1.55 var(--lc-body); color: var(--lc-ink); }

@media (max-width: 650px) {
	.lc-inner .pagecontent form.lc-form { grid-template-columns: minmax(0, 1fr); row-gap: 6px; }
	.lc-inner .pagecontent form.lc-form label:not(.is-label) { padding-top: 10px; }
	.lc-inner .pagecontent form.lc-form :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]), select, textarea), .lc-inner .pagecontent form.lc-form .lc-field-error { grid-column: 1; }
	.lc-inner .pagecontent form.lc-form .lc-field-error { margin-top: 2px; }
}

/* ---------- Contact: the form beside the map and the company's details ---------- */

.lc-inner .fullpanel { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 2fr); gap: 56px; align-items: start; }
.lc-inner .colright iframe { display: block; width: 100%; max-width: 480px; height: auto; aspect-ratio: 4 / 3; margin: 0 0 24px !important; border: 1px solid var(--lc-slate) !important; }
.lc-inner .is-contact-details dl { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 0 12px; margin: 0 0 12px; }
.lc-inner .is-contact-details dt, .lc-inner .is-contact-details dd { margin: 0; font: 400 15px/1.55 var(--lc-body); color: var(--lc-grey); }
.lc-inner .is-contact-details dd { color: var(--lc-ink); }
.lc-inner .is-contact-details .single-col { grid-column: 1 / -1; margin-top: 6px; }
.lc-inner .pagecontent .is-contact-details a { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }

@media (max-width: 980px) {
	.lc-inner .fullpanel { grid-template-columns: minmax(0, 1fr); gap: 40px; }
}

/* ---------- Services landing: every service as a ruled row with its drawn icon ---------- */

.lc-inner .serviceicons ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; margin: 8px 0 0; padding: 0; list-style: none; border-top: 2px solid var(--lc-blue); }
.lc-inner .serviceicons li { margin: 0; border-bottom: 1px solid var(--lc-slate); }
.lc-inner .leftpanel .serviceicons a { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 10px 0; color: var(--lc-ink); text-decoration: none; transition: color .2s ease-out; }
.lc-inner .leftpanel .serviceicons a:hover { color: var(--lc-blue); }
.lc-inner .serviceicons span { font: 600 17px/1.15 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; }

@media (max-width: 640px) {
	.lc-inner .serviceicons ul { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Service key features ---------- */

.lc-inner .keyfeatures { margin: 32px 0; padding: 22px 26px 24px; border-top: 2px solid var(--lc-blue); background: var(--lc-off); }
.lc-inner .leftpanel .keyfeatures h2 { margin: 0 0 12px; font: 600 20px/1.1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .keyfeatures ul { margin: 0; padding-left: 1.2em; list-style: square; }
.lc-inner .keyfeatures li { margin: 0 0 8px; max-width: 58ch; font: 400 15px/1.55 var(--lc-body); color: var(--lc-grey); }
.lc-inner .keyfeatures li::marker { color: var(--lc-blue); }

/* ---------- Legal text, the sitemap and media in the reading column ---------- */

.lc-inner .sozo-content ul, .lc-inner .sozo-content ol { margin: 16px 0; padding-left: 1.3em; color: var(--lc-grey); }
.lc-inner .sozo-content ul { list-style: square; }
.lc-inner .sozo-content li { max-width: 58ch; margin: 0 0 6px; font: 400 16px/1.6 var(--lc-body); }
.lc-inner .sozo-content li::marker, .lc-inner .cktext li::marker { color: var(--lc-blue); }
.lc-inner .sozo-content a { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-inner .sozo-content table, .lc-inner .cktext table { width: 100%; margin: 20px 0; border-collapse: collapse; font: 400 15px/1.5 var(--lc-body); color: var(--lc-grey); }
.lc-inner :is(.sozo-content, .cktext) :is(th, td) { padding: 8px 10px; border-bottom: 1px solid var(--lc-slate); text-align: left; vertical-align: top; }
.lc-inner :is(.sozo-content, .cktext) th { font-weight: 600; color: var(--lc-ink); }
.lc-inner .visual img { display: block; width: 100%; max-width: 700px; height: auto; }
.lc-inner .videobox { margin: 24px 0; }
.lc-inner .videobox iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }

/* ---------- Tap targets: small text actions reach further than they look ---------- */

a.lc-ruled, .lc-more summary { position: relative; }
a.lc-ruled::after, .lc-more summary::after { content: ""; position: absolute; inset: -11px -6px; }

/* ---------- Cookie banner (OneTrust): its default green buttons fail contrast (2.3:1), so they take the site's buttons ---------- */

#onetrust-consent-sdk #onetrust-accept-btn-handler,
#onetrust-consent-sdk #onetrust-reject-all-handler,
#onetrust-consent-sdk #accept-recommended-btn-handler,
#onetrust-consent-sdk .save-preference-btn-handler,
#onetrust-consent-sdk #filter-apply-handler { background-color: #005f90 !important; border-color: #005f90 !important; color: #fff !important; border-radius: 0 !important; }
#onetrust-consent-sdk #onetrust-accept-btn-handler:hover,
#onetrust-consent-sdk #onetrust-reject-all-handler:hover,
#onetrust-consent-sdk #accept-recommended-btn-handler:hover,
#onetrust-consent-sdk .save-preference-btn-handler:hover,
#onetrust-consent-sdk #filter-apply-handler:hover { background-color: #231f20 !important; border-color: #231f20 !important; opacity: 1 !important; }
#onetrust-consent-sdk #onetrust-pc-btn-handler,
#onetrust-consent-sdk #filter-cancel-handler { background-color: #fff !important; border-color: #005f90 !important; color: #005f90 !important; border-radius: 0 !important; }
#onetrust-consent-sdk #onetrust-pc-btn-handler:hover,
#onetrust-consent-sdk #filter-cancel-handler:hover { color: #231f20 !important; border-color: #231f20 !important; opacity: 1 !important; }

/* FAQ questions are headings now; they keep the row's spacing */
.lc-faq summary .lc-faq-q { margin: 0; }

/* Long addresses and URLs in legal text wrap instead of pushing the column wider than the screen */
.lc-inner :is(.leftpanel, .rightpanel, .fullpanel) { overflow-wrap: break-word; }
/* Reading text ends without a lone word on its last line, and headings break evenly */
.lc-inner :is(.leftpanel, .fullpanel) :is(p, li) { text-wrap: pretty; }
.lc-inner :is(.cktext, .sozo-content) :is(h2, h3, h4), .lc-faq-q { text-wrap: balance; }
.lc-inner .consent-notice p { max-width: 60ch; }

/* Wide tables (the cookie list) scroll inside the column on phones rather than widening the page */
@media (max-width: 640px) {
	.lc-inner :is(.sozo-content, .cktext) table { display: block; max-width: 100%; overflow-x: auto; }
}

/* 320px screens (WCAG reflow): the logo, Partnerlink and the menu button share the bar without spilling */
@media (max-width: 360px) {
	.lc-bar { gap: 8px; }
	.lc-brand img { width: 128px; }
	.lc-utility { gap: 6px; }
	a.lc-portal { padding: 11px 9px; font-size: 14px; }
	.lc-menu-btn { width: 44px; height: 44px; }
}

/* ==========================================================================
   Landing page design: the approved "UK & I Europe" copy on the home page, and the grouped Services page
   ========================================================================== */

.lc-menu-all { display: flex; flex-wrap: wrap; gap: 8px 28px; }

/* Lead: a longer heading, a heritage line and three actions */
.lc-hero .lc-lead h1 { max-width: 20ch; font-size: clamp(34px, 3.1vw, 48px); line-height: 1; }
.lc-lead .lc-lead-text p { font-size: 17px; }
.lc-lead p.lc-heritage { margin-top: 14px; font: 600 17px/1.35 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-blue); }
.lc-hero .lc-actions { gap: 12px; }
.lc-hero a.lc-btn, .lc-tagline a.lc-btn { padding: 15px 20px; font-size: 18px; }
a.lc-btn--ghost { background: var(--lc-white); color: var(--lc-blue); box-shadow: inset 0 0 0 2px var(--lc-blue); }
a.lc-btn--ghost:hover, a.lc-btn--ghost:focus-visible { background: var(--lc-blue); color: var(--lc-white); }

/* Chart: four pillars instead of two statements, so they are narrower */
.lc-statement a { width: 220px; padding: 12px 14px 12px 12px; }
.lc-statement .lc-label { font-size: 19px; }
.lc-value .lc-label { font-size: 22px; }

@media (min-width: 1081px) and (max-width: 1320px) {
	.lc-statement a { width: 200px; }
	.lc-statement .lc-label { font-size: 17px; }
	.lc-value .lc-label { font-size: 19px; }
}

/* Shared section title */
.lc-section-title { margin: 0 0 32px; max-width: 24ch; font: 700 clamp(30px, 3vw, 44px)/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-blue); text-wrap: balance; }

/* Four pillars, each under a rule */
.lc-pillars .lc-wrap { padding-top: 24px; padding-bottom: 72px; }
.lc-pillar-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; margin: 0; padding: 0; list-style: none; }
.lc-pillar-list li { margin: 0; padding-top: 18px; border-top: 2px solid var(--lc-blue); }
.lc-pillar-list h3 { margin: 0 0 10px; font: 600 22px/1.1 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-pillar-list p { margin: 0; font: 400 15px/1.6 var(--lc-body); color: var(--lc-grey); }

/* Best people, data and technology: the rows carry long paragraphs, so the heading column widens */
.lc-key .lc-wrap { grid-template-columns: 1fr; gap: 28px; }
.lc-key h2 { max-width: none; }
.lc-key .lc-row { grid-template-columns: 52px 260px minmax(0, 1fr) auto; gap: 18px 28px; }
.lc-key .lc-row p { max-width: 72ch; }

/* Specialist band: white on AU Dark Blue (6.4:1) */
.lc-specialist { background: var(--lc-blue); color: var(--lc-white); }
.lc-specialist .lc-wrap { display: grid; grid-template-columns: minmax(320px, 5fr) 8fr; gap: 32px 56px; padding-top: 80px; padding-bottom: 80px; }
.lc-specialist h2 { margin: 0; max-width: 16ch; font: 700 clamp(32px, 3vw, 46px)/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-white); }
.lc-specialist .lc-wrap > div p { margin: 20px 0 0; max-width: 46ch; font: 400 17px/1.6 var(--lc-body); color: var(--lc-white); }
.lc-points { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--lc-white); }
.lc-points li { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 18px; margin: 0; padding: 24px 0; border-bottom: 1px solid var(--lc-on-blue-rule); }
.lc-points h3 { margin: 0; font: 600 24px/1.05 var(--lc-cond); text-transform: uppercase; color: var(--lc-white); }
.lc-points p { margin: 0; font: 400 16px/1.6 var(--lc-body); color: var(--lc-white); }

/* Custom solutions: four ruled rows, the title in its own column beside the paragraph (no icons, so they read apart from the Best rows) */
.lc-solutions { padding-top: 88px; padding-bottom: 80px; }
.lc-solution-rows { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--lc-blue); }
.lc-solution { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 12px 28px; align-items: start; margin: 0; padding: 28px 0; border-bottom: 1px solid var(--lc-slate); }
.lc-solution h3 { margin: 0; font: 600 30px/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-solution p { margin: 0; max-width: 60ch; font: 400 15px/1.65 var(--lc-body); color: var(--lc-grey); text-wrap: pretty; }

/* Services provided: two groups of ruled rows */
.lc-provided { background: var(--lc-off); }
.lc-provided .lc-wrap { padding-top: 80px; padding-bottom: 72px; }
.lc-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }
.lc-group h3 { margin: 0 0 12px; font: 600 22px/1.1 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-blue); }
.lc-svc-list { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--lc-blue); }
.lc-svc-list li { margin: 0; border-bottom: 1px solid var(--lc-slate); }
.lc-svc-list a, .lc-svc-plain { display: flex; align-items: center; gap: 14px; min-height: 48px; padding: 8px 0; font: 600 17px/1.15 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; color: var(--lc-ink); text-decoration: none; }
.lc-svc-list a span { border-bottom: 2px solid transparent; transition: border-color .2s ease-out, color .2s ease-out; }
.lc-svc-list a:hover span { color: var(--lc-blue); border-bottom-color: var(--lc-blue); }
/* Services with a page of their own carry an arrow, so they read as links among the plain entries */
.lc-svc-list a::after, .lc-inner .leftpanel .serviceicons a::after { content: ""; flex: none; width: 14px; height: 14px; margin-left: auto; margin-right: 4px; background: var(--lc-blue); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.lc-svc-list i, .lc-inner .serviceicons i { flex: none; width: 30px; }
/* An entry with no line icon takes the chart's diamond */
i.lc-svc-dot::before { content: ""; display: block; width: 12px; height: 12px; margin: 0 auto; border: 2px solid var(--lc-sky); transform: rotate(45deg); }
.lc-provided .lc-wrap > p { margin: 32px 0 0; }

/* Technology suite: name over description, in a grid of ruled cells */
.lc-tech { padding-top: 80px; padding-bottom: 72px; }
.lc-tech-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0 28px; margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--lc-blue); }
.lc-tech-list li { margin: 0; padding: 16px 0 18px; border-bottom: 1px solid var(--lc-slate); }
.lc-tech-list strong { display: block; font: 600 21px/1.1 var(--lc-cond); letter-spacing: 0.01em; text-transform: uppercase; color: var(--lc-ink); }
.lc-tech-list a { text-decoration: none; }
.lc-tech-list a strong { color: var(--lc-blue); }
.lc-tech-list a:hover strong { text-decoration: underline; text-underline-offset: 0.2em; }
.lc-tech-list span { display: block; margin-top: 6px; font: 400 15px/1.5 var(--lc-body); color: var(--lc-grey); }
.lc-tech > p { margin: 32px 0 0; }

/* Meet the experts: photo, name and role, each a link to the full profile */
.lc-experts { background: var(--lc-off); }
.lc-experts .lc-wrap { padding-top: 80px; padding-bottom: 80px; }
.lc-expert-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 32px 20px; margin: 0; padding: 0; list-style: none; }
.lc-expert-list li { margin: 0; }
.lc-expert-list a { display: block; text-decoration: none; }
.lc-expert-list .lc-person-img { margin-bottom: 14px; background: var(--lc-white); }
.lc-expert-list strong { display: block; font: 600 20px/1.1 var(--lc-cond); text-transform: uppercase; color: var(--lc-ink); }
.lc-expert-list a:hover strong { color: var(--lc-blue); text-decoration: underline; text-underline-offset: 0.2em; }
.lc-expert-role { display: block; margin-top: 6px; font: 400 14px/1.4 var(--lc-body); color: var(--lc-grey); }

/* Closing line before the footer */
.lc-tagline { background: var(--lc-blue-deep); color: var(--lc-white); }
.lc-tagline .lc-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 48px; padding-top: 64px; padding-bottom: 64px; }
.lc-tagline h2 { margin: 0; max-width: 22ch; font: 700 clamp(30px, 3vw, 44px)/1 var(--lc-cond); text-transform: uppercase; color: var(--lc-white); }
.lc-tagline .lc-actions { margin: 0; }
.lc-tagline a.lc-btn { background: var(--lc-white); color: var(--lc-blue); }
.lc-tagline a.lc-btn:hover, .lc-tagline a.lc-btn:focus-visible { background: var(--lc-ink); color: var(--lc-white); }
.lc-tagline a.lc-btn--outline { background: transparent; color: var(--lc-white); box-shadow: inset 0 0 0 2px var(--lc-white); }
.lc-tagline a.lc-btn--outline:hover, .lc-tagline a.lc-btn--outline:focus-visible { background: var(--lc-white); color: var(--lc-ink); }
.lc-tagline a.lc-call { color: var(--lc-white); border-bottom-color: var(--lc-white); }
.lc-tagline .lc-call small { color: var(--lc-reversed); }
.lc-tagline :focus-visible { outline-color: var(--lc-white); }

/* Services page: one titled group after another */
.lc-svc-group { margin-top: 48px; scroll-margin-top: 24px; }
.lc-inner .leftpanel .lc-svc-group > h2 { margin: 0 0 14px; font: 700 30px/1.05 var(--lc-cond); text-transform: uppercase; color: var(--lc-blue); }
.lc-inner .leftpanel .lc-svc-group > p { margin: 0 0 18px; }
.lc-inner .serviceicons .lc-svc-plain { display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 10px 0; color: var(--lc-ink); }
.lc-inner .serviceicons .lc-svc-plain span { font: 600 17px/1.15 var(--lc-cond); letter-spacing: 0.02em; text-transform: uppercase; }
.lc-inner .leftpanel .lc-tech-list a:not([class]) { text-decoration: none; }
.lc-inner .lc-tech-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1080px) {
	/* The approved intro is long, so the heading sits at the top of its column rather than the foot */
	.lc-lead { align-items: start; }
	.lc-lead-text { grid-column: 2; }
	.lc-lead .lc-actions { grid-column: 2; }
	.lc-pillar-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.lc-specialist .lc-wrap { grid-template-columns: 1fr; }
}

@media (max-width: 980px) {
	.lc-key .lc-row { grid-template-columns: 40px 1fr; }
	.lc-points li { grid-template-columns: 1fr; gap: 8px; }
	.lc-groups { grid-template-columns: 1fr; }
	.lc-solution { grid-template-columns: 1fr; padding: 24px 0; }
	.lc-pillars .lc-wrap, .lc-specialist .lc-wrap, .lc-solutions, .lc-provided .lc-wrap, .lc-tech, .lc-experts .lc-wrap { padding-top: 56px; padding-bottom: 56px; }
	.lc-statement a, .lc-value a, .lc-credential a { width: auto; }
}

@media (max-width: 640px) {
	.lc-pillar-list { grid-template-columns: 1fr; gap: 24px; }
	.lc-solution h3 { font-size: 24px; }
	.lc-inner .lc-tech-list { grid-template-columns: 1fr; }
	.lc-expert-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
	.lc-hero a.lc-btn, .lc-tagline a.lc-btn { width: 100%; justify-content: center; }
}

/* ---------- Line icons (Lucide sprite at /images/icons/icons.svg), drawn in AU Dark Blue ---------- */

.lc-ico { flex: none; width: 24px; height: 24px; color: var(--lc-blue); }
.lc-svc-list .lc-ico, .lc-inner .serviceicons .lc-ico { width: 26px; height: 26px; margin: 0 2px; }
/* Best people, data and technology: the icon sits in the row's first column, as the diamond did */
.lc-row-ico { width: 34px; height: 34px; }
/* Technology suite: the icon hangs to the left of the name and description */
.lc-tech-list li { position: relative; padding-left: 44px; }
.lc-tech-ico { position: absolute; left: 0; top: 16px; width: 28px; height: 28px; }

/* ---------- Adapt: chart nodes stay inside the chart, and short links reach 44px ---------- */

/* linkchart.js sets --nudge on a node that would overhang the chart's edge; the list layout under 981px ignores it */
@media (min-width: 981px) {
	.lc-node { transform: translate(calc(-50% + var(--nudge, 0px)), -50%); }
}

/* Best-row and technology links keep their drawn size but answer 11px further above and below */
.lc-key .lc-row a, .lc-tech-list a { position: relative; }
.lc-tech-list a { display: block; width: fit-content; }
.lc-key .lc-row a::after, .lc-tech-list a::after { content: ""; position: absolute; inset: -11px -6px; }

/* Certificate links: one 44px row each, underlined rather than ruled so the line stays under the words */
.lc-cred-list p br { display: none; }
.lc-cred-list p a { display: block; width: fit-content; padding: 11px 0; font-size: 16px; line-height: 22px; border-bottom: 0; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; }
.lc-cred-list p a:hover { text-decoration-color: var(--lc-ink); }

/* 1081-1180px: the chart column is under 600px, so pillar boxes come in further (184px, a 28px glyph) to keep
   Global Scale clear of the company disc's ring without needing a nudge */
@media (min-width: 1081px) and (max-width: 1180px) {
	.lc-statement a { width: 184px; gap: 8px; padding: 10px 12px 10px 10px; }
	.lc-statement .lc-glyph { width: 28px; height: 28px; }
}

/* Get in touch box (every inner page): the phone number and the enquiry button reach 44px too */
a.lc-railbox-tel { display: inline-block; padding: 10px 0; line-height: 24px; }
a.lc-railbox-action { padding-top: 14px; padding-bottom: 13px; }

/* ---------- Harden ---------- */

/* Without JavaScript the menu button can't open the navigation, so under 1150px the links show as a list under the bar */
@media (max-width: 1150px) {
	.no-js .lc-menu-btn { display: none; }
	.no-js .lc-bar { flex-wrap: wrap; padding-bottom: 8px; }
	.no-js .lc-nav { display: block; position: static; order: 3; width: 100%; padding: 0; border: 0; box-shadow: none; }
}

/* A form on its way: the button stays put but shows it is working, and a second press does nothing (linkchart.js) */
.lc-inner .pagecontent form button.lc-btn--form[aria-disabled="true"] { background: var(--lc-blue-deep); cursor: progress; }

/* Names and titles in narrow columns break a word that is longer than the column rather than widening the page
   ("anywhere" also lets the grid track shrink below the word; hyphens apply first where the dictionary knows the word) */
.lc-pillar-list h3, .lc-row h3, .lc-points h3, .lc-solution h3, .lc-group h3, .lc-svc-list span,
.lc-tech-list strong, .lc-expert-list strong, .lc-expert-role, .lc-section-title, .lc-lead h1, .lc-specialist h2,
.lc-tagline h2, .lc-key h2, .lc-creds h2, .lc-cred-list strong { overflow-wrap: anywhere; hyphens: auto; }
/* Chart nodes are absolutely placed and size to their content, so "anywhere" would let a node near the edge shrink
   to a sliver and stack its label letter by letter. Nodes take their full content width (linkchart.js keeps them
   inside the chart), and a label only breaks a word that is wider than its fixed-width box. */
.lc-node { width: max-content; }
.lc-label { overflow-wrap: break-word; hyphens: auto; }
@media (max-width: 980px) {
	.lc-node { width: auto; }
}
.lc-svc-list a, .lc-svc-plain, .lc-svc-list li, .lc-tech-list li, .lc-expert-list li, .lc-pillar-list li, .lc-solution, .lc-row { min-width: 0; }

/* Single-column grids: a plain 1fr track grows to fit its longest word, so every one-column step is minmax(0, 1fr) */
.lc-key .lc-wrap { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 1080px) {
	.lc-hero, .lc-creds, .lc-specialist .lc-wrap { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 980px) {
	.lc-key .lc-row { grid-template-columns: 40px minmax(0, 1fr); }
	.lc-points li, .lc-solution, .lc-groups { grid-template-columns: minmax(0, 1fr); }
	.lc-f-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
	.lc-pillar-list { grid-template-columns: minmax(0, 1fr); }
}
/* Strength labels wrap at about two short words, so "Best Technology" sits on two lines and stays clear of the disc */
.lc-value .lc-label { max-width: 6em; }
@media (max-width: 980px) {
	.lc-value .lc-label { max-width: none; }
}

/* ---------- P3 fixes ---------- */

/* Chart and Best-row glyphs draw in currentColor; the colour follows the Link Kind Rule */
.lc-glyph { color: var(--lc-blue); }
.lc-value .lc-glyph, .lc-row .lc-glyph { color: var(--lc-sky); }

/* Contact details: the phone number and email address are 44px rows, their labels aligned on the text baseline */
.lc-inner .is-contact-details dl { align-items: baseline; }
.lc-inner .is-contact-details dd > a { display: inline-block; padding: 11px 0; line-height: 22px; }

/* Consent choices: the label is the target, so it gets the height (44px a line) */
.lc-inner .consent-option { margin: 0; }
.lc-inner .consent-option label { padding: 11px 0; }
.lc-inner .pagecontent form .consent-option input[type="radio"] { margin-top: 12px; }

/* The LRQA + UKAS mark is wide: at 325px its LRQA square is 180px, the legible size LRQA's rules ask for */
.lc-cred-list img.lc-mark-wide { width: 325px; max-width: 100%; }

/* Strength nodes on the chart carry the same line icon as their Best row, drawn in AU Light Blue (the strength colour)
   on the 34px glyph square; the 24px Lucide grid is set at 30px so its 2px stroke lands near the 2.2px of the other glyphs */
.lc-node .lc-node-ico { width: 30px; height: 30px; margin: 2px; }

/* Custom Solutions: colour as wayfinding. Each solution leads with its own line icon in AU Light Blue (a line
   colour, 3.9:1 on white, above the 3:1 icons need) and its title in AU Dark Blue; the paragraph stays AU Grey */
.lc-solution-head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.lc-solution-ico { width: 34px; height: 34px; color: var(--lc-sky); }
.lc-solution h3 { color: var(--lc-blue); }