@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,900;1,900&family=Poppins:wght@300;400;500;600;700&display=swap');
:root {
  --header-height: 6rem;  
  --first-color: #c46e02;
  --second-color:#c46d02c4;
  --title-color: hsl(0,0%,100%);
  --text-color: hsl(0,0%,77%);
  --body-color: oklch(0.12 0.015 240) ;
  --navbar-color:oklch(0.1 0.015 240);
  --container-color: hsl(0,0%,10% );
  --container-color2: hsla(0, 0%, 10%, 0.916);
  --box-color:hsla(28, 89%, 48%, 0.16);
  --box-color-2:oklch(0.1 0.015 240);
  --border-color:oklch(0.22 0.03 240);
  --border-color-2:hsla(0,0%,100%,0.2);
  --box-color-3: oklch(25.201% 0.08734 26.14);
  --font-color: oklch(0.637 0.237 25.331);
  --box-color-4:  oklch(22.797% 0.04528 167.356) ;
  --font-color-2: oklch(0.696 0.17 162.48);
  --body-font:"Poppins", sans-serif;
  --second-font:"Montserrat", sans-serif;
  --big-font-size: 4.5rem ;
  --h1-font-size: 3.75rem;
  --h2-font-size: 1.5rem;
  --h3-font-size: 1.25rem;
  --normal-font-size: .975rem;
  --small-font-size: .9rem;
  --smaller-font-size: 0.775rem;
  --weight-300:300;
  --weight-400:400;
  --weight-500:500; 
  --weight-600:500;  
  --weight-700:700;   
  --weight-900:900;  
  --transition: cubic-bezier(0.05,0.2,0.1,1);
  --radius:0.5rem;
  --z-toolip:10;
  --z-fixed:10;
} 
 .home__container {
    grid-template-columns: 7fr 5fr;
    align-items: center;
    width: 100%;
    overflow: hidden;
    max-width: 100%;
    padding-bottom: 2rem;
 }
 .resume-container{
    display: grid;
    gap:2rem;
    max-width:1260px;
    margin-inline:auto;
    padding-inline:1.25rem;
    grid-template-columns: 1fr 1fr;
    align-items: start;
}

.member-loc{
  display: flex;
  width: 100%;
  justify-content: center;
  gap: 8px;
}
.right{
  padding-left: 50px;
}
 .blackhole-wrapper {
  /* width: clamp(0.875rem, 0.3338rem + 2.4742vw, 2.375rem); */
  margin-left: 20px;
  width:450px;      
  aspect-ratio: 1/1;
  border-radius: 47% 53% 71% 29% / 47% 57% 43% 53%;
  padding-bottom: 20px;
  display: flex;
  align-items: center;

 background: radial-gradient(circle,
    rgba(0,0,0,1) 0%,               
    rgba(255, 195, 0, 0.839) 45%,               
    rgba(255, 115, 0, 0.654) 65%,                
    rgba(255, 68, 0, 0.374) 75%,          
    rgba(255, 85, 0, 0.301) 85%, 
    rgba(0,0,0,0) 100%
   
  );

 

  box-shadow:
    0 0 25px 10px rgba(255, 102, 0, 0.312),
    0 0 50px 25px rgba(255, 119, 0, 0.191),
    0 0 90px 40px rgba(255, 89, 0, 0.066);
}
.home__light-img {
    width: min(390px,100%);      
   aspect-ratio: 1/1;
   border-radius: 50%;
   filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.842))
 }



 .light-wrapper{
    margin-left: 10px;
    width: 450px;     
    aspect-ratio: 1/1;
    border-radius:50% 50% 54% 46% / 55% 46% 54% 45% ;
    background-color: #c46e02;
    display: flex;
    align-items: center;
 }
 
.tabla-visitas {
  width: 100%;
  border-collapse: collapse;
  background: var(--container-color);
  border-radius: var(--radius);
  overflow: hidden;
}

.tabla-visitas th,
.tabla-visitas td {
  padding: 1rem;
  text-align: left;
  border-bottom: 1px solid var(--border-color);
}

