/* ==========================================================================
   Nextalent — Organisation Design & Change Management
   Page-scoped styles. Loaded after style.css, so it wins ties.
   Design frame: 1280px, 52px gutter → 1176px content column.
   ========================================================================== */

.s-organisation-design-hero,
.s-organisation-design-shift,
.s-organisation-design-equilibrium,
.s-organisation-design-focus,
.s-organisation-design-dividends,
.s-organisation-design-conviction,
.s-organisation-design-cta {
  /* The shared "Figma orange" of the sixteen practice pages. On this frame it
     is the friction meter and the 8:1 figure — NOT the hero CTA, which this
     frame paints in the deeper rust below. */
  --od-orange:      #F08A5D;
  --od-orange-ink:  #E67A49;   /* hover                                       */

  /* The hero CTA, measured off the frame: a burnt rust with white lettering,
     not the lighter meter orange. */
  --od-cta:         #99450A;
  --od-cta-ink:     #803906;   /* hover                                       */

  /* The deep teal-green the frame uses for the healthy half of every reading:
     the layers meter, the cellular legend, the 2.8x and < 90d figures.
     --green-900 is the greyer brand green and stays on the closing panel. */
  --od-deep:        #19574E;
  --od-deep-soft:   #2E7D6E;
  --od-mint:        #2FC2B0;   /* the Live Model pill                         */
  --od-mint-wash:   #DFF4EE;   /* its tint, and the active pod                */

  /* Warm sands measured off the frame — no token covers them. */
  --od-sand:        #F5EDE1;   /* telemetry card, schema card                 */
  --od-beige:       #F5F0EA;   /* the dividends band                          */
  --od-inset:       #F7F1E8;   /* key-deliverables panel, schema stat tiles   */
  --od-rose:        #F6E2E0;   /* the fragmented pyramid segments             */
  --od-rose-ink:    #C96A5B;   /* "Endless Friction"                          */
  --od-sand-line:   rgba(31, 37, 35, .10);
}

/* Structural wrappers: grid / flex children that carry the long Indonesian
   strings, so each has to be allowed to shrink below its own min-content. */
.s-organisation-design-hero__copy,
.s-organisation-design-shift__copy,
.s-organisation-design-shift__schema-heading,
.s-organisation-design-focus__heading,
.s-organisation-design-conviction__body { min-width: 0; }

/* ---- shared small primitives ------------------------------------------- */
.s-organisation-design-hero__panel-title,
.s-organisation-design-shift__legend-label,
.s-organisation-design-shift__tile-label,
.s-organisation-design-focus__badge,
.s-organisation-design-focus__deliverables-title,
.s-organisation-design-dividends__badge,
.s-organisation-design-dividends__caption {
  font-family: var(--sans);
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  line-height: 1.4;
}

/* the serif card titles across the page */
.s-organisation-design-shift__schema-title,
.s-organisation-design-focus__name,
.s-organisation-design-dividends__name {
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -.005em;
  color: var(--ink-900);
  overflow-wrap: break-word;
}

/* The frame runs its section headings a step under the 44px primitive. */
.s-organisation-design-shift__title,
.s-organisation-design-focus__title,
.s-organisation-design-dividends__title { font-size: 40px; line-height: 1.18; }

/* base.css resets p / figure / ul but not blockquote, which still carries the
   browser's own 1em 40px margin — both pull quotes need it cleared */
.s-organisation-design-equilibrium__quote,
.s-organisation-design-conviction__quote {
  margin: 0;
  overflow-wrap: break-word;
}

/* ==========================================================================
   1 — hero
   ========================================================================== */
.s-organisation-design-hero { padding-block: 48px 56px; }

.s-organisation-design-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 382px;
  gap: 72px;
  align-items: start;
}

.s-organisation-design-hero__eyebrow {
  font-size: 10.5px;
  letter-spacing: .15em;
  margin-bottom: 20px;
}

.s-organisation-design-hero__title {
  margin: 0 0 24px;
  font-family: var(--serif);
  font-weight: 400;
  font-size: 54px;
  line-height: 1.18;
  letter-spacing: normal;
  color: var(--ink-900);
  overflow-wrap: break-word;
}
.s-organisation-design-hero__line { display: block; }
.s-organisation-design-hero__line--serif {
  font-style: italic;
  color: var(--terracotta);
}

