:root{--forest:#31452E;}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;line-height:1.58;}a{color:inherit;text-decoration:none}body,main{position:relative}main{overflow:hidden;isolation:isolate}main:before,main:after{content:"";position:absolute;z-index:-2;pointer-events:none;border-radius:50%}main:before{width:76vw;height:30vw;right:-35vw;top:9vh;transform:rotate(-12deg);}main:after{width:90vw;height:24vw;left:-42vw;top:55%;transform:rotate(8deg);}
header{margin:auto;display:flex;justify-content:space-between;align-items:center;gap:30px;}.brand{letter-spacing:.28em;font-family:Georgia,serif;font-size:20px;}.brand small{display:block;font:9px Arial,sans-serif;letter-spacing:.3em;margin-top:5px}nav{display:flex;gap:28px;font-size:16px;white-space:nowrap;}.wrap{max-width:1440px;margin:auto;padding:76px 6%}.eyebrow{letter-spacing:.25em;text-transform:uppercase;font-size:11px;}h1,h2,h3{font-family:Georgia,serif;font-weight:400;line-height:1.08;}h1{font-size:clamp(34px,4.1vw,58px);margin:.22em 0}h2,.expertise-title{font-size:clamp(27px,3.1vw,42px);margin:.2em 0 .65em}h3{font-size:21px}.lead{font-size:20px;max-width:680px}.btn{display:inline-block;margin-top:25px;padding:13px 28px;border-radius:30px;letter-spacing:.2em;font-size:12px;}.split{display:grid;grid-template-columns:1fr 1fr;gap:90px}.pagehead{padding-bottom:58px;}.prose{max-width:850px;font-size:20px}.tags{color:var(--burg);letter-spacing:.12em;text-transform:uppercase;font-size:11px}footer{padding:42px 6%;color:var(--navy);display:flex;justify-content:space-between;}.home-body-size{font-size:16px}
/* INTERIOR THREADS: the JS draws one SVG wave through the exact centre of each real node. */
.thread-list,.steps,.expertise-list{padding-left:48px;}.expertise-list{list-style:none;margin:1.5rem 0 2rem}.thread-list h2,.steps h2{margin-left:-48px}.thread-node{margin-top:30px}.step{margin:0 0 34px}.expertise-list li{margin:.5rem 0;line-height:1.8}.live-thread-rail{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}.live-thread-path{fill:none;stroke-width:1.1;vector-effect:non-scaling-stroke;stroke-linecap:round;}.live-thread-dot{position:absolute;width:12px;height:12px;border-radius:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:none;}.live-thread-dot.c0{background:var(--burg)}.live-thread-dot.c1{background:var(--forest)}.live-thread-dot.c2{background:var(--gold)}.live-thread-dot.c3{background:var(--navy)}
/* quiet page curves */
.threaded-section,.pagehead,.case-section{position:relative;isolation:isolate}.threaded-section:after,.pagehead:after,.case-section:after{content:"";position:absolute;pointer-events:none;z-index:-1;width:64%;height:120px;border-radius:50%;border-top:1px solid rgba(173,123,40,.13);left:-20%;bottom:-38px;transform:rotate(-3deg)}
/* ABOUT */
.about-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);gap:72px;align-items:center;margin-top:34px}.about-layout .prose{max-width:720px}.about-photo{margin:0;position:relative;overflow:hidden;border-radius:46% 8% 42% 12% / 18% 10% 20% 13%;min-height:440px;}.about-photo img{display:block;width:100%;height:100%;min-height:440px;object-fit:cover;object-position:52% center;filter:saturate(.86) contrast(.98)}
/* CASE STUDIES: deliberate empty image areas for future photography. */
.case-section{overflow:hidden}.case-section .wrap{position:relative;z-index:1}.case-section .split{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}.case-photo-space{height:240px;margin:28px 0 0;border:1px solid rgba(11,43,76,.12);border-radius:50%;position:relative;overflow:hidden;}.case-photo-space:after{content:"PHOTO";position:absolute;inset:0;display:grid;place-items:center;font-size:10px;letter-spacing:.25em;}.case-section:nth-of-type(even) .case-photo-space{border-radius:48% 52% 46% 54% / 52% 46% 54% 48%}
/* CONTACT */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:70px}.contact form{display:grid;gap:14px;padding:22px;}input,textarea{padding:14px;border:1px solid #cfc7b8;font:inherit;}textarea{min-height:150px}button{border:0;cursor:pointer}
@media(max-width:1000px){nav{gap:16px;font-size:14px}}
@media(max-width:850px){.brand{font-size:15px}.wrap{padding:54px 7%}.split,.contact,.about-layout{grid-template-columns:1fr}.thread-list,.steps,.expertise-list{padding-left:42px}.thread-list h2,.steps h2{margin-left:-42px}.about-layout{gap:38px}.about-photo,.about-photo img{min-height:320px}.case-photo-space{height:210px}footer{display:block}main:before{width:120vw;height:62vw;right:-72vw}main:after{width:130vw;height:48vw;left:-76vw}}

/* 2026-09 olive palette rebuild — warm cream becomes the accent */

/* Cream now supplies the soft accent planes and curves. */
main:before{background:rgba(248,245,238,.34)}
main:after{background:rgba(248,245,238,.23)}

footer{border-top-color:rgba(248,245,238,.58)}
/* Interior thread nodes sit cleanly on olive or cream sections. */

.case-photo-space:after{color:rgba(11,43,76,.46)}

/* ============================================================
   RECREATED SITE — palette and flow matched to LOCKED hero art
   The hero image itself is untouched. 27 Sep 2026.
   ============================================================ */
:root{
  --paper:#FDFAF4;
  --paper-soft:#F8F2E8;
  --sage:#E4E3CB;
  --sage-soft:#EFEDD9;
  --ink:#343A3B;
  --navy:#263F4C;
  --olive:#5A603A;
  --burg:#751638;
  --gold:#B98531;
  --cream:#FDFAF4;
  --stone:#E9E0D2;
  --band:#EFEDD9;
  --slate:#3E4748;
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink)}
header{max-width:1500px;padding:25px 5% 18px;background:var(--paper);position:relative;z-index:10}
.brand{color:var(--navy)}
nav{color:var(--navy)}
nav a{position:relative;padding-bottom:5px}
nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--gold);transition:right .2s ease}
nav a:hover:after,nav a[aria-current="page"]:after{right:0}
main:before,main:after{background:rgba(228,227,203,.28)}
.band{background:var(--sage-soft)}
footer{background:var(--paper);border-top:1px solid rgba(90,96,58,.16)}
.btn{background:var(--olive);color:#fff;border:1px solid var(--olive)}
.btn:hover{background:transparent;color:var(--olive)}
h1,h2,h3{color:var(--navy)}
.eyebrow{color:var(--burg)}

/* HOME — the approved artwork is the hero field, not a card beside the copy. */
.home-main{overflow:hidden;background:var(--paper)}
.home-main:before,.home-main:after{display:none}

.integrated-home-copy .eyebrow{margin-bottom:12px;}
.integrated-home-copy h1{font-size:clamp(34px,3.05vw,51px);line-height:1.06;margin:.1em 0 .38em;color:var(--navy)}
.integrated-home-copy .lead{font-size:18px;line-height:1.45;color:var(--navy);margin:0 0 18px;max-width:540px}
.integrated-home-copy p:not(.lead){font-size:15px;line-height:1.58;margin:0 0 12px;max-width:555px}
.integrated-home-copy .btn{margin-top:10px;padding:11px 25px}

/* Internal pages carry the hero's cream, olive, brass and claret rather than a separate green site. */
.pagehead{padding-top:84px}
.threaded-section:after,.pagehead:after,.case-section:after{border-top-color:rgba(185,133,49,.23)}
.live-thread-path{stroke:var(--olive);stroke-opacity:.55}
.live-thread-dot{box-shadow:0 0 0 5px var(--paper)}
.band .live-thread-dot{box-shadow:0 0 0 5px var(--sage-soft)}
.case-photo-space{background:rgba(228,227,203,.38);border-color:rgba(90,96,58,.20)}
.contact form{background:var(--sage-soft)}
input,textarea{border-color:rgba(90,96,58,.28);background:rgba(253,250,244,.55)}
.about-photo{background:var(--sage-soft)}

@media(max-width:1120px){
  header{padding-left:4%;padding-right:4%}
  nav{gap:16px;font-size:13px}
  
  .integrated-home-copy h1{font-size:clamp(31px,3.4vw,43px)}
  .integrated-home-copy p:not(.lead){font-size:14px;line-height:1.5}
}
@media(max-width:850px){
  header{padding-bottom:12px}

  .integrated-home-copy h1{font-size:clamp(35px,9vw,49px)}
  .integrated-home-copy .lead{font-size:18px}
  .integrated-home-copy p:not(.lead){font-size:16px;line-height:1.62}
}

.integrated-home-copy h1{
  max-width:560px;
}

/* ============================================================
   CALM, PURPOSEFUL THREAD LANGUAGE
   Several fine strands can travel together, cross and diverge.
   Nodes are significant moments resting precisely on the
   dominant strand — never endpoints or flowchart connectors.
   ============================================================ */
.live-thread-rail,.live-thread-dot{display:none!important}
.threaded-section:after,.pagehead:after,.case-section:after{display:none!important}
.case-thread{display:none!important}

.thread-list,.steps,.expertise-list{position:relative}
.strand-field{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  z-index:0;
}
.strand{
  fill:none;
  vector-effect:non-scaling-stroke;

}
.strand.dominant{
  stroke:var(--olive);

}
.strand.companion-a{
  stroke:var(--navy);

}
.strand.companion-b{
  stroke:var(--olive);

}
.strand-node{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  z-index:3;
  pointer-events:none;
  box-shadow:0 0 0 4px var(--paper);
}
.band .strand-node{box-shadow:0 0 0 4px var(--sage-soft)}
.strand-node.n0{background:var(--burg)}
.strand-node.n1{background:var(--forest)}
.strand-node.n2{background:var(--gold)}

.thread-node,.step,.expertise-list li{position:relative;z-index:2}

/* Quiet strands on pages where there is no meaningful sequence of nodes.
   They drift through the composition rather than "connect" content. */
main{position:relative}
.ambient-strands{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
  overflow:visible;
}
.ambient-line{
  fill:none;
  vector-effect:non-scaling-stroke;
  
}
.ambient-line.a{stroke:var(--olive);stroke-width:.82px;stroke-opacity:.23}
.ambient-line.b{stroke:var(--navy);stroke-width:.65px;stroke-opacity:.15}
.ambient-line.c{stroke:var(--gold);stroke-width:.62px;stroke-opacity:.12}
main > section{position:relative;z-index:1}

@media(max-width:850px){
  .strand.dominant{stroke-width:.95px}
  .strand.companion-a,.strand.companion-b{stroke-width:.6px}
  .strand-node{width:9px;height:9px;box-shadow:0 0 0 3px var(--paper)}
  .band .strand-node{box-shadow:0 0 0 3px var(--sage-soft)}
  .ambient-strands{opacity:.7}
}

/* VISIBLE WHISPY REFINEMENT
   No SVG masks: the proven visible strands are retained.
   Fine companion strands are quieter, with round caps; geometry in
   script.js has been softened to remove abrupt lateral bends. */
.strand{
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
.strand.dominant{
  stroke-width:.95px !important;
  stroke-opacity:.68 !important;
}
.strand.companion-a{
  stroke-width:.60px !important;
  stroke-opacity:.21 !important;
}
.strand.companion-b{
  stroke-width:.56px !important;
  stroke-opacity:.16 !important;
}
.ambient-line{
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* WHEN TO BRING ME IN — deliberately uses the exact same .wrap.split,
   .thread-list, .steps, h2/h3 and paragraph system as HOW I WORK. */
.when-expertise-list{
  margin:0 0 24px;
  padding-left:20px;
}
.when-expertise-list li{
  margin:.45rem 0;
  line-height:1.65;
}

/* Case Studies introductory heading — match Home "Understanding the problem..." treatment */
.home-statement-match{
  font-family:Arial,sans-serif !important;
  font-size:18px !important;
  line-height:1.45 !important;
  font-style:italic !important;
  font-weight:400 !important;
}

/* INTERNAL PAGE MAIN HEADINGS — same size as Home
   "Understanding the problem. Shaping the solutions. Together." */
.pagehead h1{
  font-size:clamp(34px,4vw,64px) !important;
}

/* Requested headings — exact Home main-heading typography */

/* Requested headings — mirror Home h1 at every responsive breakpoint */
.home-heading-match{
  font-family:Georgia,serif !important;
  font-size:clamp(34px,3.05vw,51px) !important;
  line-height:1.06 !important;
  font-weight:400 !important;
  color:var(--navy) !important;
}

/* Same tablet override used by .integrated-home-copy h1 */
@media(max-width:1120px){
  .home-heading-match{
    font-size:clamp(31px,3.4vw,43px) !important;
  }
}

/* Same mobile override used by .integrated-home-copy h1 */
@media(max-width:850px){
  .home-heading-match{
    font-size:clamp(35px,9vw,49px) !important;
  }
}

/* ============================================================
   FIVE INTRODUCTORY STATEMENTS — TRUE VISUAL MATCH TO HOME H1
   Same font, same responsive size, same line-height, same text measure.
   ============================================================ */
.pagehead h1.home-heading-match,
h1.home-heading-match,
h2.home-heading-match,
h3.home-heading-match,
p.home-heading-match{
  font-family:Georgia,serif !important;
  font-size:clamp(34px,3.05vw,51px) !important;
  line-height:1.06 !important;
  font-weight:400 !important;
  color:var(--navy) !important;
  width:min(575px,39vw) !important;
  max-width:min(575px,39vw) !important;
  letter-spacing:normal !important;
  text-transform:none !important;
}

@media(max-width:1120px){
  .pagehead h1.home-heading-match,
  h1.home-heading-match,
  h2.home-heading-match,
  h3.home-heading-match,
  p.home-heading-match{
    font-size:clamp(31px,3.4vw,43px) !important;
    width:43vw !important;
    max-width:43vw !important;
  }
}

@media(max-width:850px){
  .pagehead h1.home-heading-match,
  h1.home-heading-match,
  h2.home-heading-match,
  h3.home-heading-match,
  p.home-heading-match{
    font-size:clamp(35px,9vw,49px) !important;
    width:auto !important;
    max-width:none !important;
  }
}

/* Requested line composition: preserve Home typography exactly. */
.pagehead h1.home-heading-match{
  width:min(1000px,86vw) !important;
  max-width:min(1000px,86vw) !important;
}
@media(max-width:850px){
  .pagehead h1.home-heading-match{
    width:auto !important;
    max-width:none !important;
  }
}

/* HOME LABEL — same typography and claret colour as the internal page labels. */
.integrated-home-copy .eyebrow{
  font-family:Arial,sans-serif !important;
  font-size:11px !important;
  line-height:1.2 !important;
  font-weight:400 !important;
  letter-spacing:.25em !important;
  text-transform:uppercase !important;
  color:var(--burg) !important;
}

/* WHEN TO BRING ME IN — requested two-line composition only */
.when-page .pagehead h1.home-heading-match{
  width:min(1120px,90vw) !important;
  max-width:min(1120px,90vw) !important;
}

/* How I can help nested bullets */
.when-expertise-sublist{margin-top:.55em;margin-left:1.35em;}

/* Remove bullet from the introductory How I can help line only */
.when-expertise-list > li{
  list-style:none;
}

/* Intro under HOW I CAN HELP: same heading typography as
   "Also available for senior interim leadership roles", with no parent bullet. */
.when-expertise-list > li.expertise-intro-no-marker{
  list-style:none !important;
}
.when-expertise-list > li.expertise-intro-no-marker > h3{
  margin-top:0;
}

/* HOW I CAN HELP intro — align heading to its node exactly like the other .step h3 headings.
   Remove only the outer list's default inset; nested expertise bullets stay indented. */
.step > .when-expertise-list{
  margin-left:0 !important;
  padding-left:0 !important;
}
.step > .when-expertise-list > li.expertise-intro-no-marker{
  margin-left:0 !important;
  padding-left:0 !important;
}
.step > .when-expertise-list > li.expertise-intro-no-marker > h3{
  margin-left:0 !important;
  padding-left:0 !important;
}

/* ABOUT PHOTO — proportionally reduced BY one third.
   Resize the complete photo treatment so the surrounding shaded shape follows it. */
.about-page .about-photo{
  width:66.666667% !important;
  min-height:293.333px !important;
  height:293.333px !important;
  justify-self:end !important;
  overflow:hidden !important;
}
.about-page .about-photo img{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  object-fit:cover !important;
}

/* Keep the resized photo treatment proportional on smaller screens too. */
@media(max-width:850px){
  .about-page .about-photo{
    width:66.666667% !important;
    min-height:213.333px !important;
    height:213.333px !important;
    justify-self:end !important;
  }
  .about-page .about-photo img{
    min-height:0 !important;
  }
}

/* ABOUT + CONTACT — exact locked Home visible-text alignment.
   Native .wrap/.pagehead already resolves to the same x=Home origin and y=84px.
   Match Home's internal title/heading spacing only; no positional nudges. */
.about-page .pagehead > .eyebrow,
.contact-page .pagehead > .eyebrow{
  margin:0 0 12px 0 !important;
}
.about-page .pagehead > h1.home-heading-match,
.contact-page .pagehead > h1.home-heading-match{
  width:min(575px,39vw) !important;
  max-width:min(575px,39vw) !important;
  margin:.1em 0 .38em 0 !important;
}
@media(max-width:1120px){
  .about-page .pagehead > h1.home-heading-match,
  .contact-page .pagehead > h1.home-heading-match{
    width:43vw !important;
    max-width:43vw !important;
  }
}
@media(max-width:850px){
  .about-page .pagehead > h1.home-heading-match,
  .contact-page .pagehead > h1.home-heading-match{
    width:auto !important;
    max-width:none !important;
  }
}

/* Contact deliberately uses the accepted About page's exact outer layout.
   This rule only hides the empty second column on the stacked mobile layout. */
.contact-empty-column{min-width:0}
@media(max-width:850px){.contact-empty-column{display:none}}

/* HOME EYEBROW TYPOGRAPHY ONLY — match the How I Work page eyebrow */

/* HOME EYEBROW COLOUR — explicitly identical to How I Work eyebrow */

/* HOME FOUZIA HARRINGTON — literal computed typography from HOW I WORK */
.home-page .integrated-home-copy > .eyebrow{
  font-family:Arial, sans-serif !important;
  font-size:11px !important;
  font-weight:400 !important;
  letter-spacing:2.75px !important;
  text-transform:uppercase !important;
  color:rgb(117, 22, 56) !important;
  line-height:17.38px !important;
}

/* HOME TWO BODY PARAGRAPHS — exact typography from How I Work body copy */
.home-page .integrated-home-copy p{
  font-family:Arial, sans-serif !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:25.28px !important;
  letter-spacing:normal !important;
  color:rgb(52, 58, 59) !important;
}

/* ABOUT — preserve the exact accepted layout geometry with the shorter copy */
@media (min-width:851px){
  .about-page .about-layout{
    min-height:375.23px !important;
  }
  .about-page .about-layout > .prose{
    align-self:start !important;
  }
}

/* CASE STUDIES — compact two-column grid */
.cases-page .case-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:72px;
  row-gap:0;
  padding-top:18px;
  padding-bottom:76px;
}
.cases-page .case-grid-item{
  padding:30px 0 34px;
  border-top:1px solid rgba(38,63,76,.18);
}
.cases-page .case-grid-item h2{
  margin:.38em 0 .35em;
  font-size:clamp(25px,2.05vw,34px);
  line-height:1.08;
}
.cases-page .case-grid-item .tags{margin:0 0 22px;}
.cases-page .case-grid-item h3{margin:0 0 8px;font-size:18px;}
.cases-page .case-grid-item .lead{
  margin:0;
  max-width:600px;
  font-size:17px;
  line-height:1.55;
}
@media(max-width:850px){
  .cases-page .case-grid{grid-template-columns:1fr;column-gap:0;padding-top:0;}
  .cases-page .case-grid-item{padding:26px 0 30px;}
}

/* HOW I WORK + WHEN TO BRING ME IN — match the site's standard paper background */
body.paper-background-page-1,
body.paper-background-page-2{background:#FAF7F1 !important;}
body.paper-background-page-1 main,
body.paper-background-page-2 main,
body.paper-background-page-1 section,
body.paper-background-page-2 section,
body.paper-background-page-1 .band,
body.paper-background-page-2 .band{background:transparent !important;}

/* Fine horizontal rules ONLY above the four major section headings */
.how-page h2:first-of-type,
.how-page h2:nth-of-type(2),
.when-page h2:first-of-type,
.when-page h2:nth-of-type(2){
  border-top:1px solid rgba(38,63,76,.18);
  padding-top:24px;
}

/* Case study READ ME controls — inherit the Home CONTACT ME button styling */
.case-grid-item .case-read-button{
  margin-top:18px;
}

/* Case Studies — breathing room between title, case name and summary */
.case-grid-item > h2{
  margin-bottom:22px !important;
}
.case-grid-item > h3{
  margin-top:0 !important;
  margin-bottom:18px !important;
}
.case-grid-item > h3 + p{
  margin-top:0 !important;
}

/* ABOUT — editorial redesign in the established site language */
.about-page .about-redesign{
  padding-top:84px;
}
.about-page .about-redesign-grid{
  display:grid;

  align-items:start;
}
.about-page .about-story .eyebrow,
.about-page .about-contact-block .eyebrow{
  margin:0 0 12px 0;
}
.about-page .about-story h1{
  width:auto !important;
  max-width:650px !important;
  margin:.1em 0 .55em 0 !important;
}
.about-page .about-story .prose{
  max-width:650px;
}
.about-page .about-story .prose p{
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:25.28px;
  letter-spacing:normal;
  color:rgb(52,58,59);
}
.about-page .about-side{
  min-width:0;
}
.about-page .about-photo-reserve{
  width:100%;
  height:clamp(245px,19vw,315px);
  background:transparent;
  margin:0 0 34px 0;
}

.about-page .about-contact-block h2{
  font-size:clamp(28px,2.4vw,38px);
  line-height:1.08;
  margin:.1em 0 .55em 0;
  max-width:440px;
}
.about-page .about-contact-block p{
  font-family:Arial,sans-serif;
  font-size:16px;
  line-height:25.28px;
  color:rgb(52,58,59);
  max-width:470px;
  margin:0 0 20px 0;
}
.about-page .about-contact-details{
  margin-bottom:0 !important;
}

@media(max-width:850px){
  
  .about-page .about-photo-reserve{
    height:240px;
    margin-bottom:28px;
  }
  .about-page .about-story h1{
    max-width:none !important;
  }
}

/* ABOUT — final composition with the original photograph reintroduced */
.about-page .about-redesign-grid{
  grid-template-columns:minmax(0,1.02fr) minmax(390px,.78fr);
  gap:clamp(64px,7vw,120px);
}
.about-page .about-redesign-photo{
  width:100%;
  height:clamp(270px,22vw,350px);
  margin:0 0 34px 0;
  overflow:hidden;
}
.about-page .about-redesign-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.about-page .about-contact-block{
  border-top:1px solid rgba(38,63,76,.18);
  padding-top:24px;
}
@media(max-width:850px){
  .about-page .about-redesign-grid{
    grid-template-columns:1fr;
    gap:42px;
  }
  .about-page .about-redesign-photo{
    height:280px;
    margin-bottom:28px;
  }
}

/* ABOUT — use the same organic photo-frame SHAPE language as Home */
.about-page .home-shaped-photo{
  position:relative;
  overflow:visible !important;
  isolation:isolate;
  border-radius:0 !important;
}
.about-page .home-shaped-photo img{
  position:relative;
  z-index:3;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  
  border-radius:48% 52% 44% 56% / 42% 38% 62% 58%;
}
.about-page .home-shaped-photo::before,
.about-page .home-shaped-photo::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:1;
  background:rgba(224,205,188,.22);
}
.about-page .home-shaped-photo::before{
  inset:-42px -38px -35px -48px;
  border-radius:54% 46% 58% 42% / 44% 56% 44% 56%;
  transform:rotate(-3deg);
}
.about-page .home-shaped-photo::after{
  inset:-24px -54px -52px -25px;
  border-radius:43% 57% 46% 54% / 57% 43% 59% 41%;
  transform:rotate(4deg);
  background:rgba(231,216,202,.18);
}

/* Crawley Hospital case study */
.case-study-detail-page{background:#FAF7F1;}
.case-study-detail-page main,.case-study-detail-page section{background:transparent;}
.case-detail-hero{padding-top:84px;padding-bottom:64px;}
.case-detail-hero .eyebrow{margin-bottom:14px;color:rgb(117,22,56);}
.case-detail-hero h1{max-width:880px;margin:.08em 0 .34em;font-size:clamp(38px,4.4vw,62px);line-height:1.02;}
.case-detail-name{font-family:Arial,sans-serif;font-size:16px;line-height:25.28px;color:rgb(52,58,59);}
.case-detail-section{display:grid;grid-template-columns:minmax(150px,.34fr) minmax(0,1fr);gap:clamp(45px,7vw,110px);padding-top:42px;padding-bottom:56px;position:relative;}
.case-detail-section::before{content:"";position:absolute;top:0;left:6%;right:6%;border-top:1px solid rgba(38,63,76,.18);}
.case-detail-label{font-family:Arial,sans-serif;font-size:11px;line-height:17.38px;letter-spacing:2.75px;color:rgb(117,22,56);}
.case-detail-content{max-width:760px;}
.case-detail-content p{margin:0 0 22px;font-family:Arial,sans-serif;font-size:16px;font-weight:400;line-height:25.28px;color:rgb(52,58,59);}
.case-detail-content blockquote{margin:10px 0 30px;padding:0;border:0;max-width:680px;font-family:Georgia,serif;font-size:clamp(27px,2.8vw,40px);line-height:1.16;font-style:italic;color:rgb(38,63,76);}
.case-detail-content .case-detail-emphasis{max-width:720px;margin-bottom:34px;font-family:Georgia,serif;font-size:clamp(22px,2.2vw,31px);line-height:1.28;color:rgb(38,63,76);}
.case-detail-back{padding-top:12px;padding-bottom:90px;}
@media(max-width:850px){.case-detail-section{grid-template-columns:1fr;gap:20px}.case-detail-hero h1{max-width:none}}

/* CRAWLEY — redesigned to follow the existing Common Challenges layout */
.crawley-story{
  padding-top:26px;
  padding-bottom:62px;
  border-top:1px solid rgba(38,63,76,.18);
}
.crawley-thread-list{
  max-width:880px;
  padding-left:48px;
}
.crawley-thread-list .crawley-stage{
  margin:0 0 52px 0;
}
.crawley-thread-list .crawley-stage:last-child{
  margin-bottom:0;
}

.crawley-thread-list .crawley-stage p{
  margin:0 0 20px 0;
  max-width:790px;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:25.28px;
  color:rgb(52,58,59);
}
.crawley-thread-list .crawley-question{
  font-family:Georgia,serif !important;
  font-size:clamp(24px,2.25vw,34px) !important;
  line-height:1.2 !important;
  color:var(--navy) !important;
  margin:4px 0 26px !important;
}
.crawley-thread-list .crawley-emphasis{
  font-family:Georgia,serif !important;
  font-size:clamp(20px,1.8vw,27px) !important;
  line-height:1.3 !important;
  color:var(--navy) !important;
  margin-bottom:28px !important;
}
@media(max-width:850px){
  .crawley-thread-list{padding-left:48px;}
}

/* Crawley stage headings: match “When you do not know where to start” exactly */
.crawley-thread-list .crawley-stage h2{
  font-family:Georgia,serif !important;
  font-size:21px !important;
  font-weight:400 !important;
  line-height:1.08 !important;
  color:var(--navy) !important;
  margin:0 0 20px 0 !important;
}

/* CRAWLEY — approved single-image case-study composition */
.crawley-single-image-story{
  position:relative;
  display:grid;

  padding-top:42px;
  padding-bottom:72px;
  border-top:1px solid rgba(38,63,76,.18);
}
.crawley-story-copy.thread-list{
  max-width:720px;
  padding-left:48px;
}
.crawley-single-stage{
  margin:0 0 58px 0;
}
.crawley-single-stage:last-child{margin-bottom:0;}
.crawley-single-stage h2{
  font-family:Georgia,serif;
  font-size:21px;
  font-weight:400;
  line-height:1.08;
  color:var(--navy);
  margin:0 0 20px 0;
}
.crawley-single-stage p{
  margin:0 0 20px;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:25.28px;
  color:rgb(52,58,59);
}

.crawley-image-placeholder{
  position:absolute;
  inset:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  color:rgba(38,63,76,.55);
  background:
    radial-gradient(ellipse at 30% 22%,rgba(224,205,188,.38),transparent 45%),
    linear-gradient(160deg,rgba(231,216,202,.36),rgba(92,103,65,.10));
  border-radius:58% 42% 47% 53% / 12% 10% 18% 16%;
}
.crawley-image-placeholder::before{
  content:"";
  position:absolute;
  inset:7% -10% 6% 7%;
  border-left:1px solid rgba(173,123,40,.18);
  border-radius:52% 48% 45% 55%;
  pointer-events:none;
}
.crawley-image-placeholder span{
  position:relative;
  z-index:1;
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:2.75px;
}
.crawley-image-placeholder small{
  position:relative;
  z-index:1;
  font-family:Arial,sans-serif;
  font-size:12px;
}
@media(max-width:850px){
  .crawley-single-image-story{
    grid-template-columns:1fr;
    gap:44px;
  }
  .crawley-case-image{

    order:-1;
  }
}

/* CRAWLEY — approved generated-artwork treatment */
.crawley-single-image-story{
  grid-template-columns:minmax(0,.96fr) minmax(390px,.74fr) !important;
  gap:clamp(46px,5.8vw,94px) !important;
  overflow:visible;
}
.crawley-story-copy.crawley-flow{
  position:relative;
  padding-left:58px;
  max-width:720px;
}
.crawley-flow-thread{
  position:absolute;
  left:3px;
  top:-20px;
  width:46px;
  height:calc(100% + 35px);
  overflow:visible;
  pointer-events:none;
  z-index:0;
}
.crawley-flow-thread path{
  fill:none;
  stroke:var(--olive);
  stroke-width:.9px;
  stroke-opacity:.68;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
}
.crawley-single-stage{
  position:relative;
  z-index:2;
  padding-left:0;
}
.crawley-single-stage::before{
  content:"";
  position:absolute;
  left:-45px;
  top:7px;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 4px var(--paper);
  z-index:3;
}
.crawley-single-stage:nth-of-type(2)::before{background:var(--burg);}
.crawley-single-stage:nth-of-type(3)::before{background:var(--forest);}
.crawley-single-stage:nth-of-type(4)::before{background:var(--gold);}

.crawley-case-image{

  overflow:hidden;
  border-radius:58% 0 0 42% / 12% 0 0 16%;
  margin-right:calc(-1 * max(0px, (100vw - 1440px)/2));
}
.crawley-case-image img{
  display:block;

}
.crawley-case-image::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0 auto 0 -1px;
  width:26%;
  background:linear-gradient(90deg,var(--paper),rgba(250,247,241,.60),transparent);
  pointer-events:none;
}
@media(max-width:850px){
  .crawley-story-copy.crawley-flow{padding-left:52px;}
  .crawley-flow-thread{left:0;width:42px;}
  .crawley-single-stage::before{left:-39px;}
  .crawley-case-image{
    position:relative;
    top:auto;

    margin-right:0;
    border-radius:48% 52% 44% 56% / 18% 14% 20% 16%;
  }
}

/* Crawley image: extend to the bottom of the complete case study */
.crawley-single-image-story{
  align-items:stretch !important;
}
.crawley-case-image{
  position:relative !important;
  top:auto !important;
  height:auto !important;
  min-height:100% !important;
  align-self:stretch !important;
}
.crawley-case-image img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
@media(max-width:850px){
  .crawley-case-image{
    min-height:500px !important;
    height:500px !important;
  }
}

/* Crawley — nodes mathematically positioned on the actual wavy SVG path */
.crawley-flow .crawley-single-stage::before,
.crawley-flow .crawley-single-stage::after{
  display:none !important;
  content:none !important;
}
.crawley-curve-node{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 4px var(--paper);
  z-index:5;
  pointer-events:none;
}
.crawley-curve-node-1{background:var(--burg);}
.crawley-curve-node-2{background:var(--forest);}
.crawley-curve-node-3{background:var(--gold);}

/* Child Development Centre — companion design to Crawley, image left / story right */
.child-single-image-story{
  position:relative;
  display:grid;
  grid-template-columns:minmax(390px,.74fr) minmax(0,.96fr);
  gap:clamp(46px,5.8vw,94px);
  align-items:stretch;
  padding-top:42px;
  padding-bottom:72px;
  overflow:visible;
}
.child-story-copy.child-flow{
  position:relative;
  padding-left:58px;
  max-width:720px;
}
.child-flow-thread{
  position:absolute;
  left:3px;
  top:-20px;
  width:46px;
  height:calc(100% + 35px);
  overflow:visible;
  pointer-events:none;
  z-index:0;
}
.child-flow-thread path{
  fill:none;
  stroke:var(--olive);
  stroke-width:.9px;
  stroke-opacity:.68;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
}
.child-single-stage{
  position:relative;
  z-index:2;
  margin:0 0 58px 0;
}
.child-single-stage:last-child{margin-bottom:0;}
.child-single-stage h2{
  font-family:Georgia,serif;
  font-size:21px;
  font-weight:400;
  line-height:1.08;
  color:var(--navy);
  margin:0 0 20px 0;
}
.child-single-stage p{
  margin:0 0 20px;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:25.28px;
  color:rgb(52,58,59);
}
.child-case-image{
  position:relative;
  min-height:100%;
  align-self:stretch;
  overflow:hidden;
  border-radius:0 58% 42% 0 / 0 12% 16% 0;
  margin-left:calc(-1 * max(0px, (100vw - 1440px)/2));
}
.child-case-image img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  
}
.child-case-image::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0 -1px 0 auto;
  width:22%;
  background:linear-gradient(270deg,var(--paper),rgba(250,247,241,.52),transparent);
  pointer-events:none;
}
.child-curve-node{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 4px var(--paper);
  z-index:5;
  pointer-events:none;
}
.child-curve-node-1{background:var(--burg);}
.child-curve-node-2{background:var(--forest);}
.child-curve-node-3{background:var(--gold);}
@media(max-width:850px){
  .child-single-image-story{grid-template-columns:1fr;gap:44px;}
  .child-case-image{
    min-height:500px;
    height:500px;
    margin-left:0;
    border-radius:48% 52% 44% 56% / 18% 14% 20% 16%;
  }
  .child-story-copy.child-flow{padding-left:52px;}
  .child-flow-thread{left:0;width:42px;}
}

