/* r28 (10 Nov, Sohrab's review): section order, the receipt and testimonials as their own sections, the map in the site's sans-serif, finer flow drawings. */

/* How we work: the receipt moved out, so the flow card sits alone in the row */
#how .row{grid-template-columns:minmax(0,1fr)}

/* What clients say: now its own section after Research (was under How we work) */
#reviews .hqw{margin-top:0;padding-top:0;border-top:0}

/* How we charge: the receipt sits alone, centred, directly under How we work (Pat 10 Nov r29) */
#receipt .row{grid-template-columns:minmax(0,540px);justify-content:center}
#receipt .rwrap{width:auto;max-width:100%}

/* Map section (Location): every heading and label in the site's sans-serif (was Fraunces and a handwriting face) */
.mp-box,.mp-note,
#esvg .cor2 .lb,
#areas svg text,#areas .lb{font-family:var(--f-text)!important;font-weight:600;letter-spacing:0}
.mp-note b,.mp-note i,.mp-box b,.mp-box i{font-family:var(--f-text)}

/* How we work: finer, sharper drawings (thinner even strokes; the pen wobble is cut back in index.html) */
#how .hp .fig .d{stroke-width:1.25}
#how .hp .fig .spd path{stroke-width:1}
@media (max-width:860px){
  #how .hp .fig .d{stroke-width:1.4}
  #how .hp .fig .spd path{stroke-width:1.1}
}

/* broker form: Continue under the multi-select list */
.cpb-opts ~ .cpb-btn{margin-top:24px}
.cpb-opts ~ .cpb-err{margin-top:12px}

/* r29 (Pat 10 Nov): Contact shows the phone and email, each with a small label */
.office .oadr li{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}
.office .oadr .ok{flex:0 0 56px;font:600 14px/1.2 var(--f-text);letter-spacing:.14em;text-transform:uppercase;color:#3F5F54}
/* Pat 10 Nov: receipt gets a little shadow, and the same space above and below it */
#receipt .rwrap{filter:drop-shadow(0 1px 2px rgba(17,65,54,.14)) drop-shadow(0 12px 18px rgba(17,65,54,.14))} /* the paper is masked, so its own box-shadow is clipped */
#receipt{padding-bottom:128px}
@media (max-width:760px){#receipt{padding-bottom:96px}}

/* r37m (Pat 10 Nov, phone only): three phone layout fixes. Desktop (768 px and up) is untouched. */
@media (max-width:767px){
  /* 1. Rental Yield / Capital Growth circle: each half's text is anchored to the divider, not to a % of the circle,
        so "against its price." always keeps a clear 24 px from the line however narrow the phone is */
  #rcwrap .rcore .ct.y{top:auto;bottom:calc(50% + 24px)}
  #rcwrap .rcore .ct.g{top:calc(50% + 24px)}
  #rcwrap .rcore .ct h3{font-size:25px}
  #rcwrap .rcore .ct p{font-size:14px;line-height:1.35;margin-top:6px}

  /* 2. Hero: the drawing's amenity list gets even air under it, and the paper strip between the hero and
        the dark How we work panel goes (the panel starts straight after the hero) */
  #hero.h25{padding-bottom:20px}
  #how{padding-top:0}

  /* 3. Testimonials: every card is only as tall as its own content; name sits straight under the quote */
  .how .q26-track,.how .q26-dup{align-items:flex-start}
  .how .q26-card,.how .q26-card.q26-s{flex-basis:min(300px,calc(100vw - 72px));padding:24px}
  .how .q26-card.q26-l{flex-basis:min(340px,calc(100vw - 56px))}
  .how .q26-card blockquote{font-size:19px;line-height:1.4;margin-top:16px}
  .how .q26-card figcaption{margin-top:0;padding-top:16px}
}