.tabla-visitas th {
  background: var(--navbar-color);
  color: var(--title-color);
  font-weight: var(--weight-600);
}

.tabla-visitas tr:hover {
  background: var(--box-color);
  transition: 0.3s;
}

.tabla-visitas td {
  font-size: var(--small-font-size);
}
@media screen and (max-width:967px){
    :root{
  --big-font-size: 3.5rem ;
  --h1-font-size: 2.75rem;
  --h2-font-size: 1.45rem;
  --h3-font-size: 1.15rem;
  --normal-font-size: .925rem;
  --small-font-size: 0.875rem;
  --smaller-font-size: 0.813rem;
  }
  
}
@media screen and (max-width:886px){
  .nav{
    height: 4.75rem;
 
  }
  .resume-container{
    grid-template-columns: 1fr;
    /* text-align: center; */
  }
  .nav-toggle,
  .nav-close{
    display: inline-flex !important;
    color: var(--title-color);
    font-size: 1.25rem;
    cursor: pointer;
  }
  .change-theme{
    padding-top: 14px;
    padding-right: 5px;
  }
   /* .nav-toggle{
     margin-right: 1.25rem;
   } */
  .nav-menu{
    position: fixed;
    top: 0;
    right: -100%;
    background-color: hsla(var(--body-color), 0%, 4%, 0.4);
    width: 55%;
    height: 100%;
    padding: 5rem 0 4rem 3rem;
    backdrop-filter: blur(24px);
    /* height: 100%; */
  }
  .show-menu{
    right: 0;
  }
  .nav-list{
    flex-direction: column;
    row-gap: 3rem;
  }
  .nav-close{
    position: absolute;
    top: 2rem;
    right: 1.8rem;
  }
  .home__container {
    grid-template-columns: 1fr;
    /* text-align: center; */
  }
  .pdf-container{
      margin-left: 1.25rem;
  } 
  .member-loc{
    justify-content: start;
  }
  .right{
  padding-left: 2px;
}
.sub_title-gr{
  padding-left: 2.95rem;
}
.button_members{
 margin-inline: 1.75rem;
}
.custom-table th{
  font-size: var(--smaller-font-size);
}

 .home__title{
  font-size: 1.1rem;
  /* line-height: 1.1; */
 }
  .home__description{
    font-size: var(--smaller-font-size);
   
  }
 .blackhole-wrapper, .light-wrapper{
  width:min(450px,100%);      
  aspect-ratio: 1/1;
}

}

@media screen and (max-width:609px){
  .item-text,.item-icon, .member-text{
    font-size:.7rem;
  }

}
@media screen and (max-width:549px){
  .table-title{
    font-size: 1.3rem;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
  }
  .table-description{
    font-size:.65rem;
  }
  .custom-table,.tabla-visitas{
    font-size:.65rem ;
  }
  .custom-table th,
.custom-table td,
 .tabla-visitas th,
  .tabla-visitas td{
   padding: 6px 8px;
   text-align: center;
}
.tabla-visitas td{
  font-size: .65rem ;
}
}
@media screen and (max-width:537px){
  .item-text{
    font-size:.6rem;
  }
}
@media screen and (max-width:495px){
  .item-text,.item-icon{
    font-size:.55rem;
  }
  .button_members{
    margin-left: 4rem;
  }
 .home__title, .home__description, .home__subtitle
 {
    margin-left:1.85rem;
  } 
  .home__buttons{
    padding-left: 1.85rem;
  }
}
@media screen and (max-width:476px){
  .item-text{
    font-size:.5rem;
  }
}
@media screen and (max-width:456px){
  .item-text{
    font-size:.45rem;
  }
}
@media screen and (max-width:435px){
  .item-text{
   display: none;
  }
  .item-icon{
    font-size: var(--smaller-font-size);
  }
  .button_members,.sub_title-gr{
 margin-inline: 1.25rem;
}
}

