@charset "UTF-8";
/* ======================================================================
 Xu Laboratory | Research Page (2026)
 Research_top_revised.html 専用
 Load after common.css, top.css and other existing stylesheets.
 ====================================================================== */
.xu-research-page {
  --xu-navy: #173c50;
  --xu-teal: #168b91;
  --xu-ink: #263e4a;
  --xu-muted: #617681;
  --xu-line: #dbe7e9;
  --xu-paper: #ffffff;
  background: #f9fbfc;
  color: var(--xu-ink);
  padding-bottom: 70px;
  overflow-wrap: anywhere;
}
.xu-research-page,
.xu-research-page * { box-sizing: border-box; }

/* Header matches Access FINAL / NEWS / Members / Publication */
.xu-research-page .sub_top.xu-research__hero {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 174px !important;
  margin: 0 !important;
  padding: 38px 24px 42px !important;
  background: linear-gradient(116deg, #123b51 4%, #176c79 70%, #269b9b) !important;
  color: #ffffff !important;
}
.xu-research-page .xu-research__hero-inner {
  width: min(100%, 1000px);
  margin: 0 auto;
  text-align: left;
}
.xu-research-page .xu-research__eyebrow {
  position: static !important;
  display: block;
  padding: 0 !important;
  margin: 0 0 8px !important;
  color: #b9e4e8 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  font-weight: 700;
  letter-spacing: .17em;
}
.xu-research-page .sub_top.xu-research__hero h1 {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  -ms-transform: none !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: clamp(30px, 4vw, 42px) !important;
  font-family: 'Roboto', 'Noto Sans JP', sans-serif;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .04em;
  text-align: left !important;
}
.xu-research-page .xu-research__hero-caption {
  margin: 11px 0 0 !important;
  padding: 0 !important;
  color: #e5f5f5 !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
}
.xu-research-page .xu-research__breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  width: min(100% - 36px, 1040px);
  margin: 0 auto 12px !important;
  padding: 16px 4px 12px !important;
  color: var(--xu-navy);
  font-size: 13px !important;
  line-height: 1.8 !important;
}
.xu-research-page .xu-research__breadcrumb > a,
.xu-research-page .xu-research__breadcrumb > span {
  font-size: 13px !important;
  line-height: 1.8 !important;
  letter-spacing: 0 !important;
}
.xu-research-page .xu-research__breadcrumb a {
  color: var(--xu-teal) !important;
  text-decoration: none;
  font-weight: 400 !important;
}
.xu-research-page .xu-research__breadcrumb a:hover { text-decoration: underline; }
.xu-research-page .xu-research__breadcrumb [aria-current="page"] {
  color: var(--xu-navy);
  font-weight: 700;
}
.xu-research-page .xu-research__breadcrumb span[aria-hidden="true"] { color: #93a5ae; }
.xu-research-page .xu-research__container {
  width: min(100% - 36px, 1040px);
  margin: 0 auto;
}
.xu-research-page .xu-research__section-label {
  margin: 0 0 10px !important;
  color: var(--xu-teal);
  font-size: 11px !important;
  line-height: 1.6 !important;
  letter-spacing: .17em;
  font-weight: 700;
}

/* Intro and local section nav */
.xu-research-page .xu-research__intro {
  padding: 38px 44px 35px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--xu-line);
  box-shadow: 0 8px 28px rgba(23, 60, 80, .045);
}
.xu-research-page .xu-research__intro h2 {
  margin: 0 0 18px !important;
  padding: 0 !important;
  color: var(--xu-navy) !important;
  font-size: clamp(27px, 3.2vw, 39px) !important;
  line-height: 1.45 !important;
  font-weight: 700;
  text-align: left !important;
}
.xu-research-page .xu-research__intro h2 span { font-size: .63em; }
.xu-research-page .xu-research__intro > p:not(.xu-research__section-label) {
  max-width: 890px;
  margin: 0 !important;
  color: #425866;
  font-size: 16px !important;
  line-height: 2.0 !important;
}
.xu-research-page .xu-research__jump {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 26px;
}
.xu-research-page .xu-research__jump a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 14px 16px;
  border: 1px solid #c8e1e5;
  border-radius: 10px;
  background: #f2f9f9;
  color: var(--xu-navy) !important;
  font-size: 15px;
  line-height: 1.4;
  text-decoration: none;
  font-weight: 700;
  transition: background .2s, border-color .2s, transform .2s;
}
.xu-research-page .xu-research__jump a span {
  color: var(--xu-teal);
  font: 700 23px/1 'Roboto', sans-serif;
}
.xu-research-page .xu-research__jump a:hover {
  background: #e5f5f5;
  border-color: #168b91;
  transform: translateY(-2px);
}

