@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=DM+Mono:wght@300;400&family=Outfit:wght@300;400;500;600&display=swap');

:root {
  /* TEMPORARY purple test — original green values in comments */
  --forest:        #3E2A5C;  /* green: #2d5016 */
  --forest-mid:    #3E2A5C;  /* green: #2d5016 */
  --forest-light:  #3E2A5C;  /* green: #2d5016 */
  --forest-pale:   #f2eff7;  /* green: #f0f6ea */
  --forest-border: #3E2A5C;  /* green: #2d5016 */
  --forest-glow:   rgba(62,42,92,0.25);  /* green: rgba(45,80,22,0.25) */
  --navy:          #1B2A41;
  --navy-deep:     #0e1626;
  --white:         #ffffff;
  --off-white:     #f8faf5;
  --text:          #1a1b1d;  /* was greenish black #161b10 */
  --text-soft:     #3f4347;  /* was grey-green #475240 */
  --text-muted:    #6b7075;  /* was grey-green #7a8a6e */
  --accent:        #3E2A5C;  /* green: #2d5016 */
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family:'Times New Roman', serif;
  background:var(--white);
  color:var(--text);
  min-height:100vh;
}

/* ── NAVBAR ─────────────────────────────────────────────── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:62px;
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--forest-border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 4rem;
}

.nav-logo {
  font-family:'Times New Roman', serif;
  font-size:1.55rem; font-weight:600;
  color:var(--forest); text-decoration:none;
  letter-spacing:0.05em;
  display:flex; align-items:center; gap:0.5rem;
}

.nav-logo-dot {
  width:6px; height:6px; border-radius:50%;
  background:var(--accent); display:inline-block;
  animation: pulse-dot 3s ease-in-out infinite;
}

@keyframes pulse-dot {
  0%,100% { box-shadow: 0 0 0 0 rgba(62,42,92,0.5); }   /* green: 45,80,22 */
  50%      { box-shadow: 0 0 0 5px rgba(62,42,92,0); }
}

.nav-links { display:flex; gap:0; list-style:none; }

.nav-links a {
  font-family:'Times New Roman', serif;
  font-size:1rem; font-weight:400;
  letter-spacing:0.08em; text-transform:uppercase;
  color:var(--text-soft); text-decoration:none;
  padding:0 1.25rem;
  height:62px; display:flex; align-items:center;
  border-bottom:2px solid transparent;
  transition:color 0.2s, border-color 0.2s;
  position:relative;
}

.nav-links a:hover { color:var(--forest); }
.nav-links a.active { color:var(--forest); border-bottom-color:var(--forest); }

/* dropdown trigger */
.nav-dropdown { position:relative; }

.nav-dropdown > a::after {
  content:'';
  display:inline-block;
  margin-left:5px;
  border:4px solid transparent;
  border-top-color:currentColor;
  vertical-align:middle;
  margin-top:3px;
}

.dropdown-menu {
  display:none;
  position:absolute; top:100%; left:0;
  background:var(--white);
  border:1px solid var(--forest-border);
  border-top:none;
  min-width:210px;
  box-shadow:0 8px 24px rgba(62,42,92,0.10);  /* green: 45,80,22 */
  z-index:300;
}

.nav-dropdown:hover .dropdown-menu { display:block; }

.dropdown-menu a {
  display:block; padding:0.75rem 1.25rem;
  font-family:'Times New Roman', serif;
  font-size:0.95rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-soft); text-decoration:none; border:none;
  height:auto;
  transition:background 0.15s, color 0.15s;
}

.dropdown-menu a:hover {
  background:var(--forest-pale); color:var(--forest); border:none;
}

/* ── PAGE WRAP ──────────────────────────────────────────── */
.page-wrap {
  padding-top:62px;
  min-height:100vh;
  animation:fadeUp 0.4s ease both;
}

