/* Gwen Ahn — white, research-forward academic website */
:root {
  --paper: #ffffff;
  --white: #ffffff;
  --ink: #24323e;
  --secondary: #58646c;
  --muted: #8c9697;
  --line: #e4e7e8;
  --accent: #334b60;
  --accent-soft: #f5f7f8;
  --serif: "Iowan Old Style", "Baskerville", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Arial, sans-serif;
}
html { scroll-behavior: smooth; }
body { background:var(--paper); color:var(--ink); font-family:var(--sans); -webkit-font-smoothing: antialiased; line-height:1.65; }
a { color:var(--accent); text-underline-offset:4px; }
a:hover { color:#253849; }
/* Quarto navbar */
#quarto-header { border-bottom: 1px solid var(--line); background:var(--paper); }
.navbar { background:var(--paper) !important; min-height:84px; box-shadow:none !important; border:0; }
.navbar .navbar-container { max-width:1188px !important; margin:0 auto; padding:0 32px; }
.navbar-brand { font:600 25px/1.2 var(--serif); color:var(--ink) !important; letter-spacing:-.035em; }
.navbar-nav .nav-link { color:var(--secondary) !important; font-size:13px; letter-spacing:.035em; font-weight:550; margin-left:19px; }
.navbar-nav .nav-link:hover,.navbar-nav .nav-link.active { color:var(--accent) !important; }
/* Quarto scaffolding */
#quarto-content { padding: 0 !important; }
#quarto-content main { margin:0 !important; padding:0 !important; max-width:none !important; }
#title-block-header { display:none !important; }
main.content { margin:0; max-width:none; }
.quarto-title-block { display:none !important; }
#quarto-footer { background:var(--paper); }
.nav-footer { max-width:1188px; margin:0 auto; padding:26px 32px 32px; color:var(--secondary); font-size:12px; border-top:1px solid var(--line); }
.site-shell { max-width:1188px; padding:0 32px; margin:0 auto; }
.eyebrow { font-size:11px; font-weight:700; letter-spacing:.19em; text-transform:uppercase; color:var(--accent); }
.hero { display:grid; grid-template-columns: minmax(0,1.17fr) minmax(275px,.83fr); align-items:center; column-gap:90px; padding:85px 0 72px; }
.hero h1, .page-intro h1 { margin:15px 0 12px; color:var(--ink); font:500 clamp(58px,6.2vw,96px)/1.03 var(--serif); letter-spacing:-.06em; }
.hero-role { color:var(--ink); font-size:18px; line-height:1.6; font-weight:450; max-width:590px; margin:20px 0; }
.hero-description { margin:25px 0 0; max-width:645px; font-size:16px; color:var(--secondary); line-height:1.85; }
.hero-links { display:flex; flex-wrap:wrap; gap:14px 26px; margin-top:25px; align-items:center; }
.text-link { white-space:nowrap; text-decoration:none; display:inline-flex; gap:12px; align-items:center; font-size:13px; font-weight:700; color:var(--accent); border-bottom:1px solid var(--accent); padding-bottom:5px; }
.text-link:after { content:'↗'; font-size:17px; font-weight:400; }
.text-link:hover { color:var(--ink); border-color:var(--ink); }
.secondary-link { text-decoration:none; color:var(--secondary); font-size:13px; border-bottom:1px solid #aab6b2; padding-bottom:5px; }
.secondary-link:hover { color:var(--ink); }
.focus-panel { padding:33px 34px 32px; border:1px solid var(--line); background:var(--white); box-shadow: 9px 9px 0 var(--accent-soft); }
.focus-panel .panel-header { font-size:10px; letter-spacing:.18em; color:var(--muted); font-weight:700; margin:0 0 27px; }
.focus-item { border-top:1px solid var(--line); padding:16px 0 13px; display:flex; align-items:baseline; gap:17px; }
.focus-number { font:italic 13px var(--serif); color:var(--accent); width:20px; flex-shrink:0; }
.focus-label { font:500 19px/1.4 var(--serif); letter-spacing:-.015em; }
.focus-panel .panel-note { border-top:1px solid var(--line); padding-top:18px; font-size:12px; color:var(--secondary); margin:13px 0 0; }
.section-wrap { padding:70px 0 78px; border-top:0; }
.section-header { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:30px; }
.section-header h2 { margin:9px 0 0; font:500 clamp(34px,3.2vw,49px)/1.15 var(--serif); letter-spacing:-.03em; }
.section-header .text-link { white-space:nowrap; margin-bottom:9px; }
@media (min-width: 750px) { .section-header > div:first-child { min-width: 340px; } .section-header h2 { white-space: nowrap; } }
.research-entry { display:grid; grid-template-columns:42px minmax(0,1fr) minmax(155px,.28fr); gap:25px; padding:29px 0 31px; border-top:1px solid var(--line); }
.research-entry:last-child { border-bottom:1px solid var(--line); }
.entry-number { color:#8c9c98; font:italic 16px var(--serif); padding-top:4px; }
.entry-title { font:500 23px/1.38 var(--serif); margin:0 0 12px; letter-spacing:-.017em; }
.entry-authors { font-size:13px; color:var(--secondary); margin:0; }
.entry-status { font-size:12px; line-height:1.55; color:var(--accent); text-align:right; padding-top:6px; }
.section-bottom { text-align:right; padding:25px 0 0; }
.page-intro { padding:88px 0 47px; max-width:820px; }
.page-intro h1 { font-size:clamp(55px,5vw,77px); }
.page-intro .lead { color:var(--secondary); font-size:17px; max-width:740px; margin:25px 0 0; }
.content-section { margin:21px 0 75px; }
.subsection-heading { font:500 31px var(--serif); letter-spacing:-.025em; margin:0 0 18px; }
.section-explainer { font-size:13px; color:var(--secondary); margin:0 0 22px; }
.teaching-entry { display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:27px 0; border-top:1px solid var(--line); }
.teaching-entry:last-child { border-bottom:1px solid var(--line); }
.teaching-entry h3 { font:500 24px/1.3 var(--serif); letter-spacing:-.01em; margin:0 0 5px; }
.teaching-entry p { margin:0; font-size:13px; color:var(--secondary); }
.years { color:var(--secondary); font-size:13px; white-space:nowrap; font-style:italic; }
.contact-band { background:var(--accent-soft); padding:36px 42px; margin:0 0 82px; border-left:3px solid var(--accent); display:flex; gap:22px; justify-content:space-between; align-items:center; }
.contact-band p { margin:2px 0; font-size:14px; color:var(--secondary); }
.contact-band h3 { font:500 25px var(--serif); margin:0 0 7px; }
.small-meta { margin:30px 0 50px; color:var(--secondary); font-size:13px; }
/* Static preview header/footer, uses same presentation classes */
.preview-nav { border-bottom:1px solid var(--line); }
.preview-nav-inner { max-width:1188px; margin:0 auto; padding:24px 32px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.preview-nav .brand { font:600 25px var(--serif); letter-spacing:-.035em; color:var(--ink); text-decoration:none; }
.preview-nav .links { display:flex; flex-wrap:wrap; align-items:center; gap:29px; }
.preview-nav .links a { text-decoration:none; font-size:13px; color:var(--secondary); letter-spacing:.035em; font-weight:550; }
.preview-nav .links a.active, .preview-nav .links a:hover { color:var(--accent); }
.preview-footer { border-top:1px solid var(--line); max-width:1124px; margin:0 auto; padding:26px 0 35px; color:var(--secondary); font-size:12px; display:flex; justify-content:space-between; gap:20px; }
@media (max-width:800px) {
  .navbar { min-height:65px; }
  .hero { grid-template-columns:1fr; row-gap:38px; padding:62px 0 42px; }
  .hero-portrait { width: min(100%,410px); margin: 0 auto 0 0; }
  .focus-panel { max-width:650px; }
  .research-entry { grid-template-columns:30px 1fr; gap:16px; }
  .entry-status { grid-column:2; text-align:left; padding:0; }
  .site-shell { padding:0 24px; }
  .section-header { align-items:start; }
  .preview-nav-inner { padding:19px 24px; }
  .preview-footer { margin:0 24px; }
  .page-intro { padding:66px 0 33px; }
}
@media (max-width:560px) {
  .hero h1 { font-size:63px; }
  .hero-portrait { max-width:340px; }
  .hero-role { font-size:17px; }
  .section-header { flex-direction:column; align-items:start; }
  .section-wrap { padding:57px 0; }
  .entry-title { font-size:20px; }
  .research-entry { padding:25px 0; }
  .preview-nav-inner { align-items:start; flex-direction:column; }
  .preview-nav .links { gap:20px; }
  .contact-band { padding:26px; flex-direction:column; align-items:start; }
  .teaching-entry { flex-direction:column; gap:12px; }
}

/* Hero headshot — intentionally prominent, never clipped to a circular avatar */
.hero-portrait { margin:0; width:100%; align-self:center; }
.hero-portrait .headshot { display:block; width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center 34%; background:#f1f3f4; border:1px solid #e5e8ea; }
.research-interests { color:var(--secondary); font-size:14px; line-height:1.7; margin:16px 0 0; max-width:650px; }
.research-interests strong { font-weight:600; color:var(--ink); }
.hero .hero-description { max-width:650px; }
.pdf-link {
  white-space: nowrap;
  margin-left: 8px;
}

.pdf-link a {
  color: #344d63;
  text-decoration: underline;
  text-underline-offset: 3px;
}