/* Organisations page, one offer and one form (owner review, 28 Sep 2026), built by src/content/organisations-plan.mjs;
   the industry pages share its parts and scale (sector-plan.mjs, 29 Sep 2026), with their own blocks at the end.
   Grounds alternate: the hero pale with the proof beneath it, the programme white, the manager's view pale, the
   partnerships forest, the sectors white, tailored learning pale, security white, the questions pale, the enquiry
   white. The team story's rules are prefixed tj-; its script is public/scripts/team-story.js. */
main:is([data-org-plan],[data-sector-plan]){--op-ink:#203432;--op-muted:#526b63;--op-line:#d3e0d6;--op-forest:#244140;--op-lime:#c1f99b;--op-cepol:#033b6d;--op-pale:#f3f7f3}

/* Hero: the proof beneath the two columns */
main:is([data-org-plan],[data-sector-plan]) .op-proof-wrap{padding-top:0}
main:is([data-org-plan],[data-sector-plan]) .op-proof{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:24px 64px;margin:56px 0 0;padding:29px 0 0;border-top:1px solid var(--op-line)}
main:is([data-org-plan],[data-sector-plan]) .op-proof>div{padding:0}
main:is([data-org-plan],[data-sector-plan]) .op-proof dt{margin:0 0 8px;font-size:12px;line-height:1.4;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-proof dd{display:grid;justify-items:start;gap:3px;margin:0}
main:is([data-org-plan],[data-sector-plan]) .op-proof strong{font-size:var(--ds-font-subtitle,20px);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-proof span{font-size:13px;line-height:1.5;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-proof a{margin-top:6px;font-size:14px;font-weight:600;color:var(--op-ink);text-underline-offset:4px}
/* Each column runs to the foot of the row, so the strip's links share a line (owner, 4 October 2026). */
main:is([data-org-plan],[data-sector-plan]) .op-proof>div{display:flex;flex-direction:column}
main:is([data-org-plan],[data-sector-plan]) .op-proof dd{flex:1;grid-template-rows:auto auto 1fr}
main:is([data-org-plan],[data-sector-plan]) .op-proof dd>a{align-self:end}
main:is([data-org-plan],[data-sector-plan]) .org-proof-cepol strong{color:var(--op-cepol)}

/* The team story: one case, eight people, drawn as one mark in the brand's judgement paths */
main:is([data-org-plan],[data-sector-plan]) .tj{--tj-muted:#a9c2b8;--tj-soft:#dbe8e1;--tj-teal:#27b996;--tj-lime:#c1f99b;position:relative;margin:0;width:100%;max-width:580px;justify-self:end;padding:22px 26px 18px;border-radius:18px;background:#244140;color:#fff}
main:is([data-org-plan],[data-sector-plan]) .tj p{margin:0}
main:is([data-org-plan],[data-sector-plan]) .tj-kicker{font-size:13px;line-height:1.4;color:var(--tj-muted)}
main:is([data-org-plan],[data-sector-plan]) .tj-case{max-width:24em;margin-top:6px;font-size:var(--ds-font-subtitle,20px);line-height:1.35;font-weight:600;letter-spacing:-.02em;color:#fff}
main:is([data-org-plan],[data-sector-plan]) .tj-sentence{display:inline-block;text-wrap:balance}
/* One case, eight judgements: paths that end on the decision bar escalate; the rest run out beneath it */
main:is([data-org-plan],[data-sector-plan]) .tj-stage{position:relative;margin-top:16px}
main:is([data-org-plan],[data-sector-plan]) .tj-map{display:block;width:100%;height:auto;overflow:visible}
/* A double click on the corner control selected the nearest word of the picture; the picture and its captions are not text to copy. */
main:is([data-org-plan],[data-sector-plan]) :is(.tj-map,.tj-steps){-webkit-user-select:none;user-select:none}
main:is([data-org-plan],[data-sector-plan]) .tj-esc{fill:none;stroke:var(--tj-teal);stroke-width:8;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
main:is([data-org-plan],[data-sector-plan]) .tj-cls{fill:none;stroke:rgba(238,245,240,.3);stroke-width:4;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
main:is([data-org-plan],[data-sector-plan]) :is(.tj-esc,.tj-cls).off{opacity:0}
main:is([data-org-plan],[data-sector-plan]) .tj-bar{fill:var(--tj-lime)}
main:is([data-org-plan],[data-sector-plan]) .tj-person{fill:var(--tj-soft)}
main:is([data-org-plan],[data-sector-plan]) .tj-person.cert{fill:var(--tj-lime)}
main:is([data-org-plan],[data-sector-plan]) .tj-dash{fill:var(--tj-lime)}
main:is([data-org-plan],[data-sector-plan]) .tj-report{fill:#244140;stroke:var(--tj-lime);stroke-width:1.8}
main:is([data-org-plan],[data-sector-plan]) .tj-report-front{fill:var(--tj-lime)}
main:is([data-org-plan],[data-sector-plan]) .tj-report-ink{fill:#244140}
main:is([data-org-plan],[data-sector-plan]) :is(.tj-person,.tj-dash,.tj-report,.tj-report-front){transform-box:fill-box;transform-origin:center}
main:is([data-org-plan],[data-sector-plan]) .tj-label{font:600 14px Inter,system-ui,sans-serif;fill:var(--tj-lime)}
main:is([data-org-plan],[data-sector-plan]) .tj-label-cls{fill:var(--tj-muted);font-weight:400}
/* The four steps, marked with the brand slant, one line each */
main:is([data-org-plan],[data-sector-plan]) .tj-steps{display:flex;align-items:flex-start;gap:14px;margin-top:12px;padding-right:28px}
/* The motion's control is the site's one (/styles/motion-control.css), in the figure's bottom-right corner. */
main:is([data-org-plan],[data-sector-plan]) .tj-marks{display:flex;flex:none;gap:4px;padding-top:5px}
main:is([data-org-plan],[data-sector-plan]) .tj-marks i{width:15px;height:11px;background:var(--tj-lime);clip-path:polygon(43.9% 0,100% 0,56.1% 100%,0 100%)}
main:is([data-org-plan],[data-sector-plan]) .tj-captions{display:grid;min-height:44px}
main:is([data-org-plan],[data-sector-plan]) .tj-caption{grid-area:1/1;font-size:14px;line-height:1.5;color:var(--tj-soft)}
main:is([data-org-plan],[data-sector-plan]) .tj-caption.off{opacity:0}
main:is([data-org-plan],[data-sector-plan]) .tj-caption b{margin-right:4px;font-weight:600;color:#fff}

/* How the annual programme works */
main:is([data-org-plan],[data-sector-plan]) .op-programme{padding:84px 0 76px;background:#fff}
main:is([data-org-plan],[data-sector-plan]) .op-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 72px;align-items:end;margin-bottom:44px}
main:is([data-org-plan],[data-sector-plan]) .op-head h2{margin:0;font-size:var(--ds-font-section);line-height:var(--ds-leading-heading);font-weight:600;letter-spacing:var(--ds-tracking-heading);color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-head p{max-width:34em;margin:0;font-size:var(--ds-font-body);line-height:var(--ds-leading-body);color:var(--op-muted)}
/* Three stages: a card each, led by a real visual (the example team check, the programme badges, the brand marks),
   with no rules above them. The homepage's organisations block names the same stages and offers in the same words. */
main:is([data-org-plan],[data-sector-plan]) .op-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:0;padding:0}
main:is([data-org-plan],[data-sector-plan]) .op-stage{display:flex;flex-direction:column;margin:0;border-radius:16px;background:var(--op-pale);overflow:hidden}
main:is([data-org-plan],[data-sector-plan]) .op-visual{display:flex;align-items:center;justify-content:center;gap:18px;min-height:168px;margin:10px 10px 0;padding:20px;border-radius:12px;background:#fff}
main:is([data-org-plan],[data-sector-plan]) .op-visual-assess{display:grid;align-content:center;justify-content:stretch;gap:10px}
main:is([data-org-plan],[data-sector-plan]) .op-visual-assess>p{margin:0;font-size:var(--ds-font-label);line-height:1.4;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-bars{display:grid;gap:9px;list-style:none;margin:0;padding:0}
main:is([data-org-plan],[data-sector-plan]) .op-bars li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:4px 8px;margin:0;font-size:13px;line-height:1.3;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-bars li:not(.op-priority) b{grid-column:3}
main:is([data-org-plan],[data-sector-plan]) .op-bars b{font-weight:600;font-variant-numeric:tabular-nums}
main:is([data-org-plan],[data-sector-plan]) .op-bars mark{padding:2px 8px;border-radius:999px;background:var(--op-lime);color:#193b30;font-size:12px;line-height:1.4;font-weight:600}
main:is([data-org-plan],[data-sector-plan]) .op-bars i{grid-column:1/-1;display:block;height:5px;border-radius:3px;background:#e1ebe4;overflow:hidden}
main:is([data-org-plan],[data-sector-plan]) .op-bars em{display:block;height:100%;border-radius:3px;background:#27b996;transform:scaleX(var(--w));transform-origin:left}
main:is([data-org-plan],[data-sector-plan]) .op-visual>span{display:grid;justify-items:center;gap:7px}
main:is([data-org-plan],[data-sector-plan]) .op-visual img{display:block;object-fit:contain}
main:is([data-org-plan],[data-sector-plan]) .op-visual small{font-size:var(--ds-font-label);line-height:1.3;font-weight:600;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-body{display:flex;flex:1;flex-direction:column;padding:22px 24px 24px}
main:is([data-org-plan],[data-sector-plan]) .op-num{margin:0;font-size:13px;line-height:1.4;color:var(--op-muted);font-variant-numeric:tabular-nums}
main:is([data-org-plan],[data-sector-plan]) .op-stage h3{margin:4px 0 4px;font-size:var(--ds-font-title);line-height:var(--ds-leading-heading);font-weight:600;letter-spacing:-.03em;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-purpose{margin:0 0 14px;font-size:var(--ds-font-body);line-height:1.45;font-weight:600;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-offers{display:grid;gap:8px;list-style:none;margin:0 0 18px;padding:0}
main:is([data-org-plan],[data-sector-plan]) .op-offers li{margin:0;font-size:15px;line-height:1.55;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-offers a{font-weight:600;color:var(--op-ink);text-decoration:none}
main:is([data-org-plan],[data-sector-plan]) .op-offers a:hover{text-decoration:underline;text-underline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) .op-stage-link{margin-top:auto;align-self:flex-start;font-weight:600;color:var(--op-ink);text-underline-offset:4px}
/* Icons from the approved set, on a small tile; no rules above the items */
main:is([data-org-plan],[data-sector-plan]) .op-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:#e7f0ea;color:var(--op-forest)}
main:is([data-org-plan],[data-sector-plan]) .op-record{display:flex;align-items:center;gap:14px;margin:36px 0 0;font-size:15px;line-height:1.6;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-record .op-icon{flex:none}
main:is([data-org-plan],[data-sector-plan]) .op-record strong{font-weight:600;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-amlr,main:is([data-org-plan],[data-sector-plan]) .op-programme .org-procurement-note{margin:20px 0 0;font-size:15px;line-height:1.6;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-amlr{margin-top:28px}
main:is([data-org-plan],[data-sector-plan]) .op-amlr a,main:is([data-org-plan],[data-sector-plan]) .op-programme .org-procurement-note a{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) :is(#live-development,#amlr-practice,#corporate-preview,#bespoke-learning,#content-licensing,#industry-directory,#supplier-review,#team-enquiry){scroll-margin-top:120px}

/* Learning partnerships in practice, on forest */
main:is([data-org-plan],[data-sector-plan]) .op-partners{padding:80px 0 76px;background:var(--op-forest)}
main:is([data-org-plan],[data-sector-plan]) .op-partners h2{color:#fff}
main:is([data-org-plan],[data-sector-plan]) .op-practice-line{margin:28px 0 0;font-size:15px;line-height:1.6;color:#c9dcd2}
main:is([data-org-plan],[data-sector-plan]) .op-practice-line a{font-weight:600;color:var(--op-lime);text-underline-offset:4px}

/* Training for your sector: a compact directory */
main:is([data-org-plan],[data-sector-plan]) #industry-directory{padding:72px 0;background:#fff}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:24px 64px;align-items:start;padding:0;background:none}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-intro{display:block;margin:0}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-intro h2{margin:0 0 12px;font-size:var(--ds-font-section);line-height:var(--ds-leading-heading);font-weight:600;letter-spacing:var(--ds-tracking-heading)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-intro p{margin:0;font-size:var(--ds-font-body);line-height:var(--ds-leading-body);color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px;border-top:1px solid var(--op-line)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link{position:relative;display:grid;gap:3px;min-height:0;margin:0;padding:15px 36px 15px 0;border:0;border-bottom:1px solid var(--op-line);border-radius:0;background:none;box-shadow:none;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link>svg{position:absolute;right:4px;top:50%;margin:0;transform:translateY(-50%)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link,main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link.sector-discovery-link--agency{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-auto-rows:auto;align-content:start;height:auto}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link>:is(h3,p){grid-column:1;grid-row:auto;min-height:0;height:auto;max-width:none}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-industry-name .brand-link__label{display:inline;min-height:0}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link.sector-discovery-link--agency{grid-column:1/-1;gap:3px;padding:15px 36px 15px 0;background:none;color:var(--op-cepol)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link.sector-discovery-link--agency:hover{background:none}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link.sector-discovery-link--agency h3{color:var(--op-cepol)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-industry-name{margin:0;font-size:var(--ds-font-body);line-height:1.35;font-weight:600;letter-spacing:-.01em;color:inherit}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-industry-name .brand-link__label{font:inherit;letter-spacing:inherit}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-industry-benefit{margin:0;font-size:15px;line-height:1.55;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link--agency{color:var(--op-cepol)}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link--agency .sector-industry-benefit{color:#40607e}
main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-link:hover .sector-industry-name{text-decoration:underline;text-underline-offset:4px}

/* Tailored learning, then our courses in your LMS on the same ground */
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning{padding-bottom:40px}
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning .org-bespoke-copy>a.text-link{display:inline-block;margin-top:8px;font-weight:600;color:var(--op-ink);text-underline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) .op-lms{padding:0 0 84px;background:var(--op-pale)}
main:is([data-org-plan],[data-sector-plan]) .op-lms-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:28px 72px;padding-top:64px}
main:is([data-org-plan],[data-sector-plan]) .op-lms-copy h2{margin:0 0 14px;font-size:var(--ds-font-section);line-height:var(--ds-leading-heading);font-weight:600;letter-spacing:var(--ds-tracking-heading);color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-lms-copy p{margin:0 0 14px;font-size:var(--ds-font-body);line-height:var(--ds-leading-body);color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-lms-copy a{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) .op-lms-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:0;padding:0}
main:is([data-org-plan],[data-sector-plan]) .op-lms-routes li{display:grid;align-content:start;gap:12px;margin:0}
main:is([data-org-plan],[data-sector-plan]) .op-lms-routes h3{margin:0;font-size:var(--ds-font-body);line-height:1.35;font-weight:600;letter-spacing:-.01em;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-lms-routes p{margin:0;font-size:15px;line-height:1.6;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-lms .ocl-scope{margin:32px 0 0;padding:0;border-top:1px solid var(--op-line);border-bottom:1px solid var(--op-line)}
main:is([data-org-plan],[data-sector-plan]) .op-lms .ocl-scope>summary{padding:18px 0;font-size:16px;font-weight:600;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-lms .ocl-scope>div{display:grid;gap:10px;padding:0 0 20px;font-size:15px;line-height:1.6;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-lms .ocl-scope p{margin:0}

/* Security and supplier review: the answers on show */
main:is([data-org-plan],[data-sector-plan]) #supplier-review{background:#fff}
main:is([data-org-plan],[data-sector-plan]) #supplier-review .op-icon,main:is([data-org-plan],[data-sector-plan]) .op-lms .op-icon{background:#e7f0ea}
main:is([data-org-plan],[data-sector-plan]) #supplier-review .procurement-intro a.text-link{display:inline-block;margin-top:8px;font-weight:600;color:var(--op-lime);text-underline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) .op-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 36px;align-content:start;margin:0}
main:is([data-org-plan],[data-sector-plan]) .op-facts>div{display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 16px;align-content:start}
main:is([data-org-plan],[data-sector-plan]) .op-facts .op-icon{grid-row:span 2}
main:is([data-org-plan],[data-sector-plan]) .op-facts dt{margin:8px 0 2px;font-size:var(--ds-font-body);line-height:1.35;font-weight:600;letter-spacing:-.01em;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-facts dd{margin:0;font-size:15px;line-height:1.6;color:var(--op-muted)}

/* One type scale for the page (owner, 29 Sep 2026), from the site's tokens (assets-tokens.css): section headings at
   the section size, section introductions at body size, card titles at the title or subtitle size, item titles at body
   size in 600, card and item text at 15px, labels at 13px, small print at 14px; weights 400 and 600 only. The blocks
   below come from shared stylesheets and are brought onto the same scale here. The product mock-ups (the manager's
   walkthrough, the tailored-learning example) keep their interface sizes; the example's title stays below the
   section heading. The FAQ and the enquiry form are shared across the site and keep its sizes. */
main:is([data-org-plan],[data-sector-plan]) :is(#organisation-flow-title,.op-partners h2,#org-bespoke-title,#supplier-review .procurement-intro h2){font-size:var(--ds-font-section)!important;line-height:var(--ds-leading-heading)!important;font-weight:600!important;letter-spacing:var(--ds-tracking-heading)!important}
main:is([data-org-plan],[data-sector-plan]) :is(#corporate-preview .org-intro,#bespoke-learning .org-intro,#supplier-review .procurement-intro>p){font-size:var(--ds-font-body)!important;line-height:var(--ds-leading-body)!important}
main:is([data-org-plan],[data-sector-plan]) #corporate-preview .org-portal-benefits strong{font-size:var(--ds-font-body)!important;line-height:1.35!important;font-weight:600!important}
main:is([data-org-plan],[data-sector-plan]) #corporate-preview .org-portal-benefits span{font-size:15px!important;line-height:1.6!important}
main:is([data-org-plan],[data-sector-plan]) :is(.op-partners .partner-card h3,#bespoke-learning .org-bespoke-routes h3){font-size:var(--ds-font-subtitle)!important;line-height:1.3!important;font-weight:600!important;letter-spacing:-.02em!important}
main:is([data-org-plan],[data-sector-plan]) :is(.op-partners .partner-copy p,#bespoke-learning .org-bespoke-routes p){font-size:15px!important;line-height:1.6!important}
main:is([data-org-plan],[data-sector-plan]) .op-partners .org-client-label{font-size:var(--ds-font-label)!important;font-weight:600!important}
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning .org-bespoke-note{font-size:var(--ds-font-support)!important}
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning .org-bespoke-case h3{font-size:28px!important;line-height:1.15!important;font-weight:600!important;letter-spacing:-.03em!important}
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning :is(.org-case-feedback strong,.org-case-steps strong){font-weight:600!important}
main:is([data-org-plan],[data-sector-plan]) .organisation-hero .org-eyebrow{font-size:var(--ds-font-label)!important;font-weight:600!important}
@media(max-width:700px){main:is([data-org-plan],[data-sector-plan]) #bespoke-learning .org-bespoke-case h3{font-size:24px!important}}

/* Industry pages on the same plan (sector-plan.mjs). Grounds: the hero pale with the proof beneath it, the topics
   white, the stages pale, tailored learning and the partnership forest, records and systems white, the questions pale,
   the enquiry white. The partner card draws as it does on the organisations page (corporate-editorial.css there). */
/* The hero at the organisations page's sizes: heading 40px to 66px, introduction 20px (18px to 1100px, 16px on
   phones), label 13px. */
main[data-sector-plan] .org-sector-kicker{margin:0 0 18px;font-size:var(--ds-font-label);line-height:1.5;font-weight:600}
main[data-sector-plan] .org-sector-hero h1{max-width:760px;margin:0;font-size:clamp(40px,4.4vw,56px);line-height:1.04;font-weight:600;letter-spacing:-.045em}
main[data-sector-plan] .org-sector-lead{max-width:620px;margin:26px 0 32px;font-size:20px;line-height:1.55}
main[data-sector-plan] .org-sector-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin:0}
main[data-sector-plan] .org-sector-actions>.text-link{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
/* Who the page is for, just under the lead. */
main[data-sector-plan] .org-sector-lead+.op-audience{max-width:620px;margin:-18px 0 30px;font-size:15px;line-height:1.5;color:var(--op-muted)}
main[data-sector-plan] .org-sector-split{align-items:center}
main[data-sector-plan] :is(.op-record,.op-amlr){max-width:none}
main[data-sector-plan] .op-topics{padding:84px 0 76px;background:#fff}
main[data-sector-plan] .op-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:0;padding:0}
main[data-sector-plan] .op-topic{display:flex;flex-direction:column;margin:0;padding:24px 24px 26px;border-radius:16px;background:var(--op-pale)}
main[data-sector-plan] .op-topic h3{margin:4px 0 6px;font-size:var(--ds-font-subtitle);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--op-ink)}
main[data-sector-plan] .op-topic-who{margin:0 0 16px;font-size:var(--ds-font-support);line-height:1.5;color:var(--op-muted)}
main[data-sector-plan] .op-topic .op-offers{margin:0}
/* A policy's lifecycle (insurance, 19 October 2026): its four stages in one numbered row, then the two responsibilities
   that run across them, each at half the width and marked rather than numbered. */
main[data-sector-plan] .op-topic-grid--lifecycle{grid-template-columns:repeat(4,minmax(0,1fr))}
main[data-sector-plan] .op-topic-grid--lifecycle .op-topic--across{grid-column:span 2}
main[data-sector-plan] .op-across{font-weight:600;color:var(--op-ink)}
main[data-sector-plan] .op-programme{background:var(--op-pale)}
main[data-sector-plan] .op-programme .op-stage{background:#fff}
main[data-sector-plan] .op-programme .op-visual{background:var(--op-pale)}
main[data-sector-plan] .op-practice .op-head p{color:#c9dcd2}
/* The workshop example on its own (design review, 18 October 2026): what it is beside its situation, task and output,
   on one white card. */
main[data-sector-plan] .op-workshop{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px 56px;margin:0;padding:36px 40px 38px;border-radius:16px;background:#fff}
main[data-sector-plan] .op-workshop-copy{display:flex;flex-direction:column;align-items:flex-start}
main[data-sector-plan] .op-workshop-label{display:block;margin:0 0 8px;font-size:var(--ds-font-label);line-height:1.4;font-weight:600;color:var(--op-muted)}
main[data-sector-plan] .op-workshop h3{margin:0 0 10px;font-size:var(--ds-font-subtitle);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--op-ink)}
main[data-sector-plan] .op-workshop-copy>p{margin:0 0 22px;font-size:15px;line-height:1.6;color:var(--op-muted)}
main[data-sector-plan] .op-workshop-copy>.text-link{margin-top:auto;font-weight:600;color:var(--op-ink);text-underline-offset:4px}
main[data-sector-plan] .op-workshop-steps{display:grid;gap:14px;align-content:start;list-style:none;margin:0;padding:0}
main[data-sector-plan] .op-workshop-steps li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;margin:0}
main[data-sector-plan] .op-workshop-steps .op-num{padding-top:1px}
main[data-sector-plan] .op-workshop-steps strong{display:block;font-size:15px;line-height:1.45;font-weight:600;color:var(--op-ink)}
main[data-sector-plan] .op-workshop-steps span:not(.op-num){display:block;font-size:15px;line-height:1.55;color:var(--op-muted)}
/* The exercise leads its section (crypto, 19 October 2026): its label and the workshop link along the top, then the
   file, the task and the written output side by side. */
main[data-sector-plan] .op-workshop--exercise{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 40px;padding:28px 40px 34px}
main[data-sector-plan] .op-workshop-head{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;padding-bottom:18px;border-bottom:1px solid var(--op-line)}
main[data-sector-plan] .op-workshop-head .op-workshop-label{margin:0}
main[data-sector-plan] .op-workshop-head>.text-link{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
main[data-sector-plan] .op-workshop--exercise .op-workshop-steps{display:contents}
main[data-sector-plan] .op-workshop--exercise .op-workshop-steps li{grid-template-columns:minmax(0,1fr);gap:8px;align-content:start}
main[data-sector-plan] .op-setup{padding:84px 0 76px;background:#fff}
main[data-sector-plan] .op-setup .op-head{margin-bottom:40px}
main[data-sector-plan] .op-facts dd a{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
@media(max-width:1100px){main[data-sector-plan] .org-sector-lead{font-size:18px}}
@media(max-width:1000px){main[data-sector-plan] .op-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}main[data-sector-plan] .op-topic-grid--lifecycle .op-topic--across{grid-column:auto}}
@media(max-width:600px){
 main[data-sector-plan] .org-sector-lead{margin-top:20px;font-size:16px;line-height:1.6}
 /* As on the organisations page: the button across the column, its link beneath on the left. */
 main[data-sector-plan] .org-sector-actions{flex-direction:column;align-items:stretch}
 main[data-sector-plan] .org-sector-actions>.btn{width:100%;justify-content:space-between}
 main[data-sector-plan] .org-sector-actions>.text-link{align-self:flex-start}
}
@media(max-width:760px){
 main[data-sector-plan] :is(.op-topics,.op-setup){padding:56px 0 52px}
}

/* The enquiry closes the page on white */
main:is([data-org-plan],[data-sector-plan]) #team-enquiry{background:#fff}

@media(max-width:1000px){
 main:is([data-org-plan],[data-sector-plan]) .op-stages{grid-template-columns:minmax(0,1fr);gap:18px}
 main:is([data-org-plan],[data-sector-plan]) .op-head{grid-template-columns:minmax(0,1fr);align-items:start}
 main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-panel{grid-template-columns:minmax(0,1fr)}
 main:is([data-org-plan],[data-sector-plan]) .op-lms-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
 main:is([data-org-plan],[data-sector-plan]) .op-proof{grid-template-columns:minmax(0,1fr);gap:22px;margin-top:36px;padding-top:25px}
 main:is([data-org-plan],[data-sector-plan]) .op-programme,main:is([data-org-plan],[data-sector-plan]) .op-partners{padding:56px 0 52px}
 main:is([data-org-plan],[data-sector-plan]) .op-record{align-items:flex-start}
 main:is([data-org-plan],[data-sector-plan]) #industry-directory{padding:52px 0}
 main:is([data-org-plan],[data-sector-plan]) #industry-directory .sector-discovery-options{grid-template-columns:minmax(0,1fr)}
 main:is([data-org-plan],[data-sector-plan]) .op-lms{padding-bottom:56px}
 main:is([data-org-plan],[data-sector-plan]) .op-lms-routes{grid-template-columns:minmax(0,1fr);gap:20px}
 main:is([data-org-plan],[data-sector-plan]) .op-facts{grid-template-columns:minmax(0,1fr);gap:18px}
}
/* The team story's own breakpoints */
@media(max-width:1000px){main:is([data-org-plan],[data-sector-plan]) .tj{justify-self:start}}
@media(max-width:760px){
 main:is([data-org-plan],[data-sector-plan]) .tj{padding:18px 18px 14px}
 main:is([data-org-plan],[data-sector-plan]) .tj-case{font-size:17px}
   main:is([data-org-plan],[data-sector-plan]) .tj-caption{font-size:13.5px}
 main:is([data-org-plan],[data-sector-plan]) .tj-label{font-size:21px}
}
@media(forced-colors:active){main:is([data-org-plan],[data-sector-plan]) :is(.tj-esc,.tj-out){stroke:CanvasText}main:is([data-org-plan],[data-sector-plan]) .tj-bar{fill:CanvasText}}
/* Lines of about 75 characters (audit, 29 September 2026): the training record line ran to 160 at 1440px. */
main:is([data-org-plan],[data-sector-plan]) .op-record{align-items:flex-start}
main:is([data-org-plan],[data-sector-plan]) .op-record>span:not(.op-icon){max-width:40em}
main:is([data-org-plan],[data-sector-plan]) #bespoke-learning .org-bespoke-routes p{max-width:38em}
main[data-org-plan] #content-licensing .ocl-scope p{max-width:38em}
/* The hero on a laptop (audit, 29 September 2026): at 1280 x 720 the lime button shows without scrolling. The space
   above and below the headline tightens; the parent link keeps a 32px target, above the 24px minimum. */
@media(min-width:1025px){
 main:is([data-org-plan],[data-sector-plan]) [data-page-navigation-hero]{padding-top:16px!important}
 main:is([data-org-plan],[data-sector-plan]) .page-navigation{margin-bottom:12px}
 main:is([data-org-plan],[data-sector-plan]) .page-navigation>a{min-height:32px}
 main[data-org-plan] .organisation-hero .org-eyebrow{margin-bottom:12px}
 main[data-org-plan] .organisation-hero-copy .lead{margin:20px 0 24px}
 main[data-sector-plan] .org-sector-kicker{margin-bottom:12px}
 main[data-sector-plan] .org-sector-lead{margin:20px 0 24px}
 main[data-sector-plan] .org-sector-lead+.op-audience{margin:-12px 0 24px}
}

/* A content-licensing block in its own section already has the section's top padding; the grid's own 64px doubled it
   into a 128px band (owner, 2 October 2026: whitespace audit of the organisations page). */
main:is([data-org-plan],[data-sector-plan]) .section.op-lms .op-lms-grid{padding-top:0}
/* Phones stack the three stage cards, so their pictures no longer need one shared height. */
@media(max-width:760px){main:is([data-org-plan],[data-sector-plan]) .op-visual{min-height:0}}

/* A partner's public quote inside its story card (BPO & outsourcing, design review 17 October 2026): the card's ink,
   with the brand slant the scene's answer uses. Not the site's large .partner-quote: this one belongs to the card. */
main[data-sector-plan] .op-client .op-quote{position:relative;margin:0 0 22px;padding:0 0 0 24px;font-size:17px;line-height:1.45;font-weight:600;letter-spacing:-.012em;color:var(--op-ink);text-wrap:pretty}
main[data-sector-plan] .op-client .op-quote::before{content:"";position:absolute;left:0;top:.2em;width:13px;height:18px;background:#27b996;clip-path:polygon(40% 3%,95% 3%,60% 97%,5% 97%)}
main[data-sector-plan] .op-client .op-quote footer{display:grid;gap:2px;margin-top:10px;font-size:13px;line-height:1.45;font-weight:400;letter-spacing:0;color:var(--op-muted)}
main[data-sector-plan] .op-client .op-quote footer strong{font-weight:600;color:var(--op-ink)}

/* Phones (design review, 17 October 2026). The quote link's landing on the form is shared with every sector page
   (organisation-sectors.css). */
@media(max-width:760px){
 /* The proof row: CEPOL across, the accreditation and the rating side by side. */
 main[data-sector-plan] .op-proof{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 20px}
 main[data-sector-plan] .op-proof>.org-proof-cepol{grid-column:1/-1}
 /* The stage pictures, a little tighter. */
 main[data-sector-plan] .op-programme .op-visual{margin:8px 8px 0;padding:14px 16px}
 main[data-sector-plan] .op-visual-certify img{width:44px;height:44px}
}
/* Small phones (design review, 17 October 2026): who the page is for follows the buttons, so the quote button shows
   on the first screen at 360 x 740 too. Desktop keeps it under the lead. */
@media(max-width:600px){
 main[data-sector-plan] .org-sector-hero-copy{display:flex;flex-direction:column}
 main[data-sector-plan] .org-sector-lead+.op-audience{order:1;margin:22px 0 0}
}
/* The hero's rhythm where the screen has room (owner, 17 October 2026: "too dense with little space between lines").
   The tight spacing above is for short laptop screens such as 1280 x 720, where the quote button must show without
   scrolling; on taller screens the blocks get their air back: 28px from the back link, 16px from the label to the
   headline, 24px to the lead, 18px to who the page is for and 32px to the buttons. */
@media(min-width:1025px) and (min-height:801px){
 main[data-sector-plan] .page-navigation{margin-bottom:28px}
 main[data-sector-plan] .org-sector-kicker{margin-bottom:16px}
 main[data-sector-plan] .org-sector-lead{margin:24px 0 18px}
 main[data-sector-plan] .org-sector-lead+.op-audience{margin:0 0 32px}
}

/* The partner's story beside the proof (design review, 18 October 2026): one white card on the hero's ground, its photo
   beside the work in one line, the partner's public quote and the story. */
main[data-sector-plan] .op-client-wrap{padding-top:40px}
main[data-sector-plan] .op-client{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);margin:0;border-radius:16px;overflow:hidden;background:#fff}
main[data-sector-plan] .op-client-photo{display:block;width:100%;height:100%;min-height:270px;object-fit:cover;object-position:center 38%}
main[data-sector-plan] .op-client-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:34px 44px 36px}
main[data-sector-plan] .op-client-label{margin:0 0 8px;font-size:var(--ds-font-label);line-height:1.4;font-weight:600;color:var(--op-muted)}
main[data-sector-plan] .op-client-title{margin:0 0 8px;font-size:var(--ds-font-subtitle);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:var(--op-ink)}
main[data-sector-plan] .op-client-line{margin:0 0 20px;font-size:15px;line-height:1.6;color:var(--op-muted)}
main[data-sector-plan] .op-client-copy>.text-link{font-weight:600;color:var(--op-ink);text-underline-offset:4px}
/* A practitioner instead of a client story (banking, 18 October 2026): their portrait in a narrow column, their
   published role, then what they bring in the card's ink. */
main[data-sector-plan] .op-client--person{grid-template-columns:260px minmax(0,1fr)}
main[data-sector-plan] .op-client--person .op-client-photo{min-height:300px;object-position:center 18%}
main[data-sector-plan] .op-client--person .op-client-line{margin-bottom:12px}
main[data-sector-plan] .op-client-text{max-width:36em;margin:0 0 22px;font-size:16px;line-height:1.55;color:var(--op-ink)}
/* The sector's own programme in place of a story (crypto, 19 October 2026): its badge and three facts on forest in a
   narrow column, the copy beside them, its entry boundary last before the link. */
main[data-sector-plan] .op-client--programme{grid-template-columns:300px minmax(0,1fr)}
main[data-sector-plan] .op-client-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:32px 24px;background:var(--op-forest)}
main[data-sector-plan] .op-client-panel img{display:block;width:104px;height:104px;object-fit:contain}
main[data-sector-plan] .op-client-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;margin:0;padding:0;list-style:none;text-align:center}
main[data-sector-plan] .op-client-facts li{display:grid;align-content:start;gap:2px;margin:0}
main[data-sector-plan] .op-client-facts strong{font-size:var(--ds-font-subtitle);line-height:1.2;font-weight:600;letter-spacing:-.02em;color:var(--op-lime);font-variant-numeric:tabular-nums}
main[data-sector-plan] .op-client-facts span{font-size:13px;line-height:1.35;color:#c9dcd2}
main[data-sector-plan] .op-client--programme .op-client-line{margin-bottom:12px}
main[data-sector-plan] .op-client--programme .op-client-text{margin-bottom:12px}
main[data-sector-plan] .op-client-note{margin:0 0 22px;font-size:14px;line-height:1.55;color:var(--op-muted)}

/* The quote again at the foot of the topics (conversion review, 18 October 2026): a text link, so the page keeps one
   lime action, at the site's one action size for arrow links (brand-links.css); its own line marks it out. */
main[data-sector-plan] .op-next{margin:32px 0 0}
main[data-sector-plan] .op-next a{color:var(--op-ink);text-underline-offset:4px}

/* A part that folds on a phone: the FAQ's row and angled bars, under the plan's own names. Screens with room show
   the open copy instead (sector-plan.mjs, organisation-parts.mjs). */
main:is([data-org-plan],[data-sector-plan]) :is(.op-topic-folds,.op-stage-fold){display:none}
main:is([data-org-plan],[data-sector-plan]) .op-fold>summary{display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;gap:16px;min-height:56px;padding:16px 0;padding-right:0!important;cursor:pointer;list-style:none;color:var(--op-ink)}
main:is([data-org-plan],[data-sector-plan]) .op-fold>summary::-webkit-details-marker{display:none}
/* The site's own disclosure marker (body[data-page] details>summary::after) would add a second icon, and it keeps
   44px clear for that marker; the plan's icon ends the row. */
main:is([data-org-plan],[data-sector-plan]) .op-fold>summary::before,main:is([data-org-plan],[data-sector-plan]) .op-fold>summary::after{content:none!important;display:none!important}
main:is([data-org-plan],[data-sector-plan]) .op-fold>summary::marker{content:''}
main:is([data-org-plan],[data-sector-plan]) .op-fold>summary:focus-visible{outline:2px solid currentColor;outline-offset:4px}
main:is([data-org-plan],[data-sector-plan]) .op-fold-label{display:grid;gap:3px;min-width:0}
main:is([data-org-plan],[data-sector-plan]) .op-fold-label strong{font-size:17px;line-height:1.35;font-weight:600;letter-spacing:-.01em}
main:is([data-org-plan],[data-sector-plan]) .op-fold-label span{font-size:14px;line-height:1.45;font-weight:400;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-fold-icon{display:block;width:24px;height:24px}
main:is([data-org-plan],[data-sector-plan]) .op-fold-vertical{transform:rotate(90deg);transform-origin:12px 12px;transition:transform 360ms cubic-bezier(.22,.7,.25,1),opacity 160ms ease-out}
main:is([data-org-plan],[data-sector-plan]) .op-fold[open]>summary .op-fold-vertical{transform:rotate(270deg);opacity:0;transition:transform 360ms cubic-bezier(.22,.7,.25,1),opacity 140ms ease-out 190ms}
.motion-off main:is([data-org-plan],[data-sector-plan]) .op-fold-vertical{transition:none}
@media(prefers-reduced-motion:reduce){main:is([data-org-plan],[data-sector-plan]) .op-fold-vertical{transition:none}}
main:is([data-org-plan],[data-sector-plan]) .op-fold-offers{display:grid;gap:8px;list-style:none;margin:0;padding:0 0 18px}
main:is([data-org-plan],[data-sector-plan]) .op-fold-offers li{margin:0;font-size:15px;line-height:1.55;color:var(--op-muted)}
main:is([data-org-plan],[data-sector-plan]) .op-fold-offers a{font-weight:600;color:var(--op-ink);text-decoration:none}

@media(max-width:760px){
 main[data-sector-plan] .op-client-wrap{padding-top:28px}
 main[data-sector-plan] .op-client{grid-template-columns:minmax(0,1fr)}
 main[data-sector-plan] .op-client-photo{height:200px;min-height:0}
 main[data-sector-plan] .op-client--person{grid-template-columns:minmax(0,1fr)}
 main[data-sector-plan] .op-client--person .op-client-photo{min-height:0;object-position:center 12%}
 main[data-sector-plan] .op-client-copy{padding:20px 20px 22px}
 main[data-sector-plan] .op-client--programme{grid-template-columns:minmax(0,1fr)}
 main[data-sector-plan] .op-client-panel{flex-direction:row;justify-content:flex-start;gap:20px;padding:18px 20px}
 main[data-sector-plan] .op-client-panel img{width:64px;height:64px}
 main[data-sector-plan] .op-client-facts{gap:10px;text-align:left}
 /* The six areas fold to their titles and who each is for, so all six can be scanned at once; each opens on its tasks. */
 main[data-sector-plan] .op-topic-grid{display:none}
 main[data-sector-plan] .op-topic-folds{display:block;list-style:none;margin:0;padding:0;border-top:1px solid var(--op-line)}
 main[data-sector-plan] .op-topic-folds>li{margin:0;border-bottom:1px solid var(--op-line)}
 /* Each stage on the industry pages: its purpose and one action, with what is included folded; the badges and marks
    repeat the names below them, so only the example team report keeps its picture. The organisations page keeps its
    stages as they are until the owner decides. */
 main[data-sector-plan] .op-stage .op-offers{display:none}
 main[data-sector-plan] .op-stage-fold{display:block;margin:0 0 18px;border-top:1px solid var(--op-line);border-bottom:1px solid var(--op-line)}
 main[data-sector-plan] .op-stage-fold>summary{min-height:48px;padding:12px 0}
 main[data-sector-plan] .op-stage-fold .op-fold-label{font-size:15px;line-height:1.4;font-weight:600}
 main[data-sector-plan] :is(.op-visual-certify,.op-visual-develop){display:none}
 main[data-sector-plan] .op-purpose{margin-bottom:12px}
 /* The workshop: what it is, then its steps, then the link. */
 main[data-sector-plan] .op-workshop{display:flex;flex-direction:column;gap:0;padding:24px 22px 26px}
 main[data-sector-plan] .op-workshop-copy{display:contents}
 main[data-sector-plan] .op-workshop-steps{order:1;margin:0 0 22px}
 main[data-sector-plan] .op-workshop-copy>.text-link{order:2;margin-top:0;align-self:flex-start}
 /* The exercise: its label, its steps, then the link. */
 main[data-sector-plan] .op-workshop--exercise .op-workshop-head{display:contents}
 main[data-sector-plan] .op-workshop--exercise .op-workshop-label{order:0;margin:0 0 16px}
 main[data-sector-plan] .op-workshop--exercise .op-workshop-steps{display:grid}
 main[data-sector-plan] .op-workshop--exercise .op-workshop-steps li{grid-template-columns:28px minmax(0,1fr);gap:10px}
 main[data-sector-plan] .op-workshop--exercise .op-workshop-head>.text-link{order:2;align-self:flex-start}
}