/* Additions to design.css: Montserrat tuning, the news and publication markup
   generated by build.py, and the single-column personal pages. */

/* Montserrat runs wider than the design's Georgia, so set it slightly smaller. */
body { font-size: 15px; }
.section-title, .dialog-heading h2 { font-weight: 700; letter-spacing: -0.01em; }
.section-title { font-size: 23px; }
#about .section-title { font-size: 27px; }
#news .section-title, .practical-column .section-title { font-size: 21px; }
#about > p { font-size: 14.5px; }
.pub-title { font-size: 14.5px; }
.pub-authors, .pub-venue { font-size: 13px; }
.news-text { font-size: 13px; }
.course p:not(.course-meta) { font-size: 14px; }
.member div > p:first-child { font-size: 15px; }
.pub-link { font-size: 11px; }

/* Publication years are collapsible, as on the current site. */
details.pub-year { margin: 0 0 18px; }
details.pub-year:last-child { margin-bottom: 0; }
details.pub-year > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 9px;
  list-style: none; cursor: pointer; user-select: none;
  font: 600 1.05rem/1.4 'Montserrat', sans-serif; color: var(--accent);
  border-bottom: 1px solid var(--line); padding: 6px 0 9px;
}
details.pub-year > summary::-webkit-details-marker { display: none; }
details.pub-year > summary::after {
  content: ''; flex: none; width: 9px; height: 9px; margin-right: 1px; opacity: .8;
  background: linear-gradient(currentColor, currentColor) center/9px 1px no-repeat,
              linear-gradient(currentColor, currentColor) center/1px 9px no-repeat;
}
details.pub-year[open] > summary::after {
  background: linear-gradient(currentColor, currentColor) center/9px 1px no-repeat;
}
details.pub-year > .pub-year-content { padding-top: 12px; }

.pub .pub-authors a.coauthor { color: inherit; font-weight: inherit; text-decoration: none; }
.pub .pub-authors a.coauthor:hover { text-decoration: underline; text-underline-offset: 3px; }
/* Group members (or the page owner) are slightly emphasized in author lists. */
.pub-authors .team-author { font-weight: 500; color: var(--ink); }
.pub .pub-note { color: var(--muted); font-size: 12px; font-weight: normal; margin-left: 0.4em; }

/* Light pastel wash per link type. The ice is a touch deeper toward the bottom,
   and the design's lit facet (::after) stays visible on top. */
.pub-link::before {
  background: linear-gradient(165deg, color-mix(in srgb, var(--wash) 62%, #fff) 25%,
                                      color-mix(in srgb, var(--wash) 80%, #fff));
}
.pub-link::after { opacity: .35; }

.pub-link { --wash: #e9e4f7; color: #5e5389; }                       /* publisher versions: lavender */
.pub-link[data-kind=eprint], .pub-link[data-kind=arxiv] { --wash: #dcebfa; color: #3d6890; }
.pub-link[data-kind=slides] { --wash: #dff2e6; color: #3f7656; }
.pub-link[data-kind=video] { --wash: #fce2da; color: #985444; }
.pub-link[data-kind=code] { --wash: #fbf1cc; color: #7f6a22; }
.pub-link[data-kind=cite] { --wash: #edf0f3; color: #5f6f7c; }

/* "more" link below the news feed */
.news-more { padding: 3px 0 8px; font-size: 13px; }
.news-more a { font-weight: bold; }

/* ---------- Personal pages (single column) ---------- */
.page .card { margin-bottom: 24px; }
.page .card p a, .page .card li a { font-weight: 600; }
.page .card ul { margin: 0.5rem 0 0.5rem 1.25rem; padding: 0; list-style: disc; }
.page .card li + li { margin-top: 0.2rem; }

.page #about .section-title { margin-bottom: 20px; }
.about-hero { display: flex; gap: 2rem; align-items: flex-start; }
.about-hero > div:last-child { flex: 1; min-width: 200px; }
.about-photo { display: flex; flex-direction: column; align-items: center; gap: 0.9rem; flex-shrink: 0; }
.about-photo .portrait-frame { width: 142px; }
.about-icon-rows { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; }
.about-icon-row { display: flex; gap: 0.9rem; align-items: center; justify-content: center; }
.about-icon-row a { color: var(--muted); transition: color 0.15s; }
.about-icon-row a:hover { color: var(--ink); text-decoration: none; }
.about-text p { font-size: 14.5px; line-height: 1.78; }
.about-text p + p { margin-top: 0.75rem; }

/* Projects and resources reuse the collapsible headings. */
.page details.pub-year > summary { font-size: 1rem; }
.page .pub-year-content > p { font-size: 14px; line-height: 1.7; }
.page .pub-year-content > p + p { margin-top: 0.5rem; }
.page .pub-year-content > ul { font-size: 13.5px; line-height: 1.7; }

/* service */
.service-block { margin-bottom: 1.75rem; }
.service-block:last-child { margin-bottom: 0; }
.service-label { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent); margin-bottom: 0.75rem; }
.service-columns { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0 2.5rem; align-items: start; }
.service-reviewing { grid-column: 2; grid-row: 1 / 3; }
.service-list { display: flex; flex-direction: column; gap: 0.5rem; }
.service-venue { font-weight: 600; color: var(--ink); font-size: 14px; }
.service-years { font-size: 12.5px; color: var(--muted); margin-top: 0.1rem; }

/* talks */
.talk { padding: 1.6px 0 1.6px 12px; border-left: 1px solid #d0dce2; margin-bottom: 0.9rem; }
.talk:last-child { margin-bottom: 0; }
.talk-title { font-weight: 600; font-size: 14px; color: var(--ink); }
.talk-meta { font-size: 13px; color: var(--muted); margin-top: 0.15rem; }

@media (max-width: 650px) {
  .about-hero { flex-direction: column; align-items: center; }
  .about-hero > div { width: 100%; }
  .about-icon-rows { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 0.9rem; }
  .about-icon-row { display: contents; }
  .service-columns { grid-template-columns: 1fr; row-gap: 1.5rem; }
  .service-reviewing { grid-column: auto; grid-row: auto; }
}

/* news archive page: the timeline dots are drawn in the cool surface color */
.news-page { background: var(--surface-cool); }
.news-page .news-feed { margin-top: 4px; }

/* imprint */
.legal p { font-size: 14px; line-height: 1.75; }
.legal .legal-heading { font-size: 14px; font-weight: 700; color: var(--ink); margin: 1.4rem 0 0.35rem; }
.legal .section-title + .legal-heading { margin-top: 0; }
.legal .legal-group { font-size: 16px; margin-top: 2.2rem; }
