/* =========================================================================
   Sitewide polish for mlarreboure.com
   Minimalist override of the Hugo Academic theme.
   Goal: clean, calm, paper-list-first; takes cues from Stantcheva / Chetty /
   Williams personal sites.
   ========================================================================= */

/* --- Typography ----------------------------------------------------------- */
:root {
  --text: #1a1a1a;
  --muted: #555;
  --faint: #888;
  --rule: #eaeaea;
  --accent: #5a5a5a;
}

body,
.universal-wrapper p,
.universal-wrapper li {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.portrait-title h2,
.portrait-title h3 {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  letter-spacing: -0.01em;
}

/* Section-level h1 (e.g. "Research", "Teaching") */
.home-section h1 {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
}

/* --- Section spacing ------------------------------------------------------ */
.home-section {
  padding-top: 2.75rem;
  padding-bottom: 2.75rem;
}
.home-section:first-of-type {
  padding-top: 4rem;
}

/* --- Navbar --------------------------------------------------------------- */
#navbar-main {
  border-bottom: 1px solid var(--rule);
  background: #fff;
}
#navbar-main .nav-link {
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: 0.02em;
}
#navbar-main .nav-link:hover { color: var(--text); }

/* --- About widget --------------------------------------------------------- */
.wg-about #profile { text-align: center; }
.wg-about .avatar {
  width: 240px;
  height: 240px;
  margin-bottom: 1rem;
}
.wg-about .portrait-title h2 {
  font-size: 1.45rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
  text-transform: none;
}
.wg-about .portrait-title h3 {
  font-size: 0.95rem;
  font-weight: 400;
  color: var(--muted);
  margin: 0.15rem 0;
  text-transform: none; /* portrait role / affiliation stays sentence-case */
  letter-spacing: 0;
}
.wg-about .portrait-title a { color: var(--muted); }
.wg-about .portrait-title a:hover { color: var(--text); }

.wg-about .network-icon { margin-top: 0.8rem; }
.wg-about .network-icon a { color: var(--muted); }
.wg-about .network-icon a:hover { color: var(--text); }
.wg-about .network-icon .big-icon { font-size: 1.2rem; }

/* Right column: bio + interests + education */
.wg-about .col-lg-8 > h1:first-of-type { display: none; }   /* "About" widget has no title */
.wg-about h3 {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  font-weight: 600;
  margin-top: 1.2rem;
  margin-bottom: 0.6rem;
}
.wg-about .ul-interests,
.wg-about .ul-edu {
  font-size: 0.93rem;
  color: var(--text);
}
.wg-about .ul-edu .institution { color: var(--muted); font-size: 0.9rem; }

/* --- Links: subtle dotted underline matches the custom widgets ----------- */
.universal-wrapper a:not(.btn):not(.nav-link):not([class*="network"]) {
  color: var(--text);
  text-decoration: none;
  border-bottom: 1px dotted #aaa;
}
.universal-wrapper a:not(.btn):not(.nav-link):not([class*="network"]):hover {
  border-bottom-color: var(--text);
}

/* --- Footer --------------------------------------------------------------- */
.site-footer {
  border-top: 1px solid var(--rule);
  font-size: 0.85rem;
  color: var(--faint);
}

/* --- Responsive tweaks ---------------------------------------------------- */
@media (max-width: 600px) {
  .wg-about .avatar { width: 180px; height: 180px; }
  .home-section { padding-top: 2rem; padding-bottom: 2rem; }
  .home-section h1 { font-size: 1.4rem; }
}