/* 청랑이들: 기수와 부서의 기록, 그리고 한 사람씩 이어지는 인물 소개. */
.people-page, .person-page { background: #e8eff4; color: #1b2d49; }
.people-page .site-header, .person-page .site-header { position: fixed; }
.people-page .primary-nav a[aria-current="page"], .person-page .primary-nav a[aria-current="page"] { color: #c8d9eb; }

.people-cover { position: relative; min-height: 550px; overflow: hidden; background: #14294f; color: #f6f4ee; }
.people-cover::before { position: absolute; inset: 0; background: linear-gradient(90deg, #14294f 0%, rgba(20,41,79,.92) 42%, rgba(20,41,79,.55)), url('/graphics/academy-night-2026.webp') right 47% / cover no-repeat; opacity: .88; content: ''; pointer-events: none; }
.people-cover-inner { position: relative; padding-top: 153px; padding-bottom: 86px; }
.people-cover .eyebrow { color: #bdcfe1; }
.people-cover h1 { max-width: 1020px; margin: 27px 0 21px; font-family: 'Maru Buri', serif; font-size: clamp(53px, 5.4vw, 76px); font-weight: 600; letter-spacing: -.045em; line-height: 1.28; word-break: keep-all; }
.people-cover h1 em { color: #cadbef; font-style: normal; }
.people-cover-inner > p:last-child { margin: 0; color: #d4e1ee; font-size: 16px; line-height: 1.75; word-break: keep-all; }

.people-directory { padding: 87px 0 117px; }
.people-directory-heading { display: flex; justify-content: space-between; align-items: end; gap: 28px; margin-bottom: 31px; padding-bottom: 24px; border-bottom: 1px solid #a7bacc; }
.people-directory-heading .eyebrow { color: #527295; }
.people-directory-heading h2 { margin: 13px 0 0; color: #183456; font-family: 'Maru Buri', serif; font-size: clamp(38px, 3.6vw, 51px); font-weight: 600; letter-spacing: -.045em; }
.people-directory-heading > p { max-width: 330px; margin: 0 0 5px; color: #52677e; font-size: 15px; line-height: 1.7; word-break: keep-all; }
.person-feature { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); min-height: 540px; overflow: hidden; border: 1px solid #a2b9cb; border-radius: 3px 46px 3px 27px; background: #dce8f1; }
.person-feature-photo { display: block; min-height: 540px; overflow: hidden; background: #aec1ce; }
.person-feature-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 36%; transition: transform .4s ease; }
.person-feature:hover .person-feature-photo img { transform: scale(1.025); }
.person-feature-content { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(32px, 5vw, 75px); }
.person-feature-index { color: #527295; font-size: 13px; font-weight: 700; }
.person-feature-content strong { margin-top: 48px; color: #173459; font-family: 'Maru Buri', serif; font-size: clamp(60px, 6.4vw, 94px); font-weight: 600; letter-spacing: -.045em; line-height: 1.18; }
.person-feature-role { margin-top: 10px; color: #3d628a; font-size: 17px; font-weight: 600; }
.person-feature-action { display: inline-flex; align-items: center; gap: 55px; min-height: 47px; margin-top: auto; padding-top: 10px; border-bottom: 1px solid #789ab8; color: #234d77; font-size: 15px; font-weight: 700; }
.person-feature-action b { font-size: 18px; font-weight: 400; }
.person-feature:focus-visible { outline: 3px solid #b68542; outline-offset: 4px; }

.person-portrait { padding: 125px 0 94px; background: #e8eff4; }
.person-portrait-top { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 32px; padding-bottom: 20px; border-bottom: 1px solid #a9bfce; }
.person-portrait-top > span { color: #6081a0; font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.person-portrait-layout { display: grid; grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); align-items: stretch; gap: clamp(34px, 6vw, 90px); }
.person-portrait-copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding-top: clamp(55px, 8vw, 116px); }
.person-back { display: inline-flex; min-height: 44px; align-items: center; padding-bottom: 4px; border-bottom: 1px solid #8ca7be; color: #315b84; font-size: 13px; font-weight: 700; }
.person-back:hover { color: #173b64; }
.person-portrait-copy .eyebrow { margin: 0; color: #527295; }
.person-portrait h1 { margin: 23px 0 12px; color: #142f54; font-family: 'Maru Buri', serif; font-size: clamp(73px, 8vw, 119px); font-weight: 600; letter-spacing: -.045em; line-height: 1.18; white-space: nowrap; }
.person-position { margin: 0; color: #39648e; font-size: clamp(23px, 2.3vw, 31px); font-weight: 600; letter-spacing: -.04em; }
.person-position::after { display: block; width: 56px; height: 2px; margin-top: 27px; background: #5b7fa0; content: ''; }
.person-intro { max-width: 320px; margin: 26px 0 0; color: #4e637c; font-size: 16px; line-height: 1.85; word-break: keep-all; }
.person-one-line { width: min(100%, 350px); margin-top: 35px; padding-top: 19px; border-top: 1px solid #a8c0d0; }
.person-one-line span { color: #6a86a0; font-size: 12px; font-weight: 700; }
.person-one-line blockquote { margin: 10px 0 0; color: #193d64; font-family: 'Maru Buri', serif; font-size: clamp(22px, 2.1vw, 29px); font-weight: 600; letter-spacing: -.045em; line-height: 1.55; }
.person-copy-mark { margin-top: auto; padding-top: 80px; color: #a2bbcd; font-family: 'Maru Buri', serif; font-size: 27px; letter-spacing: .16em; }
.person-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 69px 0 0; border-top: 1px solid #8ba9c0; border-bottom: 1px solid #b9cbd7; }
.person-facts div { display: flex; flex-direction: column; gap: 13px; min-width: 0; padding: 23px 24px 26px; }
.person-facts div:first-child { padding-left: 0; }
.person-facts div + div { border-left: 1px solid #b9cbd7; }
.person-facts dt { color: #65819d; font-size: 13px; }
.person-facts dd { margin: 0; color: #23456c; font-family: 'Maru Buri', serif; font-size: clamp(18px, 2vw, 24px); font-weight: 600; letter-spacing: -.04em; }
.person-portrait-image { min-width: 0; margin: 0 12px 12px 0; overflow: hidden; border-radius: 2px 43px 2px 2px; background: #183b64; box-shadow: 12px 12px 0 #c9dbe7; }
.person-portrait-image img { display: block; width: 100%; height: clamp(500px, 48vw, 670px); object-fit: cover; object-position: center 32%; background: #b9cbd6; }
.person-portrait-image figcaption { display: flex; justify-content: space-between; gap: 15px; padding: 15px 19px; color: #e0eaf2; font-size: 12px; font-weight: 600; }
.person-portrait-image figcaption span:last-child { color: #b3c9dc; }

.person-more { padding: 80px 0 100px; border-top: 1px solid #c0cdd8; background: #f3f5f4; }
.person-more-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 7vw, 100px); }
.person-more .eyebrow { color: #527295; }
.person-more h2 { margin: 22px 0 0; color: #193658; font-family: 'Maru Buri', serif; font-size: clamp(34px, 3.7vw, 51px); font-weight: 600; letter-spacing: -.045em; line-height: 1.42; }
.person-more-links { border-top: 1px solid #a9bbc9; }
.person-more-links a { display: grid; grid-template-columns: 33px minmax(0, 1fr) 23px; align-items: center; gap: 12px; min-height: 74px; border-bottom: 1px solid #a9bbc9; color: #254b71; }
.person-more-links a span { color: #7690a6; font-size: 12px; }
.person-more-links a strong { font-family: 'Maru Buri', serif; font-size: 22px; font-weight: 600; }
.person-more-links a b { font-size: 19px; font-weight: 400; }
.person-more-links a:hover { color: #4b7198; }
.person-more-links a:focus-visible, .person-back:focus-visible { outline: 3px solid #b68542; outline-offset: 3px; }

@media (max-width: 900px) {
  .person-portrait-layout { gap: 34px; }
  .person-portrait h1 { font-size: clamp(66px, 8vw, 85px); }
  .person-portrait-copy { padding-top: 45px; }
  .person-copy-mark { padding-top: 45px; }
}

@media (max-width: 680px) {
  .people-cover { min-height: 0; }
  .people-cover-inner { padding-top: 129px; padding-bottom: 72px; }
  .people-cover h1 { margin: 22px 0 18px; font-size: clamp(35px, 9.5vw, 56px); line-height: 1.4; }
  .people-cover-inner > p:last-child { max-width: 310px; font-size: 14px; }
  .people-directory { padding: 62px 0 82px; }
  .people-directory-heading { display: block; margin-bottom: 22px; }
  .people-directory-heading h2 { font-size: 39px; }
  .people-directory-heading > p { margin-top: 12px; font-size: 14px; }
  .person-feature { display: block; min-height: 0; border-radius: 3px 34px 3px 24px; }
  .person-feature-photo { min-height: 0; aspect-ratio: 4 / 4.3; }
  .person-feature-content { min-height: 266px; padding: 27px 26px 30px; }
  .person-feature-content strong { margin-top: 17px; font-size: 62px; }
  .person-feature-role { margin-top: 0; font-size: 15px; }
  .person-feature-action { gap: 27px; margin-top: auto; font-size: 14px; }
  .person-portrait { padding: 106px 0 70px; }
  .person-portrait-top { margin-bottom: 28px; padding-bottom: 12px; }
  .person-portrait-top > span { font-size: 10px; }
  .person-portrait-layout { display: flex; flex-direction: column; align-items: stretch; gap: 31px; }
  .person-portrait-copy { padding-top: 0; }
  .person-portrait h1 { margin-top: 16px; font-size: clamp(64px, 17vw, 84px); }
  .person-position { font-size: 22px; }
  .person-position::after { margin-top: 20px; }
  .person-intro { margin: 18px 0 0; font-size: 15px; }
  .person-one-line { margin-top: 25px; padding-top: 16px; }
  .person-one-line blockquote { font-size: 23px; }
  .person-copy-mark { display: none; }
  .person-portrait-image img { height: auto; aspect-ratio: 4 / 4.5; }
  .person-portrait-image figcaption { padding: 13px 14px; font-size: 11px; }
  .person-facts { margin-top: 48px; }
  .person-facts div { padding: 19px 11px 21px; }
  .person-facts dd { font-size: 15px; word-break: keep-all; }
  .person-more { padding: 62px 0 75px; }
  .person-more-layout { display: block; }
  .person-more h2 { margin: 15px 0 33px; font-size: 36px; }
}

/* 기수 선택 */
.cohort-index { padding: 82px 0 114px; }
.cohort-index-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 0 28px; padding-bottom: 27px; border-bottom: 1px solid #a7bacc; }
.cohort-index-heading .eyebrow { grid-column: 1 / -1; color: #527295; }
.cohort-index-heading h2 { margin: 16px 0 0; color: #183456; font-family: 'Maru Buri', serif; font-size: clamp(39px, 3.8vw, 54px); font-weight: 600; letter-spacing: -.045em; }
.cohort-index-heading > p:last-child { max-width: 300px; margin: 0 0 7px; color: #52677e; font-size: 15px; line-height: 1.7; word-break: keep-all; }
.cohort-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: 30px; }
.cohort-card { display: flex; flex-direction: column; align-items: flex-start; min-height: 340px; padding: clamp(29px, 3.5vw, 50px); border: 1px solid #adc3d3; border-radius: 2px 48px 2px 28px; background: #dce8f1; color: #18375b; transition: background .22s ease, transform .22s ease; }
.cohort-card:nth-child(2) { border-radius: 2px 28px 2px 48px; background: #cfdfeb; }
.cohort-card:hover { transform: translateY(-4px); background: #e4eef5; }
.cohort-card:focus-visible { outline: 3px solid #b68542; outline-offset: 4px; }
.cohort-card-top { color: #527295; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.cohort-card strong { margin-top: 29px; font-family: 'Maru Buri', serif; font-size: clamp(76px, 8vw, 112px); font-weight: 600; letter-spacing: -.045em; line-height: 1.1; }
.cohort-card-departments { margin-top: 17px; color: #496985; font-size: 14px; line-height: 1.6; word-break: keep-all; }
.cohort-card-action { display: flex; justify-content: space-between; align-items: center; gap: 34px; width: 100%; margin-top: auto; padding-top: 23px; border-top: 1px solid #9db8cd; color: #23547f; font-size: 15px; font-weight: 700; }
.cohort-card-action b { font-size: 19px; font-weight: 400; }

/* 각 기수의 부서 기록 */
.cohort-cover { position: relative; overflow: hidden; background: #14294f; color: #f6f4ee; }
.cohort-cover::before { position: absolute; inset: 0; background: linear-gradient(90deg, #14294f 0%, rgba(20,41,79,.94) 48%, rgba(20,41,79,.64)), url('/graphics/academy-night-2026.webp') right 48% / cover no-repeat; opacity: .88; content: ''; pointer-events: none; }
.cohort-cover-next::before { background-position: center, right 65%; }
.cohort-cover-inner { position: relative; padding-top: 124px; padding-bottom: 68px; }
.cohort-cover-links { display: flex; justify-content: space-between; gap: 24px; padding-bottom: 16px; border-bottom: 1px solid rgba(205,223,237,.34); }
.cohort-cover-links a { color: #cfdeeb; font-size: 13px; font-weight: 600; }
.cohort-cover-links a:hover { color: #fff; }
.cohort-cover .eyebrow { margin-top: 57px; color: #bed2e3; }
.cohort-cover h1 { margin: 16px 0 12px; font-family: 'Maru Buri', serif; font-size: clamp(70px, 8.5vw, 116px); font-weight: 600; letter-spacing: -.045em; line-height: 1.23; }
.cohort-cover h1 em { color: #c8dbee; font-style: normal; }
.cohort-cover-inner > p:last-child { max-width: 600px; margin: 0; color: #d6e3ed; font-size: 16px; line-height: 1.75; word-break: keep-all; }
.department-nav { display: grid; grid-template-columns: 1.1fr repeat(3, minmax(0, 1fr)); align-items: center; min-height: 94px; border-bottom: 1px solid #9eb7c9; }
.department-nav > span { color: #5f7993; font-size: 13px; font-weight: 700; }
.department-nav a { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 45px; padding: 0 16px; border-left: 1px solid #bad0dc; color: #254f78; font-size: 15px; font-weight: 700; }
.department-nav a:hover { color: #527da2; }
.department-nav a b { font-size: 18px; font-weight: 400; }
.department-nav a:focus-visible, .department-note a:focus-visible, .department-official:focus-visible, .cohort-cover-links a:focus-visible { outline: 3px solid #b68542; outline-offset: 3px; }
.cohort-departments { padding-bottom: 98px; }
.cohort-roster-note { margin: 29px 0 0; color: #58738c; font-size: 14px; line-height: 1.7; }
.department-section { scroll-margin-top: 104px; padding: 78px 0 82px; border-bottom: 1px solid #a9bfce; }
.department-heading { display: flex; align-items: flex-start; gap: clamp(24px, 3vw, 45px); }
.department-number { min-width: 58px; padding-top: 13px; border-top: 2px solid #315d87; color: #4e7698; font-family: 'Pretendard Variable', sans-serif; font-size: 16px; font-weight: 700; }
.department-heading p { margin: 0 0 7px; color: #64809a; font-size: 13px; font-weight: 700; }
.department-heading h2 { margin: 0; color: #18375b; font-family: 'Maru Buri', serif; font-size: clamp(43px, 4.5vw, 62px); font-weight: 600; letter-spacing: -.045em; line-height: 1.35; }
.department-description { max-width: 580px; margin: 18px 0 35px 103px; color: #4e667e; font-size: 17px; line-height: 1.8; word-break: keep-all; }
.cohort-page .person-feature { max-width: 970px; margin-left: 103px; }
.department-official { display: inline-flex; align-items: center; gap: 10px; margin: 25px 0 0 103px; padding-bottom: 6px; border-bottom: 1px solid #87a8c0; color: #315d85; font-size: 14px; font-weight: 700; }
.department-note { display: flex; justify-content: space-between; align-items: center; gap: 22px; min-height: 108px; margin-left: 103px; padding: 18px 0; border-top: 1px solid #acc1d0; border-bottom: 1px solid #c3d1db; }
.department-note > span { color: #6a849b; font-size: 12px; font-weight: 700; }
.department-note p { margin: 0; color: #315473; font-family: 'Maru Buri', serif; font-size: 20px; font-weight: 600; }
.department-note a { color: #315d85; font-size: 13px; font-weight: 700; }
.cohort-official-note { margin: 36px 0 0; color: #526d84; font-size: 14px; line-height: 1.75; }
.cohort-official-note a { color: #244f78; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }

@media (min-width: 681px) {
  .cohort-page .person-feature { min-height: 420px; }
  .cohort-page .person-feature-photo { min-height: 420px; }
  .cohort-page .person-feature-content { padding: clamp(35px, 4vw, 56px); }
  .cohort-page .person-feature-content strong { margin-top: 27px; font-size: clamp(66px, 6vw, 83px); }
}

@media (max-width: 680px) {
  .cohort-index { padding: 64px 0 82px; }
  .cohort-index-heading { display: block; }
  .cohort-index-heading h2 { font-size: 39px; }
  .cohort-index-heading > p:last-child { margin: 12px 0 0; font-size: 14px; }
  .cohort-cards { grid-template-columns: 1fr; gap: 15px; margin-top: 21px; }
  .cohort-card { min-height: 272px; padding: 28px; border-radius: 2px 34px 2px 23px; }
  .cohort-card:nth-child(2) { border-radius: 2px 23px 2px 34px; }
  .cohort-card strong { margin-top: 16px; font-size: 79px; }
  .cohort-card-departments { margin-top: 7px; font-size: 13px; }
  .cohort-card-action { padding-top: 16px; font-size: 14px; }
  .cohort-cover-inner { padding-top: 102px; padding-bottom: 54px; }
  .cohort-cover-links a { font-size: 12px; }
  .cohort-cover .eyebrow { margin-top: 48px; }
  .cohort-cover h1 { font-size: clamp(63px, 17vw, 88px); }
  .cohort-cover-inner > p:last-child { font-size: 14px; }
  .department-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); min-height: 105px; padding: 16px 0; }
  .department-nav > span { grid-column: 1 / -1; margin-bottom: 8px; font-size: 12px; }
  .department-nav a { min-height: 37px; padding: 0 9px; border-left: 0; border-right: 1px solid #bad0dc; font-size: 12px; white-space: nowrap; }
  .department-nav a:first-of-type { padding-left: 0; }
  .department-nav a:last-child { padding-right: 0; border-right: 0; }
  .department-nav a b { font-size: 14px; }
  .cohort-departments { padding-bottom: 72px; }
  .cohort-roster-note { font-size: 13px; }
  .department-section { scroll-margin-top: 74px; padding: 56px 0 62px; }
  .department-heading { gap: 17px; }
  .department-number { min-width: 37px; padding-top: 10px; font-size: 13px; }
  .department-heading h2 { font-size: clamp(38px, 11vw, 49px); }
  .department-description { margin: 16px 0 28px 54px; font-size: 14px; }
  .cohort-page .person-feature { margin-left: 0; }
  .department-official { margin-left: 0; font-size: 13px; }
  .department-note { display: block; min-height: 0; margin-left: 0; padding: 19px 0; }
  .department-note p { margin: 6px 0 10px; font-size: 18px; }
  .department-note a { display: inline-block; }
  .cohort-official-note { margin-top: 27px; font-size: 13px; }
}
