/* The middle-page components deliberately use only the shared palette and fonts. */
.mid-intro, .mid-process, .mid-plan, .mid-transformation, .mid-founder, .mid-changes {
  font-family: "DM Sans", sans-serif;
  color: var(--ink, #17241f);
  font-size: 18px;
  line-height: 1.65;
}
.mid-intro *, .mid-process *, .mid-plan *, .mid-transformation *, .mid-founder *, .mid-changes * { box-sizing: border-box; }
.mid-intro h2, .mid-process h2, .mid-plan h2, .mid-transformation h2, .mid-founder h2, .mid-changes h2,
.mid-process h3, .mid-transformation h3 {
  font-family: "Manrope", sans-serif;
  letter-spacing: -.045em;
  line-height: 1.12;
  margin: 0;
}
.mid-intro p, .mid-process p, .mid-plan p, .mid-transformation p, .mid-founder p, .mid-changes p { margin: 0; }
.mid-intro strong, .mid-process strong, .mid-plan strong, .mid-transformation strong, .mid-founder strong, .mid-changes strong { font-weight: 700; }
.mid-kicker {
  color: var(--green, #387761);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.3;
  text-transform: uppercase;
}

/* A deliberate dark transition from the problem into the offer. */
.mid-intro { background: var(--forest, #153f35); color: var(--white, #fff); }
.mid-intro__inner { padding-top: 50px; padding-bottom: 45px; }
.mid-intro__topline, .mid-intro__footer {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: #bfcdc5;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.35;
  text-transform: uppercase;
}
.mid-intro__topline { border-bottom: 1px solid rgba(255,255,255,.22); padding-bottom: 22px; }
.mid-intro__grid { display: grid; grid-template-columns: 1.15fr .65fr; gap: 9%; padding: 115px 0 120px; align-items: end; }
.mid-intro__title { max-width: 780px; font-size: clamp(52px, 5.6vw, 82px); font-weight: 700; line-height: 1.01 !important; }
.mid-intro__title > span { display: block; }
.mid-intro__title small { display: block; margin-top: 27px; color: #c9d8ce; font-size: clamp(20px, 2vw, 27px); font-weight: 500; letter-spacing: -.025em; line-height: 1.25; }
.mid-intro__copy { max-width: 465px; }
.mid-intro__copy p { color: #eef3ee; font-size: 19px; line-height: 1.7; }
.mid-intro__scope { display: grid; grid-template-columns: auto auto 1fr; gap: 13px; align-items: center; margin-top: 49px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.25); color: #d3e1d6; font-size: 10px; font-weight: 700; letter-spacing: .13em; line-height: 1.4; }
.mid-intro__scope span:first-child { color: #fff; font-size: 31px; letter-spacing: -.05em; }
.mid-intro__scope span:last-child { justify-self: end; text-align: right; }
.mid-intro__footer { border-top: 1px solid rgba(255,255,255,.22); padding-top: 22px; }

/* Three connected stages: editorial columns, not cards. */
.mid-process { background: var(--paper, #f7f6f2); padding: 128px 0 135px; }
.mid-section-head { max-width: 870px; margin-bottom: 72px; }
.mid-section-head h2, .mid-plan h2, .mid-transformation h2, .mid-founder h2, .mid-changes h2 { font-size: clamp(38px, 4.1vw, 60px); font-weight: 700; }
.mid-section-head h2 { margin-top: 22px; }
.mid-section-head h2 span { color: var(--green, #387761); }
.mid-process__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 38px; padding: 0; margin: 0; list-style: none; }
.mid-stage { position: relative; display: flex; flex-direction: column; min-width: 0; }
.mid-stage::before { position: absolute; z-index: 0; top: 20px; left: 40px; right: -38px; border-top: 1px solid #aabbb0; content: ""; }
.mid-stage:last-child::before { display: none; }
.mid-stage__number { z-index: 1; display: grid; place-items: center; width: 41px; height: 41px; border: 1px solid var(--green, #387761); border-radius: 50%; background: var(--paper, #f7f6f2); color: var(--forest, #153f35); font-size: 11px; font-weight: 700; letter-spacing: .04em; }
.mid-stage h3 { margin: 30px 0 17px; max-width: 360px; font-size: clamp(23px, 2vw, 28px); line-height: 1.19; }
.mid-stage > p { max-width: 420px; margin-bottom: 32px; font-size: 17px; line-height: 1.68; }
.mid-figure { min-width: 0; height: 230px; margin: 36px 0 0; margin-top: auto; padding: 18px; background: #eaece5; border: 1px solid #d9dfd5; color: var(--forest, #153f35); }
.mid-figure figcaption, .mid-blueprint figcaption { color: #577266; font-size: 10px; font-weight: 700; letter-spacing: .1em; line-height: 1.3; text-transform: uppercase; }
.mid-map { display: grid; grid-template-columns: minmax(0, 1.28fr) 24px minmax(0, .8fr); align-items: center; height: calc(100% - 19px); padding-top: 13px; }
.mid-map__choices { display: grid; gap: 7px; }
.mid-map__choices span { min-width: 0; padding: 7px 8px; border: 1px solid #bdcfc1; background: #f7f8f3; font-size: 11px; font-weight: 600; line-height: 1.2; }
.mid-map__join { position: relative; height: 65%; border-right: 1px solid #94ac9d; }
.mid-map__join::before, .mid-map__join::after { position: absolute; left: 0; width: 100%; border-top: 1px solid #94ac9d; content: ""; }
.mid-map__join::before { top: 0; }
.mid-map__join::after { bottom: 0; }
.mid-map__join i { position: absolute; top: 50%; left: 0; width: 100%; border-top: 1px solid #94ac9d; }
.mid-map__selected { position: relative; padding: 12px 9px; border: 1px solid #4e8067; background: #dce8dc; font-size: 11px; font-weight: 700; line-height: 1.25; }
.mid-map__selected span { display: block; font-family: "Manrope", sans-serif; font-size: 23px; letter-spacing: -.05em; }
.mid-build { display: flex; flex-direction: column; justify-content: center; height: calc(100% - 19px); padding-top: 14px; }
.mid-build__flow { display: grid; grid-template-columns: minmax(0,1fr) 15px minmax(0,1.3fr) 15px minmax(0,1fr); align-items: center; text-align: center; }
.mid-build__flow span, .mid-build__flow strong { display: grid; place-items: center; min-height: 50px; padding: 5px; border: 1px solid #b8cabe; background: #f7f8f3; font-size: 11px; line-height: 1.2; }
.mid-build__flow strong { border-color: #52826a; background: #dce8dc; }
.mid-build__flow b { color: #779584; font-size: 15px; font-weight: 400; }
.mid-build__approval { display: flex; justify-content: space-between; gap: 5px; margin-top: 15px; padding: 8px 9px; border: 1px dashed #94aa99; font-size: 10px; font-weight: 700; line-height: 1.2; }
.mid-build__foot { margin-top: 10px; color: #607d6d; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.mid-handover { padding-top: 20px; font-size: 11px; font-weight: 600; }
.mid-handover__input { display: grid; grid-template-columns: 1fr 24px 1fr; align-items: center; text-align: center; }
.mid-handover__input span:first-child, .mid-handover__input strong { padding: 9px 5px; border: 1px solid #b8cabe; background: #f7f8f3; line-height: 1.2; }
.mid-handover__input strong { border-color: #52826a; background: #dce8dc; }
.mid-handover__outputs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 13px; }
.mid-handover__outputs span { padding: 8px; border-left: 2px solid #7da28a; background: rgba(255,255,255,.5); line-height: 1.2; }
.mid-handover__support { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; color: #466d58; font-size: 10px; line-height: 1.2; }
.mid-handover__support span:first-child { font-weight: 800; white-space: nowrap; }
.mid-handover__support span:last-child { text-align: right; }
.mid-process__cta { display: flex; justify-content: flex-start; margin-top: 62px; }
.mid-process__cta .book-button { max-width: 100%; white-space: normal; text-align: center; }

/* The written plan: a document motif, rather than a product dashboard. */
.mid-plan { padding: 125px 0 135px; background: var(--stone, #e9e7df); }
.mid-plan h2 { max-width: 1010px; margin-top: 23px; }
.mid-plan__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); gap: clamp(55px, 9vw, 145px); align-items: center; margin-top: 74px; }
.mid-blueprint { margin: 0; padding: 20px; background: #d9ded3; }
.mid-blueprint__sheet { margin: 15px 0 0; padding: 24px; background: #f8f8f4; border: 1px solid #ccd5c8; box-shadow: 9px 9px 0 rgba(68,103,82,.09); }
.mid-blueprint__sheethead { display: flex; justify-content: space-between; gap: 10px; padding-bottom: 18px; color: #648071; font-size: 10px; font-weight: 700; letter-spacing: .1em; line-height: 1.3; }
.mid-blueprint__row { display: grid; grid-template-columns: 30px 1fr; gap: 12px; align-items: center; min-height: 50px; padding: 12px 0; border-top: 1px solid #d8dfd6; font-size: 12px; line-height: 1.3; }
.mid-blueprint__row span { color: #78917f; font-size: 10px; }
.mid-blueprint__row strong { color: #2d5444; font-weight: 700; }
.mid-plan__copy { max-width: 590px; }
.mid-plan__copy p { font-size: 19px; line-height: 1.7; }
.mid-plan__copy p + p { margin-top: 25px; }

/* A progression in three time horizons, treated as a single editorial timeline. */
.mid-transformation { padding: 135px 0 125px; background: var(--white, #fff); }
.mid-transformation__heading { max-width: 920px; margin-bottom: 76px; }
.mid-transformation__heading h2 { margin-top: 23px; }
.mid-moments { border-bottom: 1px solid var(--line, #d4d7ce); }
.mid-moment { display: grid; grid-template-columns: 60px minmax(0,.8fr) minmax(0,1fr); gap: 34px; align-items: start; padding: 43px 0 49px; border-top: 1px solid var(--line, #d4d7ce); }
.mid-moment__index { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #bdcbc0; border-radius: 50%; color: #548069; font-size: 11px; font-weight: 700; line-height: 1; }
.mid-moment h3 { max-width: 370px; font-size: clamp(28px, 3vw, 42px); }
.mid-moment p { max-width: 570px; font-size: 18px; line-height: 1.7; }
.mid-moment--second h3 { color: var(--green, #387761); }
.mid-moment--third .mid-moment__index { background: var(--forest, #153f35); border-color: var(--forest, #153f35); color: white; }

/* Founder section: typography rather than an invented portrait. */
.mid-founder { padding: 135px 0 62px; background: #e6e9e0; }
.mid-founder__grid { display: grid; grid-template-columns: 1fr .9fr; gap: clamp(70px, 11vw, 170px); }
.mid-founder__heading h2 { max-width: 620px; margin-top: 23px; }
.mid-founder__copy { max-width: 590px; }
.mid-founder__copy p { font-size: 18px; line-height: 1.7; }
.mid-founder__copy p + p { margin-top: 24px; }
.mid-founder__statement { display: grid; grid-template-columns: 1fr auto 1fr; gap: 28px; align-items: end; margin-top: 120px; padding-top: 25px; border-top: 1px solid #bac8ba; color: var(--forest, #153f35); }
.mid-founder__statement > span { padding-bottom: 7px; color: #577866; font-size: 10px; font-weight: 700; letter-spacing: .12em; line-height: 1.3; text-transform: uppercase; }
.mid-founder__statement > span:last-child { text-align: right; }
.mid-founder__statement strong { font-family: "Manrope", sans-serif; font-size: clamp(39px, 5vw, 72px); font-weight: 700; letter-spacing: -.06em; line-height: 1; }

/* Six original points as a spacious numbered index. */
.mid-changes { padding: 135px 0 140px; background: var(--paper, #f7f6f2); }
.mid-changes__head { max-width: 880px; margin-bottom: 74px; }
.mid-changes__head h2 { margin-top: 23px; }
.mid-changes__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(50px, 8vw, 125px); row-gap: 0; padding: 0; margin: 0; list-style: none; }
.mid-changes__list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 15px; align-items: start; padding: 27px 0 37px; border-top: 1px solid var(--line, #d4d7ce); }
.mid-changes__number { padding-top: 5px; color: var(--green, #387761); font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.mid-changes__list p { max-width: 500px; font-size: 18px; line-height: 1.68; }

@media (max-width: 1050px) {
  .mid-intro__grid { gap: 6%; grid-template-columns: 1fr .75fr; }
  .mid-process__list { gap: 24px; }
  .mid-stage::before { right: -24px; }
  .mid-figure { padding: 13px; }
  .mid-map { grid-template-columns: minmax(0,1.2fr) 15px minmax(0,.8fr); }
  .mid-map__choices span, .mid-map__selected { font-size: 10px; }
  .mid-build__flow { grid-template-columns: minmax(0,1fr) 11px minmax(0,1.2fr) 11px minmax(0,1fr); }
  .mid-build__flow span, .mid-build__flow strong { font-size: 10px; }
  .mid-founder__grid { gap: 8%; }
}
@media (max-width: 860px) {
  .mid-intro, .mid-process, .mid-plan, .mid-transformation, .mid-founder, .mid-changes { font-size: 17px; }
  .mid-intro__inner { padding-top: 28px; padding-bottom: 29px; }
  .mid-intro__topline { font-size: 9px; }
  .mid-intro__grid { grid-template-columns: 1fr; gap: 42px; padding: 78px 0 70px; }
  .mid-intro__title { font-size: clamp(44px, 10vw, 64px); }
  .mid-intro__title small { margin-top: 21px; font-size: 21px; }
  .mid-intro__copy p { font-size: 18px; }
  .mid-intro__scope { margin-top: 34px; }
  .mid-intro__footer { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; font-size: 10px; }
  .mid-process, .mid-plan, .mid-transformation, .mid-changes { padding: 88px 0 95px; }
  .mid-section-head, .mid-transformation__heading, .mid-changes__head { margin-bottom: 52px; }
  .mid-section-head h2, .mid-plan h2, .mid-transformation h2, .mid-founder h2, .mid-changes h2 { font-size: clamp(36px, 8vw, 48px); }
  .mid-process__list { display: block; }
  .mid-stage { padding-left: 61px; padding-bottom: 52px; }
  .mid-stage:last-child { padding-bottom: 0; }
  .mid-stage__number { position: absolute; top: 0; left: 0; }
  .mid-stage::before { top: 40px; bottom: 0; left: 20px; right: auto; border-top: 0; border-left: 1px solid #aabbb0; }
  .mid-stage h3 { margin: 0 0 15px; font-size: 25px; }
  .mid-stage > p { max-width: none; font-size: 17px; }
  .mid-figure { max-width: 480px; height: 225px; padding: 17px; }
  .mid-map { grid-template-columns: minmax(0,1.28fr) 24px minmax(0,.8fr); }
  .mid-map__choices span, .mid-map__selected { font-size: 11px; }
  .mid-build__flow { grid-template-columns: minmax(0,1fr) 15px minmax(0,1.3fr) 15px minmax(0,1fr); }
  .mid-build__flow span, .mid-build__flow strong { font-size: 11px; }
  .mid-process__cta { margin-top: 44px; }
  .mid-process__cta .book-button { width: 100%; }
  .mid-plan__grid { grid-template-columns: 1fr; gap: 42px; margin-top: 48px; }
  .mid-blueprint { max-width: 520px; }
  .mid-plan__copy p { font-size: 18px; }
  .mid-moment { grid-template-columns: 42px 1fr; gap: 15px; padding: 31px 0 37px; }
  .mid-moment h3 { font-size: 29px; }
  .mid-moment p { grid-column: 2; font-size: 17px; }
  .mid-founder { padding: 90px 0 45px; }
  .mid-founder__grid { grid-template-columns: 1fr; gap: 35px; }
  .mid-founder__copy p { font-size: 17px; }
  .mid-founder__statement { grid-template-columns: 1fr auto; gap: 18px; margin-top: 65px; }
  .mid-founder__statement strong { grid-column: 1 / -1; grid-row: 1; font-size: clamp(41px, 10vw, 65px); }
  .mid-founder__statement > span { grid-row: 2; }
  .mid-changes__list { grid-template-columns: 1fr; }
  .mid-changes__list li { padding: 25px 0 31px; }
  .mid-changes__list p { max-width: none; font-size: 17px; }
}
@media (max-width: 380px) {
  .mid-intro__topline { gap: 8px; font-size: 8px; }
  .mid-intro__title { font-size: 41px; }
  .mid-stage { padding-left: 52px; }
  .mid-figure { padding: 12px; }
  .mid-map { grid-template-columns: minmax(0,1.25fr) 12px minmax(0,.85fr); }
  .mid-map__choices span, .mid-map__selected { font-size: 10px; }
  .mid-build__flow { grid-template-columns: minmax(0,1fr) 10px minmax(0,1.15fr) 10px minmax(0,1fr); }
  .mid-build__flow span, .mid-build__flow strong { font-size: 9px; }
  .mid-build__approval { font-size: 9px; }
}

/* Keep small process labels readable against their specific surfaces. */
.mid-plan .mid-kicker, .mid-founder .mid-kicker { color: #2b6753; }
.mid-figure figcaption, .mid-blueprint figcaption, .mid-build__foot,
.mid-blueprint__sheethead, .mid-blueprint__row span { color: #405f50; }
.mid-moment__index { color: #386c56; }
.mid-moment--third .mid-moment__index { color: #fff; }