/* Child Development Centre: suppress any generic duplicate/faded strand decoration.
   The dedicated child-flow thread and its three nodes remain unchanged. */
.child-single-image-story .strand-field,
.child-single-image-story .strand-node,
.child-single-image-story .live-thread-rail,
.child-single-image-story .live-thread-dot{
  display:none !important;
}

/* Joint Commissioning Framework — wide image introduction + editorial story */
.joint-case-hero{padding-bottom:40px;}
.joint-photo-band{
  width:100%;
  overflow:hidden;
  margin:0 0 56px 0;
}
.joint-photo-frame{
  position:relative;
  width:100%;
  height:clamp(330px,31vw,500px);
  overflow:hidden;
  border-radius:0 0 48% 42% / 0 0 12% 10%;
}
.joint-photo-frame img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  
}
.joint-photo-frame::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:18%;
  background:linear-gradient(0deg,var(--paper),rgba(250,247,241,.34),transparent);
  pointer-events:none;
}
.joint-story{
  padding-top:10px;
  padding-bottom:72px;
}
.joint-story-copy.joint-flow{
  position:relative;
  
  margin:0 auto;
  
}
.joint-flow-thread{
  position:absolute;
  left:12px;
  top:-28px;
  width:58px;
  height:calc(100% + 48px);
  overflow:visible;
  pointer-events:none;
  z-index:0;
}
.joint-flow-thread path{
  fill:none;
  stroke:var(--olive);
  stroke-width:.9px;
  stroke-opacity:.68;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
}
.joint-stage{
  position:relative;
  z-index:2;
  
  margin:0 0 62px 0;
}

