/* HEADER */
.news-intro{
text-align:center;
color:#666;
margin-top:-10px;
margin-bottom:30px;
font-size:16px;
}

/* FLEX LAYOUT */
.news-container{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;

  gap:60px;              /* 🔥 increase spacing */
}

/* CARD */
.newsbox{
background:white;
padding: 25px;
border-radius:12px;
box-shadow:0 4px 20px rgba(0,0,0,0.08);
width:100%;
max-width: 360px;
min-height:320px;
position:relative;
overflow:hidden;
transition:all 0.3s ease;
cursor:pointer;
display:flex;
flex-direction:column;
justify-content:space-between;
}

.newsbox h3{
  margin-top:2px !important;
  margin-bottom:5px !important;
}

/* LAB TAG */
.news-tag{
background:#1e4d6b;
color:white;
font-size:12px;
padding:6px 10px;
border-radius:6px;
display:inline-block;
margin-bottom:5px;
}

/* TITLE */
.news h3{
margin:2px 0 5px 0;
font-size:20px;
}

/* DESCRIPTION */
.news-desc{
text-align:justify;
font-size:14px;
color:#444;
margin-bottom:8px;     /* was 15px → tighter */
line-height:1.35;      /* new → compact text */
}

.news-meta p{
margin:1px 0;          /* was 3px → tighter */
font-size:13px;
color:#333;
line-height:1.3;       /* new */
}

/* LINK */
.news-meta a{
color:#1e4d6b;
text-decoration:none;
font-weight:bold;
}

/* HOVER LAYER */
.news-hover{
pointer-events: none;
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background:linear-gradient(135deg, #0f2a44, #1e4d6b);
color:white;
padding:20px;                 /* slightly smaller */
box-sizing:border-box;        /* ✅ FIX overflow */
opacity:0;
transform:translateY(20px);
transition:all 0.35s ease;
font-size:14px;
text-align:justify;
line-height:1.4;

/* NEW */
overflow:auto;                /* ✅ allows scroll if content is long */
}

/* SHOW HOVER */
.newsbox:hover .news-hover{
opacity:1;
transform:translateY(0);
}

/* CARD HOVER EFFECT */
.newsbox:hover{
transform:translateY(-6px);
box-shadow:0 12px 35px rgba(0,0,0,0.15);
}

.news-link{
  text-decoration: none !important;
  color: inherit !important;

  display: block !important;     /* 🔥 important */
  width: 360px !important;       /* 🔥 fixed card width */
}