.global-nav a[aria-current="page"] { color: #23627a; }
.global-nav a[aria-current="page"]::after { right: 0; left: 0; }

.about-hero { height: var(--hero-second-height); min-height: var(--hero-second-height); position: relative; background: #eaf4f8 url("../assets/about/about_hero_leaves.webp") center / cover no-repeat; }
.about-hero::before { width: 56%; height: 100%; position: absolute; inset: 0 auto 0 0; content: ""; background: linear-gradient(90deg, rgba(235,246,250,.98), rgba(235,246,250,.77), transparent); }
.about-hero__inner { max-width: var(--max); min-height: var(--hero-second-height); margin: 0 auto; padding: 45px 32px; position: relative; display: flex; align-items: center; justify-content: space-between; }
.about-hero__inner > div, .about-hero__side { position: relative; z-index: 1; }
.about-kicker { margin: 0 0 11px; font-size: 13px; letter-spacing: .14em; }
.about-hero h1 { margin: 0 0 10px; font-size: 34px; line-height: 1.35; font-weight: 400; letter-spacing: .1em; }
.about-hero__inner > div > p:last-child { margin: 0; font-size: 14px; line-height: 1.7; letter-spacing: .04em; }
.about-hero__side { margin: 0; padding-right: 18px; font-size: 10px; line-height: 1.55; letter-spacing: .1em; }
.about-hero__side span { width: 22px; height: 1px; display: block; margin-top: 10px; background: #607b8d; }

.about-shell { max-width: 940px; margin: 0 auto; padding-bottom: 24px; }
.about-row { min-height: 238px; padding: 16px 0; display: grid; grid-template-columns: .88fr 1.2fr; gap: 42px; align-items: center; border-bottom: 1px solid var(--line); }
.about-row--image-copy { grid-template-columns: 1.2fr .88fr; }
.about-copy { padding: 0 32px; }
.about-copy h2, .about-mission h2, .company-profile h2 { margin: 0 0 10px; font-size: 28px; line-height: 1.35; font-weight: 400; letter-spacing: .04em; }
.about-copy > p:not(.about-kicker):not(.about-subtitle), .mission-intro > p:not(.about-kicker) { margin: 0 0 12px; color: #405c70; font-size: 14px; line-height: 1.75; }
.about-subtitle { margin: -7px 0 10px; font-size: 16px; letter-spacing: .08em; }
.about-link { display: inline-flex; align-items: center; gap: 13px; font-size: 12px; letter-spacing: .08em; transition: color .25s ease, transform .25s ease; }
.about-link span { width: 25px; height: 25px; display: inline-grid; place-items: center; border: 1px solid #7d98aa; border-radius: 50%; font-family: var(--sans); transition: color .25s ease, background-color .25s ease, transform .25s ease; }
.about-image { min-height: 205px; display: block; background-repeat: no-repeat; background-size: 105% auto; background-position: center; transition: filter .25s ease, box-shadow .25s ease, transform .25s ease; }
.about-image--facility { background-image: url("../assets/about/about_organelle_facility.webp"); }
.about-image--origin { background-image: url("../assets/about/about_research_origin.webp"); }
.about-image--founder { background-image: url("../assets/about/about_founder_researcher.webp"); background-position: center 42%; }

.about-row--process { grid-template-columns: 1.25fr .85fr; gap: 30px; }
.research-cycle { margin: 0; padding: 8px 0; }
.research-cycle img { width: 100%; height: 142px; object-fit: cover; object-position: center; }
.research-cycle figcaption { padding: 0 7px; display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; }
.research-cycle figcaption span { min-width: 0; display: grid; justify-items: center; }
.research-cycle b { font-size: 10px; letter-spacing: .05em; }
.research-cycle strong { margin-top: 3px; font-size: 12px; font-weight: 500; }
.research-cycle small { margin-top: 5px; color: #506a7d; font-size: 9px; line-height: 1.4; }

.about-mission { padding: 26px 0; display: grid; grid-template-columns: 320px 1fr; gap: 22px; border-bottom: 1px solid var(--line); }
.mission-intro { padding: 0 32px; border-right: 1px solid var(--line); }
.about-mission ul { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; }
.about-mission li { padding: 0 10px; display: grid; justify-items: center; align-content: start; text-align: center; border-right: 1px solid var(--line); }
.about-mission li:last-child { border-right: 0; }
.mission-icon { width: 54px; height: 54px; margin-bottom: 10px; display: grid; place-items: center; border-radius: 50%; background: #edf5fa; color: #1f5b83; font: 27px var(--serif); }
.about-mission li b { margin-bottom: 7px; font-size: 12px; font-weight: 500; white-space: nowrap; }
.about-mission li p { margin: 0; color: #526a7b; font-size: 9px; line-height: 1.55; }

.company-profile { padding: 16px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 42px; align-items: center; }
.company-profile__image { min-height: 190px; background: url("../assets/about/about_company_lobby.webp") center / 105% auto no-repeat; }
.company-profile__content { padding-right: 18px; }
.company-profile dl { margin: 0; font-size: 11px; color: #405c70; }
.company-profile dl div { min-height: 27px; display: grid; grid-template-columns: 125px 1fr; border-top: 1px solid var(--line); }
.company-profile dl div:last-child { border-bottom: 1px solid var(--line); }
.company-profile dt, .company-profile dd { margin: 0; padding: 5px 10px; line-height: 1.45; }
.company-profile dt { border-right: 1px solid var(--line); }

@media (hover: hover) {
  .about-link:hover { color: #23627a; transform: translateX(3px); }
  .about-link:hover span { color: #fff; background: #23627a; transform: rotate(-20deg); }
  .about-image[href]:hover { filter: saturate(1.06) brightness(1.02); box-shadow: 0 8px 20px rgba(22,65,84,.16); transform: translateY(-2px); }
}

@media (max-width: 900px) {
  .about-shell { margin: 0 5vw; }
  .about-row { gap: 24px; }
  .about-copy { padding: 0 12px; }
  .about-mission { grid-template-columns: 1fr; }
  .mission-intro { padding: 0 12px; border-right: 0; }
  .company-profile { gap: 24px; }
}

@media (max-width: 680px) {
  .about-hero { height: var(--hero-second-height); min-height: var(--hero-second-height); background-position: 68% center; }
  .about-hero::before { width: 100%; background: linear-gradient(180deg, rgba(235,246,250,.96), rgba(235,246,250,.56) 58%, rgba(235,246,250,.12)); }
  .about-hero__inner { height: var(--hero-second-height); min-height: var(--hero-second-height); padding: 42px 7vw; align-items: flex-start; }
  .about-hero h1 { font-size: 32px; }
  .about-hero__inner > div > p:last-child { font-size: 16px; }
  .about-hero__side { display: none; }
  .about-shell { margin: 0; }
  .about-row, .about-row--image-copy, .about-row--process { padding: 38px 6vw 44px; display: flex; flex-direction: column; align-items: stretch; gap: 26px; }
  .about-row--image-copy .about-image { order: 2; }
  .about-row--process .research-cycle { order: 2; }
  .about-copy { padding: 0; }
  .about-copy h2, .about-mission h2, .company-profile h2 { font-size: 26px; }
  .about-copy > p:not(.about-kicker):not(.about-subtitle), .mission-intro > p:not(.about-kicker) { font-size: 16px; }
  .about-image { width: 100%; min-height: 0; aspect-ratio: 2 / 1; background-size: cover; }
  .research-cycle { width: 100%; }
  .research-cycle img { height: auto; aspect-ratio: 3.3 / 1; }
  .research-cycle figcaption { grid-template-columns: 1fr 1fr; gap: 20px 8px; }
  .research-cycle b { font-size: 11px; }
  .research-cycle strong { font-size: 13px; }
  .research-cycle small { font-size: 11px; }
  .about-mission { padding: 38px 6vw 42px; }
  .mission-intro { padding: 0; }
  .about-mission ul { grid-template-columns: 1fr 1fr; row-gap: 28px; }
  .about-mission li:nth-child(2) { border-right: 0; }
  .about-mission li b { font-size: 13px; white-space: normal; }
  .about-mission li p { font-size: 11px; }
  .company-profile { padding: 38px 6vw 10px; grid-template-columns: 1fr; gap: 28px; }
  .company-profile__image { min-height: 0; aspect-ratio: 2 / 1; background-size: cover; }
  .company-profile__content { padding: 0; }
  .company-profile dl { font-size: 14px; }
  .company-profile dl div { grid-template-columns: 108px 1fr; }
}