.mtt-wrapper {
	 width: 100%;
	 max-width: 1200px;
	 margin: 80px auto;
	 font-family: inherit;
}

/* --- GRID LAYOUT --- */
 .mtt-grid {
	 display: grid;
	 gap: 30px;
	 align-items: stretch; /* Forces all cards in a row to be the same height */
}
 .mtt-cols-3 {
	 grid-template-columns: repeat(3, 1fr);
}
 .mtt-cols-4 {
	 grid-template-columns: repeat(4, 1fr);
}

/* Prevent Salient from breaking grid items */
 .mtt-grid .mtt-card.col.has-animation {
	 float: none !important;
	 width: 100% !important;
	 margin: 0 !important;
	 display: flex !important;
	 visibility: visible;
}

/* --- THE CARD --- */
 .mtt-card {
	 background: #ffffff;
	 border-radius: 12px;
	 overflow: hidden;
	 box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
	 display: flex;
	 flex-direction: column;
	 position: relative; /* Safety for layering */
}

/* Perfect Square Image Crops */
 .mtt-card-img {
	 width: 100%;
	 aspect-ratio: 1 / 1 !important;
	 background: #dfdfdf;
	 overflow: hidden;
	 position: relative;
	 z-index: 1;
}
 .mtt-card-img img {
	 width: 100%;
	 height: 100%;
	 object-fit: cover !important;
   object-position: center 15% !important; /* Locks crop near the top where faces/ears sit */
	 display: block;
}

/* Explicit background and z-index prevents the stacking overlap bug */
 .mtt-card-content {
	 padding: 35px 30px;
	 display: flex;
	 flex-direction: column;
	 flex: 1;
	 background: #ffffff;
	 position: relative;
	 z-index: 2;
}
 .mtt-accent-line {
	 width: 45px;
	 height: 3px;
	 margin-bottom: 20px;
}
 .mtt-accent-line.mtt-center {
	 margin: 0 auto 20px auto;
}

/* Typography */
 .mtt-name {
	 color: var(--mtt-name) !important;
	 font-size: 22px;
	 font-weight: 700;
	 margin: 0 0 5px 0 !important;
}
 .mtt-title {
	 color: var(--mtt-title) !important;
	 font-size: 14px;
	 font-weight: 600;
}
 .mtt-short-bio, .mtt-long-bio p {
	 color: var(--mtt-text) !important;
	 font-size: 15px;
	 line-height: 1.6;
}
 .mtt-short-bio {
	 margin-bottom: 25px !important;
	 flex: 1;
}

/* Card Footer Elements */
 .mtt-card-footer {
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 margin-top: auto;
	 gap: 15px;
	 width: 100%;
}
 .mtt-read-more {
	 background: #eef5f7;
	 color: #0f2e40;
	 padding: 12px 20px;
	 border-radius: 6px;
	 font-size: 16px;
	 font-weight: 700;
	 text-decoration: none;
	 transition: all 0.3s ease;
	 width: 100%;
	 text-align: center;
	 box-sizing: border-box;
}
 .mtt-read-more:hover {
	 background: #dceaf0;
}
 .mtt-linkedin-icon {
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 width: 40px;
	 height: 40px;
	 border-radius: 50%;
	 transition: all 0.3s ease;
}
 .mtt-linkedin-icon svg {
	 width: 18px;
	 height: 18px;
	 stroke: #fff;
	 fill: none;
}
 .mtt-icon-gray {
	 background: #eef5f7;
}
 .mtt-icon-gray svg {
	 stroke: #0f2e40;
}
 .mtt-icon-gray:hover {
	 background: #dceaf0;
}
 .mtt-icon-orange {
	 background: #EE512A;
}
 .mtt-icon-orange:hover {
	 filter: brightness(1.1);
}

