:root {
      --sidebar-width: 320px;
      --sidebar-bg: #172235;
      --sidebar-text: #dce4ef;
      --sidebar-muted: #9eabc0;
      --accent: #5fa8d3;
      --main-bg: #f6f7f9;
      --card-bg: #ffffff;
      --text: #202936;
      --muted: #657184;
      --border: #dfe4ea;
      --max-content-width: 1100px;
    }

    * {
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      margin: 0;
      background: var(--main-bg);
      color: var(--text);
      font-family:
        Inter, Pretendard, "Noto Sans KR", Arial, sans-serif;
      line-height: 1.65;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    img {
      max-width: 100%;
      display: block;
    }

    .site-layout {
      display: grid;
      grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
      min-height: 100vh;
    }

    /* Sidebar */
    .sidebar {
      position: fixed;
      inset: 0 auto 0 0;
      width: var(--sidebar-width);
      height: 100vh;
      padding: 42px 28px;
      overflow-y: auto;
      background: var(--sidebar-bg);
      color: var(--sidebar-text);
    }

    .sidebar-brand {
      width: min(100%, 260px);
      margin: 0 auto;
    }

    .lab-logo-link {
      display: block;
      width: 100%;
      margin-bottom: 18px;
    }

    .lab-logo {
      width: 100%;
      height: auto;
      opacity: 0.96;
    }

    .lab-logo-divider {
      width: 100%;
      height: 2px;
      margin-bottom: 18px;
      border-radius: 999px;
      background: rgba(220, 228, 239, 0.5);
    }

    .lab-name {
      width: 100%;
      margin: 0;
      font-size: 1.55rem;
      line-height: 1.3;
      letter-spacing: -0.038em;
      word-break: keep-all;
    }

    .lab-name a {
      display: block;
      white-space: pre-line;
    }

    .lab-subtitle {
      margin: 10px 0 34px;
      color: var(--sidebar-muted);
      font-size: 0.9rem;
      letter-spacing: -0.01em;
    }

    .site-subtitle-separator {
      margin: 0 0.25em;
    }

    .navigation {
      margin-top: 28px;
    }

    .nav-list {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .nav-list > li {
      margin-bottom: 11px;
    }

    .nav-link,
    .nav-group-title {
      display: block;
      padding: 10px 14px;
      border-radius: 7px;
      font-size: 1.22rem;
      transition:
        background-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
    }

    .nav-link:hover,
    .nav-link:focus-visible {
      background: rgba(255, 255, 255, 0.08);
      color: #ffffff;
      transform: translateX(3px);
      outline: none;
    }

    .nav-group-title {
      font-weight: 700;
      color: #ffffff;
    }

    .subnav {
      margin: 2px 0 10px;
      padding-left: 16px;
      list-style: none;
    }

    .subnav .nav-link {
      padding: 7px 14px;
      color: var(--sidebar-muted);
      font-size: 1rem;
    }

    .sidebar-footer {
      margin-top: 44px;
      padding-top: 20px;
      border-top: 1px solid rgba(255, 255, 255, 0.12);
      color: var(--sidebar-muted);
      font-size: 0.9rem;
    }

    /* Main content */
    .main-content {
      grid-column: 2;
      min-width: 0;
    }

    .content-wrapper {
      width: min(100% - 56px, var(--max-content-width));
      margin: 0 auto;
      padding: 64px 0 96px;
    }

    .hero {
      padding: 0;
    }

    .hero-visual {
      max-width: 1040px;
      margin: 0 auto;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 18px;
      background: #ffffff;
      box-shadow: 0 16px 44px rgba(24, 36, 52, 0.07);
    }

    .hero-visual img {
      width: 100%;
      aspect-ratio: 1840 / 858;
      object-fit: contain;
    }

    .hero-content {
      max-width: 1040px;
      margin: 34px auto 0;
    }

    .eyebrow {
      margin: 0 0 16px;
      color: #326f8f;
      font-size: 0.98rem;
      font-weight: 700;
      letter-spacing: -0.01em;
      word-break: keep-all;
    }

    .hero h2 {
      margin: 0;
      font-size: clamp(1.75rem, 2.45vw, 2.55rem);
      line-height: 1.2;
      letter-spacing: -0.035em;
      word-break: keep-all;
    }

    .hero-title {
      display: block;
      max-width: 1040px;
    }

    .hero-title-ko,
    .hero-title-en {
      display: block;
    }

    .hero-title-en {
      margin-top: 4px;
      font-size: 0.9em;
      white-space: normal;
    }

    .hero p {
      max-width: 880px;
      margin: 18px 0 0;
      color: var(--muted);
      font-size: 1.04rem;
    }

    .hero-description-ko {
      word-break: keep-all;
    }

    section {
      scroll-margin-top: 32px;
      padding-top: 40px;
    }

    .section-heading {
      margin-bottom: 28px;
    }

    .section-heading h2 {
      margin: 0;
      font-size: clamp(1.9rem, 3vw, 2.7rem);
      letter-spacing: -0.035em;
    }

    .section-heading p {
      max-width: 760px;
      margin: 10px 0 0;
      color: var(--muted);
    }

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

    .card {
      padding: 26px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--card-bg);
      box-shadow: 0 10px 30px rgba(24, 36, 52, 0.04);
    }

    .card h3 {
      margin: 0 0 10px;
      font-size: 1.15rem;
    }

    .card p {
      margin: 0;
      color: var(--muted);
    }

    .news-list,
    .publication-list {
      margin: 0;
      padding: 0;
      list-style: none;
      border-top: 1px solid var(--border);
    }

    .news-item,
    .publication-item {
      display: grid;
      grid-template-columns: 130px minmax(0, 1fr);
      gap: 24px;
      padding: 22px 0;
      border-bottom: 1px solid var(--border);
    }

    .item-date,
    .publication-type {
      color: var(--muted);
      font-size: 0.9rem;
      font-weight: 700;
    }

    .item-title {
      margin: 0;
      font-size: 1rem;
      font-weight: 700;
    }

    .item-description {
      margin: 5px 0 0;
      color: var(--muted);
    }

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

    .person-card {
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--card-bg);
    }

    .person-photo-frame {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 3;
      overflow: hidden;
      background: #ffffff;
    }

    .person-photo {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: contain;
    }

    .person-info {
      padding: 22px;
    }

    .person-info h3 {
      margin: 0;
      font-size: 1.1rem;
    }

    .person-role {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 0.92rem;
    }

    .research-interest {
      margin-top: 16px;
      color: var(--muted);
      font-size: 0.94rem;
    }

    .research-interest-title {
      margin: 0 0 6px;
      color: var(--text);
      font-weight: 700;
    }

    .research-interest ul {
      margin: 0;
      padding-left: 19px;
    }

    .research-interest li + li {
      margin-top: 3px;
    }

    .contact-box {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 28px;
      padding: 32px;
      border-radius: 14px;
      background: var(--card-bg);
      border: 1px solid var(--border);
    }

    .contact-box h3 {
      margin-top: 0;
    }

    .contact-box p {
      color: var(--muted);
    }

    .text-link {
      color: #256f99;
      font-weight: 700;
    }

    .text-link:hover {
      text-decoration: underline;
    }

    /* Mobile navigation button */
    .menu-toggle {
      display: none;
    }

    @media (max-width: 920px) {
      .site-layout {
        display: block;
      }

      .sidebar {
        position: sticky;
        top: 0;
        z-index: 1000;
        width: 100%;
        height: auto;
        padding: 18px 22px;
      }

      .sidebar-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
      }

      .lab-logo-link,
      .lab-logo-divider {
        display: none;
      }

      .lab-name {
        font-size: 1.05rem;
      }

      .lab-subtitle,
      .sidebar-footer {
        display: none;
      }

      .menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        border-radius: 8px;
        background: transparent;
        color: #ffffff;
        cursor: pointer;
      }

      .navigation {
        display: none;
        padding-top: 16px;
      }

      .navigation.is-open {
        display: block;
      }

      .main-content {
        grid-column: auto;
      }

      .content-wrapper {
        width: min(100% - 36px, var(--max-content-width));
        padding-top: 28px;
      }

      .hero {
        padding: 0;
      }

      .card-grid,
      .people-grid {
        grid-template-columns: 1fr 1fr;
      }
    }

    @media (max-width: 640px) {
      .card-grid,
      .people-grid,
      .contact-box {
        grid-template-columns: 1fr;
      }

      .news-item,
      .publication-item,
      .lecture-list-item {
        grid-template-columns: 1fr;
        gap: 7px;
      }

      .hero {
        padding: 0;
      }

      .hero-visual {
        border-radius: 14px;
      }

      .hero-content {
        margin-top: 24px;
      }

      .hero h2 {
        font-size: clamp(1.85rem, 8vw, 2.45rem);
      }

      .hero-title {
        display: block;
      }

      .hero-title-ko,
      .hero-title-en {
        display: block;
      }

      section {
        padding-top: 68px;
      }
    }

