/* GENERATED by build/pho-el/make_css.py - do not edit on the server. Source: build/pho/pho.css */
/* Website Design: page level adjustments only, plus two new blocks: the fill card that carries its own
   sibling link, and the single featured quote. */

/* ---------- 01 hero ---------- */
.bhp-pho.chero .paths{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.bhp-pho.chero .paths .btn{flex:0 0 auto}
.bhp-pho .cta-core .paths.mid{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;
  margin-top:clamp(22px,3vh,28px)}
.bhp-pho.chero .tag .ln{white-space:normal}
.bhp-pho .ec-fig b{font-size:26px}
.bhp-pho .ec-fig small{max-width:88px}

/* ---------- 02 the answer column ---------- */
.bhp-pho .a2 .erow{align-items:stretch}
.bhp-pho .lead-col{display:flex;flex-direction:column;justify-content:flex-start}
.bhp-pho .lead-col p{font-size:20px!important;line-height:1.7;color:var(--navy);max-width:46ch}

/* ---------- the head sits inside the copy column wherever a device stands beside it ---------- */
.bhp-pho .erow.topalign{align-items:stretch;margin-top:0}
.bhp-pho .erow.topalign .ecol .shead{margin-bottom:clamp(14px,1.8vh,18px)}
.bhp-pho .erow.topalign .ecol > p:first-of-type{margin-top:0}
.bhp-pho .a2 .erow.topalign + .closeband{margin-top:clamp(28px,3.4vh,38px)}
.bhp-pho .ecol p.moat{margin-top:auto;padding-top:clamp(14px,2vh,20px)}
.bhp-pho .ecol .subh{color:var(--navy)}

/* ---------- 04 the standards strip ---------- */
.bhp-pho .a4 .statrow.four{display:grid;grid-template-columns:repeat(4,1fr)}
.bhp-pho .statrow .lstat .fig{font-size:clamp(26px,2.6vw,38px)}
@media (max-width:900px){.bhp-pho .a4 .statrow.four{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.bhp-pho .a4 .statrow.four{grid-template-columns:1fr}}
.bhp-pho.sec-white .statrow .lstat p,.bhp-pho.sec-cream .statrow .lstat p{color:var(--on-light-2)!important}
.bhp-pho.sec-white .statrow .lstat,.bhp-pho.sec-cream .statrow .lstat{border-color:var(--line-light)}

/* ---------- 06, 07 and 13 the two across card grids ---------- */
.bhp-pho .svcgrid.two{display:grid;grid-template-columns:repeat(2,1fr)}
@media (max-width:820px){.bhp-pho .svcgrid.two{grid-template-columns:1fr}}

/* ---------- 11 the engine grid: three sibling links as doors ---------- */
.bhp-pho .enggrid.three{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px);
  margin-top:clamp(30px,3.8vh,42px)}
.bhp-pho .engcard{position:relative;display:flex;flex-direction:column;gap:14px;
  padding:clamp(22px,2.6vh,28px) clamp(20px,2vw,24px);border-radius:14px;text-decoration:none;
  background:rgba(247,242,231,.05);border:1px solid rgba(247,242,231,.14);
  transition:transform .22s ease,border-color .22s ease,background .22s ease}
.bhp-pho .engcard:hover{transform:translateY(-3px);border-color:rgba(255,176,0,.55);
  background:rgba(247,242,231,.09)}
.bhp-pho .engcard:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.bhp-pho .engcard .sysn{font-family:var(--body);font-size:11px;font-weight:500;letter-spacing:.16em;
  color:var(--gold)}
.bhp-pho .engcard .engt{font-family:var(--disp);font-weight:600;font-size:clamp(16px,1.35vw,19px);
  line-height:1.3;letter-spacing:-.02em;color:#fff}
.bhp-pho .engcard .engarrow{margin-top:auto;width:22px;height:10px;background:var(--gold);
  clip-path:polygon(0 45%,72% 45%,72% 0,100% 50%,72% 100%,72% 55%,0 55%);opacity:.85;
  transition:transform .22s ease}
.bhp-pho .engcard:hover .engarrow{transform:translateX(5px)}
@media (max-width:820px){.bhp-pho .enggrid.three{grid-template-columns:1fr}}

/* the proof band's closing copy sits on deep navy */
.bhp-pho.sec-deep .secfollow,.bhp-pho.sec-deep .secfollow p{color:var(--on-dark-2)}


.bhp-pho .pcard{display:flex;flex-direction:column;padding:clamp(24px,2.8vh,30px) clamp(22px,2.2vw,28px);
  border-radius:14px;background:var(--field-cream);border:1px solid var(--line-light);position:relative;
  overflow:hidden;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.bhp-pho .pcard:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(23,29,58,.1);
  border-color:rgba(255,176,0,.5)}
.bhp-pho .pcard h3{margin:10px 0 0;font-family:var(--disp);font-weight:600;font-size:clamp(19px,1.6vw,22px);
  line-height:1.24;letter-spacing:-.02em;color:var(--navy)}
.bhp-pho .pcard p{margin:10px 0 0;font-size:15px;line-height:1.75;color:var(--on-light-2)}

/* ---------- 16 the note under the final CTA ---------- */
.bhp-pho .ctanote{margin:clamp(16px,2.2vh,22px) 0 0;font-family:var(--body);font-size:14px;
  letter-spacing:.04em;color:rgba(247,242,231,.56);text-align:center}

/* a row that follows another block keeps its own spacing: the shared rule zeroes it */
.bhp-pho .statrow + .erow,.bhp-pho .fillgrid + .closeband{margin-top:clamp(28px,3.4vh,38px)}

/* ---------- 04 the gallery: eight slots awaiting their portfolio selects ----------
   The brief has web dev swap these for approved photographs from Branded Assets. Until then the grid
   shows the shot each slot holds, so the section is structurally finished and obviously unfilled,
   rather than eight broken images. */
.bhp-pho .ggrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px);
  margin-top:clamp(28px,3.6vh,38px)}
