/* professorwatson.com: additions to site.css and fonts.css, which are unchanged copies from gregwatson.com. */

.brand-words .ws { font-size: 1.12rem; }
.narrow { width: min(100% - 2 * var(--gutter), 780px); margin-inline: auto; }
.page-hero h1 { max-width: 22em; font-size: clamp(1.9rem, 3.8vw, 2.9rem); overflow-wrap: anywhere; }
.page-hero .lede { margin-top: 1rem; }
.post-meta { color: var(--muted); font-size: .95rem; margin: .8rem 0 0; }
.pw-hero { padding-block: clamp(40px, 7vw, 88px); }
.pw-hero .lede { margin-bottom: 0; }
.section-more { margin-top: clamp(24px, 4vw, 40px); }
.pw-gap { margin-top: clamp(40px, 6vw, 64px); }
.pw-duo { align-items: start; }

/* cards that are links */
a.pw-card { display: block; text-decoration: none; color: var(--graphite); transition: border-color .15s ease; }
a.pw-card:hover { border-color: var(--teal); color: var(--graphite); }
.pw-card { padding: clamp(20px, 3vw, 28px); }
.pw-card .eyebrow { margin-bottom: .5rem; font-size: .72rem; letter-spacing: .16em; color: var(--gold-ink); }
.pw-card h2, .pw-card h3 { font-size: 1.15rem; margin-bottom: .4rem; }
.pw-card p { margin: 0 0 .6rem; font-size: .98rem; }
.pw-card p:last-child { margin-bottom: 0; }

/* student voices */
.pw-quote { font-family: var(--font-serif); font-size: 1.15rem; line-height: 1.5; color: var(--ink); margin: 0 0 1rem; border-left: 4px solid var(--gold); padding-left: 1.1rem; }
.pw-quote.card { border-left: 4px solid var(--gold); margin: 0; padding: clamp(20px, 3vw, 28px); }
.pw-quote cite { display: block; font: 500 .9rem/1.5 var(--font-body); font-style: normal; color: var(--muted); margin-top: .7rem; }
.rating-line { font-weight: 600; color: var(--ink); }
.note-line { color: var(--muted); font-size: .98rem; margin-top: clamp(20px, 3vw, 32px); max-width: 48em; }

/* long text */
.prose h3 { margin-top: 1.6em; }
.prose h4 { font: 700 1rem/1.3 var(--font-head); color: var(--ink); margin: 1.4em 0 .4em; }
.prose figure.photo { margin: 0 0 clamp(24px, 4vw, 40px); max-width: 420px; }
.prose figure.photo.wide { max-width: 100%; }
.prose figure.photo img { border-radius: var(--radius); }
.prose a { overflow-wrap: anywhere; }
.note { margin-top: clamp(32px, 5vw, 48px); padding: clamp(20px, 3vw, 28px); border: 1px solid var(--line); border-left: 4px solid var(--teal); border-radius: 10px; }
.note p:last-child { margin-bottom: 0; }
.table-scroll { overflow-x: auto; }
.table-scroll table { border-collapse: collapse; width: 100%; font-size: .95rem; }
.table-scroll th, .table-scroll td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }

/* footer */
.foot-simple { display: flex; flex-wrap: wrap; gap: 24px 48px; justify-content: space-between; align-items: flex-start; }
.foot-brand p { margin: 0; max-width: 24em; }
.foot-line { margin: 0; max-width: 40em; }
.muted-on-ink { color: var(--on-ink-muted); }

@media (max-width: 900px) {
  .pw-duo { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .brand-words .ws { font-size: .98rem; }
  .brand-words .dr { font-size: .72rem; }
}
.pw-duo > *, .grid-2 > *, .grid-3 > * { min-width: 0; }
.pw-email { overflow-wrap: anywhere; }
/* Burnished gold fails as text on white (site.css): the wordmark uses the darker gold here. */
.brand-words .ws { color: var(--gold-ink); }
/* Corridor videos inside the research text */
.pw-talks { margin: 1.4rem 0 .4rem; }
.pw-talks .talk-body h3 { margin-top: 0; }
.split > * { min-width: 0; }