/* Shared finishing layer; retain the established QDL visual design. */
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #3568e8; outline-offset: 5px; }
main:focus { outline: none; }
[id] { scroll-margin-top: 110px; }
.skip-link { position: fixed; top: 12px; left: 16px; z-index: 100; padding: 10px 18px; border-radius: 8px; background: #fff; color: #142246; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.menu-toggle { display: none; font: inherit; font-size: 13px; font-weight: 700; border: 1px solid #d5ddeb; border-radius: 10px; background: #f5f7fc; color: #142246; padding: 10px 12px; min-height: 44px; cursor: pointer; }
.menu-toggle span { margin-left: 6px; }
.publication-item > div, .content-card, .hero-copy { min-width: 0; }
.publication-meta, .contact-email { overflow-wrap: anywhere; }
@media (max-width: 1080px) {
  .nav-wrap { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; }
  .nav-ready .menu-toggle { display: inline-flex; align-items: center; }
  .nav-wrap nav { width: 100%; flex-wrap: wrap; overflow: visible; margin: 0; gap: 6px; }
  .nav-ready .nav-wrap nav { display: none; }
  .nav-ready .nav-wrap nav.is-open { display: flex; padding: 8px 0; }
  .nav-wrap nav a { min-height: 44px; display: inline-flex; align-items: center; padding: 10px 13px; font-size: 14px; }
}
@media (max-width: 600px) {
  .page-hero h1 { font-size: clamp(34px, 9vw, 48px); overflow-wrap: break-word; }
  .page-hero { padding: 60px 0; }
  .page-section { padding: 56px 0; }
  .cta-box { padding: 26px; }
  .person-card-featured { grid-template-columns: 1fr; padding: 22px; }
  .person-card-featured .person-photo { max-width: 240px; }
  .profile-list li { font-size: 14px; }
  .profile-period { font-size: 12px; }
  .profile-label { font-size: 11px; }
}
@media (max-width: 360px) {
  .brand { gap: 8px; }
  .brand-name { font-size: 13px; }
  .brand-university { font-size: 9px; }
  .menu-toggle { padding: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Home and Research: clearer hierarchy within the original visual identity. */
.hero-emphasis { color: #b4c5ff; }
.home-page .hero { min-height: 620px; }
.home-page .hero-grid { grid-template-columns: minmax(0,1.25fr) minmax(0,.85fr); gap: 52px; padding: 88px 0 64px; }
.home-page .hero h1 { font-size: clamp(36px,4.4vw,60px); line-height: 1.1; letter-spacing: -.045em; }
.home-page .hero-description { max-width: 610px; font-size: 17px; }
.home-page .device-visual { height: 350px; }
.home-page .research-card h3 { font-size: 26px; }
.home-page .theme-visual-graphene { background: repeating-linear-gradient(60deg,transparent 0 24px,#d8e0f4 25px 26px,transparent 27px 50px),repeating-linear-gradient(-60deg,#f3f5fd 0 24px,#d8e0f4 25px 26px,transparent 27px 50px); }
.home-invitation { padding: 74px 0; }
.invitation-grid { display:flex; justify-content:space-between; align-items:center; gap:30px; }
.home-invitation h2 { font-size:clamp(28px,3.2vw,42px); line-height:1.15; letter-spacing:-.035em; }
.home-invitation p { margin-top:18px; color:var(--muted); max-width:580px; }
.home-invitation .button { flex-shrink:0; }
.research-page .research-page-hero { min-height:430px; }
.research-page .research-page-hero h1 { max-width:820px; font-size:clamp(38px,5.2vw,68px); line-height:1.08; }
.research-page .research-page-hero p { max-width:650px; }
.research-jump { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:36px; }
.research-jump a { display:flex; align-items:center; gap:14px; padding:17px 20px; border:1px solid #e0e6ef; border-radius:12px; text-decoration:none; font-size:14px; font-weight:600; background:#f8f9fc; }
.research-jump a:hover { background:#eef2ff; border-color:#afbee8; }
.research-jump span { color:#5971be; font-size:12px; }
.research-jump b { margin-left:auto; color:#5971be; }
.research-page .research-theme { grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:40px; padding:36px; align-items:start; box-shadow:0 8px 32px rgba(15,23,42,.035); }
.research-page .research-theme-copy { min-width:0; }
.research-page .research-theme-number { position:static; display:block; margin-bottom:18px; font-size:36px; color:#8195c6; }
.research-page .research-theme h2 { font-size:clamp(28px,3vw,38px); padding-right:0; }
.research-page .research-theme:nth-child(even) .research-theme-copy { order:0; }
.research-page .research-theme:nth-child(even) .research-theme-visual { order:0; }
.question-label { font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:#566a9b; margin-top:24px; }
.research-page .research-question-list { margin-top:12px; }
.research-page .selected-work > span { color:#596780; font-size:10px; }
.research-page .selected-work p { font-size:13px; line-height:1.65; }
.research-diagram { align-self:center; margin:0; overflow:hidden; border:1px solid #e1e7f1; border-radius:18px; background:#f5f7fc; }
.research-diagram img { display:block; width:100%; height:auto; }
.research-diagram figcaption { padding:18px 20px; color:#5f6b7d; font-size:13px; line-height:1.65; border-top:1px solid #e1e7f1; background:#fff; }
.research-diagram figcaption strong { color:#344054; }
.research-diagram small { display:block; margin-top:12px; font-size:10px; color:#6b758a; }
.research-page .research-paper-figure { align-self:center; }
.research-page .research-paper-figure figcaption { font-size:12px; color:#596780; line-height:1.6; }
@media(max-width:900px) {
  .home-page .hero-grid { grid-template-columns:1fr; padding:60px 0 44px; gap:40px; }
  .home-page .device-visual { width:100%; max-width:520px; height:280px; }
  .research-page .research-theme { grid-template-columns:1fr; }
  .research-diagram, .research-page .research-paper-figure { width:100%; max-width:540px; justify-self:center; }
}
@media(max-width:600px) {
  .home-page .hero h1 { font-size:clamp(29px,7.7vw,46px); }
  .home-page .hero-description { font-size:16px; }
  .home-page .device-visual { height:230px; }
  .research-jump { grid-template-columns:1fr; }
  .research-jump a { padding:16px; font-size:13px; }
  .research-page .research-theme { padding:24px; gap:26px; }
  .research-page .research-page-hero { min-height:380px; }
  .research-page .research-page-hero .container { width:calc(100% - 32px); }
  .invitation-grid { align-items:flex-start; flex-direction:column; }
}

/* Front-page artwork and research platform summaries. */
.home-page .hero-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; }
.home-page .hero h1 { font-size:clamp(34px,3.8vw,54px); }
.home-hero-art { margin:0; align-self:center; min-width:0; }
.home-hero-art img { display:block; width:100%; height:auto; border-radius:24px; border:1px solid rgba(180,197,255,.16); box-shadow:0 24px 80px rgba(0,0,0,.28); }
.home-hero-art figcaption { padding:14px 4px 0; color:#a5b1cb; font-size:11px; line-height:1.5; }
.theme-platform { padding:14px 16px; margin:0 0 20px; border-left:3px solid #8da0d8; background:#f6f8fc; color:#344054; font-size:14px; font-weight:600; }
.theme-platform > span { display:block; margin-bottom:5px; color:#637396; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
.theme-platform small { display:block; margin-top:4px; color:#667085; font-size:12px; font-weight:400; }
.research-status { display:block; width:fit-content; margin:0 0 14px; padding:3px 9px; border-radius:5px; background:#eeeafa; color:#6c549c; font-size:11px; }
@media(max-width:900px) { .home-page .hero-grid { grid-template-columns:1fr; } .home-hero-art { max-width:680px; } }
@media(max-width:600px) { .home-page .hero h1 { font-size:clamp(29px,7.7vw,46px); } .home-hero-art img { border-radius:16px; } }

/* Supporting pages: opportunities, people, equipment, and contact. */
.hero-inline-link { margin-top:26px; }
.detail-list { display:grid; gap:10px; padding-left:20px; margin:22px 0 26px; color:#566176; font-size:14px; }
.opportunity-card { display:flex; flex-direction:column; }
.opportunity-card .text-action { margin-top:auto; }
.text-action, .inline-actions a { display:inline-block; color:#3159b8; font-size:14px; font-weight:600; text-underline-offset:4px; }
.steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; list-style:none; margin-top:40px; }
.steps-grid li { border-top:1px solid #d6deed; padding-top:22px; }
.step-number { display:block; font-size:13px; color:#697fb6; margin-bottom:24px; }
.steps-grid h3 { font-size:21px; letter-spacing:-.02em; margin-bottom:12px; }
.steps-grid p { font-size:15px; line-height:1.8; color:#5f6b7d; }
.section-note { font-size:13px; color:#677389; margin-top:26px; }
.section-shortcuts { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.section-shortcuts a { padding:9px 16px; border:1px solid #dbe2ef; border-radius:30px; color:#405d9c; text-decoration:none; font-size:13px; min-height:44px; display:inline-flex; align-items:center; }
.section-shortcuts a:hover { background:#edf2ff; }
.professor-contact { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:18px; font-size:13px; color:#3159b8; overflow-wrap:anywhere; }
.facility-shortcuts { margin-top:32px; }
.equipment-purpose { padding:0 18px 22px; color:#637087; font-size:13px; line-height:1.65; }
.contact-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:80px; align-items:start; }
.contact-primary { padding:34px; border:1px solid #dfe5ef; border-radius:22px; background:#f7f9fd; }
.contact-primary h2 { font-size:36px; line-height:1.15; letter-spacing:-.04em; }
.contact-role { color:#637087; margin-top:16px; line-height:1.8; font-size:15px; }
.email-panel { padding:26px 0; margin-top:25px; border-top:1px solid #dce3ef; border-bottom:1px solid #dce3ef; }
.email-panel > span { display:block; text-transform:uppercase; letter-spacing:.12em; font-size:11px; color:#637087; margin-bottom:10px; }
.email-panel > .contact-email { display:block; color:#254da9; font-size:clamp(19px,2.3vw,28px); font-weight:650; text-underline-offset:6px; overflow-wrap:anywhere; }
.contact-primary > .text-action { margin-top:20px; }
.inquiry-list { display:grid; gap:32px; }
.inquiry-list article { border-bottom:1px solid #e1e7f0; padding-bottom:32px; }
.inquiry-list h2 { font-size:24px; line-height:1.3; letter-spacing:-.025em; margin-bottom:12px; }
.inquiry-list p { color:#637087; font-size:15px; line-height:1.8; margin-bottom:20px; }
.inline-actions { display:flex; gap:12px 24px; flex-wrap:wrap; }
@media(max-width:900px) { .contact-layout { grid-template-columns:1fr; gap:40px; } .contact-primary { max-width:620px; } .steps-grid { gap:20px; } }
@media(max-width:600px) { .steps-grid { grid-template-columns:1fr; gap:28px; } .step-number { margin-bottom:12px; } .contact-primary { padding:25px; } .contact-primary h2 { font-size:30px; } .footer-links a { min-height:44px; display:inline-flex; align-items:center; } }

.email-instruction { margin-top:18px; font-size:12px; color:#637087; }
.email-panel > .contact-email { text-transform:none; letter-spacing:normal; }

/* Research: text-only editorial layout. */
.research-page .research-page-hero { background-image:none; background-color:#0a1428; min-height:360px; }
.research-page .research-page-hero::before { display:none; }
.research-page .research-theme-list { gap:0; }
.research-page .research-theme { display:block; padding:48px 0; border:0; border-top:1px solid #dce3ee; border-radius:0; box-shadow:none; background:transparent; overflow:visible; }
.research-page .research-theme-copy { max-width:850px; margin:0 auto; }
.research-page .research-theme-number { margin-bottom:12px; font-size:18px; color:#637cae; }
.research-page .research-theme h2 { max-width:800px; font-size:clamp(28px,3.2vw,40px); }
.research-page .research-theme-copy > p { max-width:none; font-size:16px; line-height:1.9; }
.research-page .theme-platform { background:none; border-left:0; border-bottom:1px solid #e8ecf3; padding:0 0 18px; }
.research-page .selected-work { margin-top:28px; }
@media(max-width:600px) { .research-page .research-theme { padding:34px 0; } .research-page .research-theme-copy > p { font-size:15px; } .research-page .research-page-hero { min-height:320px; } }

.join-contact { max-width:900px; min-height:220px; }
.join-contact h2 { font-size:clamp(25px,4vw,36px); letter-spacing:-.025em; }
.join-contact h2 span { font-weight:500; }
.join-email { margin-top:22px; color:#3f568a; font-size:clamp(18px,3vw,24px); overflow-wrap:anywhere; }
.person-name-en { font-size:.72em; font-weight:500; color:#596780; }

.join-invitation { max-width:760px; margin-bottom:22px; color:#566176; font-size:17px; line-height:1.9; }
.join-invitation + h2 { margin-top:40px; }