@keyframes fadeUp {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ── INNER PAGE HEADER ──────────────────────────────────── */
/* Starfield band: same imagery as the homepage hero, navy-tinted
   for legibility, with the green brand seam underneath */
.page-header {
  padding:4rem 5rem 3rem;
  border-bottom:2px solid var(--forest);
  background:
    linear-gradient(180deg, rgba(14,22,38,0.55) 0%, rgba(14,22,38,0.75) 100%),
    url('MBH.jpg') center 30% / cover no-repeat;
}

.eyebrow {
  font-family:'Times New Roman', serif;
  font-size:0.9rem; letter-spacing:0.18em; text-transform:uppercase;
  color:rgba(255,255,255,0.65); margin-bottom:0.7rem; font-style:italic;
}

.page-header h1 {
  font-family:'Times New Roman', serif;
  font-size:2.8rem; font-weight:300; color:var(--off-white); line-height:1.15;
}

/* ── PAGE BODY ──────────────────────────────────────────── */
.page-body { padding:3.5rem 5rem; max-width:1250px; margin:0 auto; }

/* ── QUICK LINK BUTTONS ─────────────────────────────────── */
.ql-btn {
  display:inline-flex; align-items:center; gap:0.6rem;
  padding:0.8rem 1.5rem;
  border:1.5px solid var(--forest-border);
  border-radius:7px;
  background:var(--white);
  color:var(--forest); font-family:'Outfit', sans-serif;
  font-size:0.84rem; font-weight:500; letter-spacing:0.04em;
  text-decoration:none; cursor:pointer;
  transition: transform 0.25s ease, box-shadow 0.3s ease, border-color 0.25s ease;
}
.ql-btn svg {
  width:15px; height:15px;
  stroke:var(--accent); fill:none; stroke-width:1.8;
  flex-shrink:0; transition:stroke 0.25s;
}
.ql-btn:hover {
  border-color:var(--forest-light);
  transform:translateY(-3px);
  box-shadow:0 0 14px var(--forest-glow), 0 6px 20px rgba(62,42,92,0.12);  /* green: 45,80,22 */
}
.ql-btn:hover svg { stroke:var(--forest); }

/* ── ACCORDION ──────────────────────────────────────────── */
.accordion { border:1px solid var(--forest-border); border-radius:8px; margin-bottom:1rem; overflow:hidden; }

.accordion-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:1.35rem 1.75rem; cursor:pointer;
  background:var(--white); user-select:none; transition:background 0.2s;
}
.accordion-header:hover { background:var(--forest-pale); }
.accordion-header.open  { background:var(--forest-pale); border-bottom:1px solid var(--forest-border); }

.acc-title-wrap { display:flex; align-items:center; gap:0.9rem; }
.acc-num { font-family:'DM Mono', monospace; font-size:0.62rem; color:var(--accent); letter-spacing:0.1em; }
.accordion-header h3 {
  font-family:'Times New Roman', serif;
  font-size:1.35rem; font-weight:400; color:var(--forest);
}

.acc-arrow {
  width:18px; height:18px;
  stroke:var(--forest-mid); fill:none; stroke-width:2;
  transition:transform 0.3s ease; flex-shrink:0;
}
.accordion-header.open .acc-arrow { transform:rotate(180deg); }

.accordion-body {
  max-height:0; overflow:hidden;
  transition:max-height 0.4s ease, padding 0.3s ease;
  background:var(--white); padding:0 1.75rem;
}
.accordion-body.open { max-height:900px; padding:1.75rem; }
.accordion-body p {
  font-size:1.12rem; line-height:1.85;
  color:var(--text-soft); font-weight:300; margin-bottom:0.9rem;
}
.accordion-body p:last-child { margin-bottom:0; }

/* ── PUBLICATIONS ───────────────────────────────────────── */
.orcid-link {
  display:inline-flex; align-items:center; gap:0.5rem;
  font-family:'DM Mono', monospace; font-size:0.82rem;
  color:var(--forest-mid);
  background:var(--forest-pale); border:1px solid var(--forest-border);
  border-radius:4px; padding:0.4rem 0.85rem;
  text-decoration:none;
  transition:box-shadow 0.25s;
}
.orcid-link:hover { box-shadow:0 0 10px var(--forest-glow); }

.pub-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; margin-bottom:2.5rem;
}
.pub-filter {
  display:inline-flex; border:1px solid var(--forest-border);
  border-radius:4px; overflow:hidden; background:var(--white);
}
.pub-filter-btn {
  font-family:'DM Mono', monospace; font-size:0.82rem;
  letter-spacing:0.06em; text-transform:uppercase;
  color:var(--text-muted); background:transparent; border:0;
  padding:0.4rem 0.9rem; cursor:pointer;
  transition:color 0.15s, background 0.15s;
}
.pub-filter-btn + .pub-filter-btn { border-left:1px solid var(--forest-border); }
.pub-filter-btn:hover { color:var(--forest); background:var(--forest-pale); }
.pub-filter-btn.active {
  color:var(--white); background:var(--forest);
}
.pub-card[hidden], .pub-year-label[hidden] { display:none; }

.pub-year-label {
  font-family:'DM Mono', monospace;
  font-size:0.8rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--forest-light);
  display:flex; align-items:center; gap:1rem;
  margin:2.5rem 0 1rem;
}
.pub-year-label::after { content:''; flex:1; height:1px; background:var(--forest-border); }

/* Publication card — collAIder-inspired */
.pub-card {
  background:var(--white);
  border:1px solid var(--forest-border);
  border-radius:8px;
  padding:1.5rem 1.75rem;
  margin-bottom:1rem;
  transition:box-shadow 0.25s, transform 0.2s;
  position:relative;
}
.pub-card:hover {
  box-shadow:0 4px 22px rgba(62,42,92,0.10);  /* green: 45,80,22 */
  transform:translateY(-2px);
}
.pub-card-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:0.55rem; }
.pub-title {
  font-family:'Times New Roman', serif;
  font-size:1.3rem; font-weight:400; color:var(--forest); line-height:1.45;
}
.pub-title a { text-decoration:none; color:inherit; }
.pub-title a:hover { color:var(--forest-light); }

