/* Larger reading sizes and a prominent bilingual lab identity. */
:root{--header-offset:148px}
html{scroll-padding-top:calc(var(--header-offset) + 24px)}
.header{height:auto;min-height:var(--header-offset)}
.header-inner{height:auto;min-height:var(--header-offset);gap:24px;padding-top:18px;padding-bottom:18px}
.brand{display:grid;grid-template-columns:auto 1px auto;grid-template-rows:auto auto;min-width:0;column-gap:20px;row-gap:10px;flex-shrink:0}
.brand>.brand-name{grid-column:1;grid-row:1}
.brand>.brand-divider{grid-column:2;grid-row:1}
.brand>.brand-identity{grid-column:3;grid-row:1}
.brand-fullname{grid-column:1/-1;grid-row:2;font-family:var(--sans);font-size:17px;font-weight:500;line-height:1.5;letter-spacing:-.015em;color:#f6f5e9;white-space:normal}
.brand-initial{color:var(--brand-lime,#b9f541);font-weight:700}
.brand-name{font-size:64px;line-height:1}
.brand-divider{height:58px;flex-shrink:0}
.brand-identity{min-width:0;gap:9px}
.brand-identity>span{font-size:21px;line-height:1.2;letter-spacing:.045em;font-weight:700;color:#f6f5e9}
.brand-identity small{font-size:12px;line-height:1.5;letter-spacing:.06em;color:#c4d3cc;white-space:normal}
.header .nav{column-gap:18px;row-gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0}
.header .nav a{font-size:16px}
.header .lang{font-size:15px;flex-shrink:0}
.header .lang a{font-size:15px;min-width:34px;min-height:40px;display:inline-flex;align-items:center;justify-content:center}
.hero-topline{align-items:center;gap:24px;margin-bottom:38px;padding-bottom:28px}
.hero-lab-title{margin:0;max-width:980px;font-family:var(--serif);font-size:clamp(32px,3.4vw,49px);font-weight:400;line-height:1.18;letter-spacing:-.025em;color:#f7f6ec;text-wrap:balance}
.hero-lab-title span{display:inline-block}
.hero-lab-title,.hero-lab-title .brand-initial{color:var(--copper)}
.hero-location{font-size:13px;flex-shrink:0}
.hero-desc,.page-head .lead{font-size:18px;line-height:1.9}
.hero-desc{max-width:530px}
.hero-desc br{display:none}
.hero-signature{font-size:17px;flex-wrap:wrap}
.hero-signature small{font-size:14px}
.hero-kicker{font-size:26px;font-weight:600;line-height:1.5;align-items:baseline;color:#f0f3e7}
.hero-kicker>span{flex-shrink:0}
.hero .button,.hero .text-link{font-size:16px}
.actions,.research-actions{flex-wrap:wrap}
.section-head{flex-wrap:wrap}
.footer-fullname{font-size:26px;line-height:1.4}
.footer-links,.institution-links{flex-wrap:wrap}
.hero-figure,.paper-card,.area,.member-card,.opportunity,.method-card{min-width:0}
.experiment-topline{flex-wrap:wrap;gap:8px 16px}
.experiment-caption p{font-size:16px}
.experiment-source{font-size:14px}
.experiment-controls{flex-wrap:wrap}
.research-index-item strong{overflow-wrap:normal;hyphens:auto}
.device-background{margin:24px 0;padding:24px 26px;background:#e8eee5;border-left:3px solid var(--accent)}
.device-background h4{margin:0 0 10px;font-size:19px;line-height:1.5}
.device-background p{margin:0 0 16px;font-size:16px;line-height:1.85}
.device-background .text-link{font-size:15px}
.education-degree{margin:0 0 18px;font-size:17px;color:var(--ink)}
.mobile-nav.open{top:100%;max-height:calc(100dvh - var(--header-offset));overflow-y:auto}
@media(max-width:1350px){
 :root{--header-offset:144px}
 .header .nav{display:none}
 .header .lang{margin-left:auto}
 .header .menu-toggle{display:block;margin-left:0;padding:10px;min-width:44px;min-height:44px;flex-shrink:0}
 .header .mobile-nav.open{display:flex;position:absolute;top:100%;left:0;right:0;z-index:49;padding:20px 32px 28px;background:var(--dark);border-bottom:1px solid #ffffff20;flex-direction:column;gap:4px;max-height:calc(100dvh - var(--header-offset));overflow-y:auto}
 .header .mobile-nav a{font-size:18px;line-height:1.5;padding:13px 0}
 .header .mobile-nav a.nav-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:10px;padding:13px 16px;background:var(--lime);color:var(--dark);border:0}
 .header .mobile-nav a.nav-cta:hover{background:#eef6d8;color:var(--dark)}
 .brand-name{font-size:60px}
 .brand-identity>span{font-size:20px}
 .hero-topline{align-items:flex-start}
 .hero-location{padding-top:8px}
}
@media(min-width:601px) and (max-width:950px){
 .hero-grid{grid-template-columns:1fr;gap:36px;min-height:0}
 .hero-copy{max-width:700px;padding-bottom:0}
 .hero-figure.research-carousel{width:100%;max-width:700px;justify-self:center}
 .hero-desc{max-width:650px}
 .paper-grid,.approach-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
 :root{--header-offset:208px}
 .header-inner{display:grid;grid-template-columns:1fr auto auto;gap:6px 14px;padding-top:14px;padding-bottom:12px;min-height:var(--header-offset)}
 .header .brand{grid-column:1/-1;column-gap:14px;row-gap:10px;min-width:0;width:100%;grid-template-columns:auto 1px minmax(0,1fr)}
 .brand-fullname{font-size:16px;line-height:1.45;max-width:100%}
 .brand-name{font-size:56px;flex-shrink:0}
 .brand-divider{height:54px}
 .brand-identity{gap:5px;flex:1}
 .brand-identity>span{font-size:19px;white-space:normal;letter-spacing:.02em;line-height:1.25}
 .brand-identity small{font-size:12px;letter-spacing:.02em;line-height:1.4}
 .header .lang{grid-column:2;margin-left:0;border-left:0;padding-left:0;gap:4px}
 .header .menu-toggle{grid-column:3;padding:8px;min-height:40px;min-width:40px}
 .header .mobile-nav.open{padding:16px 24px 24px}
 .hero-topline{display:block;margin-bottom:28px;padding-bottom:22px}
 .hero-lab-title{font-size:32px;line-height:1.2;text-wrap:initial;max-width:none}
 .hero-lab-title span{display:block}
 .hero-location{display:none}
 .hero-desc,.page-head .lead{font-size:17px;line-height:1.9}
 .hero-kicker{font-size:22px;line-height:1.5}
 .hero-signature{font-size:16px;gap:12px}
 .hero-signature small{font-size:14px}
 .hero .actions{gap:18px 24px}
 .hero .button,.hero .text-link{font-size:16px}
 .hero .button{padding:16px 21px}
 .footer-fullname{font-size:23px}
 .footer-brand{gap:18px;flex-wrap:wrap}
 .section-head .text-link{font-size:15px;white-space:normal;margin-top:0}
 .experiment-caption p{font-size:16px}
 .experiment-source{font-size:13px}
}
@media(max-width:360px){
 .brand-name{font-size:50px}
 .brand-identity>span{font-size:18px}
 .brand-divider{height:50px}
 .hero-lab-title{font-size:30px}
 .hero-kicker{flex-wrap:wrap}
}