/**
 * Home page premium cards — Leadership, Partners, Digital Platforms
 * Leadership rules use #leadership-cards + !important so they beat
 * the inline styles inside index.blade.php (do not edit index).
 */

@keyframes mopdicLeadershipShine {
  0% { background-position: -120% 0; }
  100% { background-position: 220% 0; }
}

@keyframes mopdicPartnerFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}

@keyframes mopdicPartnerGlow {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 0.85; transform: scale(1.08); }
}

@keyframes mopdicSystemShimmer {
  0% { transform: translateX(-100%) rotate(12deg); }
  100% { transform: translateX(220%) rotate(12deg); }
}

@keyframes mopdicLeadershipSweep {
  0% { transform: translateX(-130%) rotate(18deg); }
  100% { transform: translateX(220%) rotate(18deg); }
}

@keyframes mopdicCrestPulse {
  0%, 100% { box-shadow: 0 10px 24px rgba(66, 124, 208, 0.35), 0 0 0 6px #fff, 0 0 0 8px rgba(66, 124, 208, 0.22); }
  50% { box-shadow: 0 12px 28px rgba(59, 178, 60, 0.32), 0 0 0 6px #fff, 0 0 0 9px rgba(59, 178, 60, 0.28); }
}

.profile-cards {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 28px !important;
  padding: 28px 8px 48px !important;
  z-index: 0;
  overflow: visible;
}

#leadership-cards {
  --lead-line-top: 215px;
  isolation: isolate;
  overflow: visible !important;
  position: relative !important;
  z-index: 0;
}

#leadership-cards::before {
  content: '';
  position: absolute !important;
  top: var(--lead-line-top) !important;
  left: -20px !important;
  right: -20px !important;
  height: 6px !important;
  transform: translateY(-50%) !important;
  background: linear-gradient(90deg, #2855a0 0%, #427cd0 22%, #3bb23c 50%, #427cd0 78%, #2855a0 100%) !important;
  background-size: 220% 100% !important;
  animation: mopdicLeadershipShine 5s linear infinite;
  border-radius: 99px;
  box-shadow:
    0 0 0 5px rgba(255, 255, 255, 0.95),
    0 0 22px rgba(66, 124, 208, 0.55),
    0 8px 22px rgba(59, 178, 60, 0.28);
  z-index: 0 !important;
  pointer-events: none !important;
}

#leadership-cards::after {
  content: '';
  position: absolute !important;
  top: var(--lead-line-top) !important;
  left: -20px !important;
  right: -20px !important;
  height: 24px !important;
  transform: translateY(-50%) !important;
  background:
    radial-gradient(circle at 2% 50%, #ffffff 0 6px, #427cd0 7px 11px, transparent 12px),
    radial-gradient(circle at 98% 50%, #ffffff 0 6px, #427cd0 7px 11px, transparent 12px) !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

#leadership-cards .profile-card {
  position: relative !important;
  z-index: 5 !important;
  isolation: isolate;
  width: 360px !important;
  border-radius: 32px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid rgba(66, 124, 208, 0.16);
  box-shadow:
    0 22px 56px rgba(15, 23, 42, 0.12),
    0 10px 24px rgba(66, 124, 208, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.98);
}

#leadership-cards .profile-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 7px;
  opacity: 1 !important;
  transform: scaleX(1) !important;
  background: linear-gradient(90deg, #2855a0, #427cd0, #3bb23c, #feb91e, #427cd0, #2855a0);
  background-size: 240% 100%;
  animation: mopdicLeadershipShine 5s linear infinite;
  z-index: 6;
}

#leadership-cards .profile-card::after {
  content: none !important;
}

.profile-card__watermark {
  display: none !important;
}

#leadership-cards .profile-card__ornament {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, #427cd0, #2d8f30) !important;
  color: #fff !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 22px rgba(66, 124, 208, 0.38), 0 0 0 5px #fff !important;
  z-index: 7 !important;
  animation: mopdicCrestPulse 3.6s ease-in-out infinite;
}

#leadership-cards .profile-card__ornament i {
  font-size: 17px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
}

#leadership-cards .profile-card__image {
  position: relative !important;
  height: 430px !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, #1e3a5f 0%, #3266b5 55%, #427cd0 100%);
}

#leadership-cards .profile-card__image::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10, 22, 40, 0.12) 0%, transparent 28%),
    linear-gradient(180deg, transparent 62%, rgba(255, 255, 255, 0.98) 100%);
  z-index: 2;
  pointer-events: none;
}

#leadership-cards .profile-card__image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.28) 50%, transparent 65%) !important;
  background-image: none !important;
  transform: translateX(-130%) rotate(18deg);
  opacity: 0 !important;
  pointer-events: none;
  z-index: 2;
}

#leadership-cards .profile-card:hover .profile-card__image::after {
  opacity: 1 !important;
  animation: mopdicLeadershipSweep 1.1s ease;
}

#leadership-cards .profile-card__image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 38% !important;
  transform: scale(1.04) !important;
  transform-origin: center 30% !important;
  filter: saturate(1.05) contrast(1.04);
}

#leadership-cards .profile-card:hover .profile-card__image img {
  transform: scale(1.08) !important;
}