@media screen and (max-width:400px){
.tabla-container{
  margin-left: .25rem;
}
}




  * {
    margin:0;
    padding:0;
    box-sizing:border-box;
 
  }
 
  input,
  textarea,
  body {
    color: var(--text-color);
    font-family:var(--body-font);
    font-size:var(--normal-font-size);
    font-weight: var(--weight-300);  
  }
  body {
    background-color:var(--body-color);
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    
  }
  html{
    width: 100%;
    overflow-x: hidden;
  }
  h1,
  h2,
  h3 {
    color: var(--title-color);
    font-weight:var(--title-color);
    
  }
 ul{
    list-style:none;
 }
 a{
    text-decoration: none;
 }
 p {
   line-height:1.67em; 
   }
img {
   max-width: 500px; 
 }
 textarea,
 input {
    background-color: none;
    border:none;
    outline: none;
 }
 .container {
    max-width:1260px;
    margin-inline:auto;
    padding-inline:1.25rem;

 } 
 /* .home__content{
  display: flex;
  gap: .25rem;
  flex-direction: column;
 } */
 .grid {
    display: grid;
    gap:1rem;
 }
 .home {    
    padding-block: 5rem 9rem;
 }

 .home__subtitle {
    font-size: var(--small-font-size);
    font-size: var(--weight-400);
    margin-bottom: 1.25rem;
    display: block;
    color: var(--first-color);

 }
 .home__description ,.home__title{
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
  }
   .home__description *{
    max-width: 100%;
   }
 .home__title {
    font-family: var(--second-font);
     font-size: var(--h2-font-size);
    font-weight: var(--weight-700);
  
 }
 .home__img {
   width: min(390px,100%);
   aspect-ratio: 1/1;
   object-fit: cover;
   border-radius: 50%;
   display: block;
  filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.007));

 }
 
.header {
    background-color: var(--navbar-color);
    position: fixed;
    inset:0 0 auto;
    z-index:1000;
    margin-bottom: 20px;
    border-bottom: solid var(--border-color) 1px
}
.nav,
.nav-list, 
.nav-btns{
  display: flex;   
}
.nav-btns{
    align-items: center;
}
.has-submenu,
.has-submenu-2{
  position: relative;
}
.sub_menu-wrap{
  position:absolute;
  translate: 450px;
  top: 100%;
  left: 0;  
  max-height: 0px;
  overflow: hidden;
  transition:max-height  0.5s ease;
  padding-left: 10px;
  border-radius: .25rem;
  z-index: 1000;
}
.sub_menu-wrap-2{
  position:absolute;
  width: 300px;
  translate: -71px 30px;
  top: 100%;
  left: 0;  
  max-height: 0px;
  overflow: hidden;
  transition:max-height  0.5s ease;
  padding-left: 10px;
  border-radius: .25rem;
  z-index: 1000;
}
.has-submenu-2:hover > .sub_menu-wrap-2 {
  display: block;
}
.has-submenu:hover > .sub_menu-wrap {
  display: block;
}
.open-menu{
  max-height: 400px;
}
.sub-menu{
  padding-left: 20px;
  padding-right: 25px;
  padding-bottom: 10px;
  background-color:var(--navbar-color);
  display: flex;
  flex-direction: column;
  gap: 1.25fr;
  border-left: solid var(--border-color) 1px;
  border-right: solid var(--border-color) 1px;
  border-bottom: solid var(--border-color) 1px;;
  border-radius: .25rem;

}
.sub-link{
  text-decoration: none;
  color: var(--text-color);
  transition: color 0.5s;
  font-size: var(--normal-font-size);
  transition: transform 0.8s;
}
.sub-link:hover{
  color: #c46e02;
  transform: translateX(5px);
}


.change-theme{
    padding-top: -10px;
    margin-top: -16px;
    font-size: 1.25rem;
    cursor: pointer;
    transition: color 0.3s;
}
.change-theme:hover{
    color:var(--first-color)
}
.main{
  padding-top: 2rem;
}
.Container{
    max-width: 1260px;
    margin-inline:auto   ;
    padding-inline:1.25rem;
}
.nav{
    background-color: transparent;
    justify-content: space-between  ;
    align-items: center;
    column-gap: 0.75rem;
    height: 5.5rem;

}
.nav-logo,
.nav_link,
.change-theme {
   text-decoration: none;
   color:var(--title-color);
}


