/* /en/teachers/ (teachers.py): the Teachers hub. The polish.css tokens: 8pt spacing, the band, hairlines, the EN type.
   White (the founders) then the light-blue band (the instructors), as the design policy alternates them. */
.th { padding: var(--band, 96px) 0; background: var(--white, #fff); }
.th--band { background: var(--beige, #e7f1f7); }
.th-in { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.th-h { font-family: var(--ff-head, 'Cormorant Garamond', serif); font-weight: 400; font-size: clamp(34px, 5vw, 48px);
    letter-spacing: .02em; color: var(--navy, #2f5d34); text-align: center; margin: 0 0 var(--s4, 16px); }
.th-lead { max-width: 34em; margin: 0 auto var(--head-gap, 48px); font-size: 17px; line-height: 1.8;
    color: var(--ink-mute, rgba(47, 93, 52, .78)); text-align: center !important; }
.th-sh { font-family: var(--ff-head, 'Cormorant Garamond', serif); font-weight: 400; font-size: clamp(28px, 4vw, 36px);
    color: var(--navy, #2f5d34); text-align: center; margin: 0 0 var(--head-gap, 48px); }
.th-lead-grid, .th-grid { list-style: none; margin: 0; padding: 0; display: grid; }
.th-lead-grid { grid-template-columns: repeat(3, 1fr); gap: var(--s7, 48px) var(--s6, 32px); }
.th-grid { grid-template-columns: repeat(4, 1fr); gap: var(--s7, 48px) var(--s5, 24px); }
.th-card { display: flex; flex-direction: column; min-width: 0; }
.th-main { display: block; color: inherit; text-decoration: none; }
.th-photo { display: block; aspect-ratio: 3 / 4; overflow: hidden; border-radius: 2px; background: #dfe9ef; }
.th-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.th-main:hover .th-photo img { transform: scale(1.03); }
.th-role { display: block; margin: var(--s4, 16px) 0 var(--s1, 4px); font-size: 12px; letter-spacing: .14em;
    text-transform: uppercase; color: var(--navy-mute, rgba(47, 93, 52, .6)); }
.th-name { font-family: var(--ff-head, 'Cormorant Garamond', serif); font-weight: 500; font-size: 22px; line-height: 1.3;
    color: var(--navy, #2f5d34); margin: 0; text-align: left; }
.th-card--lead .th-name { font-size: 28px; }
.th-main:hover .th-name { text-decoration: underline 1px; text-underline-offset: .2em; }
.th-rep { display: flex; gap: var(--s3, 12px); align-items: flex-start; margin: var(--s4, 16px) 0 0;
    padding-top: var(--s4, 16px); border-top: 1px solid var(--hairline, rgba(47, 93, 52, .14)); color: inherit;
    text-decoration: none; }
.th-rep-img { flex: none; width: 72px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 2px; background: #dfe9ef; }
.th-rep-t { font-size: 14px; line-height: 1.5; color: var(--navy, #2f5d34); display: -webkit-box; -webkit-line-clamp: 3;
    -webkit-box-orient: vertical; overflow: hidden; }
.th-rep:hover .th-rep-t { text-decoration: underline 1px; text-underline-offset: .2em; }
.th-links { display: flex; flex-direction: column; gap: var(--s2, 8px); margin: var(--s3, 12px) 0 0;
    text-align: left !important; }
.th-links a { font-size: 14px; color: var(--navy, #2f5d34); text-decoration: underline 1px;
    text-underline-offset: .22em; }
.th-links .th-book { font-weight: 500; }
@media (max-width: 960px) {
    .th-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
    .th-lead-grid { grid-template-columns: 1fr; gap: var(--s7, 48px); }
    .th-card--lead .th-photo { aspect-ratio: 4 / 3; }
    .th-grid { grid-template-columns: 1fr 1fr; gap: var(--s6, 32px) var(--s4, 16px); }
    .th-name { font-size: 19px; }
    .th-rep-img { width: 56px; }
    .th-card--lead .th-rep-img { width: 96px; }
    .th-rep-t { font-size: 13px; }
    .th-links a { font-size: 13px; }
}
