:root{font-family:Arial,"Noto Sans KR",sans-serif;color:#252b2d;background:#fdfdfb;font-size:16px;line-height:1.7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #315a6b;outline-offset:4px}.site-header{height:76px;position:fixed;inset:0 0 auto;z-index:10;background:rgba(253,253,251,.96);backdrop-filter:blur(12px);border-bottom:1px solid #dce1e1}.header-inner{max-width:1200px;height:100%;margin:auto;padding:0 34px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-weight:700;white-space:nowrap}.brand-dot{color:#416a79}.site-header nav{display:flex;align-items:center;gap:30px;overflow-x:auto;white-space:nowrap;font-size:.92rem}.site-header nav a{color:#596268;padding:8px 0}.site-header nav a:hover,.site-header nav a[aria-current=page]{color:#1f3e4b}.site-header nav a[aria-current=page]{border-bottom:1px solid #1f3e4b}.page-wrap{max-width:1200px;min-height:calc(100vh - 76px);margin:0 auto;padding:76px 34px 90px}.eyebrow{font-size:.74rem;letter-spacing:.14em;font-weight:700;color:#416a79}.hero{padding:116px 0 108px;border-bottom:1px solid #dce1e1}.hero h1,.page-intro h1,.post h1{font-family:Georgia,"Noto Serif KR",serif;font-weight:500;letter-spacing:-.045em;line-height:1.16}.hero h1{font-size:clamp(3rem,6vw,5.5rem);margin:22px 0 28px}.lead{font-size:1.25rem;font-weight:600;color:#38505b;max-width:630px}.hero-links{display:flex;gap:26px;margin-top:45px;font-weight:700}.hero-links a,.text-link,.back-link{border-bottom:1px solid #496e7d;padding-bottom:3px}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-top:54px}.feature,.project-card{border-top:2px solid #334f5a;padding:24px 0 60px;position:relative}.feature h2,.project-card h2,.split-content h2{font-family:Georgia,"Noto Serif KR",serif;font-size:2rem;font-weight:500;line-height:1.25}.feature p,.project-card p,.page-intro p,.split-content p{color:#596268}.feature-arrow{position:absolute;right:0;top:25px;font-size:1.4rem}.page-intro{padding:110px 0 66px;border-bottom:1px solid #dce1e1}.page-intro h1{font-size:clamp(3.5rem,7vw,6rem);margin:18px 0 18px}.page-intro p{font-size:1.15rem;margin:0}.project-card{max-width:700px;margin-top:60px}.project-card .text-link{display:inline-block;margin-top:22px}.post-list{margin-top:25px}.post-row{display:grid;grid-template-columns:160px 1fr 24px;gap:24px;align-items:center;border-bottom:1px solid #dce1e1;padding:27px 0}.post-row:hover .post-title{text-decoration:underline}.post-date{color:#718086;font-size:.87rem}.post-title{font-family:Georgia,"Noto Serif KR",serif;font-size:1.5rem}.split-content{display:grid;grid-template-columns:1fr 1.5fr;gap:70px;padding-top:54px}.split-content h2{margin:0}.split-content p:first-child{margin-top:0}.contact-list{padding-top:35px}.contact-list a{display:flex;justify-content:space-between;gap:20px;padding:23px 0;border-bottom:1px solid #dce1e1}.contact-list a:hover{color:#315a6b}.post{max-width:800px;padding-top:78px}.back-link{display:inline-block;margin-bottom:70px}.post h1{font-size:clamp(2.8rem,5vw,4.7rem);margin:16px 0 52px}.post-body{border-top:1px solid #dce1e1;padding-top:36px;font-size:1.1rem}.post-body h2{margin-top:2.2em}.post-body a{text-decoration:underline}.site-footer{max-width:1200px;margin:auto;padding:30px 34px 45px;border-top:1px solid #dce1e1;display:flex;justify-content:space-between;color:#66757a;font-size:.88rem}@media(max-width:700px){.site-header{height:104px}.header-inner{padding:12px 20px;display:block}.brand{display:block;margin-bottom:4px}.site-header nav{gap:21px;font-size:.86rem}.page-wrap{padding:104px 20px 70px}.hero{padding:76px 0 72px}.hero h1{font-size:clamp(2.6rem,10vw,4.2rem)}.lead{font-size:1.05rem}.home-grid,.split-content{grid-template-columns:1fr;gap:15px}.page-intro{padding:70px 0 48px}.post-row{grid-template-columns:1fr 20px;gap:8px}.post-date{grid-column:1/-1}.post-title{font-size:1.25rem}.contact-list a{display:block}.contact-list a span{display:block}.site-footer{padding:25px 20px}.post{padding-top:55px}.back-link{margin-bottom:45px}}

.main {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.main-logo {
  width: 32px;
  height: 32px;
  object-fit: contain;
  flex-shrink: 0;
}

/* =========================================
   MAIN PAGE
========================================= */
/* Home - English subtitle */
.hero .lead {
  max-width: none;
  width: 100%;
  white-space: nowrap;
}

/* 작은 화면에서는 자연스럽게 줄바꿈 */
@media (max-width: 1050px) {
  .hero .lead {
    white-space: normal;
  }
}

/* Home - Navigation spacing */

.home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 28px;
}

/* Tablet */
@media (max-width: 1000px) {
  .home-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile */
@media (max-width: 700px) {
  .home-grid {
    grid-template-columns: 1fr;
  }
}

.home-grid .feature {
  min-height: 0;
  height: auto;
  padding-bottom: 24px;
}


/* =========================================
   RESEARCH PAGE
========================================= */

/* Research Interests */

.research-intro {
  margin: 0 0 35px;
  color: #718086;
  font-size: 16px;
  line-height: 1.8;
}

.research-interests {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.research-interest {
  min-width: 0;
  padding: 28px 4px 15px;
  border-top: 2px solid #294b5b;
}

.research-interest-icon {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 24px;
  color: #294b5b;
}

.research-interest h3 {
  margin: 0 0 15px;
  color: #263f4b;
  font-family: Georgia, serif;
  font-size: 23px;
  font-weight: 400;
  line-height: 1.4;
}

.research-interest p {
  margin: 0;
  color: #718086;
  font-size: 14px;
  line-height: 1.8;
}


/* =========================================
   RESEARCH PROJECTS
========================================= */

/* Research Projects */

.research-projects {
  margin-top: 4px;
}

.research-project {
  padding: 22px 0 24px;
  border-bottom: 1px solid #e1e6e5;
}

.research-project:first-child {
  padding-top: 18px;
}

.research-project:last-child {
  border-bottom: 1px solid #e1e6e5;
}

.research-project-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.research-project-number {
  color: #8a97a0;
  font-size: 12px;
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.research-project h3 {
  margin: 0 0 12px;
  color: #111111;
  font-family: inherit;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.45;
}

.research-project p {
  margin: 0 0 14px;
  color: #6d7680;
  font-size: 15px;
  line-height: 1.8;
}

/* =========================================
   RESEARCH OUTPUTS
========================================= */

.research-output {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 25px 0;

  border-bottom: 1px solid #e1e6e5;

  color: #263f4b;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;

  transition: color 0.2s ease;
}

.research-output:first-child {
  padding-top: 5px;
}

.research-output:last-child {
  border-bottom: none;
}

.research-output:hover {
  color: #527d7b;
}

.research-output-arrow {
  color: #849092;
  font-size: 22px;
  font-weight: 400;
  transition: transform 0.2s ease;
}

.research-output:hover .research-output-arrow {
  transform: translate(3px, -3px);
}

/* Keyboard navigation */

.research-project-link:focus-visible,
.research-output:focus-visible {
  outline: 2px solid #416a79;
  outline-offset: 4px;
}


/* =========================================
   RESPONSIVE
========================================= */

/* Tablet */

@media (max-width: 980px) {

  .research-interests {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }

}

/* Mobile */

@media (max-width: 640px) {

  .research-intro {
    font-size: 14px;
    margin-bottom: 28px;
  }

  .research-interests {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .research-interest {
    padding: 22px 4px 10px;
  }

  .research-interest h3 {
    font-size: 22px;
  }

  .research-project h3 {
    font-size: 21px;
  }

  .research-project p {
    font-size: 14px;
  }

  .research-output {
    font-size: 14px;
  }

}

@media (prefers-reduced-motion: reduce) {

  .research-project-link,
  .research-output,
  .research-output-arrow {
    transition: none;
  }

}

/* Research - 기존 페이지 배지 재사용 시 간격 보정 */

.research-project-top .cv-status {
  margin-bottom: 0;
}

.research-project .journal-badges {
  margin-bottom: 0;
}

/* Research Projects의 Completed 배지만 변경 */
.research-project .research-project-top .cv-status.completed {
  color: #2555a4;
  background: #e6f0ff;
}


/* =========================================
   JOURNAL PAGE
========================================= */

.journal-page {
  max-width: 1100px;
  margin: 0 auto;
  padding-top: 45px;
}

/* Publication Statistics */

.journal-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 45px;
}

.journal-stat {
  padding: 25px;
  background: #f3f6f6;
  border: 1px solid #e1e7e7;
  border-radius: 8px;
}

.journal-stat strong {
  display: block;
  font-size: 32px;
  color: #294b5b;
  line-height: 1.3;
}

.journal-stat span {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  color: #66757a;
}

/* Search */

.journal-search {
  margin-bottom: 65px;
}

.journal-search input {
  width: 100%;
  padding: 16px 20px;
  border: 1px solid #dce1e1;
  border-radius: 8px;
  background: #fff;
  font-family: inherit;
  font-size: 15px;
  color: #252b2d;
  outline: none;
}

.journal-search input:focus {
  border-color: #416a79;
}

/* Journal Section */

.journal-section {
  margin-bottom: 75px;
}

.journal-section-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  padding-bottom: 18px;
  margin-bottom: 35px;
  border-bottom: 1px solid #bfcaca;
}

.journal-section-header h2 {
  font-family: Georgia, serif;
  font-size: 28px;
  font-weight: 500;
  margin: 0;
}

.journal-section-header > span {
  font-size: 13px;
  color: #718086;
}

.journal-year {
  font-family: Georgia, serif;
  font-size: 23px;
  font-weight: 500;
  color: #416a79;
  margin: 0 0 25px;
}

/* Publication List */

.journal-paper {
  padding: 28px 0;
  border-bottom: 1px solid #e1e6e5;
}

.journal-paper:first-of-type {
  padding-top: 0;
}

.journal-paper:last-child {
  border-bottom: none;
}

.journal-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.journal-badges span {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #416a79;
  background: #eaf0f0;
  border-radius: 4px;
  padding: 4px 9px;
}

.journal-badges .highlight.yellow {
  color: #8a6500;
  background: #fff4cc;
}

.journal-badges .highlight.blue {
  color: #2555a4;
  background: #e6f0ff;
}

.journal-paper h4 {
  font-family: Georgia, serif;
  font-size: 21px;
  font-weight: 500;
  line-height: 1.5;
  color: #263f4b;
  margin: 0 0 16px;
}

.journal-authors {
  font-size: 14px;
  line-height: 1.8;
  color: #66757a;
  margin: 0 0 8px;
}

.journal-authors strong {
  color: #294b5b;
  font-weight: 700;
}

.journal-name {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 14px;
  color: #416a79;
  margin: 0;
}

.journal-empty {
  color: #718086;
  font-size: 14px;
}

#journal-no-results {
  text-align: center;
  color: #718086;
  padding: 30px 0;
}

[hidden] {
  display: none !important;
}

/* Mobile */

@media (max-width: 700px) {
  .journal-page {
    padding-top: 35px;
  }

  .journal-stats {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .journal-stat {
    padding: 20px;
  }

  .journal-search {
    margin-bottom: 45px;
  }

  .journal-section-header h2 {
    font-size: 22px;
  }

  .journal-paper h4 {
    font-size: 19px;
  }
}

/* Clickable publication statistics */

.journal-stat-link {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.journal-stat-link:hover {
  border-color: #416a79;
  background: #eaf0f2;
  transform: translateY(-3px);
}

/* Smooth section navigation */

html {
  scroll-behavior: smooth;
}

#international,
#domestic {
  scroll-margin-top: 110px;
}

/* Search box animation */

#journal-search {
  transition: 
    transform 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

#journal-search:hover {
  transform: translateY(-3px);
  background-color: #eaf0f2;
  border-color: #416a79;
  box-shadow: 0 4px 12px rgba(41, 75, 91, 0.08);
}

#journal-search:focus {
  transform: translateY(-3px);
  background-color: #ffffff;
  border-color: #416a79;
  outline: none;
  box-shadow: 0 4px 12px rgba(41, 75, 91, 0.08);
}

/* 논문 사이에는 구분선 없음 */
.journal-paper {
  padding: 28px 0;
  border-bottom: none;
}

/* 연도와 연도 사이에만 구분선 추가 */
.journal-year-group + .journal-year-group {
  border-top: 1px solid #e1e6e5;
  padding-top: 20px;
  margin-top: 20px;
}


/* =========================================
   ABOUT PAGE - ACADEMIC CV
========================================= */

/* Content alignment */

.cv-page.journal-page {
  padding-top: 0;
}

/* Name */

.cv-name {
  margin-bottom: 45px;
}

.cv-name h2 {
  margin: 0;
  font-family: Georgia, serif;
  font-size: 2.5rem;
  font-weight: 400;
  color: #263f4b;
}


/* =========================================
   EDUCATION
========================================= */

.cv-timeline {
  padding-top: 30px;
}

.cv-education {
  display: grid;
  grid-template-columns: 145px minmax(0, 1fr);
  gap: 35px;
}

/* Date */

.cv-date {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-top: 3px;
  font-size: 14px;
}

.cv-date strong {
  color: #294b5b;
  font-weight: 600;
}

.cv-date span {
  color: #849092;
}

/* Timeline */

.cv-education-content {
  position: relative;
  min-width: 0;
  padding: 0 0 45px 30px;
  border-left: none;
}

/* 기본 동그라미: 회색 */
.cv-education-content::before {
  content: "";
  position: absolute;
  top: 11px;
  left: 0px;
  transform: translateX(-50%);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #9aa5ae;
}

/* 첫 번째 학력(진행 중): 초록색 */
.cv-education:first-child .cv-education-content::before {
  background: #27834e;
}

.cv-education:last-child .cv-education-content {
  padding-bottom: 0;
}

/* Timeline - 기본 세로선 */
.cv-education-content::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 2px;
  transform: translateX(-50%);
  background: #d4dfe0;
}