.nav-icon {
  width: 80px;   
  height: 80px;
  padding: 5px;
  margin: 5px;
}

.nav-list{
    column-gap: 2.75rem;
    text-decoration: none;
    color: inherit;
}
.nav_link{
    font-weight: var(--weight-400);
    transition: color 0.3s;
}    
.nav_link:hover {
   color:var(--first-color)
}
.change-theme{
    font-size: 1.25rem;
} 
.nav-btns{
    align-items:center;
}
.nav-close,.nav-toggle{
    display: none;
}
.home__buttons{
    display: flex;
    align-items: center;
    gap: 16px;
}
.contact,.button{
    text-decoration: none;
    padding: 10px;
    margin-top: 20px;
    font-weight: var(--weight-500);
    cursor: pointer;
}
.contact{
    background-color: var(--first-color);
    padding-right:16px;
    transition: color 0.3s;
    color:  hsl(0,0%,100%);
   
    
}
.contact:hover{
   background-color:var(--second-color);
}
.contact,.button{
    display: flex;
    gap: 16px;
    align-items: center;
    border-radius: .5rem;
}
.button{
    color:var(--text-color);
    transition: color 0.3s;
}
.button:hover{
   color: var(--first-color);
}
.resume{
    background-color: var(--body-color);
    padding-block: 5rem 9rem;
    transform: translateY(-8rem);

}
.scrolled-header{
    background-color: var(--body-color);
    box-shadow: (0,4px hsla(30, 8%, 85%, 0.071));    
} 
.light-theme {

  --title-color: hsl(0,8%,16%);
  --text-color: hsl(0,8%,28%);
  --body-color:oklch(0.99 0.005 80);
  --container-color: hsl(0,8%,99%); 
  --container-color2: hsla(0, 33%, 97%, 0.591);
  --box-color-2:   oklch(0.98 0.01 80);
  --border-color: oklch(0.88 0.01 240);
  --navbar-color:oklch(0.98 0.005 80);
  --box-color-3:oklch(83.713% 0.05983 1.083);
  --box-color-4:oklch(93% 0.07562 172.012);
 
  /* --box-color:hsla(47, 89%, 85%, 0.848); */
}