.bhp-pho .gslot{position:relative;margin:0;aspect-ratio:4/3;border-radius:12px;display:flex;
  flex-direction:column;justify-content:flex-end;padding:clamp(14px,1.8vh,18px);
  background:linear-gradient(168deg,rgba(23,29,58,.06),rgba(23,29,58,.03));
  border:1px dashed var(--line-light)}
.bhp-pho .gslot .gnum{position:absolute;top:clamp(12px,1.6vh,16px);left:clamp(14px,1.8vh,18px);
  font-family:var(--body);font-size:11px;font-weight:500;letter-spacing:.16em;color:var(--gold-deep)}
.bhp-pho .gslot figcaption{font-family:var(--body);font-size:13px;line-height:1.5;color:var(--on-light-2)}
.bhp-pho .gnote{margin:clamp(16px,2.2vh,22px) 0 0;font-family:var(--body);font-size:13px;
  letter-spacing:.02em;color:var(--slate);opacity:.85}
@media (max-width:900px){.bhp-pho .ggrid{grid-template-columns:repeat(2,1fr)}}

/* ---------- 10 two sibling doors instead of three ---------- */
.bhp-pho .enggrid.two{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,1.6vw,20px);
  margin-top:clamp(30px,3.8vh,42px)}
@media (max-width:700px){.bhp-pho .enggrid.two{grid-template-columns:1fr}}

/* ---------- 12 the team runs three across on this page ---------- */
.bhp-pho .svcgrid.three{display:grid;grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.bhp-pho .svcgrid.three{grid-template-columns:1fr}}