/* 석사: 초록색 → 회색 그라데이션 */
.cv-education:first-child .cv-education-content::after {
  background: linear-gradient(
    to bottom,
    #27834e 0%,
    #83ad95 45%,
    #d4dfe0 100%
  );
}

/* 동그라미를 세로선 위에 표시 */
.cv-education-content::before {
  z-index: 1;
}

/* Status */

.cv-status {
  display: inline-block;
  margin-bottom: 15px;
  padding: 5px 11px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 600;
}

.cv-status.current {
  color: #166534;
  background: #ddf5e5;
}

.cv-status.completed {
  color: #596b75;
  background: #edf1f3;
}


/* University */

.cv-education-content h3 {
  margin: 0 0 8px;
  font-family: Georgia, serif;
  font-size: 26px;
  font-weight: 400;
  color: #263f4b;
}

.cv-location {
  margin: 0 0 22px;
  color: #849092;
  font-size: 13px;
}

.cv-degree {
  margin: 0 0 12px;
  color: #294b5b;
  font-size: 15px;
  font-weight: 600;
}

.cv-detail {
  margin: 0 0 8px;
  color: #68777d;
  font-size: 14px;
  line-height: 1.7;
}


/* GPA */

.cv-gpa {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
}

.cv-gpa > span {
  color: #849092;
  font-size: 12px;
  font-weight: 600;
}