.experience-container,
.education-container{
     background-color: var(--box-color-2);
     padding: 1.25rem;  
     border-radius: 5%;
     display: flex;
     flex-direction: column;
     gap: 1.75rem;
     border:solid var(--border-color) 1px;
}
.edu-list,.exp-list{
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.education-item{
  text-decoration: none;
}
.education-title,.experience-title{
  display: flex;
  align-items: center;
  gap: 16px;
}
.box-icon-edu,.box-icon-exp{
  background-color:var(--box-color);
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 3px;
  padding-bottom: 3px;
  border-radius: 15%;
  color:var(--first-color)
}
.edu-subtitle,
.exp-subtitle
{
    color: var(--text-color);
}
.edu-title,
.exp-title
{
  color: var(--first-color);
}

.edu-text,
.exp-text{
  color: var(--text-color);
  transition: color 0.3s;
}
.edu-text:hover{
  color: var(--first-color);
}
.education-title,.experience-title{
  font-family: var(--body-font);
  font-size: var(--normal-font-size);
  font-weight: var(--weight-700);
}
.pub_title{
  font-family:var(--body-font);
  font-size: 2.75rem;
  font-weight:var(--weight-700) ;

}
.pub_description{
    font-family:var(--body-font);
    font-size: var(--normal-font-size);
    font-weight:var(--weight-400) ;
}
.pub_title-container{
   padding-inline:1.25rem;
   margin-bottom: 50px;
}
.article-item{
  padding: 30px;
  color: var(--title-color);
  display: flex;
  gap: 13px;
  border: solid var(--border-color) 1px;
  margin-bottom: 25px;
  border-radius: 1.5rem;
  background-color:var(--box-color-2);
}
.article-item:hover{
  border:solid var(--first-color) 1px;
}
.publications-container{
  max-width:1260px;
  padding-inline:1.25rem;
}
.publications{
  padding-block: 5rem 9rem;
  display: flex;
  gap: 3fr;
  flex-direction: column;
  padding-top: 7rem;
}

 .hidden{
  display: none;
 }

 .show_all{

  display:none;
 }

 .article-sub{
  color: var(--first-color);
 }
 .more_authors{
  color: var(--text-color);
 }
 .file_icon{
  background-color: var(--box-color);
  padding: 8px;
  font-size: var(--h3-font-size);
  font-weight: var(--weight-300);
  border-radius: 12.5%;
  
 }
 .pub-link{
  color: var(--first-color);
 }
 .show_abstract{
  display: block;
  background-color: var(--box-color-2);
  color: var(--title-color);
  padding: 10px;
  border: none;
  border-radius: .5rem;
  margin-top: 15px;
  cursor: pointer;
 }
 .show_abstract:hover{
  background-color: var(--border-color-2);
 }
 .Hidden{
  display: none;
 }
 .title_container-gr{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-top: 8rem;
  padding-bottom: 4rem;
 }
 .title_gr{
  font-weight: var(--weight-700);
 }
 .button_members{
  margin-top: 50px;
  display: flex;
  gap: 20px;
  border: solid var(--border-color) 1px;
  border-radius: .5rem;
  padding: 1px;
  cursor: pointer;
  background-color: var(--box-color-2);
 }
.current_members,
.former_members,
.visiting_members{
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 16px;
  padding-right: 16px;
  margin: 2px;
  font-size: var(--small-font-size);
  font-weight: var(--weight-500);
}
.Active{
  background-color: var(--first-color);
  border-radius: .5rem;
}
.thesis_work{
  font-size: var(--smaller-font-size);
  text-decoration: none;
  color: var(--text-color);
  min-width: 0; 
  width: 100%;
  line-height: 1.4;
}
.visiting,
.students,
.formerStudents{
  position: relative;
  padding-left: 65px; 
  font-size: var(--h2-font-size);
  font-weight: var(--weight-700);
}
.visiting::before,
.formerStudents::before,
.students::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 55px;
  height: 4px;
  background-color: var(--first-color);
  border-radius: .25rem;
  transform: translateY(-50%)
}
.visiting_container,
.students_container,
.former_container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px,1fr));
  gap: 30px 30px;
  margin-top: 30px;
  margin-bottom: 50px;
}
.member_group{
   padding-inline:1.25rem;
}
.member_info,
.mail_member,
.location_member,
.number_member,
.institution_member,
.date{
  display: flex;
  gap: 12px;
 }
.pfi{
 display: flex;
 gap: 4px;
 justify-content: center;
 /* align-items: center; */
}


 .research_member,
.research_member-2,
.research_member-v{
  background-color: var(--box-color-2);
  border: solid var(--border-color) 1px;
  border-radius: .5rem;
  padding: 30px;
  transition: border ease 0.3s;
 }
 .research_member:hover,
  .research_member-2:hover{
  border: solid var(--first-color) 1px;
 }
 .pf_container, 
 .centered {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
 }

 .img_container{
   height: 80px;
   width: 80px;
  
 }
 .img_container img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 100%;  
 }
 .gm_icon{
  margin-top: 6px;
  color: var(--first-color);
 }
 .eduIcon{
  margin-top:3px;
 }
 .students,
 .formerStudents
 {
  margin-bottom: 30px;
 }
.member_name{
  margin-top: 20px;
}
.short{
  padding-top: 30px;
}
.date_f{
  display: flex;
  font-size: var(--smaller-font-size);
  gap:4px;
  margin-top: 2px;
}
.date_f p{
  margin-top: 3px;
}
.location_member-f{
  font-size: var(--smaller-font-size);
  display: flex;
  gap:5px
}
.member_info{
  background-color: var(--body-color);
  padding-left: 6px;
  padding-right: 6px;
  border-radius: 1.25rem;
  font-size: var(--smaller-font-size);
  font-weight: var(--weight-500);
  margin-bottom: 10px;
  margin-top: 5px;
} 