.s-organisation-design-hero__lede {
  max-width: 620px;
  margin-bottom: 30px;
}

.s-organisation-design-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

/* the frame's rust CTA — .btn keeps the shape, the colour is this page's */
.s-organisation-design-hero__cta {
  background: var(--od-cta);
  color: var(--on-dark);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 0 28px;
}
.s-organisation-design-hero__cta:hover { background: var(--od-cta-ink); }

.s-organisation-design-hero__cta-2 {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 0 26px;
}

/* the frame runs this pair a notch under the 52px .btn height */
.s-organisation-design-hero__cta,
.s-organisation-design-hero__cta-2 { height: 44px; }

/* ---- telemetry card ---- */
.s-organisation-design-hero__panel {
  background: var(--od-sand);
  border-radius: var(--radius-lg);
  padding: 20px 22px 24px;
  box-shadow: var(--shadow-soft);
}

.s-organisation-design-hero__panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 22px;
}

.s-organisation-design-hero__panel-title {
  margin: 0;
  font-size: 9.5px;
  letter-spacing: .16em;
  color: var(--ink-500);
}

.s-organisation-design-hero__pill {
  flex: none;
  border-radius: 999px;
  background: var(--od-mint);
  color: #0C3A33;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 4px 11px;
  white-space: nowrap;
}

.s-organisation-design-hero__row + .s-organisation-design-hero__row { margin-top: 20px; }

.s-organisation-design-hero__row-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 8px;
  margin-bottom: 9px;
}

.s-organisation-design-hero__row-label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13px;
  line-height: 1.35;
  color: var(--ink-700);
}

.s-organisation-design-hero__row-figure {
  flex: none;
  font-family: var(--serif);
  font-size: 26px;
  line-height: 1.1;
  color: var(--ink-900);
}

/* The frame sets this note in sentence case ("-38% compression"), not caps —
   and in ID the whole row collapses into this slot, so uppercasing it would
   shout "SKOR FACI 18MD" where the sheet reads "Skor FACI 18md". */
.s-organisation-design-hero__row-note {
  flex: none;
  font-family: var(--sans);
  font-weight: 500;
  font-size: 8.5px;
  line-height: 1.4;
  letter-spacing: .06em;
  text-transform: none;
  color: var(--ink-400);
}

.s-organisation-design-hero__track {
  display: block;
  height: 5px;
  border-radius: 999px;
  background: var(--od-sand-line);
  overflow: hidden;
}
.s-organisation-design-hero__fill {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.s-organisation-design-hero__fill--deep { width: 66%; background: var(--od-deep); }
.s-organisation-design-hero__fill--warm { width: 27%; background: var(--od-orange); }

/* ==========================================================================
   2 — when structure bottlenecks strategic momentum
   ========================================================================== */
.s-organisation-design-shift { padding-block: 44px 56px; }

.s-organisation-design-shift__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 52px;
  align-items: start;
}

.s-organisation-design-shift__eyebrow {
  font-size: 10.5px;
  letter-spacing: .15em;
  margin-bottom: 16px;
}

.s-organisation-design-shift__title { margin-bottom: 26px; max-width: 520px; }

.s-organisation-design-shift__ruled {
  border-left: 2px solid var(--terracotta);
  padding-left: 20px;
  font-size: 16px;
  line-height: 1.72;
  color: var(--ink-600);
  margin-bottom: 24px;
}

.s-organisation-design-shift__body {
  font-size: 14px;
  line-height: 1.75;
  color: var(--ink-500);
  max-width: 540px;
}

/* ---- diagnostic schema card ---- */
.s-organisation-design-shift__schema {
  background: var(--od-sand);
  border-radius: var(--radius-lg);
  padding: 20px;
  box-shadow: var(--shadow-soft);
}

.s-organisation-design-shift__schema-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}

.s-organisation-design-shift__schema-eyebrow {
  font-size: 9.5px;
  letter-spacing: .16em;
  margin-bottom: 5px;
}

.s-organisation-design-shift__schema-title {
  font-size: 24px;
  line-height: 1.2;
}

.s-organisation-design-shift__state {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--od-sand-line);
  padding: 6px 13px;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--ink-700);
  white-space: nowrap;
}
.s-organisation-design-shift__state::before {
  content: "";
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--od-mint);
  flex: none;
}

