/* tools */

#et-main-area,body,html{overflow-x:hidden}.animate{-webkit-transition:.2s ease-in-out;-moz-transition:.2s ease-in-out;-ms-transition:.2s ease-in-out;-o-transition:.2s ease-in-out;transition:.2s ease-in-out}.aspect-ratio{position:relative;max-width:100%;height:auto}.aspect-ratio>*{position:absolute;top:0;left:0;width:100%;height:100%}.aspect-ratio-16-9{padding-top:56.25%!important}.mx-inline-buttons{text-align:right}.mx-inline-buttons .et_pb_button_module_wrapper{display:inline-block;margin-right:10px}.mx-inline-center{text-align:center}.mx-inline-left{text-align:left}@media screen and (max-width:980px){.tablet50 .et_pb_column_1_2{margin-right:5.5%!important;width:47.25%!important}}

/* MX - CSS */


/* Begin Announcment Bar */


#announcement-code { font-size:0.925em; text-align:center; line-height:1.5em; color:#fff !important; }
#announcement-code p a { color:#000; text-decoration:underline; color:#fff !important; }

#announcement-code p { font-weight:400 !important; color:#fff !important; }

@media screen and (max-width: 600px) {
  #announcement-code { font-size:0.9em; }
}

/*.page-id-11 #announcement-bar { display:none; }*/

@media screen and (max-width: 480px) {
  #announcement-bar { display:none; }
  .page-id-2 #announcement-bar { display:block; }
}

/* CSS vars to hold dynamic heights */
:root{
  --ann-h: 0px;        /* announcement height */
  --nav-h: 0px;        /* menu height */
  --adminbar-h: 0px;   /* WordPress admin bar when logged in */
}

/* Fix the announcement at the very top */
.page-id-2 #top-announcement{
  position: fixed;
  top: var(--adminbar-h);
  left: 0; right: 0;
  width: 100%;
  z-index: 9998; /* above the nav */
}

/* Fix the nav and push it down by the announcement’s height */
body.page-id-2 #transparent-topnav {
  background: transparent;  /* or rgba(255,255,255,0.8) if you want a fade */
  position: fixed;
  top: calc(var(--adminbar-h) + var(--ann-h));
  left: 0; right: 0;
  z-index: 9997;
}

/* Push page content below both fixed bars */
.page-id-2 #et-main-area, main{
  padding-top: calc(var(--adminbar-h) + var(--ann-h) + var(--nav-h));
}


/* top nav */

#transparent-topnav { 
  background:transparent; 
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.scrolled { background: rgba(31, 28, 28, 0.95) !important; }


/* home video gradient */
  
#home-gradient { 
  background: linear-gradient(to bottom, rgba(31, 28, 28, 0) 0%, #1f1c1c 100%);
  height:200px; z-index:1; margin-top:-200px;
}



/* Accordions */


.et_pb_toggle { margin-bottom:0 !important; border: none !important; border-bottom:2px solid #a1f5ac !important; }

.et_pb_toggle_title::before {
  content: "\4c" !important;
  font-size: 1.2em; line-height: 1em !important;
}


/* TEAMS GRID */

#team-tabs { 
  margin-bottom: 2.5em !important; 
}

.team_filter { 
  padding: 0.6em 1.4em; 
  font-weight: 600; 
  font-size: 1.1em;
  border: 1px solid #8075ff; 
  border-radius: 0.3em;
  color: #1f1c1c;
}

.active_filter { 
  background: #8075ff; 
}

.team_filter:hover { 
  color: #000; 
  background: #f1f1f1; 
}

.active_filter:hover { 
  background: #8075ff !important; 
}

/* Container grid */
#team-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2 perfectly even columns */
  gap: 32px;
  box-sizing: border-box;
}

/* Force children to behave inside the grid cells */
#team-grid .team_member {
  width: 100%;
  margin: 0;
  box-sizing: border-box;
}

