/* ── Section ── */
.intlz03-section {
  padding: 88px 48px;
  background: #fff;
}

/* ── Header ── */
.intlz03-header {
  text-align: center;
  margin-bottom: 64px;
}

.intlz03-header__eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 7px 18px;
  border-radius: 2px;
  margin-bottom: 20px;
}

.intlz03-header h2 {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(2.4rem, 4.5vw, 3.6rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.01em;
  margin-bottom: 16px;
}

.intlz03-header h2 em {
  font-style: italic;
  font-weight: 400;
}

.intlz03-header p {
  font-size: 15px;
  font-weight: 300;
  max-width: 420px;
  margin: 0 auto;
  line-height: 1.75;
  opacity: 0.55;
}

/* ── Grid ── */
.intlz03-team-group {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  max-width: 1180px;
  margin: 0 auto;
}

/* ── Card ── */
.intlz03-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  /* Fixed height so overlay has room */
  aspect-ratio: 3 / 4.2;
}

/* Full-bleed photo fills the card */
.intlz03-card__photo {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.intlz03-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
  transition: transform 0.55s ease;
}

.intlz03-card:hover .intlz03-card__photo img {
  transform: scale(1.07);
}

/* Always-visible bottom gradient + name strip */
.intlz03-card__baseline {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  z-index: 3;
  padding: 56px 20px 20px;
  background: linear-gradient(to top, rgba(0,0,0,0.72) 0%, transparent 100%);
  transition: opacity 0.35s ease;
}

.intlz03-card:hover .intlz03-card__baseline {
  opacity: 0;
}

.intlz03-card__name {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 22px;
  font-weight: 600;
  color: #fff;
  line-height: 1.15;
  margin-bottom: 3px;
}

.intlz03-card__role {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
}

/* ── Hover overlay — slides up from bottom ── */
.intlz03-card__overlay {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 28px 22px 24px;

  /* Starts hidden below */
  transform: translateY(100%);
  opacity: 0;
  transition: transform 0.4s cubic-bezier(.22,.68,0,1.08),
              opacity 0.3s ease;
}

.intlz03-card:hover .intlz03-card__overlay {
  transform: translateY(0);
  opacity: 1;
}

/* Name repeated inside overlay (bigger, styled) */
.intlz03-overlay__name {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 26px;
  font-weight: 600;
  color: #fff;
  line-height: 1.1;
  margin-bottom: 2px;
}