.s-organisation-design-shift__board {
  background: var(--surface);
  border-radius: var(--radius);
  padding: 18px 18px 22px;
}

.s-organisation-design-shift__legend {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.s-organisation-design-shift__legend-label {
  font-size: 9.5px;
  letter-spacing: .14em;
  color: var(--ink-400);
  min-width: 0;
}
.s-organisation-design-shift__legend-label--good { color: var(--od-deep); }

.s-organisation-design-shift__legend-value {
  flex: none;
  font-size: 11px;
  font-weight: 600;
}
.s-organisation-design-shift__legend-value--bad  { color: var(--od-rose-ink); }
.s-organisation-design-shift__legend-value--good { color: var(--od-deep-soft); }

.s-organisation-design-shift__segments {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 5px;
  margin: 12px 0 22px;
}
.s-organisation-design-shift__segments span {
  display: block;
  height: 10px;
  border-radius: 3px;
  background: var(--od-rose);
}

/* ---- the node diagram ---- */
.s-organisation-design-shift__nodes {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin-top: 18px;
}

.s-organisation-design-shift__node {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 74px;
  height: 74px;
  border-radius: 50%;
  padding: 8px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.3;
  text-transform: uppercase;
}
.s-organisation-design-shift__node--core {
  border: 1.5px solid var(--od-deep);
  color: var(--od-deep);
  background: var(--surface);
}
.s-organisation-design-shift__node--out {
  border: 1.5px solid var(--terracotta);
  background: #FAE2D3;
  color: #8A4524;
}

.s-organisation-design-shift__wire,
.s-organisation-design-shift__arrow {
  flex: none;
  color: var(--ink-700);
}
.s-organisation-design-shift__wire-faint { opacity: .22; }

.s-organisation-design-shift__pods {
  flex: 0 1 132px;
  min-width: 0;
  display: grid;
  gap: 5px;
}
.s-organisation-design-shift__pod {
  border-radius: var(--radius-sm);
  background: var(--od-inset);
  padding: 7px 10px;
  font-size: 10.5px;
  color: var(--ink-500);
  text-align: center;
  overflow-wrap: break-word;
}
.s-organisation-design-shift__pod--on {
  background: var(--od-mint-wash);
  color: var(--od-deep);
  font-weight: 600;
}

/* ---- the three stat tiles ---- */
.s-organisation-design-shift__tiles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}
.s-organisation-design-shift__tile {
  background: var(--od-inset);
  border-radius: var(--radius-sm);
  padding: 12px 8px 13px;
  text-align: center;
}
.s-organisation-design-shift__tile-value {
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.15;
  color: var(--ink-900);
  margin-bottom: 5px;
}
.s-organisation-design-shift__tile-value--warm { color: var(--od-orange-ink); }
.s-organisation-design-shift__tile-value--deep { color: var(--od-deep); }
.s-organisation-design-shift__tile-label {
  font-size: 8.5px;
  letter-spacing: .1em;
  color: var(--ink-400);
  overflow-wrap: break-word;
}

/* ==========================================================================
   3 — human equilibrium band
   ========================================================================== */
.s-organisation-design-equilibrium { padding-block: 10px 48px; }

.s-organisation-design-equilibrium__band {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--green-900);
}

.s-organisation-design-equilibrium__photo {
  width: 100%;
  height: 320px;
  object-fit: cover;
  object-position: 50% 65%;
}

.s-organisation-design-equilibrium__overlay {
  position: absolute;
  inset: auto 0 0 0;
  padding: 0 32px 30px;
  background: linear-gradient(to top,
              rgba(16, 24, 21, .80) 0%,
              rgba(16, 24, 21, .52) 45%,
              rgba(16, 24, 21, 0) 100%);
  padding-top: 90px;
}

.s-organisation-design-equilibrium__eyebrow {
  font-size: 9.5px;
  letter-spacing: .18em;
  color: var(--on-dark-faint);
  margin-bottom: 10px;
}

.s-organisation-design-equilibrium__quote p {
  font-family: var(--serif);
  font-style: italic;
  font-size: 21px;
  line-height: 1.45;
  color: var(--on-dark);
  max-width: 560px;
}

/* ==========================================================================
   4 — our focus areas
   ========================================================================== */
.s-organisation-design-focus { padding-block: 40px 56px; }