/* Functional additions: original visual design is preserved. */
.clickable-card {
  display: block;
  height: 100%;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.clickable-card:hover,
.clickable-card:focus-visible {
  transform: translateY(-3px);
  border-color: #c5ced8;
  box-shadow: 0 14px 34px rgba(24, 36, 52, 0.08);
  outline: none;
}

.section-heading-with-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.more-link {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 13px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 700;
}

.more-link:hover,
.more-link:focus-visible {
  border-color: #b5c0cc;
  outline: none;
}

.publication-group + .publication-group {
  margin-top: 40px;
}

.publication-group h3 {
  margin: 0 0 14px;
  font-size: 1.15rem;
}

.publication-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.publication-links a {
  color: #256f99;
  font-size: 0.88rem;
  font-weight: 700;
}

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

.lecture-grid .card {
  min-width: 0;
}

.lecture-card {
  cursor: default;
}

.lecture-period {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 700;
}

.lecture-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.lecture-list-item {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 24px;
  padding: 18px 0;
}

.lecture-name {
  color: var(--text);
  font-weight: 800;
}

.lecture-groups {
  display: grid;
  gap: 46px;
}

.lecture-group {
  padding-top: 0;
}

.lecture-group h3 {
  margin: 0 0 14px;
  font-size: 1.18rem;
}

.empty-message {
  padding: 22px 0;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}

.detail-page {
  width: min(100% - 40px, 900px);
  margin: 0 auto;
  padding: 56px 0 96px;
}

.detail-page .back-link {
  display: inline-block;
  margin-bottom: 30px;
  color: #256f99;
  font-weight: 700;
}

.detail-content {
  padding: 36px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card-bg);
  box-shadow: 0 10px 30px rgba(24, 36, 52, 0.04);
}