/* 3 across on tablet */
@media (min-width: 768px) {
  #team-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* 4 across on desktop */
@media (min-width: 1200px) {
  #team-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Card links */
.team_member a {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Picture + overlay wrapper */
.team_picture {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;   /* keep it square */
  overflow: hidden;
  box-sizing: border-box;
}

/* Image should fill the square */
.team_picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 12px;
  background: #EDE3FF;   /* placeholder if no image */
}

/* Overlay */
.team_overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(128, 117, 255, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 12px;
}

.team_picture:hover .team_overlay {
  opacity: 1;
}

/* Text */
.team_member h2 {
  margin: 12px 0 6px;
  font-size: 1.125rem;
  line-height: 1.3;
  font-weight: 700;
  color: #6E58F5;
  padding-bottom: 0;
}

.team_member .team_grid_position {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
  color: #7a7a7a;
}

/* Card */
.team_member h2 { padding-bottom:0; }

.team_member a {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Square images that always fill the grid cell */
.team_member img {
  width: 100%;
  aspect-ratio: 1 / 1;   /* force perfect square */
  object-fit: cover;     /* crop to fill square */
  border-radius: 12px;
  display: block;
  background: #EDE3FF;   /* placeholder if no image */
}

/* Text */
.team_member h2 {
  margin: 12px 0 6px;
  font-size: 1.125rem;
  line-height: 1.3;
  font-weight: 700;
  color: #6E58F5;
}

.team_member .team_grid_position {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
  color: #7a7a7a;
}

/* overlay */
/* Ensure the picture container is positioned */
.team_picture {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;   /* keep it square */
  overflow: hidden;
}

/* Image should fill the square */
.team_picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}

/* Overlay starts invisible */
.team_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(128, 117, 255, 0.5); /* #8075ff with 30% opacity */
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 12px; /* match the image corners */
}

/* Show overlay on hover */
.team_picture:hover .team_overlay {
  opacity: 1;
}




















/* TEAMS BIO PAGE */

#team-website {
  position: absolute;
  bottom: 2rem;
  right: 1rem;
  margin: 0;          /* reset Divi’s margins */
}

@media screen and (max-width: 480px) {
  #team-website { position: relative;bottom: auto; right: auto; }
}


