/* Classroom photo journal */
.teaching-gallery { padding: 44px 0 72px; border-top: 1px solid var(--border); margin-top: 32px; }
.teaching-intro { max-width: 740px; margin-bottom: 44px; }
.teaching-eyebrow { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin: 0 0 12px; }
.teaching-intro h2 { font-family: var(--display); font-size: clamp(1.8rem,3vw,2.5rem); font-weight: 600; letter-spacing: -.025em; margin: 0 0 16px; }
.teaching-intro > p:last-child { font-size: 1rem; line-height: 1.8; color: var(--muted); }
.teaching-year + .teaching-year { margin-top: 56px; }
.teaching-year-heading { display: flex; align-items: baseline; gap: 20px; flex-wrap: wrap; margin-bottom: 22px; }
.teaching-year-heading h3 { font-family: var(--display); font-size: 2rem; color: var(--accent); font-weight: 600; margin: 0; }
.teaching-year-heading p { margin: 0; font-size: .9rem; color: var(--muted); }
.teaching-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.teaching-photo { min-width: 0; margin: 0; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: var(--surface); }
.teaching-photo-open { position: relative; display: block; width: 100%; padding: 0; border: 0; background: var(--surface2); cursor: zoom-in; }
.teaching-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: contain; }
.teaching-photo-portrait img { aspect-ratio: 3/4; }
.teaching-photo-hint { position: absolute; right: 12px; bottom: 12px; background: rgba(15,23,42,.85); color: white; font: 12px/1.4 var(--body, sans-serif); padding: 6px 10px; border-radius: 20px; }
.teaching-photo-open:focus-visible { outline: 3px solid var(--accent); outline-offset: -4px; }
.teaching-photo figcaption { padding: 18px 20px; font-size: .94rem; line-height: 1.65; color: var(--text); }
#teaching-photo-dialog { width: min(1100px,94vw); max-width: 94vw; max-height: 94dvh; margin: auto; padding: 16px; background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 14px; overflow: auto; }
#teaching-photo-dialog::backdrop { background: rgba(6,12,24,.82); }
.teaching-dialog-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.teaching-dialog-bar h2 { font-size: 1rem; margin: 0; }
.teaching-dialog-close { padding: 8px 14px; border: 1px solid var(--border2); border-radius: 8px; color: var(--text); background: var(--surface2); cursor: pointer; font: inherit; }
#teaching-dialog-image { display: block; width: 100%; height: auto; max-height: 70dvh; object-fit: contain; }
#teaching-dialog-caption { line-height: 1.6; margin: 14px 0 0; }
@media(max-width:600px) {
 .teaching-grid { grid-template-columns: minmax(0,1fr); gap: 20px; }
 .teaching-year-heading { gap: 8px; flex-direction: column; }
 .teaching-gallery { padding-top: 30px; }
 .teaching-photo figcaption { padding: 15px 16px; }
}