/* Book a Call. One screen: the line, the two times, one button out. */
.bk section { padding: 150px 120px 150px 230px; display: grid;
               grid-template-columns: minmax(0, 1fr) 380px; gap: 70px; align-items: start }
/* the photo, in colour and friendly: Matt, 19 Sept. Cropped to a portrait
   around the face; it sits right of the words, and above them on a phone. */
.bk-pic { grid-column: 2; grid-row: 1; width: 100%; aspect-ratio: 4 / 5; height: auto;
          object-fit: cover; object-position: 47% 40%; border-radius: 6px; margin-top: 6px }
.bk-body { grid-column: 1; grid-row: 1; min-width: 0 }
.bk .eyebrow { display: block }
.bk h1 { margin: 20px 0 0 0; font-size: 50px; font-weight: 800; letter-spacing: -1.8px;
         line-height: 1.06; max-width: 1000px }
.bk-times { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; max-width: 900px; margin-top: 44px }
.bk-times > div { border-top: 3px solid var(--ink); padding-top: 18px }
.bk-times b { display: block; font-size: 26px; font-weight: 800; letter-spacing: -.7px }
.bk-times span { display: block; margin-top: 8px; font-family: var(--mono); font-size: 13px;
                 letter-spacing: .08em; text-transform: uppercase; color: var(--mut) }
.bk-note { margin-top: 30px; font-size: 19px; line-height: 1.55; color: #2C2E30; max-width: 760px }
.bk-go { display: inline-block; margin-top: 24px; background: var(--yellow); color: var(--ink);
         text-decoration: none; font-size: 18px; font-weight: 800; letter-spacing: -.3px;
         padding: 16px 26px; border-radius: 2px }
.bk-go--ink { background: var(--ink); color: var(--cream) }
.bk-alt { margin-top: 26px; font-size: 17px; color: var(--mut) }

@media (max-width: 1100px) { .bk section { padding-left: 96px; padding-right: 96px; grid-template-columns: minmax(0, 1fr) 280px; gap: 44px } }
@media (max-width: 900px) {
  .bk section { padding: 40px 22px 90px 22px; grid-template-columns: 1fr; gap: 30px }
  .bk-pic { grid-column: 1; grid-row: 1; aspect-ratio: 4 / 3; max-width: 460px; object-position: 47% 35% }
  .bk-body { grid-row: 2 }
  .bk h1 { font-size: 30px; letter-spacing: -.9px; line-height: 1.1 }
  .bk h1 br { display: none }
  .bk-times { grid-template-columns: 1fr; gap: 24px; margin-top: 36px }
  .bk-times b { font-size: 21px }
  .bk-note { font-size: 17px }
  .bk-go { font-size: 17px; padding: 15px 22px }
}
.bk-sign { margin-top: 18px; font-size: 21px; font-weight: 700; letter-spacing: -.3px }
@media (max-width: 900px) { .bk-sign { font-size: 18px; margin-top: 14px } }

/* ── Contact shares the Book a Call frame ─────────────────────────────────── */
.ct h1 { font-size: 46px; letter-spacing: -1.5px; overflow-wrap: anywhere }
.ct .bk-go { margin-top: 34px }
.ct-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; max-width: 900px; margin-top: 56px }
.ct-rows > div { border-top: 3px solid var(--ink); padding-top: 18px }
.ct-rows b { display: block; font-size: 22px; font-weight: 800; letter-spacing: -.6px }
.ct-rows p { margin-top: 10px; font-size: 17px; line-height: 1.5; color: #2C2E30 }
.ct-rows ul { margin-top: 12px }
.ct-rows li { margin-bottom: 10px; font-size: 17px }
.ct-rows a, .ct-out { color: var(--ink); text-decoration: none; font-weight: 700;
                      border-bottom: 3px solid var(--yellow); padding-bottom: 2px }
.ct-out { display: inline-block; margin-top: 12px; font-size: 17px }
@media (max-width: 900px) {
  .ct h1 { font-size: 27px; letter-spacing: -.8px }
  .ct-rows { grid-template-columns: 1fr; gap: 28px; margin-top: 40px }
}
/* the two coffees, the width of the rows above them */
.ct-ill { display: block; width: 100%; max-width: 640px; height: auto; margin-top: 72px }
@media (max-width: 900px) { .ct-ill { margin-top: 48px } }