/* --- CTA CARD STYLING --- */
 .mtt-cta-card {
	 justify-content: center;
	 text-align: center;
	 padding: 40px 30px;
}
 .mtt-cta-content {
	 display: flex;
	 flex-direction: column;
	 align-items: center;
}
 .mtt-cta-logo {
	 max-width: 120px !important;
	 margin-bottom: 30px !important;
}
 .mtt-cta-head {
	 color: var(--mtt-name) !important;
	 font-size: 30px !important;
	 font-weight: 800;
	 margin: 0 0 15px 0 !important;
}
 .mtt-cta-text {
	 color: var(--mtt-text) !important;
	 font-size: 15px;
	 line-height: 1.6;
	 margin: 0 0 30px 0 !important;
}
 .mtt-cta-btn {
	 width: 100%;
	 padding: 15px !important;
}

/* --- MODAL POPUP --- */
 html.mtt-lock-scroll, body.mtt-lock-scroll, body.mtt-lock-scroll #ajax-content-wrap {
	 overflow: hidden !important;
}
.mtt-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(15, 46, 64, 0.95);
	z-index: 99999;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	overflow: hidden !important;

	/* THE FIX: Added top padding to give the desktop navigation header breathing room */
	padding: 160px 20px 60px 20px !important;
	box-sizing: border-box;
	margin: 0 !important;
	overscroll-behavior: contain;
}
 .mtt-modal-overlay.mtt-modal-active {
	 opacity: 1;
	 visibility: visible;
}
.mtt-modal-content {
	background: #fff;
	border-radius: 12px;
	padding: 50px;
	width: 100%;
	max-width: 650px;
	position: relative;
	transform: translateY(20px);
	transition: transform 0.3s ease;

	/* THE FIX: Cleared auto margins so it stays perfectly centered via flexbox */
	margin: 0 !important;

	max-height: 80vh !important;
	overflow-y: auto !important;
	box-sizing: border-box;
}
 .mtt-modal-overlay.mtt-modal-active .mtt-modal-content {
	 transform: translateY(0);
}
 .mtt-modal-close {
	 position: absolute;
	 top: 20px;
	 right: 20px;
	 background: #eef5f7;
	 border: none;
	 width: 36px;
	 height: 36px;
	 border-radius: 50%;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 cursor: pointer;
	 transition: background 0.3s;
}
 .mtt-modal-close:hover {
	 background: #dceaf0;
}
 .mtt-modal-close svg {
	 width: 20px;
	 height: 20px;
	 fill: #0f2e40;
}

/* --- RESPONSIVE / MOBILE CLEANUP --- */
 @media (max-width: 1024px) {
	 .mtt-cols-4, .mtt-cols-3 {
		 grid-template-columns: repeat(2, 1fr);
	}
}
 @media (max-width: 768px) {
	 .mtt-wrapper {
		 margin: 40px auto !important;
		 padding: 0 0px !important; /* Unified mobile flush padding */
	}
	 .mtt-grid {
		 grid-template-columns: 1fr !important;
		 gap: 30px;
	}
	 .mtt-card-content {
		 padding: 30px 25px;
	}
	 .mtt-name {
		 font-size: 20px;
	}
	 .mtt-short-bio {
		 font-size: 16px !important;
	}
  
   .mtt-modal-overlay {
     /* padding: 20px 15px !important; */
	 padding: 100px 15px 40px 15px !important;
	 align-items: flex-start !important; /* Anchor from top instead of screen center */
   }
	 .mtt-modal-content {
	 padding: 40px 25px;
     max-height: 82vh !important; /* Maximizes screen real estate on phones */
	 }
   
   /* Floating close box setup prevents losing layout button targets during internal scroll */
   .mtt-modal-close {
     position: fixed !important;
     top: 30px !important;
     right: 25px !important;
     z-index: 999999 !important;
     box-shadow: 0 4px 10px rgba(0,0,0,0.1);
   }
}

/* --- STACKING CONTEXT LAYER PROTECTOR --- */
body.mtt-lock-scroll .vc_row:has(.mtt-modal-active),
body.mtt-lock-scroll .wpb_row:has(.mtt-modal-active),
body.mtt-lock-scroll .row:has(.mtt-modal-active),
body.mtt-lock-scroll .mtt-wrapper {
  position: relative !important;
  z-index: 999999 !important; /* Elevates parent row blocks past animated hardware elements below */
}