:root {
  color-scheme: light;
  --navy: #0b2e59;
  --navy-deep: #071f3d;
  --navy-ink: #09264a;
  --blue: #1d68a9;
  --blue-light: #dcecf7;
  --mist: #dceaf3;
  --paper: #eaf3f8;
  --surface: #f8fcff;
  --text: #142b45;
  --muted: #526d83;
  --line: #bdd2e1;
  --shadow: 0 18px 52px rgb(20 73 112 / 0.13);
  --radius: 14px;
  --shell: min(1180px, calc(100% - 48px));
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", Arial, sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  position: relative;
  margin: 0;
  overflow-x: hidden;
  background: radial-gradient(circle at 76% -8%, #a7d3eb 0%, transparent 33%), radial-gradient(circle at 12% 44%, #d5ebf7 0%, transparent 30%), linear-gradient(135deg, #f6fbfe, #dfedf5 56%, #edf6fb);
  color: var(--text);
  font-size: 16px;
  line-height: 1.7;
  text-rendering: optimizeLegibility;
}

.site-header, main, .site-footer { position: relative; z-index: 1; }

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

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

button { font: inherit; }

.shell { width: var(--shell); margin: 0 auto; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: -56px;
  left: 20px;
  z-index: 20;
  padding: 8px 14px;
  background: var(--surface);
  border-radius: 6px;
  box-shadow: var(--shadow);
}

.skip-link:focus { top: 14px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  min-height: 74px;
  background: linear-gradient(115deg, rgb(255 255 255 / 0.82), rgb(228 243 252 / 0.7)), rgb(245 251 255 / 0.68);
  border-bottom: 1px solid rgb(255 255 255 / 0.74);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.7), 0 8px 26px rgb(20 73 112 / 0.08);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
}

.header-inner {
  min-height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.brand-logo-frame { display: grid; flex: 0 0 52px; width: 52px; height: 52px; overflow: hidden; place-items: start; }
.brand-logo { width: 76px; max-width: none; height: 76px; transform: translate3d(-12px, -12px, 0); transform-origin: top left; transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1); }

.brand-copy { display: grid; min-width: 0; line-height: 1.15; }
.brand-copy strong { color: var(--navy); font-size: clamp(17px, 1.5vw, 22px); letter-spacing: 0.015em; white-space: nowrap; transition: color 220ms ease; }
.brand-copy span { margin-top: 4px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: 0.13em; white-space: nowrap; }
.brand:hover .brand-logo, .brand:focus-visible .brand-logo { transform: translate3d(-12px, -12px, 0) scale(1.06); }
.brand:hover .brand-copy strong, .brand:focus-visible .brand-copy strong { color: var(--blue); }

.site-nav { display: flex; align-items: center; gap: 28px; font-size: 15px; white-space: nowrap; }

.site-nav a { position: relative; padding: 25px 0 22px; color: #25364a; transition: color 180ms ease; }
.site-nav a::after { position: absolute; right: 0; bottom: 15px; left: 0; height: 2px; background: var(--blue); content: ""; transform: scaleX(0); transform-origin: center; transition: transform 180ms ease; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav .is-current { color: var(--navy); }
.site-nav a:hover::after, .site-nav a:focus-visible::after, .site-nav .is-current::after { transform: scaleX(1); }

.menu-toggle { display: none; }

.hero { position: relative; min-height: min(650px, calc(100dvh - 74px)); overflow: hidden; background: var(--navy-deep); isolation: isolate; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.1); transform-origin: 72% 54%; will-change: transform; z-index: -2; }
.hero-wash { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(3 19 39 / 0.92) 0%, rgb(5 27 55 / 0.86) 35%, rgb(7 31 61 / 0.23) 64%, rgb(7 31 61 / 0.04) 100%); }
.hero-orbit-trace { position: absolute; top: 76%; left: 34%; z-index: 0; width: 95%; height: 2px; pointer-events: none; background: linear-gradient(90deg, transparent 0%, rgb(125 202 251 / 0.08) 12%, rgb(139 213 255 / 0.48) 34%, rgb(186 233 255 / 0.62) 54%, rgb(111 193 246 / 0.34) 74%, transparent 100%); opacity: 0.8; transform: rotate(-17deg); transform-origin: left center; }
.hero-orbit-trace::before { position: absolute; top: -5px; left: 0; width: 28%; height: 12px; border-radius: 50%; background: linear-gradient(90deg, transparent, rgb(125 210 255 / 0.22) 20%, rgb(222 247 255 / 0.95) 50%, rgb(102 193 247 / 0.45) 75%, transparent); box-shadow: 0 0 16px rgb(118 205 255 / 0.68); content: ""; transform: translate3d(0, 0, 0); will-change: transform; }