/* .profession{
  padding-left: 5px;
  margin-left: 90px;
  width: 165px;
  margin-top: 5px;

} */
.professor{
 max-width: 120px;
 margin-left: 95px;
 margin-top: 5px;
}
.mail_member,.Thesis{
  width: 100%;
  border-top: solid var(--border-color) 1px;
  padding-top: 7px;
}

.thesis{
  color: var(--border-color);
  font-size: var(--small-font-size);
}
.thesis_work:hover{
  color:var(--first-color)
}
.footer{
  background-color: var(--box-color-2);
  padding-block:2rem;
  border-top: solid var(--border-color) 1px;
  width: 100%;
}
.footer-container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row ;
  padding-inline: 1.75rem;
}
.footer-social{
  display: flex;
  column-gap: 1rem;
}
.footer-link{
  color: var(--title-color);
  font-size: var(--h2-font-size);
  transition: color 0.3s;
}
.footer-link:hover{
    color: var(--first-color);
}
.footer-copyright{
  font-weight: var(--weight-500);
}
.footer-copyright span{
  color: var(--first-color);
}
.hidden_members{
  display: none;
}
.member_group{
  transition: opacity .3s ease;
}

.pdf-container iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.curriculum_title-pdf{
  font-weight: var(--weight-700);
}
.title_container-curriculum{
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-top: 8rem;
  padding-bottom: 4rem;
 }
 .shortCV{
  text-decoration: none;
  color: var(--first-color);
  font-family: var(--body-font);
 }
.popUp{
  position: fixed;
  top: -100%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  width: 80vw;
  max-width: 1100px;
  max-height: 120vh;   
  padding: 20px ;
  /* overflow: hidden;      👈 NO scroll aquí */
  z-index: 1000;
  transition: top 0ms ease-in-out 0ms,
              opacity 300ms ease-in-out
              margin-top 300ms ease-in-out;
}

.contact_form-container{
  display: grid;
  grid-template-columns: 5.5fr 6.5fr;
  height: 100%;   
  grid-template-rows: 1fr;   
 
}
.contact_info,
.contact_form{
  display: grid;

  
}
.list_info{
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
 
}

.contact_form-div,
.room-data,
.info_item{
  display: flex;
}
.info_item{
  gap: 8px;
}
.contact_button{
  max-width: 400px;
  padding: 4px;
}
.contact_form-div{
  flex-direction: column;
}
.input_contact{
  max-width: 400px;
  background-color: var(--box-color-2);
  border: solid var(--border-color) 1px;
  border-radius: .25rem;
  padding: 10px;
  text-decoration: none;
}
.contact_info{
  background-color: var(--box-color-2);
  border: solid var(--border-color) 1px;
   border-radius: .5rem;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 40px;
  padding-bottom: 30px;
 
}
.close_button{
  position: absolute;
  top: 38px;
  left: 410px;
  width: 20px;
  height: 20px;
  font-size: var(--h2-font-size);
  cursor: pointer;
}
.ROOM{
  padding-right: 2px;
}
.contact_title,
.form_title{
  font-weight: 550;
  font-family: var(--body-font);
}
.form_item-title{
  font-weight: 400;
}
.box-icon-form{
  background-color:var(--box-color);
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 3px;
  border-radius: .30rem;
  max-height: 33px;
  color:var(--first-color)
}
.contact_button{
    padding: 7px;
    background-color: var(--first-color);
    border: none;
    border-radius: .25rem;
    color: oklch(0.98 0.005 80);
    font-weight: 450;
    padding-left: 120px;
}
.contact_button:hover{
  background-color: var(--second-color);
}
.contact_form-div,
.contact_button{
  transform: translateY(-25px);
}