.s-organisation-design-focus__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
  gap: 48px;
  align-items: end;
  margin-bottom: 32px;
}

.s-organisation-design-focus__eyebrow {
  font-size: 10px;
  letter-spacing: .16em;
  margin-bottom: 10px;
}

.s-organisation-design-focus__lede {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-500);
  padding-bottom: 6px;
}

.s-organisation-design-focus__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.s-organisation-design-focus__card {
  display: flex;
  flex-direction: column;
  padding: 24px 24px 22px;
}

.s-organisation-design-focus__tile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 11px;
  margin-bottom: 22px;
}
.s-organisation-design-focus__tile--warm { background: #F6E4D6; color: #A8562C; }
.s-organisation-design-focus__tile--deep { background: var(--od-mint-wash); color: var(--od-deep); }

.s-organisation-design-focus__badge {
  font-size: 9.5px;
  letter-spacing: .15em;
  margin-bottom: 8px;
}
.s-organisation-design-focus__badge--warm { color: var(--terracotta); }
.s-organisation-design-focus__badge--deep { color: var(--od-deep-soft); }

.s-organisation-design-focus__name {
  font-size: 25px;
  line-height: 1.22;
  margin-bottom: 12px;
}

.s-organisation-design-focus__desc {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-500);
  margin-bottom: 24px;
}

.s-organisation-design-focus__deliverables {
  margin-top: auto;
  background: var(--od-inset);
  border-radius: var(--radius);
  padding: 15px 16px 16px;
}

.s-organisation-design-focus__deliverables-title {
  font-size: 9px;
  letter-spacing: .15em;
  color: var(--ink-700);
  margin-bottom: 10px;
}

.s-organisation-design-focus__list { display: grid; gap: 7px; }

.s-organisation-design-focus__item {
  position: relative;
  padding-left: 14px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink-600);
  overflow-wrap: break-word;
}
.s-organisation-design-focus__item::before {
  content: "";
  position: absolute;
  left: 2px;
  top: .55em;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--terracotta);
}

/* ==========================================================================
   5 — tangible dividends
   ========================================================================== */
.s-organisation-design-dividends {
  background: var(--od-beige);
  padding-block: 50px 58px;
}

.s-organisation-design-dividends__head { margin-bottom: 30px; }

.s-organisation-design-dividends__eyebrow {
  font-size: 10px;
  letter-spacing: .16em;
  margin-bottom: 10px;
}

.s-organisation-design-dividends__title { margin-bottom: 14px; }

.s-organisation-design-dividends__lede {
  max-width: 660px;
  font-size: 16px;
}

.s-organisation-design-dividends__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.s-organisation-design-dividends__card {
  display: flex;
  flex-direction: column;
  padding: 22px 24px 24px;
}

.s-organisation-design-dividends__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.s-organisation-design-dividends__badge {
  font-size: 9.5px;
  letter-spacing: .15em;
  color: var(--ink-400);
  min-width: 0;
}

.s-organisation-design-dividends__icon { flex: none; display: inline-flex; }
.s-organisation-design-dividends__icon--deep { color: var(--od-deep-soft); }
.s-organisation-design-dividends__icon--warm { color: var(--terracotta); }

.s-organisation-design-dividends__name {
  font-size: 25px;
  line-height: 1.22;
  margin-bottom: 12px;
}

.s-organisation-design-dividends__desc {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-500);
  margin-bottom: 34px;
}

.s-organisation-design-dividends__figure {
  margin-top: auto;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 12px;
}

.s-organisation-design-dividends__value {
  font-family: var(--serif);
  font-size: 42px;
  line-height: 1.05;
  color: var(--ink-900);
}
.s-organisation-design-dividends__value--deep { color: var(--od-deep); }
.s-organisation-design-dividends__value--warm { color: #B4571F; }

.s-organisation-design-dividends__caption {
  font-size: 9px;
  letter-spacing: .13em;
  color: var(--ink-400);
  max-width: 130px;
}

/* ==========================================================================
   6 — advisory conviction
   ========================================================================== */
.s-organisation-design-conviction { padding-block: 48px 48px; }

.s-organisation-design-conviction__grid {
  display: grid;
  grid-template-columns: minmax(0, 338px) minmax(0, 1fr);
  gap: 52px;
  align-items: center;
}

.s-organisation-design-conviction__photo {
  width: 100%;
  height: 290px;
  object-fit: cover;
  object-position: 50% 28%;
  border-radius: var(--radius-sm);
}

.s-organisation-design-conviction__eyebrow {
  font-size: 10px;
  letter-spacing: .16em;
  margin-bottom: 14px;
}

.s-organisation-design-conviction__quote p {
  font-family: var(--serif);
  font-style: italic;
  font-size: 36px;
  line-height: 1.42;
  letter-spacing: -.005em;
  color: var(--ink-900);
}

.s-organisation-design-conviction__by {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 26px;
}

.s-organisation-design-conviction__avatar {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--od-deep);
  color: var(--lime);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
}