.hero-content { position: relative; z-index: 1; min-height: min(650px, calc(100dvh - 74px)); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-top: 38px; padding-bottom: 60px; color: #f7fbff; }

.kicker { margin: 0 0 17px; color: #abc9e7; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; line-height: 1.4; }
.kicker-blue { color: var(--blue); }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: inherit; line-height: 1.17; letter-spacing: -0.035em; }
h1 { max-width: none; margin-bottom: 22px; font-size: clamp(46px, 5.2vw, 76px); font-weight: 700; white-space: nowrap; }
.hero-title-gradient { color: transparent; background: linear-gradient(100deg, #f7fbff 0%, #c5ecff 18%, #69b8e8 39%, #eaf9ff 56%, #79c3ed 77%, #f7fbff 100%); background-size: 300% 100%; background-position: 0% 50%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
h2 { margin-bottom: 22px; font-size: clamp(32px, 3.1vw, 48px); font-weight: 700; }
h3 { margin-bottom: 13px; font-size: clamp(23px, 2vw, 31px); }
.focus-title { position: relative; display: flex; width: fit-content; flex-wrap: wrap; gap: 0 0.24em; isolation: isolate; }
.focus-word { position: relative; z-index: 1; display: inline-block; transition: filter 500ms ease, opacity 500ms ease; }
html.has-js .focus-word:not(.is-active) { filter: blur(2px); opacity: 0.72; }
.focus-frame { position: absolute; z-index: 0; top: 0; left: 0; width: 0; height: 0; pointer-events: none; opacity: 0; transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1), width 500ms cubic-bezier(0.16, 1, 0.3, 1), height 500ms cubic-bezier(0.16, 1, 0.3, 1), opacity 180ms ease; }
.focus-corner { position: absolute; width: 10px; height: 10px; border-color: rgb(25 103 169 / 0.76); filter: drop-shadow(0 0 5px rgb(90 185 237 / 0.48)); }
.focus-corner-top-left { top: -4px; left: -4px; border-top: 1px solid; border-left: 1px solid; }
.focus-corner-top-right { top: -4px; right: -4px; border-top: 1px solid; border-right: 1px solid; }
.focus-corner-bottom-left { bottom: -4px; left: -4px; border-bottom: 1px solid; border-left: 1px solid; }
.focus-corner-bottom-right { right: -4px; bottom: -4px; border-right: 1px solid; border-bottom: 1px solid; }
.hero-intro { max-width: 30em; margin-bottom: 30px; color: #dbe9f7; font-size: 18px; line-height: 1.75; }

.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 5px; font-weight: 700; line-height: 1; transition: background 180ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1); }
.button-primary { color: var(--navy); background: rgb(241 248 255 / 0.84); border: 1px solid rgb(255 255 255 / 0.82); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.84), 0 10px 24px rgb(19 75 118 / 0.16); backdrop-filter: blur(14px) saturate(135%); -webkit-backdrop-filter: blur(14px) saturate(135%); }
.button:hover { background: rgb(249 252 255 / 0.96); transform: translateY(-3px); }
.button:active { transform: translateY(0); }

a:focus-visible, button:focus-visible { outline: 3px solid rgb(29 95 159 / 0.55); outline-offset: 3px; }

.quick-links { position: relative; z-index: 3; margin-top: -10px; padding-bottom: 14px; }
.quick-links-grid { display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; background: linear-gradient(105deg, rgb(230 246 255 / 0.62), rgb(174 217 242 / 0.42)), rgb(200 231 248 / 0.36); border: 1px solid rgb(216 241 255 / 0.58); border-top-color: rgb(237 250 255 / 0.36); border-radius: var(--radius); box-shadow: 0 10px 28px rgb(20 73 112 / 0.08), inset 0 1px 0 rgb(255 255 255 / 0.46); backdrop-filter: blur(19px) saturate(135%); -webkit-backdrop-filter: blur(19px) saturate(135%); }
.quick-link { position: relative; min-height: 126px; padding: 28px 38px; border-right: 1px solid rgb(139 190 220 / 0.38); transition: background 220ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1); }
.quick-link:last-child { border-right: 0; }
.quick-link::after { position: absolute; right: 34px; bottom: 25px; color: var(--blue); content: "→"; font-size: 20px; opacity: 0; transform: translate3d(-8px, 0, 0); transition: opacity 180ms ease, transform 220ms cubic-bezier(0.16, 1, 0.3, 1); }
.quick-link:hover { background: rgb(214 235 248 / 0.76); transform: translateY(-5px); }
.quick-link:hover::after, .quick-link:focus-visible::after { opacity: 1; transform: translate3d(0, 0, 0); }
.quick-link span { display: block; margin-bottom: 7px; color: var(--navy); font-size: 21px; font-weight: 700; letter-spacing: -0.025em; }
.quick-link small { display: block; color: var(--muted); font-size: 14px; line-height: 1.6; }
.quick-link-featured { background: rgb(202 233 249 / 0.26); }

