/* Catalogue — measured off tprsglass.com/catalogue/: full-bleed rows 492px
   tall, each split into a half-viewport image and a half of copy, alternating
   sides. The Elevators row runs to 579px because it carries three link pairs. */
.catalogue-intro {
  padding-block: 45px 100px;
}

.catalogue-intro__body {
  max-width: 950px;
  margin-inline: auto;
}

.catalogue-intro__body p {
  max-width: none;
  color: var(--color-text);
  font-size: 1.0625rem;
  line-height: 1.647;
  text-align: justify;
}

.cat-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  min-height: 492px;
  background: var(--color-surface);
}

.cat-row--tall {
  min-height: 579px;
}

/* the first row's artwork is anchored top-left on the live page; the rest are
   centred */
.cat-row--first .cat-row__media {
  background-position: 0% 0%;
}

.cat-row__media {
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}

/* the artwork sits left by default and swaps to the right on alternate rows */
.cat-row--image-right .cat-row__media {
  order: 2;
}

.cat-row__body {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  /* live insets the copy 43px from the split and lets it run to the outer
     edge, which is what keeps each title on a single line; the 139px lead-in
     is a spacer widget on the live page, not vertical centring */
  padding: 139px 0 30px 43px;
}

.cat-row--image-right .cat-row__body {
  order: 1;
}

.cat-row__title {
  max-width: 713px;
  color: var(--color-text-dark);
  font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.5625rem);
  font-weight: var(--fw-medium);
  line-height: 1.088;
  letter-spacing: -1.8px;
}

/* two columns of pills: view on the left, download on the right */
.cat-row__actions {
  display: grid;
  grid-template-columns: max-content max-content;
  gap: 25px 59px;
  margin-top: 25px;
}

.cat-btn {
  justify-self: start;
  padding: 17px 45px;
  border: 0;
  border-radius: 30px;
  font-size: 0.875rem;
  font-weight: var(--fw-regular);
  line-height: 1.5;
  text-align: center;
}

.cat-btn--view {
  background: #18578c;
  color: #fff;
}

.cat-btn--view:hover,
.cat-btn--view:focus-visible {
  background: var(--color-navy-dark);
  border-color: var(--color-navy-dark);
}

.cat-btn--download {
  padding: 15px 43px;
  border: 2px solid var(--color-text-dark);
  background: transparent;
  color: var(--color-text-dark);
}

.cat-btn--download:hover,
.cat-btn--download:focus-visible {
  border-color: #18578c;
  color: #18578c;
}

/* the long Elevators button labels stop fitting a half-width column below the
   theme's 1279px breakpoint */
@media (max-width: 1279px) {
  .cat-row__body {
    padding-top: 40px;
  }

  .cat-row {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  .cat-row--tall {
    min-height: 0;
  }

  .cat-row__media {
    order: 1;
    min-height: 260px;
  }

  .cat-row--image-right .cat-row__media {
    order: 1;
  }

  .cat-row__body,
  .cat-row--image-right .cat-row__body {
    order: 2;
    padding: 40px 24px 48px;
  }

  .cat-row__actions {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .cat-btn {
    justify-self: stretch;
  }
}

@media (max-width: 767px) {
  .catalogue-intro {
    padding-block: 32px 48px;
  }
}