.joint-stage:last-child{margin-bottom:0;}
.joint-stage h2{
  font-family:Georgia,serif;
  font-size:21px;
  font-weight:400;
  line-height:1.08;
  color:var(--navy);
  margin:0 0 20px 0;
}
.joint-stage p{
  margin:0 0 20px;
  font-family:Arial,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:25.28px;
  color:rgb(52,58,59);
}
.joint-curve-node{
  position:absolute;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 4px var(--paper);
  z-index:5;
  pointer-events:none;
}
.joint-curve-node-1{background:var(--burg);}
.joint-curve-node-2{background:var(--forest);}
.joint-curve-node-3{background:var(--gold);}
/* prevent generic shared-script decorations duplicating this page's dedicated thread */
.joint-story .strand-field,.joint-story .strand-node,
.joint-story .live-thread-rail,.joint-story .live-thread-dot{display:none !important;}
@media(max-width:850px){
  .joint-photo-frame{height:360px;border-radius:0 0 40% 32% / 0 0 8% 7%;}
  
  .joint-flow-thread{left:0;width:44px;}
  .joint-stage,.joint-stage:nth-of-type(2),.joint-stage:nth-of-type(3){margin-left:0;}
}

/* Joint Commissioning — make the stagger deliberate rather than slightly misaligned.
   Each complete section moves as one block, creating a clear editorial rhythm. */
