/* TCN Ikeja Member Hub — scoped to the imported Elementor template. */
.tcn-hub-shell,
.tcn-hub-shell * {
  box-sizing: border-box;
}

.elementor-element.tcn-hub-shell {
  --tcn-orange: #ff5a12;
  --tcn-ink: #111111;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  gap: 0;
  overflow: hidden;
  background: #ffffff;
  color: var(--tcn-ink);
  font-family: Arial, Helvetica, sans-serif;
}

.elementor-element.tcn-hub-hero {
  min-height: 360px;
  width: 100%;
  padding: 54px max(48px, calc((100vw - 1280px) / 2));
  display: flex;
  justify-content: center;
  align-items: flex-start;
  background:
    linear-gradient(90deg, rgba(0,0,0,.74), rgba(0,0,0,.25)),
    url('../images/hero.jpg') center 46% / cover no-repeat;
}

.elementor-element.tcn-hub-hero-copy {
  width: 100%;
  max-width: 1280px;
  gap: 6px;
  justify-content: center;
}

.tcn-hub-title .elementor-heading-title {
  margin: 0;
  color: #ffffff;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(42px, 5vw, 74px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: -.035em;
  text-wrap: balance;
}

.tcn-hub-subtitle .elementor-widget-container,
.tcn-hub-subtitle p {
  margin: 0;
  color: #ffffff;
  font-size: clamp(18px, 2vw, 28px);
  line-height: 1.25;
}

.elementor-element.tcn-hub-cards {
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: 58px 48px 72px;
  gap: 28px;
  background: #ffffff;
}

.elementor-element.tcn-hub-card {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: 420px;
  padding: 36px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  overflow: hidden;
  border-radius: 42px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  box-shadow: 0 12px 34px rgba(15, 15, 15, .08);
}

.elementor-element.tcn-hub-card-new { background-image: url('../images/new-here.jpg'); }
.elementor-element.tcn-hub-card-prayer { background-image: url('../images/prayer.jpg'); }
.elementor-element.tcn-hub-card-follow { background-image: url('../images/follow-jesus.jpg'); }
.elementor-element.tcn-hub-card-give { background-image: url('../images/give.jpg'); }
.elementor-element.tcn-hub-card-service { background-image: url('../images/service-unit.jpg'); }
.elementor-element.tcn-hub-card-announcements { background-image: url('../images/announcements.jpg'); }
.elementor-element.tcn-hub-card-community { background-image: url('../images/community.jpg'); }

.elementor-element.tcn-hub-glass {
  position: relative;
  z-index: 1;
  align-self: center;
  width: 100%;
  min-height: 220px;
  padding: 28px 32px;
  gap: 8px;
  display: flex;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 28px;
  background: linear-gradient(110deg, rgba(25,25,25,.56), rgba(74,74,74,.33));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 14px 34px rgba(0,0,0,.12);
  -webkit-backdrop-filter: blur(20px) saturate(125%);
  backdrop-filter: blur(20px) saturate(125%);
}

.tcn-hub-card-new .tcn-hub-glass,
.tcn-hub-card-give .tcn-hub-glass {
  background: linear-gradient(110deg, rgba(255,75,48,.75), rgba(255,95,54,.42));
}

.tcn-hub-card-prayer .tcn-hub-glass {
  background: linear-gradient(110deg, rgba(70,55,30,.60), rgba(187,75,201,.36));
}

.tcn-hub-heading .elementor-heading-title {
  margin: 0;
  color: #ffffff;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(30px, 3.2vw, 46px);
  font-weight: 700;
  line-height: 1.04;
  letter-spacing: -.02em;
}

.tcn-hub-copy .elementor-widget-container,
.tcn-hub-copy p {
  margin: 0;
  color: #ffffff;
  font-size: 17px;
  line-height: 1.35;
}

.tcn-hub-button {
  width: fit-content;
  margin-top: 8px;
}

.tcn-hub-button .elementor-button {
  min-height: 48px;
  padding: 13px 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: var(--tcn-orange);
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.15;
  text-align: center;
  box-shadow: 0 7px 18px rgba(0,0,0,.12);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.tcn-hub-button-light .elementor-button {
  background: #ffffff;
  color: #171717;
}

.tcn-hub-button .elementor-button:hover,
.tcn-hub-button .elementor-button:focus-visible {
  color: #ffffff;
  filter: brightness(.94);
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

.tcn-hub-button-light .elementor-button:hover,
.tcn-hub-button-light .elementor-button:focus-visible {
  color: #171717;
}

@media (max-width: 767px) {
  .elementor-element.tcn-hub-hero {
    min-height: 540px;
    padding: 28px 20px 54px;
    justify-content: flex-end;
    background-position: 51% center;
  }

  .elementor-element.tcn-hub-hero-copy {
    justify-content: flex-end;
    gap: 10px;
  }

  .tcn-hub-title .elementor-heading-title {
    max-width: 330px;
    font-size: clamp(48px, 14vw, 64px);
    line-height: .98;
  }

  .tcn-hub-subtitle .elementor-widget-container,
  .tcn-hub-subtitle p {
    max-width: 280px;
    font-size: 21px;
    line-height: 1.18;
  }

  .elementor-element.tcn-hub-cards {
    padding: 48px 16px 56px;
    gap: 30px;
  }

  .elementor-element.tcn-hub-card {
    min-height: 510px;
    padding: 18px;
    justify-content: flex-end;
    border-radius: 30px;
    background-position: center;
  }

  .elementor-element.tcn-hub-glass {
    align-self: flex-end;
    min-height: 0;
    padding: 23px 20px 20px;
    gap: 8px;
    border-radius: 22px;
  }

  .tcn-hub-heading .elementor-heading-title {
    font-size: clamp(27px, 8vw, 36px);
    line-height: 1.03;
  }

  .tcn-hub-copy .elementor-widget-container,
  .tcn-hub-copy p {
    font-size: 16px;
    line-height: 1.3;
  }

  .tcn-hub-button .elementor-button {
    min-height: 46px;
    padding: 12px 18px;
    font-size: 14px;
  }

  .elementor-element.tcn-hub-card-new { background-position: 58% center; }
  .elementor-element.tcn-hub-card-prayer { background-position: 50% center; }
  .elementor-element.tcn-hub-card-follow { background-position: 50% center; }
  .elementor-element.tcn-hub-card-give { background-position: 70% center; }
  .elementor-element.tcn-hub-card-service { background-position: 49% center; }
  .elementor-element.tcn-hub-card-announcements { background-position: 50% center; }
  .elementor-element.tcn-hub-card-community { background-position: 51% center; }
}

@media (prefers-reduced-motion: reduce) {
  .tcn-hub-button .elementor-button { transition: none; }
}