/* Feature Cards Grid Home */

.fcg-home {
  position: relative;
  z-index: 8;
}

/* Header */
.fcg-home__header {
  text-align: center;
  margin-bottom: var(--space-2xl);
  color: var(--clr-white);
}

.fcg-home__header.align-left { text-align: left; }
.fcg-home__header.align-center { text-align: center; }
.fcg-home__header.align-right { text-align: right; }

.fcg-home__heading {
  line-height: 1.1;
  margin-bottom: var(--space-md);
}

.fcg-home__description {
  line-height: 1.5;
  margin-bottom: 0;
}

/* Heading/description are richtext blocks rendered into a .rte wrapper;
   strip the inner element's default margins so the header layout stays tight. */
.fcg-home__heading .rte :last-child,
.fcg-home__description .rte :last-child {
  margin: 0;
}

/* Cards Grid — Mobile (single column, horizontal dividers) */
.fcg-home__cards {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

.fcg-home__divider {
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    to right,
    transparent 0%,
    rgba(255,255,255,0.2) 15%,
    rgba(255,255,255,0.2) 85%,
    transparent 100%
  );
}

/* Cards Grid — Tablet (2-column wrap with dividers) */
@media (min-width: 768px) and (max-width: 1023px) {
  .fcg-home__cards {
    display: flex;
    flex-wrap: wrap;
  }

  .fcg-home__card {
    flex: 0 0 calc(50% - 1px);
    max-width: calc(50% - 1px);
    min-width: 0;
  }

  .fcg-home__divider {
    display: none;
  }

  /*
   * DOM order: card(1), div(2), card(3), div(4), card(5), div(6), card(7)...
   * Vertical dividers separate same-row pairs: children 4n+2 (2, 6, 10...)
   * Horizontal dividers separate rows: children 4n (4, 8, 12...)
   */
  .fcg-home__divider:nth-child(4n+2) {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex: 0 0 1px;
    width: 1px;
    height: auto;
    background: none;
  }

  .fcg-home__divider:nth-child(4n+2)::after {
    content: '';
    width: 1px;
    align-self: stretch;
    background: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(255,255,255,0.2) 15%,
      rgba(255,255,255,0.2) 85%,
      transparent 100%
    );
  }

  .fcg-home__divider:nth-child(4n) {
    display: block;
    flex: 0 0 100%;
    width: 100%;
    height: 1px;
    background: linear-gradient(
      to right,
      transparent 0%,
      rgba(255,255,255,0.2) 15%,
      rgba(255,255,255,0.2) 85%,
      transparent 100%
    );
  }
}

/* Cards Grid — Desktop (flex row with vertical divider elements) */
@media (min-width: 1024px) {
  .fcg-home__cards {
    display: flex;
    flex-direction: row;
    align-items: stretch;
  }

  .fcg-home__divider {
    display: flex;
    align-items: stretch;
    justify-content: center;
    width: 1px;
    height: auto;
    background: none;
  }

  .fcg-home__divider::after {
    content: '';
    width: 1px;
    height: 100%;
    background: linear-gradient(
      to bottom,
      transparent 0%,
      rgba(255,255,255,0.2) 15%,
      rgba(255,255,255,0.2) 85%,
      transparent 100%
    );
  }

  .fcg-home__card {
    flex: 1;
    min-width: 0;
  }
}

/* Card */
.fcg-home__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fcg-home__card.align-left {
  align-items: flex-start;
  text-align: left;
}

.fcg-home__card.align-center {
  align-items: center;
  text-align: center;
}

.fcg-home__card.align-right {
  align-items: flex-end;
  text-align: right;
}

.fcg-home__card.animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Number */
.fcg-home__card-number {
  font-weight: 700;
  line-height: 1;
  margin-bottom: var(--space-sm);
  user-select: none;
}

@media (max-width: 767px) {
  .fcg-home__card-number {
    font-size: 48px !important;
  }
}

@media (min-width: 1024px) {
  .fcg-home__card-number {
    font-size: var(--number-size-desktop, 80px) !important;
  }
}

/* Card Content */
.fcg-home__card-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  width: 100%;
  flex: 1;
}

.fcg-home__card-title {
  line-height: 1.4;
  margin: 0;
}

.fcg-home__card-description {
  line-height: 1.5;
  margin: 0;
}

/* Card Button */
.fcg-home__card-button {
  margin-top: auto;
  padding-top: var(--space-lg);
}

.fcg-home__card.align-left .fcg-home__card-button {
  align-self: flex-start;
}

.fcg-home__card.align-center .fcg-home__card-button {
  align-self: center;
}

.fcg-home__card.align-right .fcg-home__card-button {
  align-self: flex-end;
}

.fcg-home__card-button .btn {
  cursor: pointer;
}

/* Touch target: ensure buttons meet 44px minimum on mobile */
@media (max-width: 1023px) {
  .fcg-home__card-button .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}