body.active-popup .home__content{
 filter: blur(2px);
 transition: filter 0ms ease-in-out 0ms;
}
body.active-popup .home__img {
 filter: blur(2px);
 transition: filter 0ms ease-in-out 0ms;
}
body.active-popup  .resume-container {
 filter: blur(2px);
 transition: filter 0ms ease-in-out 0ms;
}
body.active-popup  .footer-container{
 filter: blur(2px);
 transition: filter 0ms ease-in-out 0ms;
}
.home__content,
.home__img ,
.resume-container,
.footer-container{
   transition: filter 0ms ease-in-out 0ms;
}
body.active-popup .popUp{
  top:50%;
  opacity: 1;
  margin-top: 0px;
  transition: top 0ms ease-in-out 0ms,
              opacity 300ms ease-in-out
              margin-top 300ms ease-in-out;
}
.featured{
  padding: 30px;
}
.news_title{
  font-family:var(--body-font);
  font-size: 2.75rem;
  font-weight:var(--weight-700) ;

}
.news_description{
    font-family:var(--body-font);
    font-size: var(--normal-font-size);
    font-weight:var(--weight-400) ;
}
.news_title-container{
  margin-top: 100px;
  padding-inline: 1.45rem;

}
.main_new{
  padding: 30px;
  color: var(--title-color);
  border: solid var(--first-color) 1px;
  margin-bottom: 25px;
  border-radius: 1rem;
  background-color:var(--box-color-2);
  display: flex;
  flex-direction: column;
}
.sub_new-title{
  display: inline-block;
  color: var(--first-color);

}
.new_subtitle{
  font-size: var(--h3-font-size);
  font-weight: var(--weight-700);
  margin-top: 15px;
}
.new-meta{
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}
.more_new-data{
  display: flex;
  background-color: var(--body-color);
  
  border-radius: .5rem;
  border: solid var(--border-color) 1px;
  cursor: pointer;
  color: var(--text-color);
  min-width: 130px;
  max-height: 30px;
  padding-top:6px ;
  padding-left: 7px;
 
}
.read-full{
   text-decoration: none;
  color: var(--text-color);
}
.more_new-data:hover{
  background-color: aliceblue;
  
}
.category-sc{
  color: rgb(35, 192, 140);
  font-size: var(--smaller-font-size);
}
.button_toggle{
  width: 100%;
  padding: 1.75rem;
}
.buttons_news{
  display: flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
  margin-top: 60px;

}
 .button-item{
  /* display: inline; */
  border: solid var(--border-color) 1px;
  border-radius: .5rem;
  cursor: pointer;
  background-color: var(--box-color-2);
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 16px;
  padding-right: 16px;
  margin: 2px;
  font-size: var(--small-font-size);
  font-weight: var(--weight-500);
 }


.new-active{
  background-color: var(--first-color);
  
}
.achievement-container{
  margin-top: 60px;
  flex-direction: column;
  width: 100%;
   
   
}
.achievement-item{
  padding: 30px;
  color: var(--title-color);
  border: solid var(--border-color) 1px;
  margin-bottom: 25px;
  border-radius: 1rem;
  background-color:var(--box-color-2);
  display: flex;
  flex-direction: column;
  white-space: normal;
  min-width: 0;
  width: 100%;
  gap: 13px;
  flex-wrap: wrap;
}
.new_info-container {
  flex: 1;
  min-width: 0;
  word-wrap: break-word;
}

.achievement-item:hover{
  border: solid var(--first-color) 1px;
}
.event-tag,.new_file-icon1{
  background-color:  var(--box-color-3);
  color: var(--font-color);
}
.science-tag,.new_file-icon2{
 background-color:var(--box-color-4) ;
 color: var(--font-color-2);
}
.new_achv-sub{
  color: var(--first-color);
  font-size: var(--h2-font-size);
}
.new_meta-achv{
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
}
.new_category,.new_category1,.new_category2{
  font-size: var(--smaller-font-size);
  border-radius: 1.5rem;
  padding: 5px;
  font-weight: var(--weight-500);
  padding-left: 9px;
  padding-right: 8px;
}
.new_category{
    background-color: var(--box-color);
  color: var(--first-color);
}
.new_file-icon,.new_file-icon1,.new_file-icon2,.new_file-icon3{
  padding: 8px;
  font-size: var(--h2-font-size);
  font-weight: var(--weight-300);
  border-radius: 12.5%;


}

