/* ============================================================
   Shared stylesheet for the Digital Geometry Processing Group.
   Classic academic look: serif text, dark-blue headings,
   single centered column on white.
   Used by both Graduate.html and pap_list.html.
   ============================================================ */

:root {
  --maxw: 820px;
  --ink: #222222;
  --muted: #666666;
  --accent: #00337a;        /* headings & links            */
  --accent-dark: #001f4d;   /* hover / strong headings     */
  --rule: #d9d9d9;          /* hairline rules              */
  --callout-bg: #f4f6f9;    /* intro / note box background */
}

* { box-sizing: border-box; }

/* Render digits 0-9 with a lining-figure font (Georgia uses old-style
   figures that sit at varying heights). Only the numerals are remapped;
   all other characters stay in Georgia. */
@font-face {
  font-family: "LiningNums";
  src: local("Cambria"), local("Times New Roman"), local("Times");
  unicode-range: U+0030-0039;
}

body {
  font-family: "LiningNums", Georgia, "Times New Roman", Times, serif;
  font-size: 17px;
  line-height: 1.38;
  color: var(--ink);
  background: #ffffff;
  margin: 0;
  padding: 2.5rem 2rem 4rem 1.5rem;
}

.page { max-width: none; margin: 0; }

/* ---- Headings -------------------------------------------- */
h1 {
  font-size: 2rem;
  color: var(--accent-dark);
  line-height: 1.2;
  margin: 0 0 0.4rem;
}
.subtitle { color: var(--muted); margin: 0 0 1rem; }

p { margin: 0.45rem 0; }

h2 {
  font-size: 1.3rem;
  color: var(--accent);
  margin: 1.25rem 0 0.4rem;
  padding-bottom: 0.2rem;
  border-bottom: 2px solid var(--accent);
}

h3 { font-size: 1.1rem; color: var(--accent-dark); margin: 0.9rem 0 0.3rem; }

/* ---- Links ----------------------------------------------- */
a { color: var(--accent); }
a:hover { color: var(--accent-dark); }

/* ---- Entry lists (people & publications) ----------------- */
ul.entries { list-style: none; margin: 0; padding: 0; }
ul.entries > li {
  margin: 0 0 0.22rem;
  padding-left: 1.3rem;        /* hanging indent for wrapped lines */
  position: relative;
}
ul.entries > li::before {
  content: "\2022";            /* bullet */
  color: var(--accent);
  position: absolute;
  left: 0;
}

/* Publications page: slightly smaller entries for a tighter list */
.pubs ul.entries > li { font-size: 0.92rem; margin-bottom: 0.18rem; }
.pubs h2 { font-size: 1.1rem; margin: 0.8rem 0 0.3rem; padding-bottom: 0.15rem; }

.role { font-weight: bold; }             /* degree / position label  */
.note { color: var(--muted); }           /* where-are-they-now, etc. */
em   { font-style: italic; }             /* supervised students      */

/* ---- Callout / intro box --------------------------------- */
.callout {
  background: var(--callout-bg);
  border-left: 4px solid var(--accent);
  padding: 0.9rem 1.2rem;
  margin: 1.5rem 0 2rem;
}
.callout p { margin: 0.4rem 0; }

.year-note { color: var(--muted); margin: 0.2rem 0 1rem; }

/* ---- Photos ---------------------------------------------- */
.gallery { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 1.2rem 0 2rem; }
.gallery img {
  height: 112px; width: auto;
  border: 1px solid var(--rule);
  border-radius: 3px;
  background: #fff;
}
.figure-right { float: right; width: 200px; margin: 0.3rem 0 1rem 1.5rem; }
.figure-right img { max-width: 100%; height: auto; border: 1px solid var(--rule); border-radius: 3px; }

/* ---- People lists + photo column (Group page) ------------ */
.people { display: flex; gap: 1.6rem; align-items: flex-start; }
.people-text { flex: 1; min-width: 0; }
.people-photos { flex: none; width: 184px; }
.people-photos .gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.4rem;
  margin: 0;
}
.people-photos .gallery img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;       /* uniform square cells     */
  object-fit: contain;        /* show whole photo, no crop */
  border: none;               /* no outline / box         */
  border-radius: 0;
}
.people-photos .gallery img.wide {
  grid-column: 1 / -1;        /* group photos span full width */
  aspect-ratio: auto;         /* keep natural ratio          */
  object-fit: contain;
}

/* ---- Footer ---------------------------------------------- */
footer {
  margin-top: 3rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8rem;
  color: var(--muted);
}

/* ---- Profile header (intro / home page) ------------------ */
.profile { display: flex; flex-wrap: wrap; gap: 1.6rem; align-items: flex-start; margin: 0 0 1.5rem; }
.profile-photo { width: 175px; height: auto; border: 1px solid var(--rule); border-radius: 3px; flex: none; }
.profile .who { flex: 1; min-width: 250px; }
.profile .who h1 { margin: 0 0 0.4rem; }
.profile .who p { margin: 0.3rem 0; }
.contact { flex: none; font-size: 0.95rem; align-self: flex-start; }
.contact p { margin: 0.12rem 0; }
.contact .label { font-weight: bold; }

/* ---- Small screens --------------------------------------- */
@media (max-width: 600px) {
  body { font-size: 16px; padding: 1.5rem 1rem 3rem; }
  h1 { font-size: 1.6rem; }
  h2 { font-size: 1.2rem; }
  .figure-right { float: none; width: auto; max-width: 220px; margin: 0 0 1rem; }
  .profile-photo { width: 140px; }
  .people { flex-direction: column; }
  .people-photos { width: auto; }
}