/* Contact / help featured-box cards — interactive + mobile-safe */

.page-contact .row {
  row-gap: 20px;
}

/* Parent columns stretch so every card can fill the same square footprint */
.page-contact .row > [class*="col-"]:has(> .featured-box-link),
.page-contact .row > [class*="col-"]:has(> .featured-box) {
  display: flex;
}

.page-contact .featured-box,
.page-contact .featured-box-link,
.page-contact .featured-box.featured-box--interactive {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  box-sizing: border-box;
  overflow: hidden;
  margin-bottom: 0;
}

.page-contact .featured-box-link,
.page-contact .featured-box.featured-box--interactive {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.page-contact .featured-box .featured-box-icon {
  flex-shrink: 0;
}

.page-contact .featured-box .featured-box-title {
  font-size: clamp(0.95rem, 2.5vw, 1.25rem);
  margin-top: 0.75rem;
  line-height: 1.2;
}

.page-contact .featured-box-link:hover,
.page-contact .featured-box-link:focus,
.page-contact .featured-box.featured-box--interactive:hover,
.page-contact .featured-box.featured-box--interactive:focus {
  outline: 3px solid var(--accent-color, #00adef);
  transform: translateY(-2px);
  color: inherit;
}

.page-contact .featured-box-link .featured-box-content a,
.page-contact .featured-box.featured-box--interactive .featured-box-content a {
  color: inherit;
  text-decoration: underline;
  pointer-events: none;
}

.page-contact .featured-box-content {
  flex: 1;
  font-size: clamp(0.68rem, 1.8vw, 0.9em);
  word-break: break-word;
  overflow-wrap: anywhere;
  hyphens: auto;
  line-height: 1.35;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  margin-bottom: 0;
}

.page-contact .featured-box-content a {
  word-break: break-all;
  overflow-wrap: anywhere;
}

.page-contact .image-split-box img,
.page-contact .image-split-box--no-photo img {
  display: none;
}

.page-contact .image-split-box .box-content,
.page-contact .image-split-box--no-photo .box-content {
  width: 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

.page-contact .row > div:nth-child(4n+1) > .featured-box,
.page-contact .row > div:nth-child(4n+1) > .featured-box-link {
  background-image: url(../images/card-bg-1.png);
}

.page-contact .row > div:nth-child(4n+2) > .featured-box,
.page-contact .row > div:nth-child(4n+2) > .featured-box-link {
  background-image: url(../images/card-bg-2.png);
}

.page-contact .row > div:nth-child(4n+3) > .featured-box,
.page-contact .row > div:nth-child(4n+3) > .featured-box-link {
  background-image: url(../images/card-bg-3.png);
}

.page-contact .row > div:nth-child(4n) > .featured-box,
.page-contact .row > div:nth-child(4n) > .featured-box-link {
  background-image: url(../images/card-bg-4.png);
}

@media (max-width: 767px) {
  /* Keep featured cards in a 2-column grid on mobile for compact squares */
  .page-contact .row > [class*="col-"]:has(> .featured-box-link),
  .page-contact .row > [class*="col-"]:has(> .featured-box) {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .page-contact .featured-box,
  .page-contact .featured-box-link {
    padding: 14px;
  }

  .page-contact .featured-box .featured-box-icon {
    font-size: 36px;
  }

  .page-contact .featured-box .featured-box-title {
    font-size: 0.95rem;
    margin-top: 0.5rem;
  }

  .page-contact .featured-box-content {
    font-size: 0.72rem;
    -webkit-line-clamp: 3;
  }
}

@media (max-width: 380px) {
  .page-contact .featured-box,
  .page-contact .featured-box-link {
    padding: 10px;
  }

  .page-contact .featured-box .featured-box-icon {
    font-size: 28px;
  }

  .page-contact .featured-box .featured-box-title {
    font-size: 0.85rem;
  }

  .page-contact .featured-box-content {
    font-size: 0.65rem;
    -webkit-line-clamp: 3;
  }
}