.research-detail-content h1 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.12;
}

.research-detail-image-wrap {
  margin: 30px 0;
}

.research-detail-image {
  width: 100%;
  max-height: 520px;
  object-fit: cover;
  border-radius: 12px;
  background: #e8ecf1;
}

.research-detail-body p {
  margin: 0;
  color: var(--text);
}

.research-detail-body p + p {
  margin-top: 16px;
}

.related-publications-section {
  margin-top: 42px;
  padding-top: 34px;
  border-top: 1px solid var(--border);
}

.related-publications-section h2 {
  margin: 0 0 16px;
  font-size: 1.35rem;
}

.person-detail-header {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}

.person-detail-photo-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 12px;
  background: #ffffff;
}

.person-detail-photo {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.person-detail-content h1 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.12;
}

.person-detail-role {
  margin: 12px 0 0;
  color: var(--muted);
  font-weight: 700;
}

.person-detail-summary {
  min-width: 0;
}

.person-profile-lines {
  margin-top: 14px;
  color: var(--muted);
  font-size: 1.02rem;
  line-height: 1.5;
}

.person-profile-lines p {
  margin: 0;
}

.person-profile-lines p + p {
  margin-top: 4px;
}

.person-profile-line-spacer {
  display: block;
  height: 20px;
}

.person-detail-links {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 16px;
}

.person-detail-body {
  margin-top: 34px;
}

.person-detail-body p {
  margin: 0;
}

.person-detail-body p + p {
  margin-top: 16px;
}

.person-detail-section {
  margin-top: 42px;
  padding-top: 0;
}

.person-detail-section h2 {
  margin: 0 0 16px;
  font-size: 1.35rem;
}

.person-detail-section-inline {
  margin-top: 8px;
  padding-top: 10px;
  scroll-margin-top: 0;
}

.person-detail-section-inline h2 {
  margin: 0 0 12px;
  font-size: 1.18rem;
}

.person-detail-list {
  margin: 0;
  padding-left: 21px;
  color: var(--muted);
  line-height: 1.75;
}

.person-detail-list li + li {
  margin-top: 4px;
}

.timeline-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.timeline-item {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 22px;
  padding: 18px 0;
}

.timeline-period {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}

.timeline-description p {
  margin: 0;
}

.timeline-description p + p {
  margin-top: 3px;
}

@media (max-width: 640px) {
  .person-detail-header,
  .timeline-item {
    grid-template-columns: 1fr;
  }

  .person-detail-photo-frame {
    max-width: 260px;
  }

}

@media (max-width: 920px) {
  .lecture-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .lecture-grid {
    grid-template-columns: 1fr;
  }

  .section-heading-with-action {
    align-items: center;
  }
}