.new_file-icon{
   background-color: var(--box-color);
}
.all_pubs{
  text-decoration: none;
   color: var(--first-color)
  
}




.tabla-container {
  margin-inline: .75rem;
  background: var(--body-color);
  color: var(--text-color);
  font-family: var(--body-font);
}

h2 {
  color: var(--first-color);
  margin: 2rem 0 1rem;
}


.main_new-container {
  display: flex;
  justify-content: center;
  padding: 3rem 1rem;
  background: var(--body-color);
  font-family: var(--body-font);

  
}
.new-container{
   width: 100%;
}

.news-card {
  max-width: 800px;
  background: var(--container-color);
  width: 100%;
  padding: 2.5rem;
  border-radius: var(--radius);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
  border: 1px solid var(--border-color);
}

.news-title {
  font-size: var(--h1-font-size);
  color: var(--title-color);
  margin-bottom: 1rem;
  line-height: 1.2;
}

.news-meta {
  font-size: var(--smaller-font-size);
  color: var(--text-color);
  margin-bottom: 2rem;
  opacity: 0.7;
}

.news-intro {
  font-size: var(--normal-font-size);
  color: var(--text-color);
  margin-bottom: 1.5rem;
  font-weight: var(--weight-500);
}

.news-card p {
  color: var(--text-color);
  line-height: 1.7;
  margin-bottom: 1.2rem;
}

.news-highlight {
  margin-top: 2rem;
  padding: 1rem 1.5rem;
  background: var(--box-color);
  border-left: 4px solid var(--first-color);
  border-radius: var(--radius);
  color: var(--title-color);
  font-size: var(--small-font-size);
}

.news-card strong {
  color: var(--first-color);
}
.back-button {
  background: transparent;
  border: 1px solid var(--border-color);
  color: var(--text-color);
  padding: 0.5rem 1rem;
  border-radius: var(--radius);
  cursor: pointer;
  font-size: var(--small-font-size);
  margin-bottom: 1.5rem;
  transition: var(--transition);
}

.back-button:hover {
  background: var(--box-color);
  color: var(--title-color);
  border-color: var(--first-color);
}
.hidden_new{
  display: none;
}

.table-container {
  width: 100%;
  overflow-x: auto;
  padding: 1.75rem;
  margin-top: 2rem;
}
.astrolunch-title,.constr{
 padding-inline:1.25rem;
 margin-top: 6rem;
}

.table-title{
  font-family:var(--body-font);
  font-size: 2.75rem;
  font-weight:var(--weight-700) ;

}
.table-description{
    font-family:var(--body-font);
    font-size: var(--normal-font-size);
    font-weight:var(--weight-400) ;
}



.custom-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--container-color2);
  color: var(--text-color);
  border-radius: 12px;
  table-layout: fixed;
}


.custom-table th,
.custom-table td {
  padding: 12px 16px;
  text-align: left;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
}

.custom-table thead {
  background: var(--container-color)
}

.custom-table tr {
  border-bottom: 1px solid var(--border-color-2);
}

.custom-table tr:hover {
  background: var(--box-color);
}

.youtube-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ff0000;
  color: white;
  border-radius: 8px;
  padding: 6px 10px;
  text-decoration: none;
  transition: 0.3s;
}

.youtube-btn:hover {
  background: #cc0000;
}
.img-cont{
  width: 100%;
  display: flex;
  justify-content: center;

}
.b-hole{
  width: 100%;
  max-width: 900px;
  height: auto;
  display: block;
 
}
.image-caption{
  font-size: var(--smaller-font-size);
  color: var(--text-color);
}

.Thesis{
  display: grid;
  grid-template-columns: 5fr 1fr;
  gap:2rem; 
  font-size: var(--smaller-font-size);
  align-items: start;
  max-width: 100%;  
 

}
td{
  white-space: normal;
}


/* .date_f{
 
} */