/* Three pillars */
.xu-research-page .xu-research__pillar-list {
  display: grid;
  gap: 22px;
  margin-top: 28px;
}
.xu-research-page .xu-research__pillar {
  display: grid;
  grid-template-columns: minmax(210px, .68fr) minmax(0, 1.32fr);
  gap: 0;
  overflow: hidden;
  min-height: 350px;
  border-radius: 16px;
  border: 1px solid var(--xu-line);
  background: #ffffff;
  box-shadow: 0 8px 28px rgba(23, 60, 80, .06);
  scroll-margin-top: 155px;
}
.xu-research-page .xu-research__pillar-icon {
  display: grid;
  place-items: center;
  padding: 22px;
  background: radial-gradient(circle at 55% 50%, #1e7c88 0%, #15435a 62%, #0c2d42 100%);
  overflow: hidden;
}
.xu-research-page .xu-research__pillar-icon svg {
  width: min(100%, 300px);
  height: auto;
  max-height: 280px;
  display: block;
}
.xu-research-page .xu-research__pillar-body { min-width: 0; padding: 30px 36px 30px; }
.xu-research-page .xu-research__pillar-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 5px;
}
.xu-research-page .xu-research__number {
  color: var(--xu-teal);
  font: 700 25px/1.25 'Roboto', sans-serif;
}
.xu-research-page .xu-research__pill {
  padding: 4px 11px;
  border-radius: 99px;
  color: #0d6971;
  background: #e7f7f7;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 700;
}
.xu-research-page .xu-research__pillar h2 {
  padding: 0 !important;
  margin: 0 0 14px !important;
  color: var(--xu-navy) !important;
  font-size: clamp(25px, 3vw, 32px) !important;
  line-height: 1.45 !important;
  text-align: left !important;
  font-weight: 700 !important;
}
.xu-research-page .xu-research__pillar h2 small {
  display: block;
  color: var(--xu-teal);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .02em;
  margin-top: 1px;
}
.xu-research-page .xu-research__pillar-lead {
  margin: 0 0 12px !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
}
.xu-research-page .xu-research__bullets {
  padding: 0 !important;
  margin: 0 0 16px !important;
  list-style: none !important;
}
.xu-research-page .xu-research__bullets li {
  position: relative;
  padding-left: 17px;
  margin: 0 0 7px;
  color: #405561;
  font-size: 14px;
  line-height: 1.75;
}
.xu-research-page .xu-research__bullets li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .82em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--xu-teal);
}
.xu-research-page .xu-research__paper-note {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 8px;
  margin: 0 0 14px;
  padding: 12px 14px;
  border-left: 3px solid #168b91;
  border-radius: 0 8px 8px 0;
  background: #f3f9fa;
  font-size: 13px;
  line-height: 1.8;
}
.xu-research-page .xu-research__paper-note strong { color: #0a7680; }
.xu-research-page .xu-research__text-link {
  display: inline-block;
  color: #087984 !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.8;
}
.xu-research-page .xu-research__text-link:hover { text-decoration: underline; }

/* Featured result */
.xu-research-page .xu-research__featured {
  margin-top: 40px;
  padding: 32px 38px;
  border-radius: 16px;
  border: 1px solid #bedbde;
  background: linear-gradient(125deg, #e5f4f5 0%, #f5fbfb 64%, #ffffff 100%);
  box-shadow: 0 8px 30px rgba(23, 60, 80, .05);
}
.xu-research-page .xu-research__featured-head {
  display: flex;
  gap: 18px;
  justify-content: space-between;
  align-items: flex-start;
}
.xu-research-page .xu-research__featured h2,
.xu-research-page .xu-research__publications h2 {
  padding: 0 !important;
  margin: 0 !important;
  color: var(--xu-navy) !important;
  font-size: clamp(21px, 2.5vw, 27px) !important;
  line-height: 1.5 !important;
  text-align: left !important;
  font-weight: 700;
}
.xu-research-page .xu-research__featured-year {
  color: #95c5ca;
  font: 700 44px/1 'Roboto', sans-serif;
}
.xu-research-page .xu-research__featured-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr);
  gap: 32px;
  align-items: center;
  margin-top: 20px;
}
.xu-research-page .xu-research__featured-grid p {
  margin: 0 0 18px;
  font-size: 15px;
  line-height: 1.95;
}
.xu-research-page .xu-research__tags { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:17px; }
.xu-research-page .xu-research__tags span {
  display:inline-block;
  padding:5px 9px;
  background:#fff;
  border:1px solid #c6dfe2;
  border-radius:6px;
  color:#386975;
  font-size:11px;
  line-height:1.4;
}
.xu-research-page .xu-research__feature-link {
  display:inline-block;
  padding:11px 15px;
  border-radius:8px;
  background:#168b91;
  color:#fff !important;
  font-size:13px;
  font-weight:700;
  line-height:1.6;
  text-decoration:none;
}
.xu-research-page .xu-research__feature-link:hover { background:#173c50; }
.xu-research-page .xu-research__feature-graphic {
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:190px;
  padding:18px;
  border-radius:13px;
  background:linear-gradient(145deg,#10384d,#186776);
}
.xu-research-page .xu-research__feature-node {
  width:87px;
  min-width:0;
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:5px;
  padding:10px 5px;
  text-align:center;
  border-radius:12px;
  background:rgba(238,255,255,.12);
  border:1px solid rgba(227,255,255,.25);
  color:#ecffff;
}
.xu-research-page .xu-research__feature-node span { font-size:11px; line-height:1.6; }
.xu-research-page .xu-research__feature-node strong { font-size:11px; line-height:1.5; letter-spacing:.05em; }
.xu-research-page .xu-research__feature-node--material {
  background: radial-gradient(circle,rgba(64,231,218,.48),rgba(17,87,100,.8));
  border-color:rgba(177,255,242,.65);
}
.xu-research-page .xu-research__feature-arrow { color:#b9fcf2; font-size:22px; flex:0 0 auto; }

/* Papers */
.xu-research-page .xu-research__publications {
  margin-top: 35px;
  padding: 32px 36px;
  border: 1px solid var(--xu-line);
  border-radius: 16px;
  background:#fff;
}
.xu-research-page .xu-research__section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:19px;
}
.xu-research-page .xu-research__publication-list { margin:0 !important; padding:0 !important; list-style:none !important; }
.xu-research-page .xu-research__publication-list li {
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  align-items:start;
  gap:16px;
  padding:15px 4px;
  border-bottom:1px solid #e1eaec;
}
.xu-research-page .xu-research__publication-list li:first-child { border-top:1px solid #e1eaec; }
.xu-research-page .xu-research__pub-year {
  display:inline-block;
  margin-top:2px;
  padding:4px 7px;
  color:#147781;
  background:#e9f6f6;
  font:700 12px/1.4 'Roboto',sans-serif;
  text-align:center;
  border-radius:6px;
}
.xu-research-page .xu-research__publication-list a {
  color:var(--xu-navy) !important;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  line-height:1.7;
}
.xu-research-page .xu-research__publication-list a:hover { color:var(--xu-teal) !important; text-decoration:underline; }
.xu-research-page .xu-research__publication-list p {
  margin:4px 0 0 !important;
  color:#6b7982;
  font-size:12px !important;
  line-height:1.7 !important;
}
.xu-research-page .xu-research__source-note {
  margin:18px 0 0 !important;
  color:#657782;
  font-size:12px !important;
  line-height:1.8 !important;
}

/* Legacy diagrams preserved but secondary */
.xu-research-page .xu-research__legacy { margin-top:24px; }
.xu-research-page .xu-research__legacy details {
  padding:0 22px;
  border:1px solid var(--xu-line);
  border-radius:12px;
  background:#fff;
}
.xu-research-page .xu-research__legacy summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:18px 0;
  cursor:pointer;
  color:var(--xu-navy);
  font-size:14px;
  font-weight:700;
  list-style:none;
}
.xu-research-page .xu-research__legacy summary::-webkit-details-marker { display:none; }
.xu-research-page .xu-research__legacy details[open] summary span { transform:rotate(45deg); }
.xu-research-page .xu-research__legacy-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  padding:0 0 24px;
}
.xu-research-page .xu-research__legacy figure {
  margin:0;
  padding:12px;
  border:1px solid #ebf0f1;
  border-radius:10px;
  text-align:center;
}
.xu-research-page .xu-research__legacy img { display:block; max-width:100%; width:auto; height:auto; max-height:280px; object-fit:contain; margin:auto; }
.xu-research-page .xu-research__legacy figcaption { margin-top:7px; color:#6b7982; font-size:12px; }
.xu-research-page a:focus-visible,
.xu-research-page summary:focus-visible { outline:3px solid #28a7ac; outline-offset:3px; }

@media (max-width:900px) {
  .xu-research-page .xu-research__pillar { grid-template-columns:minmax(170px,.65fr) minmax(0,1.35fr); }
  .xu-research-page .xu-research__pillar-body { padding:24px; }
  .xu-research-page .xu-research__pillar-icon { padding:14px; }
  .xu-research-page .xu-research__featured-grid { grid-template-columns:1fr; gap:19px; }
  .xu-research-page .xu-research__featured-grid .xu-research__feature-graphic { max-width:450px; }
}
@media (max-width:767px) {
  .xu-research-page .sub_top.xu-research__hero { min-height:150px !important; padding:30px 20px 34px !important; }
  .xu-research-page .xu-research__hero-caption { font-size:13px !important; }
  .xu-research-page .xu-research__breadcrumb { padding:12px 4px !important; }
  .xu-research-page .xu-research__intro { padding:26px 20px; }
  .xu-research-page .xu-research__intro h2 { font-size:26px !important; line-height:1.5 !important; }
  .xu-research-page .xu-research__intro > p:not(.xu-research__section-label) { font-size:14px !important; line-height:1.95 !important; }
  .xu-research-page .xu-research__jump { grid-template-columns:1fr; gap:9px; margin-top:20px; }
  .xu-research-page .xu-research__jump a { min-height:46px; padding:10px 14px; }
  .xu-research-page .xu-research__pillar { grid-template-columns:1fr; scroll-margin-top:130px; }
  .xu-research-page .xu-research__pillar-icon { min-height:170px; max-height:190px; padding:12px; }
  .xu-research-page .xu-research__pillar-icon svg { max-height:175px; }
  .xu-research-page .xu-research__pillar-body { padding:24px 20px; }
  .xu-research-page .xu-research__pillar h2 { font-size:25px !important; }
  .xu-research-page .xu-research__pillar-lead { font-size:14px !important; }
  .xu-research-page .xu-research__featured,
  .xu-research-page .xu-research__publications { padding:25px 20px; }
  .xu-research-page .xu-research__featured-year { font-size:31px; }
  .xu-research-page .xu-research__featured h2,
  .xu-research-page .xu-research__publications h2 { font-size:22px !important; }
  .xu-research-page .xu-research__feature-graphic { padding:12px; gap:4px; }
  .xu-research-page .xu-research__feature-node { width:78px; }
  .xu-research-page .xu-research__feature-node span { font-size:10px; }
  .xu-research-page .xu-research__feature-node strong { font-size:9px; }
  .xu-research-page .xu-research__publication-list li { grid-template-columns:49px minmax(0,1fr); gap:10px; }
  .xu-research-page .xu-research__legacy-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .xu-research-page .xu-research__jump a { transition:none; }
}
/* Narrow phone safety: keep the three energy-conversion nodes inside cards. */
@media (max-width: 380px) {
  .xu-research-page .xu-research__featured-grid { grid-template-columns: minmax(0, 1fr); }
  .xu-research-page .xu-research__featured-grid > div { min-width: 0; }
  .xu-research-page .xu-research__feature-graphic { min-width: 0; gap: 3px; padding: 10px 7px; }
  .xu-research-page .xu-research__feature-node { flex: 1 1 0; width: auto; min-width: 0; padding: 8px 3px; }
  .xu-research-page .xu-research__feature-arrow { font-size: 15px; }
  .xu-research-page .xu-research__feature-link { max-width: 100%; overflow-wrap: anywhere; }
}