.cv-gpa strong {
  padding: 6px 12px;
  border-radius: 5px;
  color: #294b5b;
  background: #eaf0f2;
  font-size: 13px;
}


/* =========================================
   HONORS & AWARDS
========================================= */

.cv-award {
  display: grid;
  grid-template-columns: 145px minmax(0, 1fr);
  gap: 35px;
  padding: 25px 0;
  border-bottom: 1px solid #e1e6e5;
}

.cv-award:last-child {
  border-bottom: none;
}

.cv-award-year {
  color: #527d7b;
  font-size: 15px;
  font-weight: 600;
}

.cv-award-content h3 {
  margin: 0 0 8px;
  color: #263f4b;
  font-size: 16px;
  font-weight: 600;
}

.cv-award-content p {
  margin: 0;
  color: #849092;
  font-size: 13px;
  line-height: 1.6;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 700px) {

  .cv-name {
    margin-bottom: 35px;
  }

  .cv-name h2 {
    font-size: 2rem;
  }

  .cv-education {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .cv-date {
    flex-direction: row;
    gap: 8px;
  }

  .cv-education-content {
    margin-left: 4px;
    padding-left: 25px;
    padding-bottom: 35px;
  }

  .cv-education-content h3 {
    font-size: 23px;
  }

  .cv-award {
    grid-template-columns: 65px minmax(0, 1fr);
    gap: 18px;
  }

}

/* =========================================
   ABOUT - PROFILE
========================================= */

.cv-profile {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-top: 45px;
  margin-bottom: 65px;
}

.cv-profile-image {
  width: 110px;
  height: 110px;
  object-fit: contain;
  border-radius: 12px;
  background: #eaf0f2;
  flex-shrink: 0;
}

.cv-profile-info h2 {
  margin: 0 0 10px;
  font-family: Georgia, serif;
  font-size: 2.5rem;
  font-weight: 400;
  color: #263f4b;
}

.cv-profile-info p {
  margin: 0;
  font-size: 15px;
  color: #718086;
}

/* Mobile */

@media (max-width: 700px) {
  .cv-profile {
    gap: 18px;
    margin-bottom: 45px;
  }

  .cv-profile-image {
    width: 80px;
    height: 80px;
  }

  .cv-profile-info h2 {
    font-size: 1.8rem;
  }

  .cv-profile-info p {
    font-size: 13px;
  }
}


/* =========================================
   CONTACT PAGE
========================================= */

/* Email */

.contact-item {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 24px;
  padding: 30px 0;
  color: inherit;
  text-decoration: none;
}

.contact-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 14px;
  background: #eaf0f2;
  color: #294b5b;
  font-size: 26px;
  flex-shrink: 0;
}