.s-organisation-design-conviction__who { display: grid; gap: 2px; min-width: 0; }

.s-organisation-design-conviction__name {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-900);
}

.s-organisation-design-conviction__role {
  font-size: 11px;
  line-height: 1.45;
  color: var(--ink-400);
}

/* ==========================================================================
   7 — closing CTA
   ========================================================================== */
.s-organisation-design-cta { padding-block: 24px 56px; }

.s-organisation-design-cta__panel {
  position: relative;
  isolation: isolate;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: #141615;
  color: var(--on-dark);
  padding: 50px 56px 52px;
}
/* the frame's two corner washes — warm amber bottom-left, brand green right */
.s-organisation-design-cta__panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(62% 115% at 0% 100%, rgba(132, 76, 30, .58) 0%, rgba(132, 76, 30, 0) 60%),
    radial-gradient(60% 130% at 100% 50%, rgba(24, 68, 60, .88) 0%, rgba(24, 68, 60, 0) 70%);
}

.s-organisation-design-cta__eyebrow {
  font-size: 10px;
  letter-spacing: .17em;
  margin-bottom: 14px;
}

.s-organisation-design-cta__title {
  font-size: 52px;
  color: var(--on-dark);
  margin-bottom: 16px;
}

.s-organisation-design-cta__lede {
  max-width: 560px;
  font-size: 16px;
  line-height: 1.65;
  color: var(--on-dark-muted);
  margin-bottom: 30px;
}

.s-organisation-design-cta__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 22px;
}

.s-organisation-design-cta__btn {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 0 30px;
}

.s-organisation-design-cta__note {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  font-size: 11px;
  line-height: 1.5;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--on-dark-faint);
}
.s-organisation-design-cta__note-icon { flex: none; color: var(--od-mint); }

/* ==========================================================================
   responsive
   ========================================================================== */
@media (min-width: 1025px) and (max-width: 1279px) {
  .s-organisation-design-hero__grid { grid-template-columns: minmax(0, 1fr) 340px; gap: 44px; }
  .s-organisation-design-hero__title { font-size: 48px; }
  .s-organisation-design-shift__grid { gap: 36px; }
  .s-organisation-design-conviction__quote p { font-size: 31px; }
  .s-organisation-design-cta__panel { padding: 44px 40px 46px; }
  .s-organisation-design-cta__title { font-size: 46px; }
}

@media (max-width: 1024px) {
  .s-organisation-design-hero { padding-block: 34px 44px; }

  .s-organisation-design-hero__grid,
  .s-organisation-design-shift__grid,
  .s-organisation-design-focus__head,
  .s-organisation-design-conviction__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
    align-items: start;
  }

  .s-organisation-design-hero__panel { max-width: 460px; }
  .s-organisation-design-hero__title { font-size: 44px; }
  .s-organisation-design-hero__lede  { max-width: none; }

  .s-organisation-design-shift__title,
  .s-organisation-design-focus__title,
  .s-organisation-design-dividends__title { font-size: 34px; }

  .s-organisation-design-shift__title { max-width: none; }
  .s-organisation-design-shift__body  { max-width: none; }

  .s-organisation-design-focus__lede { padding-bottom: 0; }

  .s-organisation-design-focus__grid,
  .s-organisation-design-dividends__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .s-organisation-design-equilibrium__photo { height: 280px; }
  .s-organisation-design-equilibrium__overlay { padding: 80px 24px 24px; }

  .s-organisation-design-conviction__photo { height: 260px; max-width: 420px; }
  .s-organisation-design-conviction__quote p { font-size: 28px; }

  .s-organisation-design-cta__panel { padding: 40px 32px 42px; }
  .s-organisation-design-cta__title { font-size: 40px; }
}

