/* About shares the homepage's restrained black, white and neutral-gray palette. */
.about-page {
  --blue:#111;
  --line:#e8e8e8;
  --muted:#666;
  background:#fff;
  color:#111;
  font-family:"Noto Sans SC","Microsoft YaHei","Segoe UI",sans-serif;
}
.about-page :is(a,button,summary):focus-visible{outline:2px solid #111;outline-offset:5px}
.about-page .site-header{position:relative;top:auto;z-index:10;height:72px;padding:0 clamp(22px,calc(6vw / .9),96px);gap:28px;border-bottom:1px solid #ececec;background:#fff;backdrop-filter:none;zoom:.9}
.about-page .site-brand{width:min(220px,calc(42vw / .9));height:100%}
.about-page .site-brand img{width:auto;height:50px;max-width:100%;object-fit:contain;object-position:left center}
.about-page .site-nav{gap:32px;color:#000;font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;font-size:16px;font-weight:400;line-height:1.5}
.about-page .site-nav>a,.about-page .services-menu>summary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 6px;font-size:16px;line-height:1.5}
.about-page .site-nav>a:hover,
.about-page .site-nav>.is-current,
.about-page .services-menu[open]>summary{color:#000}
.about-page .site-nav>.is-current{text-decoration:none}
.about-page .site-nav>a:focus-visible,.about-page .services-menu>summary:focus-visible,.about-page .services-panel>a:focus-visible,.about-page .nav-toggle:focus-visible{outline:2px solid #6380cc;outline-offset:3px;border-radius:7px}
.about-page .site-brand:focus-visible,.about-page .about-header-login:focus-visible{outline:3px solid #98b4ff;outline-offset:4px}
.about-page .services-menu{display:flex;align-items:center;height:100%}
.about-page .services-panel{top:calc(100% - 2px);width:660px;border-color:#e8ecf3;border-radius:20px;box-shadow:0 14px 48px rgb(28 46 83 / .12),0 3px 10px rgb(28 46 83 / .04)}
.about-page .services-panel>:is(a,button){display:flex;align-items:center;gap:13px;min-width:0;min-height:86px;padding:13px 12px;border:0;border-radius:12px;background:transparent;font-family:"Noto Sans SC","Microsoft YaHei",sans-serif;text-align:left}
.about-page .services-panel>a:hover{background:#f6f8fc}
.about-page .services-panel strong{gap:8px;margin:0;color:#26344d;font-size:15px;font-weight:750;line-height:1.3;white-space:nowrap}
.about-page .services-panel small{display:block;margin-top:7px;color:#7c8699;font-size:12px;font-weight:400;line-height:1.5}
.about-page .services-panel em{padding:3px 6px;border-radius:5px;background:#eaf5ef;color:#3b806e;font-size:10px;font-weight:500;line-height:1.3}
.about-page .service-icon{flex-basis:43px;width:43px;height:43px;background:#f3eefb;color:#7654aa}
.about-page .service-icon.is-green{background:#eaf5ef;color:#3c8571}
.about-page .service-icon.is-blue{background:#edf2ff;color:#4664b8}
.about-page .service-icon.is-gold{background:#fcf5df;color:#ac853c}
.about-page .service-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.about-page .services-planned strong{color:#6c7688}
.about-page .services-planned em{background:#f1eef6;color:#8b809e}
.about-page .services-panel>.about-services-all{grid-column:1/-1;justify-content:space-between;min-height:0;margin-top:6px;padding:14px 17px 6px;border-top:1px solid #edf0f6;border-radius:0;color:#4863af;font-size:13px;font-weight:650;line-height:1.5}
.about-page .services-panel>.about-services-all:hover{background:transparent;color:#273c79}
.about-page .header-actions{gap:12px}
.about-page .nav-toggle{width:36px;height:36px;padding:6px;border:1px solid #e4e8f0;border-radius:8px;background:#fff;color:#445674}
.about-page .about-header-login{display:inline-flex;align-items:center;justify-content:center;min-width:88px;min-height:38px;padding:0 16px;border:1px solid #d8dce4;border-radius:8px;background:#fff;color:#27324a;box-shadow:0 4px 12px rgb(34 55 86 / .05);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;font-size:13px;font-weight:650;line-height:1.5;white-space:nowrap}
.about-page .about-header-login:hover{border-color:#8fa8d5;background:#f7f9ff;color:#2455df;box-shadow:0 8px 18px rgb(34 55 86 / .09)}

.about-hero {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);
  align-items:stretch;
  gap:0;
  width:min(1440px,calc(100% - 80px));
  margin:0 auto;
  padding:0;
  background:#fff;
  text-align:left;
}
.about-hero-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  min-width:0;
  padding:32px 28px 32px clamp(24px,3.2vw,48px);
}
.about-hero h1{
  margin:0;
  color:#1d1d1f;
  font-family:"Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC","PingFang SC",sans-serif;
  font-size:clamp(28px,2.55vw,38px);
  font-weight:800;
  line-height:1.35;
  letter-spacing:-.04em;
}
.about-hero h1>span{display:block;white-space:nowrap}
.about-hero h1>span+span{margin-top:12px}
.about-hero-brand{position:relative;top:44px;display:flex;flex-direction:column;align-items:flex-start;max-width:100%;margin-top:32px}
.about-hero-signature{display:inline-flex;align-items:center;justify-content:center;min-height:36px;margin:0;padding:9px 18px;border-radius:6px;background:#000;color:#fff;font-size:14px;font-weight:500;line-height:1.3}
.about-brand-caption{margin:14px 0 0;color:#717171;font-size:13px;font-weight:400;line-height:1.7;letter-spacing:.02em}
.about-hero-photo{width:100%;max-width:840px;min-width:0;margin:0;justify-self:end}
.about-hero-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#fff}
.about-hero-media img{position:absolute;inset:0;display:block;width:100%;height:100%;border:0;border-radius:0;object-fit:cover;object-position:50% 56%;filter:none}
.about-hero-media::after{
  content:"";
  position:absolute;
  inset:-1px auto -1px -1px;
  width:clamp(120px,23%,260px);
  background:radial-gradient(ellipse at -10% 10%,#fff 0%,rgb(255 255 255 / .82) 23%,transparent 64%),radial-gradient(ellipse at -12% 88%,#fff 0%,rgb(255 255 255 / .76) 25%,transparent 68%),linear-gradient(270deg,transparent 0%,rgb(255 255 255 / .05) 18%,rgb(255 255 255 / .48) 64%,#fff 100%);
  pointer-events:none;
}
.about-hero-photo figcaption{margin:8px 0 0;color:#777;font-size:11px;line-height:1.6;text-align:right}
.about-hero-photo figcaption a:hover{text-decoration:underline;text-underline-offset:3px;color:#111}

.about-page .page-section{width:min(1180px,calc(100% - 80px))}
.about-introduction-section{background:#fff}
.about-page .about-story{
  display:block;
  padding:80px 0 0;
}
.about-page .section-heading{margin-bottom:24px}
.about-page .section-heading h2{margin:0;color:#111;font-size:30px;font-weight:500;line-height:1.4;letter-spacing:-.025em}
.about-page .section-heading h2::before{display:none}
.about-page .about-story>.section-heading{margin-bottom:32px;text-align:center}
.about-page .about-story>.section-heading h2{font-family:"Microsoft YaHei UI","Microsoft YaHei","Noto Sans SC","PingFang SC",sans-serif;font-size:30px;font-weight:850;line-height:1.3;letter-spacing:-.03em}
.about-introduction-copy{display:flex;flex-direction:column;align-items:flex-start;padding:36px 40px;border:0;border-radius:9px;background:#f5f5f5;box-shadow:none}
.about-introduction-copy p{margin:0 0 18px;color:#555;font-size:18px;font-weight:400;line-height:1.95}
.about-text-link{
  display:inline-flex;
  align-self:center;
  align-items:center;
  justify-content:center;
  gap:16px;
  min-height:48px;
  margin-top:14px;
  padding:12px 22px;
  border:0;
  border-radius:999px;
  background:#ebebeb;
  color:#111;
  font-size:14px;
  font-weight:500;
  line-height:1.5;
  text-align:center;
}
.about-text-link:hover{background:#dfdfdf;color:#000}
.about-page .about-trust{padding:104px 0 72px}
.about-page .about-trust>.section-heading{margin-bottom:36px;text-align:center}
.about-trust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px}
.about-trust-card{position:relative;isolation:isolate;display:flex;align-items:flex-end;width:100%;min-width:0;min-height:330px;aspect-ratio:1.8;padding:32px;overflow:hidden;border-radius:9px;background:#080b0f;color:#fff}
.about-trust-art{position:absolute;inset:0;z-index:-2;display:block;width:100%;height:100%;max-width:none;object-fit:contain;transition:filter .2s ease}
.about-trust-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgb(4 6 9 / .28) 52%,rgb(4 6 9 / .9) 100%);pointer-events:none}
.about-trust-copy{max-width:48ch}
.about-trust-copy h3{margin:0;color:#fff;font-size:28px;font-weight:500;line-height:1.35;letter-spacing:-.02em}
.about-trust-card:hover .about-trust-art,.about-trust-card:focus-visible .about-trust-art{filter:brightness(1.08)}
@view-transition{navigation:none}
.about-page .about-contact-section{padding:72px 0 96px;border-top:1px solid #e8e8e8}
.about-contact-section .section-heading{margin-bottom:32px}

.about-page .site-footer{border-top:0;background:#f7f7f7}
.about-page .footer-inner{padding-top:36px;padding-bottom:28px}
.about-page .footer-inner>p,
.about-page .footer-inner nav{color:#666}
.about-page .footer-inner nav a:hover{color:#000;text-decoration:underline;text-underline-offset:4px}
.about-page .footer-inner small{color:#777}

@media(min-width:1101px){
  .about-hero{width:min(1224px,calc(85% - 68px))}
  .about-hero-copy{padding:27.2px 23.8px 27.2px clamp(20.4px,2.72vw,40.8px)}
  .about-hero h1{font-size:clamp(23.8px,2.1675vw,32.3px)}
  .about-hero h1>span+span{margin-top:10.2px}
  .about-hero-brand{margin-top:27.2px}
  .about-hero-signature{min-height:30.6px;padding:7.65px 15.3px;font-size:11.9px}
  .about-brand-caption{margin-top:11.9px;font-size:11.5px}
  .about-hero-photo{max-width:714px}
  .about-hero-media::after{width:clamp(102px,23%,221px)}
  .about-hero-photo figcaption{margin-top:6.8px;font-size:10px}
}
@media(max-width:1100px){
  .about-page .site-header{gap:12px}
  .about-page .site-nav{left:22px;right:22px;max-height:none;overflow-y:visible}
  .about-page .site-nav.is-open{gap:4px}
  .about-page .site-nav>a,.about-page .services-menu>summary{justify-content:space-between;padding:12px;font-size:15px}
  .about-page .services-menu{display:block;height:auto}
  .about-page .services-menu>summary{width:100%}
  .about-page .services-panel{position:static;top:auto;left:auto;transform:none;width:100%;padding:0;border:0;border-radius:0;box-shadow:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
  .about-page .services-panel>:is(a,button){align-items:flex-start;gap:9px;min-height:94px;padding:12px 8px}
  .about-page .service-icon{flex-basis:32px;width:32px;height:32px;border-radius:9px;font-size:19px}
  .about-page .service-icon svg{width:20px;height:20px}
  .about-page .service-icon.is-tex{font-size:12px}
  .about-page .services-panel strong{flex-wrap:wrap;gap:5px;font-size:13px}
  .about-page .services-panel small{font-size:11px}
  .about-page .services-panel em{font-size:9px}
  .about-page .services-panel>.about-services-all{min-height:0;margin-top:8px;padding:12px 10px}
  .about-hero{width:calc(100% - 56px);grid-template-columns:minmax(0,1fr)}
  .about-hero-copy{padding:48px 0 28px}
  .about-hero-brand{top:-20px;margin-top:96px}
  .about-hero h1{font-size:32px}
  .about-hero-photo{max-width:760px;justify-self:center}
  .about-hero-media::after{inset:-1px -1px auto;width:auto;height:24%;background:radial-gradient(ellipse at 15% -15%,#fff,transparent 66%),radial-gradient(ellipse at 84% -12%,#fff,transparent 62%),linear-gradient(180deg,#fff,transparent)}
  .about-page .page-section{width:calc(100% - 56px)}
}
@media(max-width:760px){
  .about-page .site-header{height:58px}
  .about-page .site-brand{width:min(180px,calc(55vw / .9))}
  .about-page .site-brand img{height:38px}
  .about-page .about-header-login{min-width:74px;min-height:34px;padding:0 11px;font-size:12px}
  .about-hero{width:calc(100% - 40px)}
  .about-hero-copy{padding:42px 0 24px}
  .about-hero h1{font-size:clamp(24px,4.8vw,32px)}
  .about-page .page-section{width:calc(100% - 40px)}
  .about-page .about-story{padding-top:56px}
  .about-page .about-story>.section-heading h2{font-size:26px}
  .about-introduction-copy{padding:26px 24px}
  .about-introduction-copy p{font-size:16px;line-height:1.9}
  .about-page .about-trust{padding:80px 0 52px}
  .about-trust-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .about-trust-card{min-height:310px;aspect-ratio:1.7;padding:28px}
  .about-trust-copy h3{font-size:24px}
  .about-page .about-contact-section{padding:52px 0 64px}
  .about-page .section-heading h2{font-size:28px}
  .about-page .about-trust>.section-heading h2{font-size:clamp(22px,6vw,28px)}
}
@media(max-width:480px){
  .about-page .site-brand{width:155px}
  .about-page .header-actions{gap:8px}
  .about-page .site-nav{left:14px;right:14px;max-height:calc(100svh - 80px);overflow-y:auto}
  .about-hero h1{font-size:clamp(22px,6.1vw,28px)}
  .about-hero-brand{margin-top:90px}
  .about-brand-caption{font-size:12px;letter-spacing:0}
  .about-trust-card{min-height:320px;aspect-ratio:auto;padding:24px}
  .about-trust-copy h3{font-size:23px}
  .about-introduction-copy{padding:24px 22px}
  .about-text-link{max-width:100%;gap:10px;font-size:13px;padding-inline:16px}
}
@media(forced-colors:active){
  .about-hero h1{color:CanvasText}
  .about-hero-signature{background:CanvasText;color:Canvas}
  .about-text-link{background:ButtonFace;color:ButtonText;border:1px solid ButtonText}
  .about-trust-card{border:1px solid CanvasText;background:Canvas;color:CanvasText}
  .about-trust-art,.about-trust-card::after{display:none}
  .about-trust-copy h3{color:CanvasText}
}
@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .about-trust-art{transition:none}
  .about-trust-card:hover .about-trust-art,.about-trust-card:focus-visible .about-trust-art{transform:none}
}
