/* Professional academic homepage — minimalist, single column */

:root{
  --bg: #ffffff;
  --text: #111;
  --muted: #555;
  --faint: #777;
  --rule: #e8e8e8;
  --rule-strong: #d9d9d9;
  --link: #0b57d0;
  --max: 1100px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: "Georgia", "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.7;
}

.container{max-width: var(--max); margin: 0 auto; padding: 34px 18px 64px}

a{color: var(--link); text-decoration: none}
a:hover{text-decoration: underline}

.header{
  padding-bottom: 14px;
  border-bottom: 1px solid var(--rule);
}

.header-top{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap: 18px;
  flex-wrap: wrap;
}

.name{margin:0; font-size: 28px; font-weight: 700}

.nav{display:flex; gap: 12px; flex-wrap:wrap; align-items:center}
.nav a{color: var(--muted); font-size: 14px}
.nav a:hover{color: var(--text); text-decoration:none}

.main{margin-top: 22px}

/* About block: simpler, more academic */
.about{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap: 18px;
  align-items: start;
}

.avatar{
  width: 120px; height: 150px; /* portrait-like */
  border: 1px solid var(--rule);
  background: #fafafa;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.avatar img{width:100%; height:100%; object-fit:cover; display:block}
.avatar .placeholder{color: var(--faint); font-size: 12px; text-align:center; padding: 0 10px}

.lead{margin: 0 0 10px; color: var(--muted)}

.links{margin: 8px 0 0; display:flex; gap: 14px; flex-wrap:wrap}
.links a{font-size: 14px}

/* Contact: inline, no nested section feel */
.contact{margin-top: 10px; color: var(--muted); font-size: 14px}

h2{margin: 28px 0 12px; font-size: 19px; font-weight: 700}

/* Stronger section divider than item dividers */
.section-rule{border-top: 1px solid var(--rule-strong); margin: 22px 0}

.small{font-size: 14px; color: var(--muted)}
.muted{color: var(--muted)}

/* Education */
.edu-list{list-style:none; padding:0; margin:0}
.edu{padding: 10px 0}
.edu-row{display:flex; justify-content:space-between; gap: 16px; align-items:baseline; flex-wrap:wrap}
.edu-degree{font-weight:700}
.edu-school{margin-top: 2px}
.edu-time{font-size: 14px; white-space: nowrap}
.edu-notes{margin-top: 6px}

/* Publications — Layout A, with subtle item spacing (no hard borders) */
.pub-list{list-style:none; padding:0; margin:0}
.pub{padding: 12px 0}
.pub + .pub{margin-top: 0; padding-top: 10px; border-top: 1px solid var(--rule)}

.pub .line1{display:flex; gap:10px; flex-wrap:wrap; align-items:baseline}
.pub .title{margin:0; font-weight:700}
.pub .line2{margin: 2px 0 0; color: var(--muted)}
.pub .line3{margin: 4px 0 0; font-size: 13px; color: var(--muted)}
.pub .line3 a{color: var(--muted)}
.pub .line3 a:hover{color: var(--text)}


.footer{
  margin-top: 30px;
  padding-top: 12px;
  border-top: 1px solid var(--rule);
  color: var(--muted);
  font-size: 13px;
  display:flex;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
}

@media (max-width: 720px){
  .about{grid-template-columns: 1fr}
  .avatar{width: 140px; height: 140px}
}

@media print{
  a{color: inherit; text-decoration: none}
  .nav{display:none}
  body{font-size: 12px}
  .container{padding: 0}
}

p {
  margin: 2px 0;
}


/* Visitor Map - override fixed positioning from mapmyvisitors script */
#visitor-map {
  position: static !important;
  bottom: auto !important;
  right: auto !important;
  width: 100%;
  margin-top: 16px;
}
#visitor-map > div {
  max-width: 500px !important;
  margin: 0 auto !important;
}