@media (max-width: 860px) {
  /* the connectors stop reading once the row is this tight */
  .s-organisation-design-shift__nodes { flex-wrap: wrap; gap: 14px; }
  .s-organisation-design-shift__wire,
  .s-organisation-design-shift__arrow { display: none; }
  .s-organisation-design-shift__pods { flex: 1 1 150px; }
}

@media (max-width: 640px) {
  .s-organisation-design-hero { padding-block: 26px 36px; }
  .s-organisation-design-hero__title { font-size: 34px; }
  .s-organisation-design-hero__panel { padding: 18px 16px 20px; max-width: none; }
  .s-organisation-design-hero__row-figure { font-size: 22px; }
  /* .btn is nowrap, and at 320px the 52px gutters leave a 216px pill — too
     narrow for "SCHEDULE A DIAGNOSTIC CONSULTATION", which then ran out past
     the pill. Let the label wrap and grow the pill to suit. */
  .s-organisation-design-hero__cta,
  .s-organisation-design-hero__cta-2 {
    width: 100%;
    height: auto;
    min-height: 44px;
    padding: 11px 16px;
    font-size: 10.5px;
    line-height: 1.4;
    letter-spacing: .07em;
    white-space: normal;
    text-align: center;
  }

  .s-organisation-design-shift { padding-block: 32px 40px; }
  .s-organisation-design-shift__title,
  .s-organisation-design-focus__title,
  .s-organisation-design-dividends__title { font-size: 28px; }
  .s-organisation-design-shift__ruled { padding-left: 14px; font-size: 15px; }
  .s-organisation-design-shift__schema { padding: 16px; }
  .s-organisation-design-shift__schema-head { flex-direction: column; gap: 10px; }
  .s-organisation-design-shift__board { padding: 14px 14px 18px; }
  .s-organisation-design-shift__legend { flex-direction: column; gap: 3px; align-items: flex-start; }
  .s-organisation-design-shift__segments { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .s-organisation-design-shift__nodes { flex-direction: column; align-items: stretch; }
  .s-organisation-design-shift__node { width: 100%; height: auto; border-radius: var(--radius-sm); padding: 12px; }
  .s-organisation-design-shift__pods { flex: 1 1 auto; }
  .s-organisation-design-shift__tiles { grid-template-columns: minmax(0, 1fr); }

  .s-organisation-design-equilibrium { padding-block: 4px 36px; }
  .s-organisation-design-equilibrium__photo { height: 300px; }
  .s-organisation-design-equilibrium__overlay { padding: 70px 18px 20px; }
  .s-organisation-design-equilibrium__quote p { font-size: 17px; }

  .s-organisation-design-focus { padding-block: 32px 40px; }
  .s-organisation-design-focus__grid,
  .s-organisation-design-dividends__grid { grid-template-columns: minmax(0, 1fr); }
  .s-organisation-design-focus__card { padding: 20px; }
  .s-organisation-design-focus__name,
  .s-organisation-design-dividends__name { font-size: 22px; }

  .s-organisation-design-dividends { padding-block: 36px 42px; }
  .s-organisation-design-dividends__card { padding: 20px; }
  .s-organisation-design-dividends__desc { margin-bottom: 24px; }
  .s-organisation-design-dividends__value { font-size: 36px; }

  .s-organisation-design-conviction { padding-block: 32px 36px; }
  .s-organisation-design-conviction__photo { height: 230px; max-width: none; }
  .s-organisation-design-conviction__quote p { font-size: 22px; line-height: 1.45; }

  .s-organisation-design-cta { padding-block: 8px 40px; }
  .s-organisation-design-cta__panel { padding: 30px 20px 32px; border-radius: var(--radius-lg); }
  .s-organisation-design-cta__title { font-size: 30px; }
  .s-organisation-design-cta__lede { font-size: 15px; }
  .s-organisation-design-cta__btn { width: 100%; }
  .s-organisation-design-cta__note { align-items: flex-start; }
  .s-organisation-design-cta__note-icon { margin-top: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .s-organisation-design-hero__cta:hover { transform: none; }
  .s-organisation-design-hero__cta-2:hover { transform: none; }
  .s-organisation-design-cta__btn:hover { transform: none; }
}