/* Styles for the added research screen only. */
.home-focus {
  background-color:#f8fafc;
  background-image:linear-gradient(rgba(255,255,255,.22),rgba(255,255,255,.22)), url('../images/backgrounds/research-protein.webp');
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.home-paged .home-focus { min-height:100svh; display:flex; flex-direction:column; justify-content:center }
.home-focus-header { max-width:760px }
.home-focus-header h2 { font-family:var(--F-display); font-weight:400; line-height:1.15; color:#1f2937 }
.home-focus-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px }
.home-focus-topic { min-width:0; display:flex; flex-direction:column; align-items:flex-start; padding-top:18px }
.home-focus-topic h3 { font-family:var(--F-display); font-weight:400; line-height:1.2; color:#1f2937; min-height:2.4em }
.home-focus-figure { width:100%; min-width:0; min-height:0; flex-shrink:0; display:flex; align-items:center; justify-content:center }
.home-focus-figure img { width:85%; height:100%; max-width:100%; max-height:100%; min-width:0; min-height:0; object-fit:contain }
.home-focus-description { font-size:17px; color:#4b5563 }
/* Fit the added research screen to ordinary laptop viewports. */
.home-paged .home-focus { padding-top:clamp(32px,5vh,56px); padding-bottom:clamp(32px,5vh,56px); gap:28px }
.home-focus-header h2 { font-size:clamp(32px,3.3vw,44px); margin-bottom:12px }
.home-focus-topic h3 { font-size:clamp(26px,2.2vw,30px); margin-bottom:12px }
.home-focus-figure { height:clamp(130px,19vh,180px); margin-bottom:16px }
.home-focus-description { line-height:1.7; margin-bottom:16px }
.home-focus-topic[hidden], .home-focus-tabs[hidden] { display:none }
.home-focus-tabs { display:flex; gap:4px; border-bottom:1px solid #d8dadd }
.home-focus-tabs button { flex:1; min-height:44px; padding:8px 4px; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; color:#6b7280; background:transparent; font:500 12px/1.4 var(--F-body); cursor:pointer }
.home-focus-tabs button[aria-selected="true"] { color:#1f2937; border-bottom-color:#374151 }
.home-focus-tabs button:focus-visible, .home-focus-topic[role="tabpanel"]:focus-visible { outline:2px solid #64748b; outline-offset:4px }
@media(max-width:1050px) and (min-width:761px) {
  .home-focus-topic h3 { font-size:26px }
  .home-focus-grid { gap:22px }
}
@media(max-width:900px) {
  .home-paged .home-focus { padding-right:56px }
}
@media(max-width:760px) {
  .home-paged .home-focus { justify-content:center; gap:18px; padding-top:32px; padding-bottom:32px; padding-right:48px }
  .home-focus-grid { grid-template-columns:1fr; gap:24px }
  .home-focus-topic { padding-top:0; border-top:0 }
  .home-focus-topic h3 { min-height:0; font-size:29px; margin-bottom:12px }
  .home-focus-figure { height:150px; margin-bottom:14px }
  .home-focus-header h2 { font-size:34px; margin-bottom:8px }
  .home-focus-description { font-size:16px; line-height:1.7; margin-bottom:14px }
}