/* Shared across every page: post layout on small screens, cookie banner, fixes for the pages built before the kit.
   The header, phone menu and footer are styled in chrome.css. */
@media (max-width:900px){
  [data-m="postgrid"]{display:block !important;}
  [data-m="postgrid"]>*{grid-column:auto !important;}
  [data-m="postgrid"]>*+*{margin-top:24px;}
  [data-m="toc"]{display:none !important;}
}
/* Cookie banner (site.js): green kit tokens, Geist from chrome.css. Accept and Reject are equally prominent (ICO guidance). */
.ck{--ck-ink:#14201B;--ck-ink2:#4A5550;--ck-line:#D8D7D0;--ck-focus:#27604B;
  position:fixed;left:16px;bottom:16px;z-index:60;max-width:380px;box-sizing:border-box;background:#fff;color:var(--ck-ink);border:1px solid var(--ck-line);border-radius:12px;box-shadow:0 18px 44px rgba(12,38,30,.14);padding:18px 18px 16px;
  font:15px/1.5 'Geist','Inter',Helvetica,Arial,sans-serif;letter-spacing:-0.006em;-webkit-font-smoothing:antialiased;text-align:left;}
.ck p{margin:0 0 14px;color:var(--ck-ink2);}
.ck a{color:var(--ck-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
.ck div{display:flex;gap:8px;}
.ck button{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:110px;margin:0;padding:0 16px;border:1px solid var(--ck-ink);border-radius:8px;background:var(--ck-ink);color:#fff;font:500 15px/1 'Geist','Inter',Helvetica,Arial,sans-serif;letter-spacing:-0.006em;cursor:pointer;transition:background-color .16s ease,border-color .16s ease;}
@media (hover:hover) and (pointer:fine){.ck button:hover{background:#27604B;border-color:#27604B;}}
.ck :focus-visible{outline:2px solid var(--ck-focus);outline-offset:2px;}
.ck:focus{outline:none;}.ck:focus-visible{outline:2px solid var(--ck-focus);outline-offset:2px;}
@media (max-width:560px){.ck{left:12px;right:12px;bottom:12px;max-width:none;}}
/* Contrast fixes (WCAG AA): labels on dark cards and the green "You" card */
[style*="background:var(--t-darkcard)"] [style*="color:#5A6170"]{color:#9AB3A5 !important;}
[style*="background:var(--t-darkcard)"] [style*="color:var(--acc);"]{color:#C2DCCC !important;}
[style*="background:var(--acc);border:1px solid var(--acc)"] > div{color:#FFFFFF !important;}
[style*="background:var(--t-dark)"] [style*="color:#5A6170"],[style*="background:#10201A"] [style*="color:#5A6170"],.dk [style*="color:#5A6170"]{color:#9AB3A5 !important;}
[style*="background:var(--acc)"] [style*="color:var(--t-ink)"],[style*="background:#3E6B55"] [style*="color:#10201A"],[style*="background:#3E6B55"] [style*="color:#41584B"],[style*="background:var(--acc)"] [style*="color:#41584B"]{color:#FFFFFF !important;}
[style*="border-radius:8px;background:var(--acc);"] *{color:#FFFFFF !important;}
/* Skip link (keyboard users) */
.skip{position:absolute;left:-9999px;top:0;}
.skip:focus{left:16px;top:16px;z-index:100;background:#fff;color:#14201B;padding:8px 12px;border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.15);}
/* Platform shortlist rows on phones */
@media (max-width:600px){.pvSL{grid-template-columns:40px minmax(0,1fr) 76px !important;}.pvSL>:last-child{grid-column:2/-1;justify-self:start;}}
/* Cookie banner: compact on phones */
@media (max-width:560px){.ck{padding:12px 14px;font-size:14px;line-height:1.45;}.ck p{margin:0 0 10px;}}
/* Print */
@media print{header,footer,.ck,.skip,[data-copy-link],[data-m="toc"],video{display:none !important;}body,html{background:#fff !important;}.prose a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em;}}
/* Logo wall: one scrolling line on every screen size */
@media (max-width:767px){html [data-m="logogrid"]{display:none !important;}html [data-m="marquee"].v2x{display:block !important;}html [data-m="marquee"] img{max-height:22px !important;}html [data-m="marquee"] [style*="padding:0 34px"]{padding:0 22px !important;}}
/* Fulfilment hero: text left, live drop card right on wide screens */
@media (min-width:1100px){[data-m="fhero"]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,540px);column-gap:64px;align-items:center;}[data-m="fhero"]>*{grid-column:1;}[data-m="fhero"]>[data-m="fcard"]{grid-column:2;grid-row:1 / span 3;margin-top:0 !important;align-self:center;}}
/* Platform hero window layout lives in platform.html (container queries) */

/* Articles: links without double underlines, sensible heading sizes, tidy contents list */
.prose a[style*="border-bottom"],.prose span a{text-decoration:none !important;}
[data-m="postgrid"] .prose h2,[data-m="postgrid"] .legal h2,article [data-m="postgrid"] h2[id]{font-size:clamp(24px,2.1vw,30px) !important;max-width:none !important;line-height:1.2 !important;}
[data-m="toc"] br{display:none;}
[data-m="toc"] a{display:block;line-height:1.4;margin:0 0 10px;}
[data-m="toc"]{line-height:1.4 !important;}
/* Hover feedback where there was none */
a[href]{transition:opacity .15s ease, border-color .15s ease, background-color .15s ease;}
a[href*="See the programmes"],a.hv2:hover,a.hv3:hover,a.hv4:hover,a.hv5:hover,a.hv6:hover{opacity:.9;}
@media (hover:hover) and (pointer:fine){main a[href^="/"]:not([class]):hover{opacity:.75;}
.pill:hover{border-color:var(--t-ink,#10201A) !important;}}
.pvCh:hover{background:#EEF2EE !important;}
/* Cookie table and trust marks */
body:not(.pg) img[src*="bcorp.svg"]{height:46px !important;width:auto !important;}
body:not(.sy) .mk img[src*="bcorp.svg"][src]{height:36px !important;width:auto !important;}
/* ---- Tablet / mid-width layout (visual QA, 1 Oct) ---- */
/* Home "Three parts": one card per row until there is room for three */
@media (max-width:1239px){#how .v2grid{grid-template-columns:1fr !important;max-width:760px;}}
/* Never leave a lone card on a row */
@media (max-width:959px){
  [style*="minmax(min(280px"]:has(> :nth-child(3):last-child),[style*="minmax(min(290px"]:has(> :nth-child(3):last-child),[style*="minmax(min(300px"]:has(> :nth-child(3):last-child),[style*="minmax(min(320px"]:has(> :nth-child(3):last-child),[style*="minmax(min(340px"]:has(> :nth-child(3):last-child),[style*="minmax(min(360px"]:has(> :nth-child(3):last-child){grid-template-columns:1fr !important;}
  [style*="minmax(min(300px"]:has(> :nth-child(2):last-child),[style*="minmax(min(320px"]:has(> :nth-child(2):last-child),[style*="minmax(min(400px"]:has(> :nth-child(2):last-child),[style*="minmax(min(440px"]:has(> :nth-child(2):last-child){grid-template-columns:1fr !important;}
}
@media (min-width:561px) and (max-width:1099px){
  [style*="repeat(auto-fit"]:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  [style*="repeat(auto-fit"]:has(> :nth-child(5):last-child){grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  [style*="repeat(auto-fit"]:has(> :nth-child(5):last-child) > :last-child{grid-column:1 / -1;}
}
/* Less dead space before the dark call-to-action bands */
section.dk[style*="margin-top:140px"]{margin-top:64px !important;}
/* Labels that are information, not buttons */
span[style*="border:1px solid #D9D9D5;border-radius:10px;padding:8px 14px"],span[style*="border:1px solid #D9D9D5;border-radius:10px;padding:7px 12px"],span[style*="border:1px solid #E1E3E9;background:#FFFFFF;border-radius:6px;padding:7px 12px"]{border-color:transparent !important;background:#EEF2EE !important;font-weight:500 !important;}
/* Customers "Launch to handover" timeline: 2 x 2 until it fits in a row */
@media (max-width:1279px){[style*="grid-template-columns:repeat(4,1fr);gap:6px"]{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
/* Fulfilment hero card spans the column when stacked */
@media (max-width:1099px){[data-m="fcard"]{max-width:none !important;}}
/* Journal lists: date | title | Read on wide screens; stacked on phones */
@media (min-width:600px){.arow,a[style*="padding:28px 0;border-top:1px solid var(--t-line)"][style*="minmax(min(200px,100%),1fr)"]{grid-template-columns:170px minmax(0,1fr) 64px !important;}
  .arow>h3,a[style*="padding:28px 0;border-top"]>h3{grid-column:auto !important;}}
@media (max-width:599px){.arow,a[style*="padding:28px 0;border-top:1px solid var(--t-line)"]{grid-template-columns:1fr !important;gap:8px !important;}.arow>h3,a[style*="padding:28px 0;border-top"]>h3{grid-column:auto !important;}.arow>div:last-child,a[style*="padding:28px 0;border-top"]>div:last-child{text-align:left !important;}}

/* ---- Phones (visual QA, 1 Oct) ---- */
@media (max-width:480px){
  .v2mTag{white-space:normal !important;}
  div:has(> .v2mTag){grid-template-columns:1fr !important;}
  [data-m="onesys"]{white-space:normal !important;font-size:14px !important;}
}
/* Two-column info rows: value always right-aligned, on one line where possible */
div[style*="display:flex;justify-content:space-between;gap:12px;padding:8px 0"]>span:last-child,div[style*="display:flex;justify-content:space-between;gap:12px;padding:10px 0"]>span:last-child{text-align:right;margin-left:auto;}
div[style*="display:flex;justify-content:space-between;gap:12px;padding:10px 0"]>span:first-child{min-width:0;}
@media (max-width:600px){
  main section[style*="padding:104px 40px"],main section[style*="padding:84px 40px"]{padding-top:56px !important;padding-bottom:56px !important;}
  main section[style*="padding:140px 40px"]{padding-top:64px !important;}
  #how{padding-top:64px !important;}
}
@media (max-width:400px){
  main [style*="display:flex;gap:12px;flex-wrap:wrap"]>a{flex:1 1 100%;text-align:center;}
}
@media (max-width:600px){.pvCh .pvChN{display:none !important;}.pvCh .pvChIc{display:none !important;}.pvCh{justify-content:center !important;padding-inline:4px !important;}}
div:has(> .pvTab){flex-wrap:wrap !important;row-gap:6px;}

/* The page wrapper clips sideways overflow without breaking position:sticky (header, platform chapter nav, post contents) */
body>div[style*="overflow-x:hidden"]{overflow-x:clip !important;}

/* Three-up stat rows never leave a lone card between phone and desktop */
@media (min-width:600px) and (max-width:959px){[style*="minmax(min(240px,100%),1fr)"]:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr)) !important;}}

/* ---- Legal pages (tools/build_legal.py): the Journal article shell (blog.css) plus clause numbers, sub-clauses and tables ---- */
.pg.lg .ar-hd h1{max-width:16em;}
.pg .legal h2 .n{color:var(--green-2);font-variant-numeric:tabular-nums;}
.pg .legal p.cl{margin-bottom:12px;padding-left:28px;}
.pg .legal p.cl + p:not(.cl),.pg .legal p.cl + :is(ul,ol){margin-top:24px;}
.pg .legal code{padding:1px 5px;border-radius:4px;background:var(--canvas-2);color:var(--ink);font:500 .86em/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-wrap:anywhere;}
.pg .legal .lg-tbl{margin:8px 0 32px;border-radius:var(--r-m);background:#fff;box-shadow:0 0 0 1px var(--line);overflow-x:auto;}
.pg .legal table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;color:var(--ink-2);}
.pg .legal th{padding:12px 16px;background:var(--canvas-2);text-align:left;vertical-align:bottom;font-size:13px;line-height:18px;font-weight:500;color:var(--ink);}
.pg .legal td{padding:12px 16px;border-top:1px solid var(--line);vertical-align:top;}
.pg .legal td:first-child{color:var(--ink);}
@media (min-width:600px){.pg .legal td:first-child code{white-space:nowrap;overflow-wrap:normal;}}
/* phones: each row is a card, every value labelled by its column (data-label) */
@media (max-width:599px){
  .pg .legal .lg-tbl{border-radius:0;background:none;box-shadow:none;overflow:visible;}
  .pg .legal :is(table,tbody,tr,td){display:block;width:100%;}
  .pg .legal thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .pg .legal tr{margin:0 0 12px;padding:4px 16px;border-radius:var(--r-m);background:#fff;box-shadow:0 0 0 1px var(--line);}
  .pg .legal td{padding:10px 0;}
  .pg .legal td:first-child{border-top:0;}
  .pg .legal td::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:13px;line-height:18px;font-weight:500;color:var(--ink-2);}
}
.pg.lg .ar-au{white-space:nowrap;}

/* pause control for the moving logo strip and looping videos (WCAG 2.2.2): tapping the strip or the video pauses it;
   the button itself is hidden until a keyboard user tabs to it, like the skip link */
.logos .row,.pg-logos .row{position:relative;}
.mq-tg{position:absolute;right:var(--gut,24px);top:50%;transform:translateY(-50%);width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
  background:#fff;color:var(--ink,#14201B);font:500 13px/1 inherit;font-family:inherit;border-radius:999px;cursor:pointer;}
.mq-tg:focus-visible{width:auto;height:32px;padding:0 14px;margin:0;overflow:visible;clip:auto;clip-path:none;box-shadow:0 0 0 1px var(--line,#D8D7D0),0 4px 12px rgba(12,38,30,.12);outline:2px solid var(--green-2,#27604B);outline-offset:2px;z-index:2;}
.logos [data-m="marquee"],.pg-logos .mq{cursor:pointer;}
html.no-motion .track,.logos [data-m="marquee"]:hover .track,.pg-logos .mq:hover .track{animation-play-state:paused !important;}
@media (prefers-reduced-motion:reduce){.mq-tg{display:none;}.logos [data-m="marquee"],.pg-logos .mq{cursor:auto;}}
@media (max-height:520px){.ck{max-height:45vh;overflow-y:auto;}}
.pg .legal p code{white-space:nowrap;}