:root{
  --bg:#ffffff;
  --text:#1a1a1a;
  --muted:#4a4a4a;
  --link:#003366; /* UWEC blue-ish */
  --accent:#FFD100; /* UWEC gold */
  --border:#e8e8e8;
  --max:1100px;
  --serif: 'Merriweather', Georgia, 'Times New Roman', serif;
  --sans: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--sans);}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--max);margin:0 auto;padding:24px}
.header{
  border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,#fff, #fafafa);
}
.brand{display:flex; align-items:center; gap:14px;}
.brand .dot{width:14px;height:14px;border-radius:50%;background:var(--accent);}

.brand h1 {
  font-family: var(--serif);
  font-size: 2.2rem; /* Larger name */
  line-height: 1.2;
  margin: 0;
}
.brand .sub {
  color: var(--muted);
  font-size: 1.2rem; /* Larger subtitle */
  margin-top: 4px;
}

nav.site-nav{display:flex;gap:16px;flex-wrap:wrap}
nav.site-nav a {
  font-size: 1.0rem; /* Larger text */
  padding: 0.7rem 1.2rem; /* More clickable area */
}

.topbar{display:flex;justify-content:space-between; align-items:center; gap:16px}
.icon-links{display:flex;gap:10px; align-items:center}
.icon{display:inline-flex; align-items:center; justify-content:center; width:28px;height:28px; border-radius:6px; border:1px solid var(--border); background:#fff}
.icon svg{width:18px;height:18px}
main{padding:24px 0}
h2,h3,h4{font-family:var(--serif);margin-top:30px}
h2{font-size:28px} h3{font-size:20px} h4{font-size:16px}
.section{margin-top:16px}
.card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:16px}
.grid{display:grid;grid-template-columns: repeat(12, 1fr); gap:16px}
.left{grid-column: span 4}
.right{grid-column: span 8}
@media (max-width: 900px){
  .left,.right{grid-column: span 12}
  .topbar{flex-direction:column; align-items:flex-start}
}
small.muted{color:var(--muted)}
footer.footer{border-top:1px solid var(--border);padding:20px 0;margin-top:30px;color:var(--muted); font-size:13px}
.searchbar{margin:10px 0; display:flex; gap:8px}
input[type="search"]{width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:14px}
.badge{display:inline-block; padding:3px 8px; border-radius:999px; border:1px solid var(--border); background:#fff; font-size:12px; color:#333}
.list{display:flex; flex-direction:column; gap:10px}
.citation{padding:10px; border:1px solid var(--border); border-radius:8px; background:#fff;}
.citation .meta{color:var(--muted); font-size:13px}
.table{width:100%; border-collapse:collapse}
.table th, .table td{border-bottom:1px solid var(--border); padding:10px; text-align:left; vertical-align:top}
.kicker{font-size:12px; letter-spacing:.1em; color:#6b7280; text-transform:uppercase}
.hero{padding:22px 18px; border:1px solid var(--border); border-radius:12px; background:#fff}
.update{padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:#fff}
.tagbar{display:flex; gap:8px; flex-wrap:wrap}
blockquote{border-left:3px solid var(--accent); margin:0; padding:12px; background:#fffef5}

.brand .avatar {
  width: 100px; /* Bigger profile image */
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--border);
  background: #f2f2f2;
}
@media (max-width: 900px) {
  .brand .avatar {
    width: 80px;
    height: 80px;
  }
}



.projects-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
}
@media (max-width:900px){
  .projects-grid{ grid-template-columns:1fr; }
}
.project-card{
  display:flex; flex-direction:column; gap:10px;
}
.project-card .thumb{
  width:100%; aspect-ratio: 16/9; overflow:hidden; border-radius:12px; border:1px solid var(--border);
  background:#f6f6f8;
}
.project-card .thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.project-meta{
  display:flex; flex-wrap:wrap; gap:8px; margin-top:6px;
}
.badge{
  display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; border:1px solid var(--border); background:#fafafa;
}
.project-card h3{ margin:6px 0 4px; }
.project-card .section-title{ font-weight:700; margin-top:6px; }

/* Combined Research & Students page */
.research-page .research-page-container{
  display:flex;
  flex-direction:column;
  gap:38px;
}
.research-page .research-page-intro{
  max-width:860px;
  padding:26px;
  border:1px solid var(--border);
  border-left:5px solid var(--accent);
  border-radius:14px;
  background:#fff;
}
.research-page .research-page-intro h2{
  margin:7px 0 12px;
}
.research-page .research-page-intro p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}
.research-page .research-anchor-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  margin-top:18px;
}
.research-page .research-anchor-links a{
  font-weight:700;
}
.research-page .research-section{
  margin:0;
  scroll-margin-top:24px;
}
.research-page .research-section > h3{
  margin:0 0 8px;
  font-size:1.35rem;
}
.research-page .research-section > p{
  max-width:760px;
  margin:0 0 16px;
  color:var(--muted);
  line-height:1.6;
}
.research-page .research-searchbar{
  max-width:640px;
  margin-bottom:20px;
}
.research-page .projects-grid{
  align-items:start;
}
.research-page .research-project-group + .research-project-group{
  margin-top:32px;
  padding-top:28px;
  border-top:1px solid var(--border);
}
.research-page .research-project-group-heading{
  margin-bottom:16px;
}
.research-page .research-project-group-heading h4{
  margin:5px 0 0;
  font-family:"Merriweather", Georgia, serif;
  font-size:1.22rem;
}
.research-page .research-project-group-collaboration .research-project-group-heading h4{
  font-size:1.08rem;
}
.research-page .collaboration-projects-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.research-page .collaboration-projects-grid .project-card{
  background:#fbfcfe;
}
.research-page .project-card{
  scroll-margin-top:24px;
}
.research-page .project-card:target{
  border-color:var(--link);
  box-shadow:0 0 0 3px rgba(0,51,102,.1);
}
.research-page .project-label{
  color:var(--muted);
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.research-page .project-detail-block{
  margin-top:4px;
}
.research-page .project-detail-block .section-title{
  margin:0 0 6px;
  font-size:.9rem;
}
.research-page .project-detail-block p,
.research-page .project-detail-list{
  margin:0;
}
.research-page .project-detail-list{
  padding-left:19px;
  line-height:1.5;
}
.research-page .project-detail-list li + li{
  margin-top:4px;
}
.research-page .project-students{
  margin-top:auto;
  padding-top:13px;
  border-top:1px solid var(--border);
}
.research-page .project-students .section-title{
  margin:0 0 8px;
  font-size:.9rem;
}
.research-page .project-student-list{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0;
  padding:0;
  list-style:none;
}
.research-page .project-student-list li{
  padding:4px 9px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fafafa;
  font-size:.88rem;
}
.research-page .past-students-section{
  padding:24px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#fbfcfe;
}
.research-page .past-students-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0 22px;
  margin:0;
  padding:0;
  border-top:1px solid var(--border);
  list-style:none;
}
.research-page .past-student{
  padding:11px 2px;
  border-bottom:1px solid var(--border);
}
.research-page .research-empty{
  margin:14px 0 0;
  color:var(--muted);
  font-style:italic;
}
.research-page .research-anchor-links a:focus-visible,
.research-page .project-card:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:3px;
}
@media (max-width:900px){
  .research-page .collaboration-projects-grid{
    grid-template-columns:1fr;
  }
}
@media (max-width:800px){
  .research-page .past-students-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:520px){
  .research-page .research-page-container{
    gap:32px;
  }
  .research-page .research-page-intro,
  .research-page .past-students-section{
    padding:20px;
  }
  .research-page .past-students-grid{
    grid-template-columns:1fr;
  }
}


.btn{
  display:inline-block; padding:10px 14px; border-radius:10px;
  border:1px solid var(--border); background:#fff; font-weight:600;
  text-decoration:none; transition:transform .06s ease;
}
.btn:hover{ transform:translateY(-1px); text-decoration:none; }
.btn.ghost{ background:#fafafa; }

/* Home page: concise lab landing page */
.home-page .home-container{
  display:flex;
  flex-direction:column;
  gap:48px;
}
.home-page .home-hero{
  padding:34px;
  border:1px solid var(--border);
  border-left:5px solid var(--accent);
  border-radius:16px;
  background:#fff;
}
.home-page .home-hero h2{
  margin:7px 0 8px;
  font-size:2.25rem;
  line-height:1.2;
}
.home-page .home-role{
  margin:0;
  color:#2e3948;
  font-size:1.08rem;
  font-weight:700;
  line-height:1.55;
}
.home-page .home-focus{
  margin:18px 0 8px;
  color:var(--link);
  font-weight:700;
  letter-spacing:.01em;
}
.home-page .home-focus-separator{
  padding:0 5px;
  color:#7a8492;
}
.home-page .home-intro{
  max-width:800px;
  margin:0;
  color:var(--muted);
  font-size:1.05rem;
  line-height:1.65;
}
.home-page .home-intro-secondary{
  margin-top:6px;
}
.home-page .home-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}
.home-page .home-section{
  margin:0;
}
.home-page .home-section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
}
.home-page .home-section-heading h2{
  margin:7px 0 0;
}
.home-page .home-section-link{
  flex:none;
  padding-bottom:3px;
  font-weight:700;
}
.home-page .home-research-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.home-page .home-research-card{
  display:flex;
  flex-direction:column;
  min-height:190px;
  padding:19px;
  border:1px solid var(--border);
  border-top:3px solid var(--link);
  border-radius:12px;
  background:#fff;
}
.home-page .home-research-card h3{
  margin:0 0 9px;
  font-size:1.05rem;
}
.home-page .home-research-card p{
  margin:0 0 14px;
  color:var(--muted);
  line-height:1.55;
}
.home-page .home-research-card a{
  margin-top:auto;
  font-size:.9rem;
  font-weight:700;
}
.home-page .home-publications{
  border-top:1px solid var(--border);
}
.home-page .home-publication{
  display:grid;
  grid-template-columns:80px minmax(0,1fr);
  gap:18px;
  padding:17px 0;
  border-bottom:1px solid var(--border);
}
.home-page .home-publication-year{
  color:var(--link);
  font-weight:700;
}
.home-page .home-publication h3{
  margin:0 0 6px;
  font-family:var(--sans);
  font-size:1rem;
  line-height:1.45;
}
.home-page .home-publication-authors{
  display:-webkit-box;
  margin:0 0 5px;
  overflow:hidden;
  color:var(--muted);
  font-size:.9rem;
  line-height:1.45;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.home-page .home-publication-venue{
  margin:0;
  color:var(--muted);
  font-size:.85rem;
}
.home-page .home-update-search{
  max-width:420px;
  margin:0 0 14px;
}
.home-page .home-loading{
  color:#666;
  font-style:italic;
}
.home-page .visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.home-page .btn:focus-visible,
.home-page .home-section-link:focus-visible,
.home-page .home-research-card a:focus-visible,
.home-page .home-publication a:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:3px;
}
@media (max-width:900px){
  .home-page .home-research-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:620px){
  .home-page .home-container{
    gap:38px;
  }
  .home-page .home-hero{
    padding:24px 20px;
  }
  .home-page .home-hero h2{
    font-size:1.8rem;
  }
  .home-page .home-focus-separator{
    display:none;
  }
  .home-page .home-focus{
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  .home-page .home-section-heading{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .home-page .home-research-grid{
    grid-template-columns:1fr;
  }
  .home-page .home-research-card{
    min-height:0;
  }
  .home-page .home-publication{
    grid-template-columns:1fr;
    gap:5px;
  }
}

.media-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:16px;
}
@media (max-width: 900px){
  .media-grid{ grid-template-columns: 1fr; }
}
.media-item{
  display:grid;
  grid-template-columns: 160px 1fr;
  gap:14px;
  align-items:start;
}
@media (max-width: 700px){
  .media-item{ grid-template-columns: 1fr; }
}
.media-item .thumb{
  width:100%;
  aspect-ratio: 16/9;
  border-radius:12px;
  border:1px solid var(--border);
  overflow:hidden;
  background:#f6f7fb;
}
.media-item .thumb img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.thumb-placeholder{
  background: repeating-linear-gradient(
    45deg, #f4f4f8, #f4f4f8 10px, #ececf3 10px, #ececf3 20px
  );
}
.media-item .media-body h3{
  margin:0 0 6px;
  font-size:18px;
}
.media-item .media-body .small.muted{
  margin-bottom:8px;
}

/* Media layout: when no thumbnail, use single-column */
.media-item.no-thumb {
  grid-template-columns: 1fr;
}


/* Teaching cards grid: max 4 per row, responsive down to 1 */
.courses-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:16px;
}
@media (max-width: 1200px){
  .courses-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px){
  .courses-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .courses-grid{ grid-template-columns: 1fr; }
}