/* Jekyll multi-page additions */
.clickable-card {
  display: block;
  height: 100%;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

.clickable-card:hover,
.clickable-card:focus-visible {
  transform: translateY(-3px);
  border-color: #c5ced8;
  box-shadow: 0 14px 34px rgba(24, 36, 52, 0.08);
  outline: none;
}

.section-heading-with-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.more-link {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 13px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card-bg);
  font-size: 0.9rem;
  font-weight: 700;
}

.publication-group + .publication-group,
.publication-subsection + .publication-subsection {
  margin-top: 40px;
}

.publication-group h3,
.publication-subsection h3 {
  margin: 0 0 14px;
  font-size: 1.15rem;
}

.publication-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.publication-links a {
  color: #256f99;
  font-size: 0.88rem;
  font-weight: 700;
}

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

.empty-message {
  padding: 22px 0;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}

.back-link {
  display: inline-block;
  margin-bottom: 30px;
  color: #256f99;
  font-weight: 700;
}

.detail-content {
  padding: 36px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card-bg);
  box-shadow: 0 10px 30px rgba(24, 36, 52, 0.04);
}

.publications-page-header {
  padding: 56px 0 8px;
}

.publications-page-header h2 {
  margin: 0;
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.publications-page-header > p:last-child {
  max-width: 760px;
  margin: 20px 0 0;
  color: var(--muted);
  font-size: 1.05rem;
}

@media (max-width: 920px) {
  .lecture-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .lecture-grid {
    grid-template-columns: 1fr;
  }

  .section-heading-with-action {
    align-items: center;
  }
}

/* Research Areas page */

.research-page-header {
  padding: 48px 0 28px;
}

.research-page-header h2 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.35rem);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.research-page-header > p:last-child {
  max-width: 900px;
  margin: 20px 0 0;
  color: var(--muted);
  font-size: 1.05rem;
}

.research-overview {
  padding: 34px 0 42px;
  border-bottom: 1px solid var(--border);
}

.research-overview h2 {
  margin: 30px 0 12px;
  font-size: clamp(1.45rem, 2.1vw, 1.9rem);
  line-height: 1.18;
  letter-spacing: -0.025em;
}

.research-overview p,
.research-area-description {
  max-width: 980px;
  color: var(--muted);
  font-size: 1.02rem;
  line-height: 1.78;
}

.research-overview p {
  margin: 0 auto;
}

.research-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 260px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(49, 72, 98, 0.14), rgba(72, 139, 164, 0.16)),
    repeating-linear-gradient(90deg, rgba(24, 36, 52, 0.06) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(0deg, rgba(24, 36, 52, 0.05) 0 1px, transparent 1px 72px),
    #f8fafc;
  color: rgba(24, 36, 52, 0.46);
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0;
  text-align: center;
}