.contact-details {
  min-width: 0;
}

.contact-label {
  display: block;
  margin-bottom: 8px;
  color: #849092;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.2px;
}

.contact-details strong {
  display: block;
  color: #263f4b;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.contact-details p {
  margin: 6px 0 0;
  color: #718086;
  font-size: 14px;
  line-height: 1.6;
}

.contact-arrow {
  color: #849092;
  font-size: 19px;
  transition: transform 0.2s ease;
}

.contact-item:hover .contact-arrow {
  transform: translate(3px, -3px);
}

/* Academic Profiles */

.contact-profiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.contact-profile {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 28px;
  border: 1px solid #dce4e6;
  border-radius: 10px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background-color 0.2s ease;
}

.contact-profile:hover {
  transform: translateY(-3px);
  border-color: #416a79;
  background: #f6f9f9;
}

.contact-profile-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 9px;
  background: #eaf0f2;
  color: #294b5b;
  font-size: 12px;
  font-weight: 700;
}

.contact-profile strong {
  grid-column: 1 / -1;
  margin-top: 15px;
  color: #263f4b;
  font-size: 16px;
}

.contact-profile > span:last-child {
  grid-column: 1 / -1;
  color: #849092;
  font-size: 13px;
}

/* Mobile */

@media (max-width: 700px) {
  .contact-item {
    grid-template-columns: 56px minmax(0, 1fr) 16px;
    gap: 14px;
    padding: 24px 0;
  }

  .contact-icon {
    width: 50px;
    height: 50px;
    font-size: 22px;
  }
}

/* Contact Information - Unified Alignment */

.contact-list > .contact-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 24px;
  width: 100%;
  box-sizing: border-box;
  border: none;
}

.contact-list > .contact-item > .contact-icon {
  flex: 0 0 60px;
}

.contact-list > .contact-item > .contact-details {
  flex: 1;
  min-width: 0;
  margin: 0;
  text-align: left;
}

.contact-list > .contact-item > .contact-arrow {
  margin-left: auto;
  flex-shrink: 0;
}

/* Mobile */
@media (max-width: 700px) {
  .contact-list > .contact-item {
    gap: 14px;
  }

  .contact-list > .contact-item > .contact-icon {
    flex-basis: 50px;
  }
}

.contact-profile-icon img {
  display: block;
  width: 20px;
  height: 20px;
  object-fit: contain;
}

/* Contact Information - 상단 간격 조절 */

.contact-page .journal-section:first-child
.journal-section-header {
  margin-bottom: 18px;
}

.contact-page .contact-list > .contact-item:first-child {
  padding-top: 8px;
}