.team_phone { display:none; }
.team_email a { color:#1f1c1c !important; }
.team_phone a { color:#1f1c1c !important; }

/* title - team bio page */

.title-with-social {
  display: block;
}

/* first row: title + icons aligned on the middle */
.title-with-social .title-row {
  display: flex;
  align-items: center;          /* vertical center vs the title */
  gap: 0.6rem;                  /* space between title and the icon group */
  flex-wrap: wrap;              /* icons wrap on small screens */
}

/* title */
.title-with-social .entry-title {
  margin: 0;
  line-height: 1.15;            /* keeps the cap height tight */
}

/* icon group */
.title-with-social .social-icons {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

/* Divi icon font */
.title-with-social .social-icons .et-pb-icon {
  font-family: "ETmodules";
  font-size: 1.15em;            /* size relative to title; tweak as needed */
  line-height: 1;
  display: inline-block;
  transform: translateY(2px);   /* tiny optical nudge; adjust or remove */
}

/* links inherit color from your heading; update to taste */
.title-with-social .social-icons a {
  color: #6f5cf6;               /* your purple */
  text-decoration: none;
}
.title-with-social .social-icons a:hover {
  opacity: .85;
}

/* degrees sits under the whole row */
.title-with-social .team-degrees {
  margin-top: 0.4rem;
  color: #666;
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.4;
}




/* home hero header */

/* Make the section fill the viewport (no absolute positioning) */
.hero.et_pb_section {
  min-height: 85vh;            /* or calc(100vh - 80px) if subtracting a fixed header */
  padding-top: 0;               /* Divi adds default top padding—zero it */
  padding-bottom: 2rem;         /* optional breathing room above the bottom edge */
}

/* Ensure the row/column can stretch full height */
.hero .et_pb_section_content { height: 100%; }
.hero-row { height: 100%; }

/* Turn the column into a vertical flex container */
.hero-col {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

/* This is the “stick to bottom” — works because the parent is flex/column */
.hero-text {
  margin-top: auto;
  /* keep your normal row padding untouched */
}

/* If Divi’s default row bottom margin fights you, zero it */
.hero-row.et_pb_row { margin-bottom: 0; }





/**/

#menu-btn { display:none; }


/* ==============================
   Research Pills – layout + rings
   ============================== */

.research-pills-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-items: center;
  align-items: start;
  gap: clamp(28px, 4vw, 56px) clamp(28px, 5vw, 72px);
}

:root { --pill-ring-gap: 24px; }

.research-pill {
  position: relative;
  width: clamp(145px, 19vw, 240px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  border: 4px solid #fff; /* pure white solid inner ring */
  overflow: visible;
  display: grid; place-items: center;
  text-align: center; color: #fff;
  cursor: pointer;
  margin-inline: auto;
  transition: box-shadow 0.3s ease, transform 0.5s ease;
}

/* Overlay gradient – base state (lighter, more transparent, bluish) */
.research-pill::before {
  content: "";
  position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(circle at 50% 60%, rgba(8,16,87,0.20) 0%, rgba(8,16,87,0.45) 70%);
  z-index: 0;
  transition: background 0.2s ease;
  will-change: background;
  transform: translateZ(0);
  backface-visibility: hidden;
  contain: paint;
}

.research-pill:hover::before,
.research-pill:focus-visible::before {
  background: radial-gradient(circle at 50% 60%, rgba(8,16,87,0.65) 0%, rgba(8,16,87,0.65) 100%);
}

.research-pill .et_pb_text_inner,
.research-pill .et_pb_blurb_container {
  position: relative; z-index: 1; padding: 0 1rem;
  font-weight: 700; line-height: 1.25; font-size: clamp(14px, 1.2vw, 18px);
}

.research-pill::after {
  content: "";
  position: absolute;
  inset: calc(-1 * var(--pill-ring-gap));
  border-radius: 50%;
  border: 2px dashed rgba(255,255,255,0.8);
  pointer-events: none; z-index: -1;
  transition: transform 1.2s linear;
}

.research-pill:hover::after,
.research-pill:focus-visible::after { transform: rotate(360deg); }

.research-pill:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.18); }

@media (max-width: 980px) {
  .research-pills-row {
    grid-template-columns: repeat(2, 1fr);
    justify-items: center;
    gap: clamp(28px, 5vw, 64px) clamp(28px, 6vw, 80px);
  }
  .research-pill { width: clamp(170px, 27vw, 260px); }
}

@media (max-width: 767px) {
  .research-pills-row { grid-template-columns: 1fr; justify-items: center; gap: clamp(28px, 7vw, 84px); }
  .research-pill { width: min(80%, 300px); }
  :root { --pill-ring-gap: calc(24px * 0.6667); }
}












/* two-cols  */

@media only screen and (max-width: 980px) {
	#footer-cols #col-1 { width: 70%!important; }
	#footer-cols #col-2 { width: 30%!important; }
	.three .et_pb_column { width: 33.33%!important;	}
	.four-cols .et_pb_column { width: 25%!important; }

	.bio-cols .col-1 { width: 22%!important; }
	.bio-cols .col-2 { width: 75%!important; padding-right: 3%; }
}
/* +5214424250754  */
/* Use: https://wa.me/5214424250754  */

/**/


/* FF form */

.frm_required_field label { 
	display: none !important; 
	font-family: 'Montserrat', sans-serif !important; 
	text-transform: uppercase;
}

.frm_required_field input[type="text"], .frm_error {
	font-family: 'Montserrat', sans-serif !important; 
}

.frm_form_title { display: none !important; }

.frm_button_submit { 
	border:none !important; 
	font-family: 'Montserrat', sans-serif !important; 
	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
	text-transform: uppercase !important;
}

/* Footer columns */


@media screen and (min-width: 981px) {

  #foot-col-1 { width:36.25% !important; }
  #foot-col-2 { width:23.0833% !important; }
  

}


/* MX Styles */

#mx-footer-menu ul { margin: 0; padding: 0; text-align: right; }

#mx-footer-menu ul li { display: inline-block; list-style: none; margin: 0 auto 0 10px; }