.section { padding: 118px 0; }
.section-heading { max-width: 530px; }
.section-heading > p:not(.kicker), .solution-copy > p:not(.kicker), .research-copy p { color: var(--muted); }
.section-heading-wide { max-width: 660px; margin-bottom: 47px; }

.about { position: relative; overflow: hidden; background: radial-gradient(circle at 9% 10%, rgb(151 205 236 / 0.42), transparent 26%), rgb(235 245 251 / 0.76); isolation: isolate; }
.about::before { position: absolute; top: -230px; right: -100px; z-index: -1; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgb(129 194 234 / 0.31), transparent 68%); content: ""; filter: blur(12px); }
.about-layout { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr); gap: clamp(50px, 10vw, 142px); align-items: end; padding: clamp(32px, 4vw, 48px); background: linear-gradient(135deg, rgb(255 255 255 / 0.76), rgb(225 242 251 / 0.5)), rgb(246 251 254 / 0.5); border: 1px solid rgb(255 255 255 / 0.9); border-radius: var(--radius); box-shadow: 0 22px 65px rgb(20 73 112 / 0.11), inset 0 1px 0 rgb(255 255 255 / 0.88); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); }
.about-actions { display: grid; justify-items: start; gap: 14px; margin-top: 28px; }
.about-explore-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; min-width: min(100%, 358px); padding: 14px 16px 14px 18px; color: var(--navy); background: linear-gradient(110deg, rgb(255 255 255 / 0.8), rgb(205 233 249 / 0.62)), rgb(230 244 253 / 0.65); border: 1px solid rgb(255 255 255 / 0.9); border-radius: 10px; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.9), 0 12px 28px rgb(19 75 118 / 0.09); backdrop-filter: blur(18px) saturate(145%); -webkit-backdrop-filter: blur(18px) saturate(145%); transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms ease, box-shadow 180ms ease; }
.about-explore-link strong, .about-explore-link small { display: block; }
.about-explore-link strong { font-size: 16px; line-height: 1.45; }
.about-explore-link small { margin-top: 2px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.about-explore-link b { color: var(--blue); font-size: 23px; font-weight: 400; transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1); }
.about-explore-link:hover, .about-explore-link:focus-visible { background: linear-gradient(110deg, rgb(255 255 255 / 0.96), rgb(191 225 246 / 0.78)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.98), 0 16px 34px rgb(19 75 118 / 0.15); transform: translate3d(0, -4px, 0); }
.about-explore-link:hover b, .about-explore-link:focus-visible b { transform: translate3d(5px, 0, 0); }
.about-statement { position: relative; min-height: 270px; padding: 43px 42px; overflow: hidden; color: #eaf5ff; background: linear-gradient(128deg, rgb(8 41 78 / 0.86), rgb(19 89 143 / 0.64)), rgb(11 46 89 / 0.7); border: 1px solid rgb(213 238 255 / 0.3); border-radius: var(--radius); box-shadow: 0 20px 52px rgb(7 31 61 / 0.2), inset 0 1px 0 rgb(238 249 255 / 0.22); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); }
.about-statement::before { position: absolute; top: -104px; right: -62px; width: 292px; height: 292px; border: 1px solid rgb(205 229 250 / 0.35); border-radius: 50%; content: ""; }
.about-statement p { position: relative; max-width: 15em; margin: 0; font-size: clamp(21px, 2vw, 29px); font-weight: 600; line-height: 1.65; letter-spacing: -0.025em; }
.about-statement span { position: absolute; right: 37px; bottom: 25px; color: #8eb7dd; font-size: 14px; letter-spacing: 0.16em; }
.text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--blue); font-weight: 700; }
.text-link:hover { color: var(--navy); }