/* Course card layout */
.course-card{
  display:flex; flex-direction:column; gap:10px;
  overflow:hidden; /* keep inner content clipped */
}
.course-card .thumb{
  width:100%;
  aspect-ratio: 16 / 9;
  border-radius:12px;
  border:1px solid var(--border);
  overflow:hidden;
  background:#f6f6f8;
}
.course-card .thumb img{
  display:block; width:100%; height:100%; object-fit:cover;
}

/* Text safety: prevent long strings from blowing out layout */
.course-card h4, .course-card p, .course-card .small, .course-card .project-meta{
  overflow-wrap:anywhere; /* avoids horizontal scroll from long tokens */
}

.project-meta{
  display:flex; flex-wrap:wrap; gap:8px; margin-top:4px;
}
.badge{
  display:inline-block; padding:2px 8px; border-radius:999px;
  font-size:12px; border:1px solid var(--border); background:#fafafa;
  white-space:nowrap; /* nicer badges */
}

/* Ensure image icons fit like your old SVGs */
.icon img {
  width: 18px;
  height: 18px;
  display: block;
}

/* Highlight current page in nav */
.site-nav a.active {
  font-weight: 700;
  text-decoration: none;
  background: rgba(0,0,0,0.04);
  border-radius: 6px;
}

/* About page: leadership profile */
.about-page .about-container{
  display:flex;
  flex-direction:column;
  gap:42px;
}
.about-page p{
  line-height:1.65;
}
.about-page .about-profile{
  padding:30px;
  border:1px solid var(--border);
  border-left:5px solid var(--accent);
  border-radius:16px;
  background:linear-gradient(135deg,#fff 55%,#f7f9fc);
}
.about-page .about-profile h2,
.about-page .about-section-heading h2,
.about-page .about-mentoring h2,
.about-page .about-deeper-links h2{
  margin:7px 0 14px;
}
.about-page .about-lead{
  max-width:900px;
  margin:0 0 12px;
  color:#263445;
  font-size:1.12rem;
}
.about-page .about-profile > p:not(.about-lead){
  max-width:900px;
}
.about-page .about-link-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}
.about-page .about-section{
  margin:0;
}
.about-page .about-section-heading{
  max-width:780px;
  margin-bottom:18px;
}
.about-page .about-section-heading p{
  margin-bottom:0;
  color:var(--muted);
}
.about-page .about-role-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.about-page .about-role-card{
  margin:0;
  padding:20px;
}
.about-page .about-role-card h3,
.about-page .about-theme-card h3,
.about-page .about-leadership-grid h3{
  margin:7px 0 9px;
}
.about-page .about-card-kicker{
  color:#596579;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.about-page .about-role-card p,
.about-page .about-theme-card p{
  margin:0 0 12px;
}
.about-page .about-text-link{
  display:inline-block;
  font-weight:700;
}
.about-page .about-theme-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.about-page .about-theme-card{
  display:flex;
  flex-direction:column;
  margin:0;
  padding:20px;
}
.about-page .about-theme-card .about-text-link{
  margin-top:auto;
}
.about-page .about-theme-card-accent{
  border-top:4px solid var(--accent);
}
.about-page .about-leadership-panel{
  padding:26px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fbfcfe;
}
.about-page .about-leadership-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
}
.about-page .about-leadership-grid article{
  padding:0 20px;
  border-left:1px solid var(--border);
}
.about-page .about-leadership-grid article:first-child{
  padding-left:0;
  border-left:0;
}
.about-page .about-leadership-grid article:last-child{
  padding-right:0;
}
.about-page .about-leadership-grid p{
  margin:0 0 12px;
}
.about-page .about-panel-note{
  margin:22px 0 0;
  padding-top:18px;
  border-top:1px solid var(--border);
  color:var(--muted);
}
.about-page .about-mentoring{
  padding:28px;
  border:1px solid #dbe3ed;
  border-radius:16px;
  background:linear-gradient(135deg,#f7faff,#fff);
}
.about-page .about-mentoring-copy{
  max-width:880px;
}
.about-page .about-award-line{
  font-size:1.05rem;
  font-weight:700;
}
.about-page .about-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:22px 0 12px;
}
.about-page .about-metric{
  padding:18px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
}
.about-page .about-metric strong{
  display:block;
  margin-bottom:5px;
  color:var(--link);
  font-family:var(--serif);
  font-size:1.8rem;
}
.about-page .about-metric span{
  color:var(--muted);
}
.about-page .about-metric-context{
  margin:0;
  color:var(--muted);
  font-size:.92rem;
}
.about-page .about-recognition-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 28px;
  border-top:1px solid var(--border);
}
.about-page .about-recognition-item{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:14px;
  padding:17px 0;
  border-bottom:1px solid var(--border);
}
.about-page .about-recognition-item div{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.about-page .about-recognition-item div span{
  color:var(--muted);
  font-size:.9rem;
  line-height:1.45;
}
.about-page .about-recognition-year{
  color:var(--link);
  font-weight:700;
}
.about-page .about-recognition-wide{
  grid-column:1 / -1;
}
.about-page .about-deeper-links{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:24px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fffef5;
}
.about-page .about-deeper-links .about-link-row{
  justify-content:flex-end;
  margin-top:0;
}
.about-page .btn:focus-visible,
.about-page .about-text-link:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:3px;
}
@media (max-width:900px){
  .about-page .about-theme-grid,
  .about-page .about-leadership-grid{
    grid-template-columns:1fr;
  }
  .about-page .about-leadership-grid article{
    padding:18px 0;
    border-left:0;
    border-top:1px solid var(--border);
  }
  .about-page .about-leadership-grid article:first-child{
    padding-top:0;
    border-top:0;
  }
  .about-page .about-leadership-grid article:last-child{
    padding-bottom:0;
  }
  .about-page .about-deeper-links{
    align-items:flex-start;
    flex-direction:column;
  }
  .about-page .about-deeper-links .about-link-row{
    justify-content:flex-start;
  }
}
@media (max-width:680px){
  .about-page .about-container{
    gap:32px;
  }
  .about-page .about-profile,
  .about-page .about-leadership-panel,
  .about-page .about-mentoring{
    padding:20px;
  }
  .about-page .about-role-grid,
  .about-page .about-metrics,
  .about-page .about-recognition-list{
    grid-template-columns:1fr;
  }
  .about-page .about-recognition-wide{
    grid-column:auto;
  }
}