/* Contact page. Desktop measured at 1440px, mobile at 390px (same conventions as site.css). */

/* ---------- How it works + booking ---------- */
.ct-book { padding: 98px 146px 0; }
.ct-steps { margin: 6px auto 0; display: grid; grid-template-columns: repeat(3, 224px); justify-content: center; list-style: none; text-align: center; }
.ct-steps li { display: flex; flex-direction: column; align-items: center; }
.ct-steps__icon { display: flex; align-items: center; justify-content: center; width: 101px; height: 99px; }
.ct-steps__icon img { max-width: 101px; max-height: 99px; }
.ct-steps .t-h5 { margin-top: 10px; max-width: 190px; }
.ct-calendar { margin-top: -10px; height: 740px; }
.ct-calendar iframe { display: block; width: 100%; height: 100%; border: 0; }

/* ---------- Where to reach us ---------- */
.ct-reach { padding: 97px 101px 110px; min-height: 542px; }
.ct-reach__cols { margin: 47px 0 0 142px; display: grid; grid-template-columns: repeat(3, 303px); column-gap: 23px; }
.ct-reach__loc { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 20.3px; line-height: 25px; }
.ct-reach__cols h3 + .ct-reach__loc { margin-top: 23px; }
.ct-reach__loc .pin { width: 11px; height: 15px; fill: var(--blue); }
.ct-reach__loc:hover, .ct-reach a:hover { color: var(--brown); }
.ct-reach__cols h3 + p { margin-top: 22px; }

/* ---------- Root ---------- */
.ct-root__title { max-width: 515px; }
.ct-root__p { margin-top: 77px; max-width: 502px; }

/* ---------- Careers ---------- */
.ct-careers__title { z-index: 1; }
.ct-careers__dome { transform: scaleY(-1); }
.ct-careers__photo { z-index: 1; border-radius: 30px; object-fit: cover; }
.ct-careers__p { margin-top: 27px; }
.btn.ct-careers__btn { margin-top: 26px; width: 257px; height: 42px; }

/* ---------- Press ---------- */
.ct-press__wave { z-index: 0; object-fit: cover; }
.sec--ct-press .t-display, .sec--ct-press .t-lg, .ct-press__btn { z-index: 1; }
.sec--ct-press a:not(.btn) { text-decoration: underline; text-underline-offset: 3px; }
.btn.ct-press__btn { width: 257px; height: 42px; }

/* ---------- Testimonial slider ---------- */
.sec--ct-quotes { background: var(--brown); color: var(--cream); }
.ct-quotes { position: relative; padding: 101px 187px 90px; min-height: 492px; }
.ct-quotes__nav { position: absolute; right: 70px; top: 36px; display: flex; gap: 20px; }
.ct-quotes__nav button { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background-color .25s ease; }
.ct-quotes__nav button:hover { background: rgba(242, 242, 231, .12); }
.ct-quotes__nav svg { width: 24px; height: 14px; fill: none; stroke: var(--cream); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.ct-slides { display: grid; }
.ct-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .6s ease, transform .6s ease, visibility 0s linear .6s; }
.ct-slide.is-active { opacity: 1; visibility: visible; transform: none; transition: opacity .6s ease, transform .6s ease; }
.ct-slide h2 { max-width: 1066px; }
.ct-slide blockquote { margin-top: 39px; max-width: 1036px; }
.ct-slide figcaption { margin: 12px 0 0 849px; width: 216px; color: var(--blue); }

/* ---------- Mobile ---------- */
@media (max-width: 1023px) {
  .ct-book { padding: 30px 25px 0; }
  .ct-steps { margin-top: 18px; grid-template-columns: 1fr; row-gap: 12px; }
  .ct-steps__icon { width: 95px; height: 94px; }
  .ct-steps__icon img { max-width: 95px; max-height: 94px; }
  .ct-steps .t-h5 { max-width: 280px; }
  .ct-calendar { margin-top: 10px; height: 782px; }

  .ct-reach { padding: 48px 63px 70px; min-height: 0; }
  .ct-reach h2 { max-width: 300px; margin: 0 auto; }
  .ct-reach__cols { margin: 13px 0 0; grid-template-columns: 1fr; row-gap: 30px; }
  .ct-reach__cols h3 + .ct-reach__loc { margin-top: 14px; }
  .ct-reach__loc { font-size: 17px; margin-top: 10px; }
  .ct-reach__cols h3 + p { margin-top: 10px; }

  .sec--ct-root { height: 726px; }
  .ct-root__p { margin-top: 23px; }

  .sec--ct-careers .stage { padding-bottom: 49px; }
  .ct-careers__photo { height: 229px; }
  .btn.ct-careers__btn { margin-top: 24px; width: 240px; height: 45px; }

  .sec--ct-press .stage { padding-bottom: 53px; }
  .btn.ct-press__btn { width: 257px; height: 45px; }

  .ct-quotes { padding: 72px 50px 60px; min-height: 0; }
  .ct-quotes__nav { right: 20px; top: 12px; gap: 6px; }
  .ct-slide blockquote { margin-top: 19px; }
  .ct-slide figcaption { margin: 10px 0 0 190px; width: 110px; }
}