.profile-card__photo-ring {
  position: absolute;
  left: 50%;
  bottom: 18px;
  width: 92px;
  height: 6px;
  transform: translateX(-50%);
  border-radius: 99px;
  background: linear-gradient(90deg, #427cd0, #3bb23c);
  box-shadow: 0 6px 16px rgba(66, 124, 208, 0.35);
  z-index: 3;
}

#leadership-cards .profile-card__body {
  padding: 8px 26px 28px !important;
  margin-top: -28px !important;
  position: relative;
  z-index: 2;
  background: linear-gradient(180deg, transparent 0%, #ffffff 28%) !important;
}

.profile-card__kicker {
  display: none !important;
}

#leadership-cards .profile-card__quote {
  width: 48px !important;
  height: 48px !important;
  font-size: 16px;
  background: linear-gradient(135deg, #3266b5, #427cd0, #3bb23c) !important;
  box-shadow: 0 12px 28px rgba(66, 124, 208, 0.4), 0 0 0 6px rgba(255, 255, 255, 0.96);
}

#leadership-cards .profile-card__name {
  font-size: 1.22rem;
  line-height: 1.25;
  color: #123056;
  letter-spacing: -0.02em;
}

#leadership-cards .profile-card__role {
  font-size: 0.72rem;
  padding: 8px 16px;
  background: linear-gradient(135deg, rgba(66, 124, 208, 0.14), rgba(59, 178, 60, 0.12));
  border-color: rgba(66, 124, 208, 0.24);
  color: #2855a0;
}

#leadership-cards .profile-card__role::before {
  background: #3bb23c;
  box-shadow: 0 0 10px rgba(59, 178, 60, 0.55);
}

#leadership-cards .profile-card__divider {
  width: 78px;
  height: 4px;
  background: linear-gradient(90deg, transparent, #427cd0, #3bb23c, #427cd0, transparent);
  opacity: 0.85;
}

#leadership-cards .profile-card .btn--ghost {
  border-radius: 999px;
  padding: 11px 22px;
  background: linear-gradient(135deg, rgba(66, 124, 208, 0.08), rgba(59, 178, 60, 0.08));
}

#leadership-cards .profile-card:hover {
  transform: translateY(-16px) scale(1.02);
  box-shadow:
    0 40px 90px rgba(15, 23, 42, 0.18),
    0 16px 40px rgba(66, 124, 208, 0.24);
  border-color: rgba(59, 178, 60, 0.35);
}

#leadership-cards .profile-card:hover .profile-card__divider {
  width: 118px;
  opacity: 1;
}

#leadership-cards .profile-card:hover .profile-card__ornament {
  transform: rotate(-8deg) scale(1.06);
}

.partners-section-wrap {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 50%, #ffffff 100%);
}

.partners-section-wrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(680px, 90%);
  height: 280px;
  background: radial-gradient(ellipse, rgba(66, 124, 208, 0.08), transparent 70%);
  pointer-events: none;
}

.partners-logos {
  gap: 28px;
}

.partner-logo-card {
  min-height: 220px;
  padding: 36px 24px 28px;
  border-radius: 26px;
  border: 1px solid rgba(66, 124, 208, 0.1);
  box-shadow:
    0 16px 48px rgba(15, 23, 42, 0.07),
    0 4px 16px rgba(66, 124, 208, 0.06);
  animation: mopdicPartnerFloat 5s ease-in-out infinite;
}

.partners-logos .partner-logo-card:nth-child(2) { animation-delay: 0.4s; }
.partners-logos .partner-logo-card:nth-child(3) { animation-delay: 0.8s; }
.partners-logos .partner-logo-card:nth-child(4) { animation-delay: 1.2s; }
.partners-logos .partner-logo-card:nth-child(5) { animation-delay: 1.6s; }

.partner-logo-card::before {
  height: 5px;
  transform: scaleX(1);
  background: linear-gradient(90deg, #427cd0, #3bb23c, #feb91e, #427cd0);
  background-size: 200% 100%;
  animation: mopdicLeadershipShine 5s linear infinite;
}

.partner-logo-card::after {
  background: radial-gradient(circle at 50% 100%, rgba(66, 124, 208, 0.14), transparent 65%);
  opacity: 0.6;
}

.partner-logo-inner {
  height: 92px;
  margin-bottom: 18px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(248, 250, 252, 0.9), rgba(230, 240, 255, 0.5));
  border: 1px solid rgba(66, 124, 208, 0.08);
}

.partner-logo-card:hover {
  transform: translateY(-16px) scale(1.04);
  animation: none;
  box-shadow:
    0 32px 70px rgba(15, 23, 42, 0.14),
    0 14px 32px rgba(66, 124, 208, 0.18);
}

.partner-logo-card .partner-arrow {
  opacity: 0.65;
  transform: translate(0, 0);
}

.partner-logo-card:hover .partner-arrow {
  animation: mopdicPartnerGlow 1.8s ease-in-out infinite;
}

@media (max-width: 768px) {
  #leadership-cards .profile-card { width: 92% !important; max-width: 380px !important; }
  #leadership-cards .profile-card__image { height: 360px !important; }
  .partner-logo-card { animation: none; }
  #leadership-cards::before,
  #leadership-cards::after { display: none !important; }
}