.intlz03-overlay__role {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

/* Thin divider */
.intlz03-overlay__divider {
  height: 1px;
  background: rgba(255,255,255,0.2);
  margin-bottom: 14px;
}

.intlz03-overlay__bio {
  font-size: 12.5px;
  font-weight: 300;
  line-height: 1.7;
  color: rgba(255,255,255,0.82);
  margin-bottom: 18px;
}

/* Social row */
.intlz03-overlay__socials {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}

.intlz03-social {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: transform 0.18s, opacity 0.18s;
  flex-shrink: 0;
}

.intlz03-social:hover {
  transform: scale(1.12);
  opacity: 0.85;
}

.intlz03-social svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

/* Action buttons */
.intlz03-overlay__actions {
  display: flex;
  gap: 8px;
}

.intlz03-btn {
  flex: 1;
  padding: 10px 12px;
  border-radius: 8px;
  border: none;
  font-family: 'Outfit', sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: opacity 0.18s, transform 0.15s;
  text-align: center;
  text-transform: uppercase;
}

.intlz03-btn:hover { opacity: 0.85; transform: scale(0.97); }

.intlz03-btn--outline {
  background: transparent !important;
  border: 2px solid rgba(255,255,255,0.55) !important;
  color: #fff !important;
}

/* staggered animation for overlay children */
.intlz03-card__overlay > * {
  transform: translateY(10px);
  opacity: 0;
  transition: transform 0.38s ease, opacity 0.35s ease;
}

.intlz03-card:hover .intlz03-card__overlay > *:nth-child(1) { transform: translateY(0); opacity: 1; transition-delay: 0.04s; }
.intlz03-card:hover .intlz03-card__overlay > *:nth-child(2) { transform: translateY(0); opacity: 1; transition-delay: 0.08s; }
.intlz03-card:hover .intlz03-card__overlay > *:nth-child(3) { transform: translateY(0); opacity: 1; transition-delay: 0.11s; }
.intlz03-card:hover .intlz03-card__overlay > *:nth-child(4) { transform: translateY(0); opacity: 1; transition-delay: 0.14s; }
.intlz03-card:hover .intlz03-card__overlay > *:nth-child(5) { transform: translateY(0); opacity: 1; transition-delay: 0.17s; }
.intlz03-card:hover .intlz03-card__overlay > *:nth-child(6) { transform: translateY(0); opacity: 1; transition-delay: 0.20s; }

/* ════════════════════════════════════════
   THEME 1 — MIDNIGHT NAVY
════════════════════════════════════════ */
.intlz03-t-navy { background: #fff; }
.intlz03-t-navy .intlz03-header__eyebrow { background: #0f1626; color: #d4af37; }
.intlz03-t-navy .intlz03-header h2       { color: #0f1626; }
.intlz03-t-navy .intlz03-header p        { color: #4a5570; }

.intlz03-t-navy .intlz03-card__overlay   { background: linear-gradient(to top, rgba(15,22,38,0.97) 0%, rgba(15,22,38,0.78) 100%); }
.intlz03-t-navy .intlz03-overlay__role   { color: #d4af37; }
.intlz03-t-navy .intlz03-social           { background: rgba(212,175,55,0.18); color: #d4af37; }
.intlz03-t-navy .intlz03-btn              { background: #d4af37; color: #0f1626; }

/* ════════════════════════════════════════
   THEME 2 — SAGE GREEN
════════════════════════════════════════ */
.intlz03-t-sage { background: #fff; }
.intlz03-t-sage .intlz03-header__eyebrow { background: #3b5e2a; color: #f6faf3; }
.intlz03-t-sage .intlz03-header h2       { color: #1e2b18; }
.intlz03-t-sage .intlz03-header p        { color: #6b7a62; }

.intlz03-t-sage .intlz03-card__overlay   { background: linear-gradient(to top, rgba(30,43,24,0.97) 0%, rgba(30,43,24,0.78) 100%); }
.intlz03-t-sage .intlz03-overlay__role   { color: #a8d898; }
.intlz03-t-sage .intlz03-social           { background: rgba(168,216,152,0.18); color: #a8d898; }
.intlz03-t-sage .intlz03-btn              { background: #a8d898; color: #1e2b18; }

/* ════════════════════════════════════════
   THEME 3 — BLUSH CORAL
════════════════════════════════════════ */
.intlz03-t-coral { background: #fff; }
.intlz03-t-coral .intlz03-header__eyebrow { background: #e87050; color: #fff; }
.intlz03-t-coral .intlz03-header h2       { color: #2e1a16; }
.intlz03-t-coral .intlz03-header p        { color: #9a7060; }

.intlz03-t-coral .intlz03-card__overlay   { background: linear-gradient(to top, rgba(192,74,42,0.97) 0%, rgba(192,74,42,0.78) 100%); }
.intlz03-t-coral .intlz03-overlay__role   { color: #fde8df; }
.intlz03-t-coral .intlz03-social           { background: rgba(255,255,255,0.18); color: #fff; }
.intlz03-t-coral .intlz03-btn              { background: #fff; color: #c04a2a; }

/* ════════════════════════════════════════
   THEME 4 — SLATE PURPLE
════════════════════════════════════════ */
.intlz03-t-slate { background: #fff; }
.intlz03-t-slate .intlz03-header__eyebrow { background: #8264e6; color: #fff; }
.intlz03-t-slate .intlz03-header h2       { color: #16141f; }
.intlz03-t-slate .intlz03-header p        { color: #666088; }

.intlz03-t-slate .intlz03-card__overlay   { background: linear-gradient(to top, rgba(22,20,31,0.97) 0%, rgba(130,100,230,0.82) 100%); }
.intlz03-t-slate .intlz03-overlay__role   { color: #c8b8f8; }
.intlz03-t-slate .intlz03-social           { background: rgba(200,184,248,0.18); color: #c8b8f8; }
.intlz03-t-slate .intlz03-btn              { background: #8264e6; color: #fff; }

/* ════════════════════════════════════════
   THEME 5 — CLEAN BLUE
════════════════════════════════════════ */
.intlz03-t-blue { background: #fff; }
.intlz03-t-blue .intlz03-header__eyebrow { background: #1a5fb4; color: #fff; }
.intlz03-t-blue .intlz03-header h2       { color: #111827; }
.intlz03-t-blue .intlz03-header p        { color: #6b7280; }

.intlz03-t-blue .intlz03-card__overlay   { background: linear-gradient(to top, rgba(13,61,122,0.97) 0%, rgba(26,95,180,0.82) 100%); }
.intlz03-t-blue .intlz03-overlay__role   { color: #bdd4f4; }
.intlz03-t-blue .intlz03-social           { background: rgba(189,212,244,0.18); color: #bdd4f4; }
.intlz03-t-blue .intlz03-btn              { background: #bdd4f4; color: #0d3d7a; }

/* ── Responsive ── */
@media (max-width: 680px) {
  .intlz03-section { padding: 56px 20px; }
  .intlz03-team-group { grid-template-columns: 1fr 1fr; gap: 14px; }
}
@media (max-width: 440px) {
  .intlz03-team-group { grid-template-columns: 1fr; }
}