nav a {
  position: relative;
  color: inherit; /* Keep the text color as defined */
  text-decoration: none; /* Remove default underlines */
}

nav a:hover::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: grey; /* Grey underline */
  transition: all 0.3s ease-in-out; /* Smooth animation */
}

nav a::after {
  content: ''; /* Invisible underline to maintain spacing */
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background-color: grey;
  transition: width 0.3s ease-in-out;
}

nav a:hover::after {
  width: 100%;
}

.year-header { margin: 2rem 0 1rem; font-weight: 700; }
.pub { display: grid; grid-template-columns: 90px 1fr 140px; gap: 1rem; align-items: start; }
.pub-meta { text-align: left; }
.pub-year { font-weight: 700; }
.pub-venue { font-size: 0.95rem; opacity: 0.8; }
.pub-title { margin: 0 0 0.25rem; }
.pub-authors { font-size: 0.95rem; margin-bottom: 0.5rem; }
.pub-links .badge { display: inline-block; padding: 2px 8px; border: 1px solid #ddd; border-radius: 999px; font-size: 0.85rem; text-decoration: none; margin-right: 6px; }
.pub-media { margin-top: 0.4rem; font-size: 0.9rem; }
.pub-thumb img { width: 100%; height: auto; border-radius: 6px; object-fit: cover; }
.pub-sep { margin: 1.25rem 0; border: none; border-top: 1px solid #eee; }
.wip-list { margin-top: 0.5rem; }

.year-header { margin: 2rem 0 1rem; font-weight: 700; }
/*.wip { display: grid; grid-template-columns: 100px 1fr 70px; gap: 1rem; align-items: start; } */
/*.wip-thumb img { width: 100%; height: auto; border-radius: 6px; object-fit: cover; } */
.wip-title { display: inline; margin: 0; font-size: 1.05rem; line-height: 1.35; }
.wip-authors { display: inline; font-size: .95rem; margin-left: 0.3rem; }
.wip-authors::after { content: ""; display: block; }
.wip-abstract, .wip-note { font-size: .95rem; }
.wip-links .badge { display: inline-block; padding: 2px 8px; border: 1px solid #ddd; border-radius: 999px; font-size: .85rem; text-decoration: none; margin-right: 6px; }
.wip-meta { text-align: right; }
.wip-year { font-weight: 700; font-variant-numeric: tabular-nums; }
/*.wip-sep { margin: 1rem 0; border: 0; border-top: 1px solid #eee; }*/
.wip-sep {
  border: 0;
  border-top: 1px solid #ccc;  /* bump thickness here (2–3px) */
  margin: 1.25rem 0;           /* adjust vertical spacing */
  opacity: 1;                  /* override Bootstrap’s default .25 */
}

/* Wider thumbnail column so images can breathe */
.wip { 
  display: grid; 
  grid-template-columns: 280px 1fr 70px;  /* wider image column */
  gap: 1rem; 
  align-items: start;                     /* top-align columns */
}

/* Thumbnail: no crop, no grey bands, fixed height */
.wip-thumb { background: transparent; padding: 0; }

.wip-thumb img {
  display: block;
  width: 100%;
  height: 200px;        /* increase to taste */
  object-fit: contain;  /* no crop */
  object-position: top; /* push image content to the top of the box */
  border-radius: 6px;
}

/* Make sure the title has no top margin */
.wip-title { margin: 0 0 .25rem; }

.section-title {
  border-bottom: 2px solid #bbb;  /* thickness + color */
  padding-bottom: .75rem;         /* space between text and line */
  margin-bottom: 1.25rem;         /* space below the line */
}

/* Abstract toggle */
/* Abstract toggle styling */
.wip-abstract { margin-top: .5rem; }


/* Make sure the label is visible on all themes */
.wip-abstract summary.badge {
  color: #222 !important;
  background: transparent !important;
  border: 1px solid #ddd;
  padding: 2px 8px;
  border-radius: 999px;
  display: inline-block;
  line-height: 1.1;
}

/* If some theme sets children color inside .badge */
.wip-abstract summary.badge * { color: inherit !important; }

/* If the element ends up empty due to templating, inject a fallback */
.wip-abstract summary.badge:empty::before { content: "Abstract"; }

.wip-abstract summary::-webkit-details-marker { display: none; }
.wip-abstract summary::marker { content: ""; }
.wip-abstract summary { list-style: none; }
.wip-abstract-content { margin-top: .5rem; font-size: .95rem; line-height: 1.45; }
/* optional: subtle filled look when open */
.wip-abstract[open] summary.badge {
  background-color: #f5f5f5;
  border-color: #ccc;
}


/* ===== Global background (very light beige) ===== */
:root {
  --beige-50: #f9f5ee;   /* tweak to taste: #faf6ef, #f8f2e8, #fff8ef */
  --beige-100: #fffaf2;  /* slightly lighter for cards/navs */
  --beige-border: #e8dfd2;
}

/* Works everywhere */
html, body { background-color: var(--beige-50); }

/* If you're on Bootstrap 5, this cascades to many components */
:root {
  --bs-body-bg: var(--beige-50);
  --bs-border-color: var(--beige-border);
}

/* Soften common white blocks (optional) */
.navbar,
.dropdown-menu,
.card,
.offcanvas,
.modal-content {
  background-color: var(--beige-100);
}

/* Code blocks & callouts (optional, so they don’t look stark white) */
pre, code, .highlight {
  background: #fffdf8;
  border-color: var(--beige-border);
}

/* Lines and section underlines to match the palette */
hr, .wip-sep { border-top: 2px solid var(--beige-border); }
.section-title { border-bottom: 3px solid var(--beige-border); }



:root{
  /* Make Garamond the default font everywhere */
  --bs-font-sans-serif: 'EB Garamond', Garamond, 'Adobe Garamond Pro', 'Garamond Premier Pro', Georgia, serif;
  --bs-body-font-family: var(--bs-font-sans-serif);
}

html, body { font-family: var(--bs-body-font-family); }

/* Headings can be a bit heavier on Garamond */
h1, h2, h3, h4, h5, h6 { font-weight: 600; }

/* Keep code blocks monospaced */
code, kbd, pre, samp { font-family: var(--bs-font-monospace); }


/* Remove the year column entirely */
.wip-meta, .wip-year { display: none !important; }

/* Single column: full-width text body */
.wip {
  display: block;
}

/* Abstract body: text on the left, image on the right */
.wip-abstract-body {
  display: flex;
  gap: 1.5rem;
  align-items: start;
  margin-top: 0.5rem;
}

.wip-abstract-body .wip-abstract-content {
  flex: 1 1 0;
  margin-top: 0;
}

.wip-abstract-body .wip-thumb {
  flex: 0 0 300px;
}

.wip-abstract-body .wip-thumb img {
  width: 100%;
  height: auto;
  max-height: 260px;
  object-fit: contain;
  object-position: top;
  border-radius: 6px;
}

/* Responsive: stack on mobile */
@media (max-width: 768px) {
  .wip-abstract-body {
    flex-direction: column;
  }
  .wip-abstract-body .wip-thumb {
    flex: none;
    width: 100%;
  }
}