body.playroom.service-page{padding-bottom:0;background:var(--lime)}
.playroom.service-page main::after{display:none}
.playroom .service-hero{position:relative;background:var(--lime);margin-top:-76px;padding:155px 0 110px;overflow:hidden}
.playroom .service-hero::after{content:"";position:absolute;inset:auto 0 0;height:85px;background:var(--wash);-webkit-mask:url('/assets/inner-hero-edge.svg') center bottom/100% 100% no-repeat;mask:url('/assets/inner-hero-edge.svg') center bottom/100% 100% no-repeat}
.playroom .service-hero-inner{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:55px;position:relative;z-index:1}
.playroom .service-hero h1{font-size:clamp(3.3rem,6.3vw,5.5rem);font-weight:650;line-height:1.02;margin:0}
.playroom .service-intro{font-size:1.1rem;line-height:1.75;max-width:47ch;color:var(--ink);margin:28px 0}
.playroom .service-hero figure{margin:0}
.playroom .service-hero img{display:block;width:100%;height:auto;mix-blend-mode:normal}
.playroom .service-section{padding-block:85px}
.playroom .service-section h2,.playroom .service-process h2,.playroom .service-next h2{font-size:clamp(2.3rem,4vw,3.6rem);font-weight:650;line-height:1.08;margin:0 0 25px}
.playroom .service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin-top:42px}
.playroom .service-grid article{border-top:1px solid var(--ink);padding-top:23px}
.playroom .service-grid h3,.playroom .service-process h3{font-size:1.7rem;line-height:1.17;font-weight:600;margin:0 0 18px}
.playroom .service-grid p,.playroom .service-process p,.playroom .service-next p{font-size:1rem;line-height:1.8;color:var(--muted);margin:0}
.playroom .service-process{display:grid;grid-template-columns:1fr 1.1fr;gap:90px;padding-block:35px 85px}
.playroom .service-process ol{counter-reset:steps;list-style:none;padding:0;margin:0}
.playroom .service-process li{position:relative;padding:0 0 30px 55px;counter-increment:steps}
.playroom .service-process li::before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:1px;font-size:.9rem;border:1px solid var(--ink);width:34px;height:34px;border-radius:50%;display:grid;place-items:center}
.playroom .service-process li+li{padding-top:30px;border-top:1px solid #17171426}
.playroom .service-process li+li::before{top:31px}
.playroom .service-next{text-align:center;border-top:1px solid #17171426;padding-block:70px 95px}
.playroom .service-next p{max-width:55ch;margin:0 auto 28px}
html[data-palette="navy"] .playroom .service-hero{background:#15243a;color:#d4b77c}
html[data-palette="navy"] .playroom .service-intro{color:#f6f2e9}
html[data-palette="navy"] .playroom .service-hero :focus-visible{outline-color:#d4b77c}
@media(max-width:800px){.playroom .service-hero{padding:112px 0 65px}.playroom .service-hero-inner{grid-template-columns:minmax(0,1fr);gap:18px}.playroom .service-hero h1{font-size:clamp(3rem,10vw,4.8rem)}.playroom .service-hero figure{max-width:360px;width:85%;margin:auto}.playroom .service-hero::after{height:50px}.playroom .service-section{padding-block:55px}.playroom .service-grid{grid-template-columns:1fr;gap:35px;margin-top:35px}.playroom .service-process{grid-template-columns:1fr;gap:35px;padding-block:10px 55px}.playroom .service-next{padding-block:50px 70px}}

/* Five connected leadership shifts, with acceleration at the centre. */
.playroom .leadership-framework{padding:35px 0 110px;background:var(--wash)}
.playroom .leadership-framework h2{text-align:center;font-size:clamp(2.6rem,5vw,4.6rem);line-height:1.04;margin:0 0 65px;font-weight:650}
.playroom .framework-map{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr) minmax(0,1fr);grid-template-areas:"impact core operating" "people core expectations";gap:90px 34px;position:relative;isolation:isolate;align-items:start;padding-block:38px}
.playroom .framework-connections{position:absolute;inset:0;width:100%;height:100%;z-index:-1;overflow:visible;fill:none;stroke:var(--ink);stroke-width:1.5}
.playroom .framework-connections circle{fill:var(--wash)}
.playroom .framework-orbit{stroke-dasharray:2 9;opacity:.28}
.playroom .framework-pillar{min-width:0;background:var(--wash);position:relative;padding:22px 12px 8px 0;border-top:1px solid var(--ink)}
.playroom .framework-pillar::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--ink)}
.playroom .framework-label{display:inline-block;font-family:var(--sans);font-size:.875rem;line-height:1.4;letter-spacing:0;font-weight:600;padding:6px 13px;border:1px solid color-mix(in srgb,var(--ink) 24%,transparent);border-radius:100px;margin-bottom:20px}
.playroom .framework-pillar h3{font-size:clamp(1.7rem,2.5vw,2.15rem);line-height:1.09;letter-spacing:-.045em;margin:0 0 22px;font-weight:650;text-wrap:balance}
.playroom .framework-shift{margin:0;font-size:1rem;line-height:1.65;letter-spacing:0}
.playroom .framework-from{display:block;color:var(--muted);margin-bottom:9px}
.playroom .framework-to{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;color:var(--ink);font-weight:500}
.playroom .framework-to>span:first-child{font-size:1.15rem;line-height:1.4}
.playroom .framework-impact{grid-area:impact}
.playroom .framework-operating{grid-area:operating}
.playroom .framework-people{grid-area:people}
.playroom .framework-expectations{grid-area:expectations}
.playroom .framework-core{grid-area:core;align-self:center;text-align:center;background:var(--ink);color:var(--wash);border:0;border-radius:45% 45% 42% 42% / 15% 15% 17% 17%;padding:36px 28px 40px;box-shadow:0 0 0 9px var(--wash),0 0 0 10px color-mix(in srgb,var(--ink) 25%,transparent)}
.playroom .framework-core::before{display:none}
.playroom .framework-core .framework-label{color:var(--wash);border-color:color-mix(in srgb,var(--wash) 35%,transparent);margin:0 0 24px}
.playroom .framework-core h3{font-size:clamp(1.65rem,2.4vw,2rem);margin-bottom:22px}
.playroom .framework-core .framework-from{color:var(--wash);opacity:.72}
.playroom .framework-core .framework-to{display:flex;flex-direction:column;gap:4px;color:var(--wash)}
.playroom .framework-core .framework-to>span:first-child{transform:rotate(90deg);align-self:center}
@media(max-width:1100px){.playroom .framework-map{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"impact operating" "core core" "people expectations";gap:52px 45px;padding-block:0}.playroom .framework-connections{display:none}.playroom .framework-core{width:min(430px,100%);justify-self:center}.playroom .framework-core::before,.playroom .framework-core::after{content:"";display:block;position:absolute;left:50%;top:auto;bottom:calc(100% + 10px);width:1px;height:32px;border-radius:0;background:var(--ink)}.playroom .framework-core::after{bottom:auto;top:calc(100% + 10px)}.playroom .leadership-framework{padding-bottom:85px}}
@media(max-width:600px){.playroom .leadership-framework{padding-block:20px 65px}.playroom .leadership-framework h2{text-align:left;margin-bottom:42px}.playroom .framework-map{grid-template-columns:minmax(0,1fr);grid-template-areas:"core" "impact" "operating" "people" "expectations";gap:32px}.playroom .framework-core{width:min(360px,100%);padding:32px 25px}.playroom .framework-core::before,.playroom .framework-core::after{display:none}.playroom .framework-pillar:not(.framework-core){padding:20px 0 0}.playroom .framework-label{margin-bottom:15px}.playroom .framework-pillar h3{font-size:1.85rem;margin-bottom:18px}}

/* Enter MJFW through a recognisable leadership situation. */
.playroom .mentoring-situations{margin-top:36px;border-bottom:1px solid var(--line)}
.playroom .mentoring-situation{border-top:1px solid var(--line)}
.playroom .mentoring-situation summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:27px 0;cursor:pointer;font-family:var(--heading);font-size:clamp(1.5rem,2.5vw,2rem);font-weight:600;line-height:1.2;letter-spacing:-.03em}
.playroom .mentoring-situation summary::-webkit-details-marker{display:none}
.playroom .mentoring-situation summary:hover>span:first-child{text-decoration:underline;text-underline-offset:5px}
.playroom .mentoring-situation summary:focus-visible{outline:2px solid var(--ink);outline-offset:5px}
.playroom .situation-toggle{flex:none;width:30px;height:30px;border:1px solid currentColor;border-radius:50%;position:relative}
.playroom .situation-toggle::before,.playroom .situation-toggle::after{content:"";position:absolute;width:12px;height:1px;background:currentColor;left:8px;top:14px}
.playroom .situation-toggle::after{transform:rotate(90deg)}
.playroom details[open] .situation-toggle::after{transform:scaleY(0);opacity:0}
.playroom .situation-content{display:grid;grid-template-columns:1.5fr 1fr;gap:55px;padding:5px 0 35px}
.playroom .situation-content h3{font-size:1.5rem;line-height:1.25;margin:0 0 18px}
.playroom .situation-content p{font-size:1rem;line-height:1.75;color:var(--muted);margin:0}
.playroom .situation-content p+p{margin-top:15px;color:var(--ink)}
.playroom .situation-evidence{border-left:1px solid var(--line);padding-left:28px}
.playroom .situation-evidence h4{font-size:1.2rem;margin:0 0 15px}
.playroom #starting-point,.playroom #framework-heading{scroll-margin-top:110px}
@media(max-width:700px){.playroom .situation-content{grid-template-columns:minmax(0,1fr);gap:25px}.playroom .situation-evidence{padding-left:20px}.playroom .mentoring-situation summary{padding-block:24px}}

.playroom .framework-name{background:var(--lime);border-radius:5px;text-decoration:none;padding:0 .08em;box-decoration-break:clone;-webkit-box-decoration-break:clone}

@media(min-width:801px){.playroom[data-page="mentoring"] .service-hero h1{font-size:5rem}}