.research-visual-overview {
  min-height: 320px;
  background:
    radial-gradient(circle at 25% 35%, rgba(92, 125, 86, 0.22), transparent 30%),
    radial-gradient(circle at 72% 45%, rgba(48, 105, 132, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(49, 72, 98, 0.12), rgba(208, 218, 229, 0.28)),
    #f8fafc;
}

.research-visual-image {
  min-height: 0;
  overflow: hidden;
  background: #fff;
}

.research-visual-image img {
  display: block;
  width: 100%;
  height: auto;
}

.research-overview-image {
  margin-bottom: 28px;
}

.research-visual-ai-wireless {
  background:
    linear-gradient(135deg, rgba(53, 91, 132, 0.18), rgba(112, 154, 137, 0.16)),
    repeating-linear-gradient(45deg, rgba(24, 36, 52, 0.06) 0 1px, transparent 1px 34px),
    #f8fafc;
}

.research-visual-mimo-beamforming {
  background:
    radial-gradient(circle at 25% 50%, rgba(221, 143, 82, 0.20), transparent 28%),
    radial-gradient(circle at 74% 42%, rgba(48, 105, 132, 0.20), transparent 32%),
    linear-gradient(90deg, rgba(24, 36, 52, 0.08), rgba(24, 36, 52, 0.02)),
    #f8fafc;
}

.research-visual-next-generation-wireless-systems {
  background:
    linear-gradient(135deg, rgba(83, 116, 92, 0.17), rgba(78, 113, 145, 0.17)),
    repeating-linear-gradient(0deg, rgba(24, 36, 52, 0.055) 0 1px, transparent 1px 42px),
    #f8fafc;
}

.research-area-sections {
  padding-top: 0;
}

.research-area-section {
  scroll-margin-top: 40px;
  padding: 54px 0 56px;
  border-bottom: 1px solid var(--border);
}

.research-area-header {
  margin-bottom: 26px;
}

.research-area-header h2 {
  max-width: 1120px;
  margin: 0;
  font-size: clamp(1.55rem, 2.25vw, 2.1rem);
  line-height: 1.16;
  letter-spacing: -0.028em;
  text-wrap: balance;
}

.research-area-header h3 {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: clamp(1.05rem, 1.65vw, 1.3rem);
  line-height: 1.35;
  letter-spacing: 0;
}

.research-area-description {
  margin: 28px auto 0;
}

.research-area-description p {
  margin: 0;
}

.research-area-description p + p {
  margin-top: 12px;
}

.research-topic-list-wrap {
  max-width: 980px;
  margin: 30px auto 0;
}

.research-topic-list-wrap h4 {
  margin: 0 0 12px;
  font-size: 1.08rem;
}

.research-topic-list {
  columns: 2;
  column-gap: 42px;
  margin: 0;
  padding-left: 20px;
  color: var(--text);
}

.research-topic-list li {
  break-inside: avoid;
  margin-bottom: 7px;
  color: var(--muted);
}

.research-publications {
  max-width: 980px;
  margin: 32px auto 0;
  border-top: 1px solid var(--border);
}

.research-publications summary {
  padding: 18px 0;
  cursor: pointer;
  color: var(--text);
  font-weight: 800;
}

.research-publications .publication-list {
  margin: 0 0 8px;
}

.research-publication-item {
  grid-template-columns: 96px minmax(0, 1fr);
}

.research-topic-link {
  display: inline-block;
  margin-top: 18px;
  color: #256f99;
  font-size: 0.9rem;
  font-weight: 700;
}

@media (max-width: 920px) {
  .research-topic-list {
    columns: 1;
  }
}

@media (max-width: 640px) {
  .research-page-header {
    padding-top: 36px;
  }

  .research-visual,
  .research-visual-overview {
    min-height: 210px;
  }

  .research-area-section {
    padding: 42px 0 44px;
  }

  .research-publication-item {
    grid-template-columns: 1fr;
  }
}
/* News accordion page */

.news-page-header {
  padding: 56px 0 24px;
}

.news-page-header h2 {
  margin: 0;
  font-size: clamp(2.4rem, 5vw, 4.4rem);
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.news-list-page {
  border-top: 1px solid var(--border);
}

.news-accordion-item {
  border-bottom: 1px solid var(--border);
}

.news-accordion-button {
  width: 100%;
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr) 34px;
  gap: 24px;
  align-items: center;
  padding: 22px 0;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.news-accordion-button:hover .news-accordion-title,
.news-accordion-button:focus-visible .news-accordion-title {
  color: #256f99;
}

.news-accordion-button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 5px;
}

.news-accordion-date {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}

.news-accordion-title {
  font-size: 1rem;
  font-weight: 700;
}

.news-accordion-icon {
  justify-self: end;
  color: var(--muted);
  font-size: 1.3rem;
  font-weight: 700;
}

.news-accordion-panel {
  margin: 0 0 24px 154px;
  padding: 28px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card-bg);
  box-shadow: 0 10px 30px rgba(24, 36, 52, 0.04);
  cursor: pointer;
}

.news-accordion-panel[hidden] {
  display: none;
}

.news-detail-image-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 26px;
}

.news-detail-image {
  width: auto;
  max-width: min(100%, 760px);
  max-height: 520px;
  object-fit: contain;
  border-radius: 10px;
}

.news-accordion-content {
  color: var(--text);
}

.news-accordion-content p {
  margin: 0;
}

.news-accordion-content p + p {
  margin-top: 16px;
}

@media (max-width: 640px) {
  .news-accordion-button {
    grid-template-columns: 1fr 30px;
    gap: 8px 14px;
  }

  .news-accordion-date {
    grid-column: 1 / -1;
  }

  .news-accordion-title {
    grid-column: 1;
  }

  .news-accordion-icon {
    grid-column: 2;
  }

  .news-accordion-panel {
    margin-left: 0;
    padding: 22px;
  }
}

/* Research summary cards */
.research-home-card h3 {
  margin-bottom: 10px;
  font-size: clamp(1.02rem, 1.2vw, 1.12rem);
  line-height: 1.25;
  letter-spacing: -0.018em;
  text-wrap: balance;
}

@media (min-width: 1180px) {
  .research-area-header h2 {
    white-space: nowrap;
  }
}

.research-card-kicker {
  margin: 0 0 8px;
  color: #326f8f;
  font-size: 0.9rem;
  font-weight: 800;
  word-break: keep-all;
}

.research-keyword-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.research-keyword-list span {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
}

.research-details-link {
  white-space: nowrap;
}