.joint-story-copy.joint-flow{
  max-width:1040px !important;
  padding-left:112px !important;
}
.joint-stage{
  width:min(100%,720px) !important;
  max-width:720px !important;
}
.joint-stage:nth-of-type(1){
  margin-left:0 !important;
  margin-right:auto !important;
}
.joint-stage:nth-of-type(2){
  margin-left:150px !important;
  margin-right:0 !important;
}
.joint-stage:nth-of-type(3){
  margin-left:42px !important;
  margin-right:auto !important;
}
.joint-stage h2,
.joint-stage p{
  text-align:left !important;
}
@media(max-width:1050px){
  .joint-stage:nth-of-type(2){margin-left:90px !important;}
  .joint-stage:nth-of-type(3){margin-left:28px !important;}
}
@media(max-width:850px){
  .joint-story-copy.joint-flow{padding-left:58px !important;}
  .joint-stage,
  .joint-stage:nth-of-type(1),
  .joint-stage:nth-of-type(2),
  .joint-stage:nth-of-type(3){
    width:auto !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

/* Integrated Neighbourhood Leadership Teams — wide urban neighbourhood image + strong editorial stagger */
.neighbourhood-case-hero{padding-bottom:40px;}
.neighbourhood-photo-band{width:100%;overflow:hidden;margin:0 0 58px;}
.neighbourhood-photo-frame{
  position:relative;
  width:100%;
  height:clamp(340px,32vw,510px);
  overflow:hidden;
  border-radius:0 0 52% 38% / 0 0 14% 9%;
}
.neighbourhood-photo-frame img{
  display:block;width:100%;height:100%;
  object-fit:cover;
}
.neighbourhood-photo-frame::after{
  content:"";position:absolute;inset:auto 0 0;height:18%;
  background:linear-gradient(0deg,var(--paper),rgba(250,247,241,.34),transparent);
  pointer-events:none;
}
.neighbourhood-story{padding-top:10px;padding-bottom:72px;}
.neighbourhood-story-copy.neighbourhood-flow{
  position:relative;
  max-width:1080px;
  margin:0 auto;
  padding-left:112px;
}
.neighbourhood-flow-thread{
  position:absolute;left:12px;top:-28px;width:58px;height:calc(100% + 48px);
  overflow:visible;pointer-events:none;z-index:0;
}
.neighbourhood-flow-thread path{
  fill:none;stroke:var(--olive);stroke-width:.9px;stroke-opacity:.68;
  vector-effect:non-scaling-stroke;stroke-linecap:round;
}
.neighbourhood-stage{
  position:relative;z-index:2;width:min(100%,720px);max-width:720px;
  margin-bottom:66px;
}
.neighbourhood-stage:nth-of-type(1){margin-left:0;margin-right:auto;}
.neighbourhood-stage:nth-of-type(2){margin-left:190px;margin-right:0;}
.neighbourhood-stage:nth-of-type(3){margin-left:58px;margin-right:auto;}
.neighbourhood-stage:last-child{margin-bottom:0;}
.neighbourhood-stage h2{
  font-family:Georgia,serif;font-size:21px;font-weight:400;line-height:1.08;
  color:var(--navy);margin:0 0 20px;
}
.neighbourhood-stage p{
  margin:0 0 20px;font-family:Arial,sans-serif;font-size:16px;font-weight:400;
  line-height:25.28px;color:rgb(52,58,59);text-align:left;
}
.neighbourhood-curve-node{
  position:absolute;width:10px;height:10px;border-radius:50%;
  transform:translate(-50%,-50%);box-shadow:0 0 0 4px var(--paper);
  z-index:5;pointer-events:none;
}
.neighbourhood-curve-node-1{background:var(--burg);}
.neighbourhood-curve-node-2{background:var(--forest);}
.neighbourhood-curve-node-3{background:var(--gold);}
.neighbourhood-story .strand-field,.neighbourhood-story .strand-node,
.neighbourhood-story .live-thread-rail,.neighbourhood-story .live-thread-dot{display:none !important;}
@media(max-width:1050px){
  .neighbourhood-stage:nth-of-type(2){margin-left:105px;}
  .neighbourhood-stage:nth-of-type(3){margin-left:34px;}
}
@media(max-width:850px){
  .neighbourhood-photo-frame{height:360px;border-radius:0 0 40% 32% / 0 0 8% 7%;}
  .neighbourhood-story-copy.neighbourhood-flow{padding-left:58px;}
  .neighbourhood-flow-thread{left:0;width:44px;}
  .neighbourhood-stage,.neighbourhood-stage:nth-of-type(1),
  .neighbourhood-stage:nth-of-type(2),.neighbourhood-stage:nth-of-type(3){
    width:auto;max-width:none;margin-left:0;margin-right:0;
  }
}

/* CASE STUDY MAIN TITLES — match the established large-text treatment used elsewhere on the site */
.case-study-detail-page .case-detail-hero h1{
  font-family:Georgia,serif !important;
  font-size:clamp(34px,3.05vw,51px) !important;
  line-height:1.06 !important;
  font-weight:400 !important;
  color:var(--navy) !important;
}
@media(max-width:1120px){
  .case-study-detail-page .case-detail-hero h1{font-size:clamp(31px,3.4vw,43px) !important;}
}
@media(max-width:850px){
  .case-study-detail-page .case-detail-hero h1{font-size:clamp(35px,9vw,49px) !important;}
}

/* Footer tagline — same established pink/burgundy accent as the page eyebrow text */

/* Footer tagline — exact typography and colour of the accepted Home caption */
.footer-tagline{
  font-family:Arial,sans-serif !important;
  font-size:11px !important;
  font-weight:400 !important;
  line-height:1.55 !important;
  letter-spacing:2.75px !important;
  text-transform:uppercase !important;
  color:rgb(117,22,56) !important;
}

/* Major section titles on How I Work / When to Bring Me In —
   match the established case-study main-title treatment */

@media(max-width:1120px){
  .how-page h2,
  .when-page h2{
    font-size:clamp(31px,3.4vw,43px) !important;
  }
}
@media(max-width:850px){
  .how-page h2,
  .when-page h2{
    font-size:clamp(35px,9vw,49px) !important;
  }
}

/* CORRECTION: major section titles on How I Work / When to Bring Me In
   match the titles on the Case Studies OVERVIEW page (e.g. Turning uncertainty...) */
.how-page h2,
.when-page h2{
  font-family:Georgia,serif !important;
  font-size:24px !important;
  line-height:1.15 !important;
  font-weight:400 !important;
  color:var(--navy) !important;
}

/* Match header band to page background ONLY on How I Work and When to Bring Me In */
body.paper-background-page-1 header,
body.paper-background-page-2 header{
  background:#FAF7F1 !important;
}

/* Match header band to the case-study page background on all four individual case studies */

/* CORRECTION — exact background used by the four individual case-study pages */
body.case-study-detail-page header{
  background:#FAF7F1 !important;
}

/* Joint Commissioning + Integrated Neighbourhood Leadership Teams:
   align My Approach with The Challenge and The Result */
body.joint-commissioning-page .case-narrative .case-section:nth-of-type(2),
body.integrated-neighbourhood-page .case-narrative .case-section:nth-of-type(2){
  margin-left:0 !important;
  margin-right:auto !important;
  transform:none !important;
}

/* CORRECTED ALIGNMENT — use the actual narrative elements on these two pages */
.joint-story .joint-stage:nth-of-type(2),
.joint-stage:nth-of-type(2){
  margin-left:0 !important;
  margin-right:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
}
.neighbourhood-story .neighbourhood-stage:nth-of-type(2),
.neighbourhood-stage:nth-of-type(2){
  margin-left:0 !important;
  margin-right:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
}

/* FINAL ALIGNMENT — all three narrative sections share the same left edge */
.joint-stage:nth-of-type(1),
.joint-stage:nth-of-type(2),
.joint-stage:nth-of-type(3),
.neighbourhood-stage:nth-of-type(1),
.neighbourhood-stage:nth-of-type(2),
.neighbourhood-stage:nth-of-type(3){
  margin-left:0 !important;
  margin-right:auto !important;
  left:auto !important;
  right:auto !important;
  transform:none !important;
}

/* Align the case-study photo rules with the 24px section-heading rules.
   66px section padding + 4.8px heading margin, minus the extra headline line. */
@media (min-width:1121px){
  .cases-page .case-grid{
    padding-top:calc(
      70.8px
      - clamp(36.04px,3.233vw,54.06px)
    ) !important;
  }
}
@media (min-width:851px) and (max-width:1120px){
  .cases-page .case-grid{
    padding-top:calc(
      70.8px
      - clamp(32.86px,3.604vw,45.58px)
    ) !important;
  }
}

/* Raise the main section/divider start slightly and equally on these three pages */
.how-page .pagehead,
.when-page .pagehead,
.cases-page .pagehead{
  padding-bottom:48px !important;
}

/* Small disclosure on generated case-study photography; Crawley uses a real photograph and is intentionally unlabelled. */
.illustrative-image-note{
  position:absolute;
  z-index:4;
  left:18px;
  bottom:16px;
  padding:5px 8px 4px;
  border-radius:2px;
  background:rgba(250,247,241,.88);
  color:rgba(38,63,76,.78);
  font-family:Arial,sans-serif;
  font-size:9px;
  font-weight:400;
  line-height:1.2;
  letter-spacing:1.35px;
  text-transform:uppercase;
  pointer-events:none;
}

/* Keep About contact links visually consistent while making them clearly actionable. */
.about-contact-details a{
  color:inherit;
  text-decoration-line:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  text-decoration-color:rgba(52,58,59,.32);
}
.about-contact-details a:hover,
.about-contact-details a:focus-visible{
  text-decoration-color:currentColor;
}

/* ============================================================
   RESPONSIVE + ACCESSIBILITY PASS
   These rules do not alter the site's written content.
   ============================================================ */

/* Keyboard users can jump past repeated navigation. Hidden until focused. */
.skip-link{
  position:fixed;
  left:18px;
  top:12px;
  z-index:10000;
  transform:translateY(-180%);
  padding:10px 14px;
  border-radius:4px;
  background:#263F4C;
  color:#fff;
  font:600 14px/1.2 Arial,sans-serif;
  text-decoration:none;
}
.skip-link:focus{transform:translateY(0);}

/* Clear keyboard focus. This appears only while navigating with a keyboard. */
a:focus-visible,
button:focus-visible{
  outline:3px solid #B98531;
  outline-offset:4px;
  border-radius:3px;
}

/* Keep the very small brand descriptor readable without changing wording. */
.brand small{font-size:10px;line-height:1.25;}

/* Mobile navigation: desktop remains unchanged. */
.menu-toggle{
  display:none;
  margin-left:auto;
  padding:9px 12px;
  border:1px solid rgba(38,63,76,.32);
  border-radius:3px;
  background:transparent;
  color:var(--navy);
  font:600 11px/1 Arial,sans-serif;
  letter-spacing:.16em;
}
@media(max-width:850px){
  header{
    position:relative;
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .menu-toggle{display:block;}
  /* If JavaScript is unavailable, navigation remains visible rather than disappearing. */
  nav{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:0;
    margin-top:14px;
    padding-top:8px;
    border-top:1px solid rgba(38,63,76,.14);
    white-space:normal;
  }
  nav a{
    display:block;
    padding:11px 2px;
    font-size:15px;
  }
  /* Once JS is ready, the menu becomes collapsible. */
  body.menu-ready nav{display:none;}
  body.menu-ready nav.is-open{display:flex;}
  body.menu-ready .menu-toggle{display:block;}
}

/* Home artwork: anchor it to the same centred design canvas as the page content.
   This stops the artwork drifting farther right on a large monitor. */

/* About portrait: preserve the source photo's 3:2 proportions at every screen size.
   The focal point therefore does not appear to slide as the browser gets wider/narrower. */
.about-page .about-redesign-photo,
.about-page .home-shaped-photo{
  aspect-ratio:3 / 2;
  height:auto !important;
  min-height:0 !important;
}
.about-page .home-shaped-photo img{
  object-position:50% 50% !important;
}
@media(max-width:850px){
  .about-page .about-redesign-photo,
  .about-page .home-shaped-photo{
    height:auto !important;
    min-height:0 !important;
  }
}

/* Wide case-study photographs use one consistent desktop crop instead of changing
   with viewport width. On very wide monitors they stop growing at 1600px and remain centred. */
.joint-photo-frame,
.neighbourhood-photo-frame{
  width:min(100%,1600px) !important;
  height:auto !important;
  aspect-ratio:16 / 5;
  margin-left:auto;
  margin-right:auto;
}
.joint-photo-frame img{object-position:50% 48% !important;}
.neighbourhood-photo-frame img{object-position:50% 46% !important;}

/* The two tall case-study images remain tied to their text column on desktop,
   then deliberately stack above the text on smaller screens. Focal points stay fixed. */
.crawley-case-image img{object-position:56% 50% !important;}
.child-case-image img{object-position:50% 50% !important;}

@media(max-width:850px){
  .crawley-single-image-story,
  .child-single-image-story{
    grid-template-columns:1fr !important;
  }
  .crawley-case-image,
  .child-case-image{
    width:100%;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:4 / 5;
  }
  .crawley-case-image img,
  .child-case-image img{
    position:absolute !important;
    inset:0 !important;
  }
  /* Keep the wide case-study banners visually substantial but predictable on phones. */
  .joint-photo-frame,
  .neighbourhood-photo-frame{
    width:100% !important;
    height:auto !important;
    aspect-ratio:16 / 6;
  }
}

/* Respect users who ask their device to reduce animation. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{scroll-behavior:auto !important;transition:none !important;animation:none !important;}
}

/* ============================================================
   HOME HERO — REFERENCE-MATCHED GEOMETRY + FIXED RIGHT EDGE
   Visual geometry is taken from the supplied approved Home page:
   - copy starts on the same horizontal content grid as internal pages;
   - artwork uses the larger approved scale (up to 1240px);
   - the photograph/artwork's actual right edge remains fixed to the
     browser edge across laptop and desktop widths.
   ============================================================ */
.home-main{overflow:hidden;background:var(--paper)}
.home-page .integrated-home-hero{
  position:relative;
  width:100%;
  max-width:none;
  min-height:clamp(760px,55vw,900px);
  margin:0;
  overflow:hidden;
  background:var(--paper);
}
.home-page .integrated-home-art{
  position:absolute;
  display:block;
  width:min(78vw,1240px);
  height:auto;
  max-width:none;
  max-height:none;
  inset:auto;
  top:clamp(12px,1.8vw,30px);
  right:0;
  z-index:0;
  object-fit:contain;
  object-position:right top;
}
.home-page .integrated-home-copy{
  position:absolute;
  z-index:2;
  top:88px;
  left:0;
  right:0;
  bottom:auto;
  /* Use the exact same centred 1440px grid and side padding as .wrap.
     This avoids a separate transformed Home coordinate system and keeps
     the copy origin identical to the internal pages at every width. */
  width:100%;
  max-width:1440px;
  margin:0 auto;
  padding:0 6%;
  transform:none;
}
.home-page .integrated-home-copy-inner{
  width:min(575px,39vw);
}
.home-page .integrated-home-copy h1{max-width:560px}

.home-page .home-red-x-caption{
  position:absolute;
  z-index:3;
  left:69.5%;
  top:72.5%;
  width:330px;
  transform:translate(-50%,-50%);
  font-family:Arial,sans-serif;
  font-size:11px;
  font-weight:400;
  line-height:1.55;
  letter-spacing:2.75px;
  text-transform:uppercase;
  color:rgb(117,22,56);
  text-align:center;
  pointer-events:none;
}

/* Laptop widths keep the approved overlay composition. The reference
   enlarged the artwork here by pushing its right edge beyond the viewport;
   this version keeps that larger scale but fixes right:0 so the portrait is
   fully visible and remains the visual anchor. */
@media(min-width:851px) and (max-width:1120px){
  .home-page .integrated-home-art{
    width:82vw;
    top:20px;
    right:0;
  }
  .home-page .integrated-home-copy{
    top:88px;
    left:0;
    right:0;
    width:100%;
    max-width:1440px;
    margin:0 auto;
    padding-left:6%;
    padding-right:6%;
    transform:none;
  }
  .home-page .integrated-home-copy-inner{
    width:43vw;
  }
  .home-page .home-red-x-caption{
    left:65%;
    top:73%;
    width:280px;
    font-size:10px;
    letter-spacing:2.2px;
  }
}

@media(max-width:850px){
  .home-page .integrated-home-hero{
    min-height:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  .home-page .integrated-home-art{
    position:relative;
    width:108%;
    height:auto;
    right:auto;
    top:auto;
    align-self:flex-end;
    margin:0;
    order:0;
  }
  .home-page .integrated-home-copy{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    bottom:auto;
    transform:none;
    width:100%;
    max-width:1440px;
    margin:0 auto;
    padding:58px 7%;
    order:1;
  }
  .home-page .integrated-home-copy-inner{
    width:auto;
  }
  .home-page .home-red-x-caption{display:none}
}

/* ============================================================
   EDITORIAL REFINEMENT PASS — OCTOBER 2026
   A restrained art-direction layer: same identity and content,
   tighter grid, typography, rhythm, links and finishing details.
   Home artwork geometry is intentionally left untouched.
   ============================================================ */
:root{
  --content-max:1440px;
  --page-pad:6%;
  --hairline:rgba(38,63,76,.16);
  --hairline-soft:rgba(38,63,76,.10);
  --editorial-ease:cubic-bezier(.2,.65,.3,1);
}

/* One shared horizontal system for brand, pages and footer. */
header{
  width:100%;
  max-width:var(--content-max);
  margin:0 auto;
  padding:30px var(--page-pad) 20px;
}
.wrap{
  max-width:var(--content-max);
  padding-left:var(--page-pad);
  padding-right:var(--page-pad);
}
footer{
  width:100%;
  max-width:var(--content-max);
  margin:0 auto;
  padding:46px var(--page-pad) 48px;
  border-top:1px solid var(--hairline);
}

/* Typography: preserve the existing faces, make the hierarchy more deliberate. */
body{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3{
  font-kerning:normal;
  text-wrap:balance;
}
p,li{
  text-wrap:pretty;
}
.brand{
  line-height:1.05;
}
.brand small{
  margin-top:7px;
  letter-spacing:.32em;
}
nav{
  gap:clamp(20px,2vw,30px);
  font-size:15px;
  letter-spacing:.01em;
}
nav a{
  padding-bottom:7px;
}
nav a:after{
  height:1px;
  transition:right .28s var(--editorial-ease);
}
.eyebrow,
.tags,
.case-detail-label{
  letter-spacing:.28em;
}
.pagehead h1.home-heading-match,
.case-study-detail-page .case-detail-hero h1,
.home-page .integrated-home-copy h1{
  letter-spacing:-.008em !important;
}

/* Shared introduction gap: 12px tighter across the three overview pages. */
.how-page .pagehead,
.when-page .pagehead,
.cases-page .pagehead{
  padding-bottom:50px !important;
}
.pagehead{
  padding-top:88px;
}
.how-page .threaded-section > .wrap,
.when-page .threaded-section > .wrap{
  padding-top:66px;
  padding-bottom:88px;
}
.how-page .split,
.when-page .split{
  gap:clamp(76px,7vw,112px);
}
.how-page h2:first-of-type,
.how-page h2:nth-of-type(2),
.when-page h2:first-of-type,
.when-page h2:nth-of-type(2){
  border-top-color:var(--hairline);
  padding-top:28px;
  margin-bottom:30px;
}
.thread-node{
  margin-top:36px;
  margin-bottom:14px;
}
.step{
  margin-bottom:42px;
}
.thread-list p,
.steps p,
.when-expertise-list li{
  line-height:1.64;
}

/* About: a slightly stronger editorial opening and calmer contact column. */
.about-page .about-redesign{
  padding-top:88px;
  padding-bottom:88px;
}
.about-page .about-redesign-grid{
  gap:clamp(74px,7.8vw,128px);
}
.about-page .about-story .prose p{
  line-height:1.64;
  margin-top:0;
  margin-bottom:20px;
}
.about-page .about-story .prose p:first-child{
  max-width:620px;
  margin-bottom:25px;
  color:var(--navy);
  font-family:Arial,sans-serif;
  font-size:18px;
  font-weight:400;
  font-style:normal;
  line-height:1.58;
  letter-spacing:normal;
}
.about-page .about-redesign-photo,
.about-page .home-shaped-photo{
  width:100%;
  max-width:540px;
  justify-self:end;
}
.about-page .about-contact-block{
  margin-top:8px;
  padding-top:28px;
  border-top-color:var(--hairline);
}
.about-page .about-contact-block h2{
  margin-bottom:.62em;
}
.about-contact-details a{
  transition:text-decoration-color .22s var(--editorial-ease), color .22s var(--editorial-ease);
}
.about-contact-details a:hover{
  color:var(--navy);
}

/* Case-study overview: quieter actions and a clearer editorial hierarchy. */
.cases-page .case-grid{
  column-gap:clamp(72px,7vw,108px);
  padding-bottom:94px;
}
.cases-page .case-grid-item{
  padding:34px 0 42px;
  border-top-color:var(--hairline);
}
.cases-page .case-grid-item .tags{
  margin-bottom:18px;
  font-size:10px;
}
.cases-page .case-grid-item h2{
  margin:.32em 0 20px !important;
  line-height:1.12;
}
.cases-page .case-grid-item h3{
  margin:0 0 15px !important;
  font-family:Arial,sans-serif;
  font-size:15px;
  font-weight:400;
  line-height:1.4;
  color:var(--olive);
}
.cases-page .case-grid-item .lead{
  max-width:64ch;
  font-size:16px;
  line-height:1.64;
}
.case-grid-item .case-read-button,
.case-detail-back .btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:22px;
  padding:0 0 5px;
  border:0;
  border-bottom:1px solid rgba(90,96,58,.52);
  border-radius:0;
  background:transparent;
  color:var(--navy);
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.20em;
  transition:color .22s var(--editorial-ease), border-color .22s var(--editorial-ease), gap .22s var(--editorial-ease);
}
.case-grid-item .case-read-button::after{
  content:"→";
  font-family:Arial,sans-serif;
  font-size:15px;
  font-weight:400;
  line-height:1;
  letter-spacing:0;
}
.case-detail-back .btn::before{
  content:"←";
  font-family:Arial,sans-serif;
  font-size:15px;
  font-weight:400;
  line-height:1;
  letter-spacing:0;
}
.case-grid-item .case-read-button:hover,
.case-detail-back .btn:hover{
  gap:13px;
  border-bottom-color:var(--gold);
  background:transparent;
  color:var(--burg);
}

/* Individual case studies: more breathing room around evidence and outcomes. */
.case-study-detail-page .case-detail-hero{
  padding-top:88px;
  padding-bottom:70px;
}
.case-study-detail-page .case-detail-hero .eyebrow{
  margin-bottom:16px;
}
.case-study-detail-page .case-detail-hero h1{
  margin:.08em 0 .42em;
}
.case-detail-name{
  color:var(--olive);
  font-size:15px;
}
.crawley-single-stage,
.child-single-stage,
.joint-stage,
.neighbourhood-stage{
  margin-bottom:68px;
}
.crawley-single-stage h2,
.child-single-stage h2,
.joint-stage h2,
.neighbourhood-stage h2{
  margin-bottom:22px;
  font-size:22px;
}
.crawley-single-stage p,
.child-single-stage p,
.joint-stage p,
.neighbourhood-stage p,
.case-detail-content p{
  line-height:1.66;
  margin-bottom:23px;
}
.case-detail-back{
  padding-top:26px;
  padding-bottom:96px;
}

/* Primary Home action stays recognisable; interaction becomes quieter and more precise. */
.home-page .integrated-home-copy .btn{
  border-radius:999px;
  transition:background .22s var(--editorial-ease), color .22s var(--editorial-ease), transform .22s var(--editorial-ease);
}
.home-page .integrated-home-copy .btn:hover{
  transform:translateY(-1px);
}

/* Footer becomes a quiet colophon rather than another content band. */
footer{
  font-size:14px;
  line-height:1.45;
}
footer small{
  display:inline-block;
  margin-top:5px;
  font-size:12px;
  color:rgba(38,63,76,.78);
}
.footer-tagline{
  align-self:center;
  font-size:10px !important;
  letter-spacing:2.5px !important;
}

/* Subtle selection colour: a small bespoke detail. */
::selection{
  background:rgba(185,133,49,.22);
  color:var(--navy);
}

@media(max-width:1120px){
  header{padding-left:var(--page-pad);padding-right:var(--page-pad);}
  nav{font-size:13px;gap:16px;}
}

@media(max-width:850px){
  :root{--page-pad:7%;}
  header{
    padding:24px var(--page-pad) 14px;
  }
  .wrap{
    padding-left:var(--page-pad);
    padding-right:var(--page-pad);
  }
  .pagehead{
    padding-top:58px;
  }
  .how-page .pagehead,
  .when-page .pagehead,
  .cases-page .pagehead{
    padding-bottom:34px !important;
  }
  .how-page .threaded-section > .wrap,
  .when-page .threaded-section > .wrap{
    padding-top:52px;
    padding-bottom:70px;
  }
  .about-page .about-redesign{
    padding-top:58px;
    padding-bottom:72px;
  }
  .about-page .about-story .prose p:first-child{
    font-size:18px;
    line-height:1.58;
  }
  .about-page .about-redesign-photo,
  .about-page .home-shaped-photo{
    max-width:none;
  }
  .cases-page .case-grid{
    padding-bottom:72px;
  }
  .cases-page .case-grid-item{
    padding:30px 0 36px;
  }
  .case-study-detail-page .case-detail-hero{
    padding-top:58px;
    padding-bottom:50px;
  }
  .crawley-single-stage,
  .child-single-stage,
  .joint-stage,
  .neighbourhood-stage{
    margin-bottom:52px;
  }
  footer{
    padding:38px var(--page-pad) 42px;
  }
  .footer-tagline{
    margin-top:24px;
  }
}

/* ============================================================
   EDITORIAL FINISHING ADJUSTMENTS — OCTOBER 2026
   Keep the Home strapline composed, unify the Home action with
   case-study links, and let the footer colour run full-bleed.
   ============================================================ */

/* Keep the key sector descriptor intact and give the Home strapline
   enough measure to retain the intended single-line desktop composition. */
.home-page .integrated-home-copy .lead{
  width:max-content;
  max-width:min(620px, calc(100vw - 12%));
}
.home-page .home-public-sector{
  white-space:nowrap;
}

/* Home CTA uses the same restrained editorial language as case-study actions. */
.home-page .integrated-home-copy .btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-top:18px;
  padding:0 0 5px;
  border:0;
  border-bottom:1px solid rgba(90,96,58,.52);
  border-radius:0;
  background:transparent;
  color:var(--navy);
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.20em;
  transition:color .22s var(--editorial-ease), border-color .22s var(--editorial-ease), gap .22s var(--editorial-ease);
}
.home-page .integrated-home-copy .btn::after{
  content:"→";
  font-family:Arial,sans-serif;
  font-size:15px;
  font-weight:400;
  line-height:1;
  letter-spacing:0;
}
.home-page .integrated-home-copy .btn:hover{
  gap:13px;
  border-bottom-color:var(--gold);
  background:transparent;
  color:var(--burg);
  transform:none;
}

/* Footer content stays on the shared 1440px grid while its background and
   top rule extend to both browser edges on wide displays. */
footer{
  position:relative;
  isolation:isolate;
  background:transparent;
  border-top:0;
}
footer::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  bottom:0;
  left:50%;
  width:100vw;
  transform:translateX(-50%);
  background:var(--paper);
  border-top:1px solid var(--hairline);
  pointer-events:none;
}

@media(max-width:850px){
  .home-page .integrated-home-copy .lead{
    width:auto;
    max-width:540px;
  }
}

/* ============================================================
   TYPOGRAPHY SYSTEM NORMALISATION — OCTOBER 2026
   18px Arial = key introductory statements
   16px Arial = ordinary body copy
   Georgia = display headings
   ============================================================ */
.home-page .integrated-home-copy .lead,
.about-page .about-story .prose p:first-child{
  font-family:Arial,sans-serif !important;
  font-size:18px !important;
  font-weight:400 !important;
  font-style:italic !important;
  line-height:1.45 !important;
}
.home-page .integrated-home-copy p:not(.lead),
.about-page .about-story .prose p:not(:first-child){
  font-family:Arial,sans-serif !important;
  font-size:16px !important;
  font-weight:400 !important;
}
/* ============================================================
   STRAPLINE WEIGHT REFINEMENT — OCTOBER 2026
   Match the lighter rendered treatment from the approved earlier
   Home page: 16px Arial, regular weight, italic, 1.58 line-height.
   Apply the same treatment to the About opening statement.
   ============================================================ */
.home-page .integrated-home-copy .lead,
.about-page .about-story .prose p:first-child{
  font-family:Arial,sans-serif !important;
  font-size:16px !important;
  font-weight:400 !important;
  font-style:italic !important;
  line-height:1.58 !important;
  letter-spacing:normal !important;
  color:rgb(52,58,59) !important;
}

/* Keep both header lines aligned, using the name to set the lockup width. */
header .brand{
  position:relative;
  display:inline-block;
  flex-shrink:0;
  padding-bottom:19.5px;
}
header .brand-name{
  display:block;
  white-space:nowrap;
}
header .brand small{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  margin:0;
  white-space:nowrap;
  letter-spacing:0;
}
/* Match the name immediately, without a post-load spacing adjustment. */
header .brand-descriptor-spacing{
  display:flex;
  justify-content:space-between;
  width:100%;
}
header .brand-descriptor-spacing > span{
  flex:0 0 auto;
  white-space:pre;
}
/* Keep one continuous descriptor available to assistive technology. */
header .brand-descriptor-text{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  border:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}

/* Return links follow each case study's final paragraph on the same text edge. */
.case-study-detail-page .case-detail-back-inline{
  display:flex;
  align-items:flex-start;
  margin:36px 0 0;
  padding:0;
}
.case-study-detail-page .case-detail-back-inline .btn{
  margin-top:0;
}

/* Home: a quiet, immediately visible endorsement beside the original artwork. */
.home-page .home-inline-testimonial{
  width:clamp(205px, 17.6vw, 285px);
  max-width:none;
  margin:30px 0 0 -3px;
  padding:0 0 0 15px;
  border-left:2px solid var(--burg);
  color:var(--navy);
}
.home-page .home-inline-testimonial blockquote{margin:0;padding:0}
.home-page .home-inline-testimonial blockquote p{
  font-family:Georgia,serif !important;
  font-size:16px !important;
  font-style:italic !important;
  font-weight:400 !important;
  line-height:1.45 !important;
  letter-spacing:-.008em;
  color:var(--burg) !important;
  text-indent:0;
  margin:0 !important;
  max-width:none !important;
}
.home-page .home-inline-testimonial figcaption{
  display:flex;
  flex-direction:column;
  margin:11px 0 0;
  color:var(--navy);
  font:normal 13px/1.45 Arial,sans-serif;
}
.home-page .home-inline-testimonial figcaption strong{
  font-weight:600;
}
.home-page .home-inline-testimonial figcaption span{
  font-size:12px;
  color:var(--navy);
}
@media(min-width:851px) and (max-width:1120px){
  .home-page .home-inline-testimonial{
    width:43vw;
    margin-top:24px;
  }
  .home-page .home-inline-testimonial blockquote p{
    font-size:16px !important;
  }
}
@media(max-width:850px){
  .home-page .home-inline-testimonial{
    width:auto;
    max-width:560px;
    margin-top:32px;
    margin-left:0;
  }
  .home-page .home-inline-testimonial blockquote p{
    font-size:17px !important;
  }
}

/* Give the narrow desktop left-column quote enough space beneath the CTA. */
@media(min-width:1121px) and (max-width:1280px){
  .home-page .integrated-home-hero{min-height:825px}
}


/* Ian Duke testimonial placements, echoing Gill's burgundy line and italic treatment. */
.editorial-testimonial{
  box-sizing:border-box;
  max-width:700px;
  margin:36px 0;
  padding:2px 0 2px 19px;
  border-left:2px solid var(--burg);
  color:var(--navy);
}
.editorial-testimonial blockquote{margin:0;padding:0;border:0}
.editorial-testimonial blockquote p{
  margin:0 !important;
  font-family:Georgia,serif !important;
  font-size:17px !important;
  font-weight:400 !important;
  font-style:italic !important;
  line-height:1.55 !important;
  letter-spacing:-.008em;
  color:var(--burg) !important;
  text-indent:0;
}
.editorial-testimonial figcaption{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-top:14px;
  color:var(--navy);
  font:normal 13px/1.45 Arial,sans-serif;
}
.editorial-testimonial figcaption strong{font-weight:600}
.editorial-testimonial figcaption span{font-size:12px}
.case-study-detail-page .crawley-testimonial blockquote p + p{
  margin-top:14px !important;
}
.case-study-detail-page .crawley-testimonial{
  margin:40px 0 12px;
  max-width:630px;
}
/* Ian Duke's endorsement closes the entire two-column When page.
   It spans both columns, rather than interrupting the challenges list. */
.when-page .split > .when-testimonial{
  grid-column:1 / -1;
  justify-self:center;
  width:min(100%, 890px);
  max-width:none;
  margin:-22px 0 0;
  padding:24px 0 0;
  border-left:0;
  border-top:1px solid rgba(117,22,56,.32);
  text-align:center;
}
.when-page .split > .when-testimonial blockquote p{
  font-size:18px !important;
  line-height:1.52 !important;
  white-space:normal;
}
.when-page .split > .when-testimonial figcaption{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:center;
  gap:0 6px;
  margin-top:12px;
}
.when-page .split > .when-testimonial figcaption strong::after{
  content:" ·";
  font-weight:400;
}
@media(max-width:850px){
  .editorial-testimonial{padding-left:15px}
  .editorial-testimonial blockquote p{font-size:16px !important;line-height:1.57 !important}
  .when-page .split > .when-testimonial{
    grid-column:1;
    width:100%;
    margin:-16px 0 0;
    padding:22px 0 0;
  }
  .when-page .split > .when-testimonial blockquote p{
    font-size:16px !important;
    line-height:1.57 !important;
  }
}

/* How I Work closing endorsement — same full-width treatment as the When to Bring Me In testimonial. */
.how-page .split > .how-testimonial{
  grid-column:1 / -1;
  justify-self:center;
  width:min(100%, 890px);
  max-width:none;
  margin:-22px 0 0;
  padding:24px 0 0;
  border-left:0;
  border-top:1px solid rgba(117,22,56,.32);
  text-align:center;
}
.how-page .split > .how-testimonial blockquote p{
  font-size:18px !important;
  line-height:1.52 !important;
  white-space:normal;
}
.how-page .split > .how-testimonial figcaption{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:center;
  gap:0 6px;
  margin-top:12px;
}
.how-page .split > .how-testimonial figcaption strong::after{
  content:" ·";
  font-weight:400;
}
@media(max-width:850px){
  .how-page .split > .how-testimonial{
    grid-column:1;
    width:100%;
    margin:-16px 0 0;
    padding:22px 0 0;
  }
  .how-page .split > .how-testimonial blockquote p{
    font-size:16px !important;
    line-height:1.57 !important;
  }
}