.institute-profile { position: relative; padding: 0 0 118px; overflow: hidden; background: rgb(229 241 248 / 0.78); isolation: isolate; }
.institute-profile::before { position: absolute; right: 8%; bottom: -180px; z-index: -1; width: 470px; height: 470px; border-radius: 50%; background: radial-gradient(circle, rgb(130 196 235 / 0.28), transparent 68%); content: ""; filter: blur(14px); }
.institute-profile-panel { display: grid; grid-template-columns: minmax(270px, 0.78fr) minmax(0, 1.22fr); gap: clamp(34px, 6vw, 82px); align-items: stretch; padding: clamp(32px, 4vw, 50px); overflow: hidden; background: linear-gradient(135deg, rgb(255 255 255 / 0.72), rgb(214 237 250 / 0.52)), rgb(244 250 254 / 0.48); border: 1px solid rgb(255 255 255 / 0.88); border-radius: var(--radius); box-shadow: 0 24px 68px rgb(20 73 112 / 0.12), inset 0 1px 0 rgb(255 255 255 / 0.88); backdrop-filter: blur(25px) saturate(155%); -webkit-backdrop-filter: blur(25px) saturate(155%); }
.profile-intro { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.profile-intro > p:not(.kicker) { max-width: 25em; margin-bottom: 26px; color: var(--muted); }
.button-profile { color: #f5fbff; background: linear-gradient(135deg, rgb(16 72 120 / 0.88), rgb(19 104 160 / 0.78)), rgb(11 46 89 / 0.82); border: 1px solid rgb(192 231 255 / 0.34); box-shadow: inset 0 1px 0 rgb(239 250 255 / 0.2), 0 12px 28px rgb(7 45 82 / 0.18); backdrop-filter: blur(12px) saturate(135%); -webkit-backdrop-filter: blur(12px) saturate(135%); }
.button-profile:hover { color: #ffffff; background: linear-gradient(135deg, rgb(20 91 147 / 0.94), rgb(26 119 178 / 0.86)); }
.profile-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(190px, 0.85fr); grid-template-rows: 1fr 1fr; gap: 14px; }
.profile-tile { min-height: 166px; padding: 25px 27px; color: var(--text); background: linear-gradient(135deg, rgb(255 255 255 / 0.68), rgb(213 237 250 / 0.38)), rgb(239 248 253 / 0.46); border: 1px solid rgb(255 255 255 / 0.82); border-radius: 10px; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.82); backdrop-filter: blur(18px) saturate(145%); -webkit-backdrop-filter: blur(18px) saturate(145%); transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 180ms ease, box-shadow 180ms ease; }
.profile-tile-lead { grid-row: span 2; min-height: 346px; color: #edf7ff; background-image: linear-gradient(145deg, rgb(4 29 57 / 0.91), rgb(7 49 86 / 0.73)), url("/assets/hero-satellite.webp"); background-position: 66% center; background-size: cover; border-color: rgb(216 240 255 / 0.34); box-shadow: 0 14px 38px rgb(4 28 54 / 0.15), inset 0 1px 0 rgb(238 249 255 / 0.22); }
.profile-tile-label { display: block; margin-bottom: 23px; color: #a2cbeb; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; }
.profile-tile h3 { margin-bottom: 14px; font-size: clamp(22px, 2vw, 28px); }
.profile-tile p { margin-bottom: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.profile-tile-lead p { max-width: 18em; color: #d5e8f7; }
.profile-tile-business { display: flex; flex-direction: column; justify-content: center; }
.profile-tile-business .profile-tile-label { margin-bottom: 12px; color: var(--blue); }
.profile-tile-business ul { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; padding: 0; margin: 0; list-style: none; }
.profile-tile-business li { color: var(--navy); font-size: 13px; font-weight: 700; line-height: 1.5; }
.profile-tile-business li::before { margin-right: 7px; color: var(--blue); content: "·"; }

.services { background: rgb(220 235 245 / 0.82); }
.services-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
.service-feature { overflow: hidden; border-radius: var(--radius); }
.service-feature-gallery { position: relative; min-height: 440px; background: var(--navy); border: 1px solid rgb(129 193 231 / 0.5); box-shadow: 0 15px 38px rgb(13 54 88 / 0.15); isolation: isolate; }
.remote-gallery { position: absolute; inset: 0; display: flex; gap: 8px; padding: 8px; perspective: 900px; }
.remote-gallery-panel { position: relative; flex: 1 1 0; min-width: 0; padding: 0; overflow: hidden; color: #f6fbff; appearance: none; background: #0a2b4e; border: 0; border-radius: 10px; cursor: pointer; transform: translateZ(0); transition: flex-grow 620ms cubic-bezier(0.16, 1, 0.3, 1), filter 420ms ease; }
.remote-gallery-panel.is-active { flex-grow: 4.1; cursor: default; }
.remote-gallery-panel > img { position: absolute; top: 50%; left: 50%; width: 126%; height: 100%; max-width: none; object-fit: cover; filter: grayscale(0.78) brightness(0.7) saturate(0.7); transform: translate3d(-50%, -50%, 0) scale(1.04); transition: filter 620ms ease, transform 700ms cubic-bezier(0.16, 1, 0.3, 1); }
.remote-gallery-panel.is-active > img { filter: grayscale(0) brightness(0.88) saturate(1); transform: translate3d(-50%, -50%, 0) scale(1); }
.remote-gallery-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgb(3 23 43 / 0.76), rgb(4 28 52 / 0.08) 60%); transition: background 520ms ease; }
.remote-gallery-panel.is-active .remote-gallery-overlay { background: linear-gradient(0deg, rgb(3 22 42 / 0.68), rgb(4 27 50 / 0.05) 62%); }
.remote-gallery-label { position: absolute; bottom: 23px; left: 18px; z-index: 1; display: grid; gap: 4px; text-align: left; text-shadow: 0 2px 14px rgb(0 19 38 / 0.75); transition: opacity 260ms ease, transform 420ms cubic-bezier(0.16, 1, 0.3, 1); }
.remote-gallery-label small { color: #b5d8ef; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; }
.remote-gallery-label strong { color: #f5fbff; font-size: 17px; letter-spacing: -0.025em; white-space: nowrap; }
.remote-gallery-panel:not(.is-active) .remote-gallery-label { bottom: 18px; left: 50%; opacity: 0.88; transform: translateX(-50%); writing-mode: vertical-rl; text-orientation: mixed; }
.remote-gallery-panel:not(.is-active) .remote-gallery-label small { display: none; }
.remote-gallery-panel:not(.is-active) .remote-gallery-label strong { font-size: 13px; letter-spacing: 0.08em; }
.remote-gallery-panel:focus-visible { outline: 2px solid #d9f1ff; outline-offset: -4px; }
.service-feature-copy { position: absolute; right: 30px; bottom: 28px; left: 30px; z-index: 2; max-width: 520px; padding: 19px 21px; color: #f7fbff; background: rgb(3 24 47 / 0.47); border: 1px solid rgb(213 234 251 / 0.25); border-radius: 10px; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.17); backdrop-filter: blur(15px) saturate(130%); -webkit-backdrop-filter: blur(15px) saturate(130%); transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1), background 220ms ease; }
.service-feature-copy h3 { margin-bottom: 10px; }
.service-feature-copy p { max-width: 36em; margin: 0; color: #dbe9f7; font-size: 15px; }
.service-feature-copy .service-label { margin-bottom: 12px; color: #a9d3ee; }
.service-stack { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.service-feature-tone, .service-feature-plain { position: relative; isolation: isolate; padding: 42px; overflow: hidden; color: #f2f8ff; background: var(--navy); transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1); }
.service-stack .service-feature-tone, .service-stack .service-feature-plain { min-height: 280px; }
.service-feature-plain { border: 1px solid rgb(119 185 226 / 0.36); }
.service-feature-background { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 700ms cubic-bezier(0.16, 1, 0.3, 1); }
.service-feature-tone::after, .service-feature-plain::after { position: absolute; inset: 0; z-index: 1; content: ""; }
.service-feature-tone::after { background: linear-gradient(112deg, rgb(4 25 49 / 0.92) 0%, rgb(5 34 65 / 0.75) 54%, rgb(5 28 53 / 0.38) 100%); }
.service-feature-plain::after { background: linear-gradient(112deg, rgb(4 25 49 / 0.9) 0%, rgb(5 37 68 / 0.72) 53%, rgb(5 32 59 / 0.32) 100%); }
.service-feature-tone > :not(.service-feature-background), .service-feature-plain > :not(.service-feature-background) { position: relative; z-index: 2; }
.service-label { display: inline-block; margin-bottom: 44px; color: #a5c6e5; font-size: 13px; font-weight: 700; }
.service-feature-tone h3 { color: #f7fbff; }
.service-feature-tone p { margin-bottom: 0; color: #cbddef; }
.service-feature-plain .service-label { color: #a5c6e5; }
.service-feature-plain h3 { color: #f7fbff; }
.service-feature-plain p { margin-bottom: 0; color: #cbddef; }

.solutions { background: rgb(242 249 253 / 0.78); }
.solutions-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, 0.87fr); gap: clamp(45px, 8vw, 100px); align-items: center; }
.solution-image-wrap { min-height: 500px; overflow: hidden; border-radius: var(--radius); box-shadow: var(--shadow); }
.solution-image-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms cubic-bezier(0.16, 1, 0.3, 1); }
.solution-copy { max-width: 470px; }
.solution-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 20px; padding: 0; margin: 30px 0 0; list-style: none; }
.solution-list li { position: relative; padding-left: 17px; color: #304e69; font-size: 15px; }
.solution-list li::before { position: absolute; top: 0.75em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); content: ""; }

.research { position: relative; padding: 106px 0; overflow: hidden; background: linear-gradient(135deg, rgb(211 231 243 / 0.82), rgb(226 240 248 / 0.8)); isolation: isolate; }
.research::before { position: absolute; top: -230px; right: -95px; z-index: -1; width: 610px; height: 610px; border-radius: 50%; background: radial-gradient(circle, rgb(114 190 236 / 0.46), transparent 67%); content: ""; filter: blur(15px); }
.research::after { position: absolute; bottom: -160px; left: -100px; z-index: -1; width: 430px; height: 430px; border-radius: 50%; background: radial-gradient(circle, rgb(255 255 255 / 0.82), transparent 68%); content: ""; filter: blur(8px); }
.research-layout { position: relative; display: grid; grid-template-columns: minmax(0, 0.83fr) minmax(380px, 1.17fr); gap: clamp(52px, 9vw, 135px); align-items: start; padding: clamp(34px, 4vw, 50px); overflow: hidden; background: linear-gradient(135deg, rgb(255 255 255 / 0.72), rgb(213 238 251 / 0.42)), rgb(242 249 253 / 0.46); border: 1px solid rgb(255 255 255 / 0.9); border-radius: var(--radius); box-shadow: 0 24px 64px rgb(19 75 118 / 0.12), inset 0 1px 0 rgb(255 255 255 / 0.9); backdrop-filter: blur(25px) saturate(155%); -webkit-backdrop-filter: blur(25px) saturate(155%); }
.research-copy, .research-topics { position: relative; z-index: 1; }
.research-copy { max-width: 420px; }
.research-signal { position: absolute; bottom: 36px; left: clamp(34px, 4vw, 50px); z-index: 0; width: min(33%, 330px); height: 82px; overflow: hidden; pointer-events: none; opacity: 0.74; }
.research-signal-grid { position: absolute; inset: 0; background-image: linear-gradient(rgb(59 133 184 / 0.16) 1px, transparent 1px), linear-gradient(90deg, rgb(59 133 184 / 0.16) 1px, transparent 1px); background-size: 18px 18px; mask-image: linear-gradient(90deg, transparent, #000 16%, #000 82%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 16%, #000 82%, transparent); }
.research-signal-beam { position: absolute; top: 39px; left: -42%; width: 38%; height: 1px; background: linear-gradient(90deg, transparent, rgb(39 135 197 / 0.72), #d7f5ff, rgb(39 135 197 / 0.72), transparent); box-shadow: 0 0 12px rgb(78 176 227 / 0.68); }
.research-signal-dot { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #7dcbf3; box-shadow: 0 0 0 4px rgb(90 179 226 / 0.13), 0 0 12px rgb(72 168 220 / 0.7); }
.research-signal-dot-one { top: 15px; left: 28%; }
.research-signal-dot-two { top: 55px; left: 56%; }
.research-signal-dot-three { top: 28px; left: 78%; }
.research-topics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.research-topics a { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 118px; padding: 23px 22px; color: var(--navy); background: linear-gradient(130deg, rgb(255 255 255 / 0.72), rgb(205 233 250 / 0.46)), rgb(234 246 253 / 0.48); border: 1px solid rgb(255 255 255 / 0.88); border-radius: 10px; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.84), 0 10px 25px rgb(21 78 120 / 0.08); backdrop-filter: blur(18px) saturate(145%); -webkit-backdrop-filter: blur(18px) saturate(145%); font-size: 18px; font-weight: 700; transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms ease, box-shadow 180ms ease; }
.research-topics a span { color: var(--blue); font-size: 22px; transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1); }
.research-topics a:hover { color: var(--blue); background: linear-gradient(130deg, rgb(255 255 255 / 0.92), rgb(185 224 248 / 0.68)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.96), 0 16px 30px rgb(21 78 120 / 0.15); transform: translate3d(0, -5px, 0); }
.research-topics a:hover span, .research-topics a:focus-visible span { transform: translate3d(5px, 0, 0); }

.contact { position: relative; padding: 98px 0; overflow: hidden; color: #edf6ff; background: radial-gradient(circle at 88% 20%, rgb(50 140 200 / 0.45), transparent 29%), linear-gradient(125deg, #082647, #0d3d70); isolation: isolate; }
.contact::before { position: absolute; bottom: -240px; left: -115px; z-index: -1; width: 560px; height: 560px; border: 1px solid rgb(177 224 252 / 0.23); border-radius: 50%; box-shadow: 0 0 0 54px rgb(177 224 252 / 0.045), 0 0 0 110px rgb(177 224 252 / 0.035); content: ""; }
.contact-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 0.72fr); gap: 70px; align-items: end; padding: clamp(32px, 4vw, 48px); background: linear-gradient(130deg, rgb(214 240 255 / 0.13), rgb(77 159 214 / 0.09)), rgb(6 34 65 / 0.22); border: 1px solid rgb(220 243 255 / 0.21); border-radius: var(--radius); box-shadow: inset 0 1px 0 rgb(240 251 255 / 0.16), 0 22px 58px rgb(1 15 35 / 0.22); backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%); }
.contact h2 { margin: 0; color: #f6fbff; }
.contact-details { max-width: 390px; color: #d2e2f1; }
.contact-details p { margin-bottom: 18px; }
.contact-phone { display: inline-grid; gap: 2px; min-width: 250px; padding-top: 18px; border-top: 1px solid rgb(180 210 238 / 0.36); color: #d9ecfb; }
.contact-phone span { color: #a8c6e2; font-size: 13px; }
.contact-phone strong { color: #f5fbff; font-size: clamp(22px, 2.4vw, 32px); letter-spacing: 0.025em; }
.contact-phone:hover strong, .contact-phone:focus-visible strong { color: #bfe7ff; }

.site-footer { padding: 32px 0; color: #5f7488; background: rgb(241 248 252 / 0.9); border-top: 1px solid rgb(255 255 255 / 0.74); }
.footer-inner { display: grid; grid-template-columns: 1fr auto auto; gap: 26px; align-items: center; font-size: 13px; }
.footer-brand { display: flex; align-items: baseline; gap: 10px; color: var(--muted); }
.footer-brand strong { color: var(--navy); letter-spacing: 0.12em; }
.footer-inner p { margin: 0; }
.record-link { text-align: right; }
.record-link a:hover, .record-link a:focus-visible { color: var(--blue-light); }

/* 内容默认可见。避免弱网、快速滚动或不支持观察器的环境出现大面积空白。 */
html.has-js .reveal, html.has-js .reveal.is-visible { opacity: 1; transform: none; }

@media (hover: hover) and (pointer: fine) {
  .profile-tile:hover { border-color: rgb(160 213 243 / 0.72); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.86), 0 16px 32px rgb(19 75 118 / 0.13); transform: translate3d(0, -5px, 0); }
  .remote-gallery-panel:hover > img { transform: translate3d(-50%, -50%, 0) scale(1.06); }
  .remote-gallery-panel.is-active:hover > img { transform: translate3d(-50%, -50%, 0) scale(1.025); }
  .service-feature-gallery:hover .service-feature-copy { background: rgb(3 24 47 / 0.64); transform: translate3d(0, -5px, 0); }
  .service-feature-tone:hover, .service-feature-plain:hover { transform: translate3d(0, -5px, 0); }
  .service-feature-tone:hover .service-feature-background, .service-feature-plain:hover .service-feature-background { transform: scale(1.06); }
  .solution-image-wrap:hover img { transform: scale(1.055); }
}

@keyframes orbital-drift {
  0% { transform: scale(1.1) translate3d(-2.2%, 2.1%, 0) rotate(-0.55deg); }
  50% { transform: scale(1.18) translate3d(2.65%, -1.75%, 0) rotate(0.36deg); }
  100% { transform: scale(1.13) translate3d(-1.15%, -2.55%, 0) rotate(-0.28deg); }
}

@keyframes wash-breathe {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.83; }
}

@keyframes headline-gradient-flow {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

@keyframes orbit-light-sweep {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(220%, 0, 0); }
}

@keyframes research-signal-sweep {
  0%, 22% { transform: translate3d(0, 0, 0); opacity: 0; }
  36%, 72% { opacity: 1; }
  100% { transform: translate3d(405%, 0, 0); opacity: 0; }
}

@keyframes research-signal-pulse {
  0%, 100% { opacity: 0.46; transform: scale(0.86); }
  50% { opacity: 1; transform: scale(1.18); }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-image { animation: orbital-drift 11s cubic-bezier(0.42, 0, 0.58, 1) infinite alternate; }
  .hero-wash { animation: wash-breathe 7s ease-in-out infinite; }
  .hero-orbit-trace::before { animation: orbit-light-sweep 4.8s ease-in-out infinite; }
  .hero-title-gradient { animation: headline-gradient-flow 8s ease-in-out infinite alternate; }
  .hero-title-gradient:hover { animation-play-state: paused; }
  .research-signal-beam { animation: research-signal-sweep 4.8s ease-in-out infinite; }
  .research-signal-dot { animation: research-signal-pulse 3.6s ease-in-out infinite; }
  .research-signal-dot-two { animation-delay: 1.1s; }
  .research-signal-dot-three { animation-delay: 2.2s; }
}

@media (max-width: 960px) {
  :root { --shell: min(100% - 40px, 760px); }
  .site-header, .header-inner { min-height: 68px; }
  .header-inner { gap: 18px; }
  .brand-copy strong { font-size: 18px; }
  .brand-copy span { font-size: 9px; }
  .site-nav { gap: 17px; font-size: 14px; }
  .site-nav a { padding: 22px 0 20px; }
  .site-nav a::after { bottom: 12px; }
  .hero, .hero-content { min-height: min(600px, calc(100dvh - 68px)); }
  .quick-link { padding: 28px 22px; }
  .service-feature-copy { right: 24px; bottom: 24px; left: 24px; padding: 19px 20px; }
  .section { padding: 88px 0; }
  .about-layout, .solutions-layout { gap: 50px; }
  .institute-profile { padding-bottom: 88px; }
  .institute-profile-panel { gap: 34px; }
  .services-layout { grid-template-columns: minmax(0, 1fr); }
  .service-feature-tone, .service-feature-plain { padding: 32px; }
  .research-layout { gap: 50px; }
  .footer-inner { grid-template-columns: 1fr; gap: 8px; }
  .record-link { text-align: left; }
}

@media (max-width: 740px) {
  :root { --shell: min(100% - 32px, 560px); }
  .brand { flex: 1 1 auto; }
  .brand-copy strong { max-width: calc(100vw - 154px); overflow: hidden; font-size: 16px; text-overflow: ellipsis; }
  .brand-copy span { max-width: calc(100vw - 154px); overflow: hidden; font-size: 8px; text-overflow: ellipsis; }
  .menu-toggle { display: grid; flex: 0 0 42px; width: 42px; height: 42px; padding: 0; place-content: center; gap: 6px; color: var(--navy); background: transparent; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
  .menu-toggle span:not(.sr-only) { display: block; width: 18px; height: 2px; background: currentColor; transition: transform 180ms ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-4px) rotate(-45deg); }
  .site-nav { position: absolute; top: 68px; right: 0; left: 0; display: none; padding: 12px 16px 20px; background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); }
  .site-nav.is-open { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 24px; }
  .site-nav a { padding: 13px 0; }
  .site-nav a::after { display: none; }
  .hero, .hero-content { min-height: 560px; }
  .hero-image { object-position: 65% center; }
  .hero-wash { background: linear-gradient(90deg, rgb(3 19 39 / 0.91), rgb(5 27 55 / 0.78) 63%, rgb(7 31 61 / 0.2)); }
  .hero-orbit-trace { top: 75%; left: 12%; width: 120%; transform: rotate(-12deg); }
  .hero-content { padding-top: 34px; padding-bottom: 55px; }
  h1 { max-width: none; margin-bottom: 18px; font-size: clamp(38px, 11.2vw, 52px); }
  .hero-intro { max-width: 25em; font-size: 16px; }
  .quick-links-grid { grid-template-columns: 1fr; }
  .quick-links { margin-top: 0; }
  .quick-link { min-height: 0; padding: 22px 2px; border-right: 0; border-bottom: 1px solid var(--line); }
  .quick-link::after { right: 2px; bottom: 19px; }
  .quick-link:last-child { border-bottom: 0; }
  .quick-link-featured { padding-right: 2px; padding-left: 2px; background: transparent; }
  .section { padding: 72px 0; }
  .about-layout, .institute-profile-panel, .services-layout, .solutions-layout, .research-layout, .contact-inner { grid-template-columns: 1fr; gap: 34px; }
  .about-statement { min-height: 225px; padding: 32px 28px; }
  .about-explore-link { width: 100%; }
  .institute-profile { padding-bottom: 72px; }
  .profile-grid { grid-template-columns: 1fr; grid-template-rows: auto; }
  .profile-tile, .profile-tile-lead { grid-row: auto; min-height: 0; }
  .profile-tile-lead { min-height: 270px; }
  .services-layout { gap: 16px; }
  .service-feature-gallery { min-height: 400px; }
  .remote-gallery { gap: 5px; padding: 5px; }
  .remote-gallery-panel.is-active { flex-grow: 3.8; }
  .remote-gallery-label { bottom: 17px; left: 14px; }
  .remote-gallery-label strong { font-size: 14px; }
  .service-stack { grid-template-columns: 1fr; grid-template-rows: repeat(2, minmax(240px, auto)); gap: 16px; }
  .service-feature-tone, .service-feature-plain { min-height: 240px; padding: 29px 28px; }
  .research-signal { display: none; }
  .service-label { margin-bottom: 28px; }
  .solution-image-wrap { min-height: 350px; }
  .solution-list { grid-template-columns: 1fr; margin-top: 23px; }
  .research-topics { grid-template-columns: 1fr; }
  .research-topics a:nth-child(odd) { margin-right: 0; }
  .contact { padding: 72px 0; }
  .footer-brand { align-items: flex-start; flex-direction: column; gap: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .focus-frame { display: none; }
  .focus-word { filter: none !important; opacity: 1 !important; }
}

@media (prefers-reduced-transparency: reduce) {
  .site-header, .quick-links-grid, .button-primary, .about-layout, .about-explore-link, .about-statement, .institute-profile-panel, .profile-tile, .research-layout, .research-topics a, .contact-inner, .service-feature-copy { backdrop-filter: none; -webkit-backdrop-filter: none; }
  .site-header { background: var(--surface); }
  .quick-links-grid { background: var(--surface); }
  .button-primary { color: var(--navy); background: #eef7ff; border-color: #b8d6ea; }
  .about-layout, .institute-profile-panel, .profile-tile, .research-layout, .research-topics a { background: var(--surface); }
  .about-statement, .profile-tile-lead, .contact-inner { background: var(--navy); }
  .service-feature-copy { background: rgb(3 24 47 / 0.92); }
}