.pub-badges { display:flex; flex-wrap:wrap; gap:0.35rem; flex-shrink:0; }
.pub-tag {
  font-family:'DM Mono', monospace; font-size:0.68rem;
  letter-spacing:0.09em; text-transform:uppercase;
  padding:0.2rem 0.55rem; border-radius:3px;
  background:var(--forest-pale); color:var(--forest-mid);
  border:1px solid var(--forest-border); white-space:nowrap;
}
.pub-tag.lead { background:var(--forest); color:var(--white); border-color:var(--forest); }

.pub-authors { font-size:1.1rem; color:var(--text-soft); margin-bottom:0.3rem; line-height:1.5; }
.pub-authors strong { color:var(--forest-mid); font-weight:500; }

.pub-footer { display:flex; align-items:center; gap:1rem; margin-top:0.6rem; flex-wrap:wrap; }
.pub-venue {
  font-family:'DM Mono', monospace; font-size:0.8rem;
  color:var(--text-muted); letter-spacing:0.03em;
}
.pub-arxiv {
  font-family:'DM Mono', monospace; font-size:0.8rem;
  color:var(--forest-light); text-decoration:none;
  padding:0.15rem 0.5rem; border:1px solid var(--forest-border);
  border-radius:3px; transition:background 0.15s;
}
.pub-arxiv:hover { background:var(--forest-pale); }

/* ── CV ─────────────────────────────────────────────────── */
.cv-download-btn {
  display:inline-flex; align-items:center; gap:0.6rem;
  padding:0.8rem 1.75rem;
  background:var(--forest); color:var(--white);
  border-radius:7px; font-size:0.83rem; letter-spacing:0.05em;
  text-decoration:none;
  transition:background 0.2s, box-shadow 0.3s;
}
.cv-download-btn:hover {
  background:var(--forest-mid);
  box-shadow:0 0 18px var(--forest-glow);
}
.cv-download-btn svg { width:15px; height:15px; stroke:#fff; fill:none; stroke-width:2; }

/* ── OUTREACH ROWS ───────────────────────────────────────── */
.outreach-body { max-width:1400px; }

.outreach-intro {
  font-family:'Times New Roman', serif;
  font-size:1.3rem; line-height:1.75;
  color:var(--text-soft); font-weight:400;
  max-width:36rem; margin:0 0 3.5rem;
}

.outreach-row {
  display:grid;
  grid-template-columns:1.85fr 1fr;
  gap:2.25rem 3rem;
  align-items:center;
  margin-bottom:3.75rem;
}
.outreach-row.flip {
  grid-template-columns:1fr 1.85fr;
}
.outreach-row.flip .outreach-text { order:2; text-align:right; }
.outreach-row.flip .outreach-photo { order:1; }

.outreach-text h2 {
  font-family:'Times New Roman', serif;
  font-size:1.55rem; font-weight:400;
  color:var(--forest); line-height:1.3;
  margin-bottom:0.7rem;
}
.outreach-text p {
  font-size:1.18rem; line-height:1.75;
  color:var(--text-soft); font-weight:300;
}

.outreach-photo {
  margin:0;
  aspect-ratio:5 / 4;
  overflow:hidden;
  background:
    linear-gradient(145deg, var(--forest-pale) 0%, #e6e0f0 100%);  /* green: #e4eed9 */
  position:relative;
}
.outreach-photo::after {
  content:'add a photo';
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font-family:'Times New Roman', serif;
  font-size:0.95rem; font-style:italic;
  color:var(--text-muted);
  opacity:0; pointer-events:none;
  transition:opacity 0.2s;
}
.outreach-photo.empty::after { opacity:0.85; }
.outreach-photo img {
  width:100%; height:100%;
  object-fit:cover; display:block;
  transition:transform 0.45s ease;
}
.outreach-photo:not(.empty):hover img { transform:scale(1.03); }

@media (max-width:820px) {
  .outreach-row,
  .outreach-row.flip {
    grid-template-columns:1fr;
    gap:1.25rem;
  }
  .outreach-row .outreach-photo,
  .outreach-row.flip .outreach-photo { order:1; }
  .outreach-row .outreach-text,
  .outreach-row.flip .outreach-text { order:2; text-align:left; }
  .outreach-photo { aspect-ratio:16 / 10; }
}

/* ── UTILITY ─────────────────────────────────────────────── */
.prose {
  font-family:'Times New Roman', serif;
  font-size:1.25rem; line-height:1.85;
  color:var(--text-soft); font-weight:400;
  margin-bottom:2.5rem; max-width:700px;
}

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width:820px) {
  nav { padding:0 1.5rem; }
  .nav-links { display:none; }
  .page-header { padding:3rem 1.5rem 2.5rem; }
  .page-body { padding:2.5rem 1.5rem; }
}