/* ---------- Elementor parity for this page ---------- */
.bhp-pho .paths .elementor-widget-button{width:auto;flex:0 0 auto}
.bhp-pho .paths{display:flex}
.bhp-pho .shead.e-con{margin-block-end:20px!important}
/* the head-to-first-block gap is the head's own margin; a row that follows another block keeps its space */
.bhp-pho .shead + .erow.e-con,.bhp-pho .shead + .statrow.e-con,.bhp-pho .shead + .prail.e-con,
.bhp-pho .shead + .flow.e-con,.bhp-pho .shead + .svcgrid.e-con,
.bhp-pho .shead + .svcgrid.three.e-con,.bhp-pho .shead + .statrow.e-con,
.bhp-pho .shead + .isel.e-con,.bhp-pho .shead + .tgrid.e-con,
.bhp-pho .shead + .elementor-widget-bhp_index_selector{margin-block-start:0!important}
.bhp-pho .erow.e-con{margin-block-start:clamp(28px,3.4vh,38px)!important}
/* the author headshot matches the other pages exactly: 56 by 70 on a 12px corner */
.bhp-pho .author .abox img{width:56px;height:70px;border-radius:12px;object-fit:cover}
.bhp-pho .author .abox .elementor-widget-image{width:auto;flex:0 0 auto}
/* the shared text-editor rule outranks Elementor's own per widget CSS for these two, so both are
   stated here: the closing link line and the note under the final CTA */
.bhp-pho .ecol .moat p,.bhp-pho .ecol .moat p a{font-size:15px;line-height:24.3px}
.bhp-pho .ctanote p{color:rgba(247,242,231,.56)!important;font-size:14px;line-height:1.62}
/* 04 and 05 the figure strips */
.bhp-pho .statrow.four.e-con{display:grid!important;grid-template-columns:repeat(4,1fr)!important}
.bhp-pho .statrow.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.bhp-pho .sec-white .statrow .lstat .elementor-widget-text-editor p,
.bhp-pho .sec-cream .statrow .lstat .elementor-widget-text-editor p{color:var(--on-light-2)!important}
.bhp-pho .sec-white .statrow .lstat.e-con,.bhp-pho .sec-cream .statrow .lstat.e-con{border-color:var(--line-light)}
/* 13 the three card team grid */
.bhp-pho .svcgrid.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
/* 06, 07 and 13 the two across card grids */
.bhp-pho .svcgrid.two.e-con{display:grid!important;grid-template-columns:repeat(2,1fr)!important}
/* 04 the gallery slots */
.bhp-pho .ggrid.e-con{display:grid!important;grid-template-columns:repeat(4,1fr)!important}
.bhp-pho .gslot.e-con{aspect-ratio:4/3;justify-content:flex-end;position:relative}
.bhp-pho .gslot .gnum{position:absolute;top:clamp(12px,1.6vh,16px);left:clamp(14px,1.8vh,18px)}
/* 10 two sibling doors */
.bhp-pho .enggrid.two.e-con{display:grid!important;grid-template-columns:repeat(2,1fr)!important}
/* 12 the team runs three across here */
.bhp-pho .svcgrid.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.bhp-pho .engcard.e-con{height:100%}
.bhp-pho .engcard .engt a{color:#fff;text-decoration:none;border:0}
.bhp-pho .engcard .engarrow.e-con{width:22px;min-height:10px;height:10px;background:var(--gold);
  clip-path:polygon(0 45%,72% 45%,72% 0,100% 50%,72% 100%,72% 55%,0 55%);opacity:.85;
  transition:transform .22s ease}
.bhp-pho .engcard:hover .engarrow.e-con{transform:translateX(5px)}
/* 02: the row is the section's first block, so it carries no top margin of its own */
.bhp-pho .a2 .erow.e-con{margin-block-start:0!important}
/* the head sits inside the copy column wherever a device stands beside it, so the device's top edge
   lines up with the headline instead of starting below it */
.bhp-pho .erow.topalign.e-con{margin-block-start:0!important}
.bhp-pho .erow.topalign .ecol .shead.e-con{margin-block-end:16px!important}
.bhp-pho .svcledger.e-con{display:flex}
.bhp-pho .svcrow.e-con{align-items:start}
.bhp-pho .svcname .elementor-heading-title{color:var(--navy)}
.bhp-pho .svcrow:hover .svcname h3.elementor-heading-title{color:var(--gold-deep)}
.bhp-pho .svctext .elementor-widget-text-editor p{max-width:66ch}
/* 06 the funding band runs three figures */
.bhp-pho .statrow.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.bhp-pho .a6 .statrow .lstat .fig .elementor-heading-title{font-size:clamp(26px,2.4vw,34px)}
/* 02 the covers panel */
.bhp-pho .verdict.e-con{align-self:stretch;border-radius:14px;overflow:hidden;position:relative;
  padding:clamp(22px,2.8vh,28px) clamp(20px,2vw,26px);background:var(--field-navy);
  box-shadow:0 24px 60px rgba(23,29,58,.2)}
.bhp-pho .verdict.e-con::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 60% at 100% 0%,rgba(255,176,0,.16),rgba(255,176,0,0) 70%)}
.bhp-pho .verdict .vrow.e-con{position:relative}
.bhp-pho .lead-col .elementor-widget-text-editor p{font-size:20px;line-height:1.7;max-width:46ch}
.bhp-pho .a2 .shead.e-con{margin-block-end:16px!important}
/* 08 the three models */
.bhp-pho .svcgrid.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.bhp-pho .svcgrid.two .svc.e-con{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.bhp-pho .svcgrid.two .svc.e-con:hover{transform:translateY(-3px);
  box-shadow:0 22px 54px rgba(23,29,58,.12);border-color:rgba(255,176,0,.45)}
.bhp-pho .secfollow p{max-width:92ch}
/* 06 the record */
.bhp-pho .statrow.four.e-con{display:grid!important;grid-template-columns:repeat(4,1fr)!important}
.bhp-pho .statrow .lstat .fig .elementor-heading-title{color:var(--gold)!important}
/* 08 the process rail */
.bhp-pho .prail.e-con{position:relative;padding:0}
.bhp-pho .prow.e-con{position:relative}
.bhp-pho .prow.e-con:not(.last)::before{content:"";position:absolute;left:21px;top:38px;bottom:-6px;
  width:2px;background:linear-gradient(180deg,rgba(255,176,0,.55),rgba(255,176,0,.3))}
.bhp-pho .pnodewrap.e-con{position:relative;z-index:1;flex:0 0 44px}
.bhp-pho .pnode .elementor-heading-title{display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;background:#fff;border:1.5px solid rgba(255,176,0,.55);
  color:var(--gold-deep);box-shadow:0 0 0 6px var(--cream);
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease}
.bhp-pho .pbody.e-con{padding:clamp(16px,2vh,20px) clamp(20px,2vw,26px);border-radius:14px;
  background:var(--field-cream);border:1px solid var(--line-light);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.bhp-pho .pbody .elementor-widget-text-editor p{max-width:78ch}
.bhp-pho .prow.e-con:hover .pnode .elementor-heading-title{background:var(--gold);border-color:var(--gold);
  color:var(--navy);transform:scale(1.06)}
.bhp-pho .prow.e-con:hover .pbody.e-con{transform:translateX(4px);box-shadow:0 18px 44px rgba(23,29,58,.1);
  border-color:rgba(255,176,0,.45)}
.bhp-pho .prow.last .pnode .elementor-heading-title{background:var(--gold);border-color:var(--gold);
  color:var(--navy)}
.bhp-pho .prow.last .pbody.e-con{border-color:rgba(255,176,0,.45)}
/* 07 the cost band runs three figures */
.bhp-pho .statrow.three.e-con{display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.bhp-pho .a7 .statrow .lstat .fig .elementor-heading-title{font-size:clamp(26px,2.4vw,34px)}
/* 05 and 06 the subheads inside the copy column */
.bhp-pho .sec-white .subh .elementor-heading-title,
.bhp-pho .sec-cream .subh .elementor-heading-title{color:var(--navy)}
/* 11 the four stage flow */
.bhp-pho .flow.four.e-con{display:grid!important;grid-template-columns:repeat(4,1fr)!important}
.bhp-pho .fstage.e-con{position:relative;padding:clamp(24px,3vh,30px) clamp(22px,2.2vw,28px);
  border-radius:14px;background:#fff;border:1px solid var(--line-light);
  box-shadow:0 14px 40px rgba(23,29,58,.06)}
/* the step card's gold edge is a border now, stated once in bhp-fes-el.css, so the old
   pseudo-element bar is gone from every page rather than redrawn on each one */
/* the vertical band label wraps instead of setting the band height */
.bhp-pho .closeband .ck .elementor-heading-title{writing-mode:vertical-rl;transform:rotate(180deg);
  max-height:110px;white-space:normal;line-height:1.35}
.bhp-pho .closeband.e-con{width:auto}
/* 12 the dual author box */
.bhp-pho .author.dual.e-con{display:grid!important;grid-template-columns:1fr 1fr!important;
  align-items:start!important;max-width:920px;margin-inline:auto}
.bhp-pho .author.dual > .elementor-widget-heading{grid-column:1 / -1;justify-self:center;padding-top:8px}
.bhp-pho .author.dual .abox img{width:56px!important;height:70px;object-fit:cover;object-position:50% 20%;
  border-radius:12px}
/* custom widget buttons never inherit the theme's link colour */
.bhp-pho .econ button{color:#fff}
@media (max-width:1100px){
  .bhp-pho .flow.four.e-con{grid-template-columns:repeat(2,1fr)!important}
}
@media (max-width:900px){
  .bhp-pho .svcgrid.two.e-con{grid-template-columns:1fr!important}
  .bhp-pho .pnodewrap.e-con{flex:0 0 36px}
  .bhp-pho .pnode .elementor-heading-title{width:36px;height:36px;font-size:16px;
    box-shadow:0 0 0 5px var(--cream)}
  .bhp-pho .prow.e-con:not(.last)::before{left:17px;top:32px}
  .bhp-pho .author.dual.e-con{grid-template-columns:1fr!important}
}
@media (max-width:900px){
  .bhp-pho .statrow.four.e-con{grid-template-columns:repeat(2,1fr)!important}
  .bhp-pho .statrow.three.e-con{grid-template-columns:1fr!important}
  .bhp-pho .svcgrid.two.e-con{grid-template-columns:1fr!important}
  .bhp-pho .enggrid.two.e-con{grid-template-columns:1fr!important}
  .bhp-pho .ggrid.e-con{grid-template-columns:repeat(2,1fr)!important}
  .bhp-pho .svcgrid.three.e-con{grid-template-columns:1fr!important}
}
@media (max-width:700px){
  .bhp-pho .svcgrid.three.e-con{grid-template-columns:1fr!important}
  .bhp-pho .statrow.three.e-con{grid-template-columns:1fr!important}
  .bhp-pho .statrow.four.e-con{grid-template-columns:1fr!important}
  .bhp-pho .flow.four.e-con{grid-template-columns:1fr!important}
}

/* ==========================================================================
   2026-09-17: the gallery slots carry real photography.

   Seven of the eight now hold Radix Recovery work that was already in the media library and was
   never being used. A filled slot is a photograph with its number and caption beneath it, so the
   picture is the tile rather than a background behind text. The eighth keeps the dashed marker,
   because there is no admissions desk photograph to put under that caption.
   ========================================================================== */
.bhp-pho .gslot:not(.gslot-empty).e-con{
  aspect-ratio:auto;padding:0;border:0;background:none;justify-content:flex-start}
.bhp-pho .gslot:not(.gslot-empty) .gnum{position:static;margin:12px 0 2px}
.bhp-pho .gslot:not(.gslot-empty) .elementor-widget-image{margin:0;width:100%}
.bhp-pho .gslot:not(.gslot-empty) .elementor-widget-image img{
  display:block;width:100%;height:168px;object-fit:cover;border-radius:12px}
.bhp-pho .gslot:not(.gslot-empty) .gcap p{margin:0}
@media (max-width:767px){
  .bhp-pho .gslot:not(.gslot-empty) .elementor-widget-image img{height:200px}
}
