/* 样式：现代清爽科技风 */
:root {
  --c-bg:#0c1424;
  --c-bg-alt:#101d33;
  --c-primary:#1573ff;
  --c-primary-accent:#3d8dff;
  --c-gradient:linear-gradient(135deg,#1677ff 0%,#4b9dff 40%,#6cc5ff 100%);
  --c-text:#e8edf5;
  --c-text-dim:#9fb2cc;
  --c-border:rgba(255,255,255,.08);
  --radius-sm:6px;
  --radius-md:14px;
  --radius-lg:34px;
  --shadow:0 4px 16px -2px rgba(0,40,120,.25),0 0 0 1px rgba(255,255,255,.04) inset;
  --font-cn:"Manrope","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {margin:0;font-family:var(--font-cn);background:radial-gradient(circle at 70% 20%,#1b3358,#0c1424 70%);color:var(--c-text);line-height:1.6;-webkit-font-smoothing:antialiased;}
img {max-width:100%;display:block;}
a {color:var(--c-primary);text-decoration:none;} a:hover{color:#fff;}

/* Layout */
.container {width:min(1240px,100% - 4rem);margin-inline:auto;}
.section {padding:clamp(3rem,8vw,6rem) 0;position:relative;}
.section-head {margin-bottom:2.5rem;}
.section-head h2 {margin:0;font-size:clamp(1.9rem,5vw,2.6rem);letter-spacing:.04em;background:var(--c-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;}
.section-head p {margin:.5rem 0 0;font-size:.9rem;letter-spacing:.25em;text-transform:uppercase;color:var(--c-primary-accent);font-weight:600;}
.section-head.center {text-align:center;}

/* Header */
.site-header {position:fixed;top:0;inset-inline:0;display:flex;align-items:center;justify-content:space-between;padding:.75rem 2rem;background:rgba(12,20,36,.72);backdrop-filter:blur(16px);z-index:40;border-bottom:1px solid var(--c-border);}
.site-header .brand {display:flex;flex-direction:column;gap:.25rem;}
.logo {font-weight:800;font-size:1.3rem;background:var(--c-gradient);background-clip:text;-webkit-background-clip:text;color:transparent;letter-spacing:.05em;}
.tagline {font-size:.65rem;color:var(--c-text-dim);letter-spacing:.15em;}
.main-nav ul {list-style:none;margin:0;padding:0;display:flex;gap:2rem;}
.main-nav a {font-weight:600;color:var(--c-text-dim);font-size:.85rem;letter-spacing:.05em;position:relative;}
.main-nav a:after {content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:var(--c-gradient);transition:.4s;}
.main-nav a:hover,.main-nav a:focus {color:#fff;}
.main-nav a:hover:after,.main-nav a:focus:after {width:100%;}
.nav-toggle {display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.5rem;}
.nav-toggle span {width:26px;height:2px;background:var(--c-text);transition:.4s;}

/* Hero */
.hero {min-height:38vh;display:grid;place-items:center;padding:8rem 1rem 4rem;position:relative;overflow:hidden;}
.hero-bg {position:absolute;inset:0;background:
  radial-gradient(circle at 20% 30%,rgba(21,115,255,.35),transparent 60%),
  radial-gradient(circle at 80% 70%,rgba(108,197,255,.25),transparent 70%),
  linear-gradient(140deg,#0a101b,#132743);
  filter:contrast(110%);}
.hero:before {content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='1600' height='900' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%231573ff0d' stroke-width='1'%3E%3Cpath d='M0 600 Q400 500 800 600 T1600 600'/%3E%3Cpath d='M0 300 Q400 200 800 300 T1600 300'/%3E%3Cpath d='M0 0 Q400 100 800 0 T1600 0'/%3E%3C/g%3E%3C/svg%3E");opacity:.35;mix-blend-mode:overlay;}
.hero-inner {position:relative;z-index:2;max-width:900px;text-align:center;}
.hero h1 {font-size:clamp(2.2rem,6vw,3.6rem);margin:0 0 1rem;font-weight:800;line-height:1.12;}
.hero .subtitle {margin:0 0 2rem;font-size:.95rem;letter-spacing:.25em;color:var(--c-text-dim);text-transform:uppercase;}
.hero-cta-group {display:flex;gap:1.1rem;justify-content:center;flex-wrap:wrap;}
.hero-badges {display:flex;gap:.75rem;justify-content:center;margin-top:2.4rem;flex-wrap:wrap;}
.hero-badges span {font-size:.7rem;letter-spacing:.1em;display:inline-block;padding:.55rem .9rem;border:1px solid var(--c-border);border-radius:40px;background:rgba(255,255,255,.05);backdrop-filter:blur(4px);}

/* Buttons */
.btn {--btn-bg:var(--c-bg-alt);--btn-color:var(--c-text);--btn-pad:.9rem 1.4rem;--btn-radius:var(--radius-lg);display:inline-flex;align-items:center;justify-content:center;padding:var(--btn-pad);font-weight:600;font-size:.9rem;border-radius:var(--btn-radius);position:relative;cursor:pointer;border:1px solid var(--c-border);background:var(--btn-bg);color:var(--btn-color);letter-spacing:.05em;transition:.45s cubic-bezier(.4,.6,.3,1);text-decoration:none;}
.btn.primary {--btn-bg:linear-gradient(90deg,#1677ff,#4b9dff);border:0;box-shadow:0 8px 24px -6px rgba(22,119,255,.5);} 
.btn.primary:hover {filter:brightness(1.15) saturate(1.15) drop-shadow(0 4px 16px rgba(22,119,255,.6));transform:translateY(-3px);}
.btn.ghost {background:rgba(255,255,255,.08);}
.btn.ghost:hover {background:rgba(255,255,255,.15);}
.btn.full {width:100%;}
.btn:active {transform:translateY(2px);}

/* Intro */
.intro-grid {display:grid;gap:3rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;}
.feature-icons {list-style:none;padding:0;margin:1.5rem 0 0;display:grid;gap:.85rem;}
.feature-icons li {background:rgba(255,255,255,.04);padding:.9rem 1rem;border-radius:var(--radius-md);border:1px solid var(--c-border);backdrop-filter:blur(6px);}
.glass-card {background:linear-gradient(150deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:1.7rem 1.6rem;box-shadow:var(--shadow);backdrop-filter:blur(12px);}
.glass-card h3 {margin-top:0;font-size:1.1rem;letter-spacing:.08em;}
.glass-card ul {list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.6rem;font-size:.8rem;letter-spacing:.08em;}
.kpi ul li {position:relative;padding-left:1.2rem;}
.kpi ul li:before {content:"";width:.55rem;height:.55rem;border-radius:50%;background:var(--c-primary);position:absolute;left:0;top:.3rem;box-shadow:0 0 0 4px rgba(21,115,255,.18);}

/* Tabs */
.services-tabs {--tab-gap:1rem;}
.tabs-nav {display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:1.5rem;}
.tabs-nav button {font:inherit;cursor:pointer;padding:.7rem 1.2rem;border-radius:50px;border:1px solid var(--c-border);background:rgba(255,255,255,.05);color:var(--c-text-dim);font-weight:600;letter-spacing:.05em;position:relative;transition:.35s;}
.tabs-nav button[aria-selected=true] {background:var(--c-gradient);color:#fff;box-shadow:0 4px 14px -4px rgba(22,119,255,.6);}
.tabs-panels {position:relative;}
.tabs-panels .panel {display:none;animation:fade .5s ease;}
.tabs-panels .panel.active {display:block;}
@keyframes fade {from {opacity:0;transform:translateY(10px);} to {opacity:1;transform:none;}}
.chip-list {list-style:none;padding:0;margin:1rem 0 0;display:flex;gap:.6rem;flex-wrap:wrap;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;}
.chip-list li {padding:.5rem .9rem;background:rgba(255,255,255,.08);border-radius:40px;border:1px solid var(--c-border);} 
.multi-cols {columns:3;gap:2.5rem;margin:1rem 0 0;padding:0;font-size:.85rem;}
.multi-cols li {break-inside:avoid;margin:0 0 .6rem;list-style:decimal-leading-zero inside;color:var(--c-text-dim);} 

/* Advantages */
.adv-grid {display:grid;gap:3rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:start;}
.certificates {display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;}
.cert-card {aspect-ratio:3/4;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.03));border:1px solid var(--c-border);border-radius:var(--radius-md);display:grid;place-items:center;position:relative;overflow:hidden;font-size:.85rem;font-weight:600;letter-spacing:.08em;text-align:center;color:var(--c-text-dim);}
.cert-card:before {content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,rgba(108,197,255,.35),transparent 70%);mix-blend-mode:overlay;}
.adv-points {list-style:none;margin:0;padding:0;display:grid;gap:1.2rem;font-size:.9rem;}
.adv-points li {background:rgba(255,255,255,.05);padding:1rem 1.2rem;border-radius:var(--radius-md);border:1px solid var(--c-border);position:relative;}
.adv-points li:before {content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:var(--c-gradient);border-radius:2px 0 0 2px;}

/* Culture */
.culture-cards {display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.c-card {background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--c-border);padding:1.4rem 1.4rem 1.6rem;border-radius:var(--radius-lg);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.6rem;box-shadow:var(--shadow);}
.c-card h3 {margin:0;font-size:1rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c-primary-accent);}
.c-card p {margin:0;font-size:.9rem;color:var(--c-text-dim);}
.c-card.highlight {background:linear-gradient(90deg,#1677ff33,#4b9dff22);}
.c-card.highlight:after {content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,rgba(76,155,255,.35),transparent 70%);mix-blend-mode:overlay;}

/* Contact */
.contact-grid {display:grid;gap:3rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));align-items:start;}
.contact-form {display:grid;gap:1rem;}
.contact-form label {display:grid;gap:.4rem;font-size:.8rem;letter-spacing:.1em;color:var(--c-text-dim);text-transform:uppercase;}
.contact-form input,.contact-form textarea {background:rgba(255,255,255,.06);border:1px solid var(--c-border);border-radius:14px;padding:.85rem 1rem;font:inherit;color:var(--c-text);resize:vertical;}
.contact-form input:focus,.contact-form textarea:focus {outline:2px solid #1677ff99;outline-offset:2px;}
.contact-info p {margin:.3rem 0;font-size:.85rem;color:var(--c-text-dim);}

/* Footer */
.site-footer {background:#08101c;padding:2.8rem 0;margin-top:4rem;border-top:1px solid var(--c-border);position:relative;}
.footer-inner {display:flex;flex-wrap:wrap;gap:2rem;align-items:center;justify-content:space-between;font-size:.75rem;color:var(--c-text-dim);}
.f-brand {font-weight:700;letter-spacing:.12em;color:#fff;}
.footer-nav a {margin-right:1.2rem;color:var(--c-text-dim);} .footer-nav a:hover{color:#fff;}

/* Scroll top button */
.scroll-top {position:fixed;bottom:1.8rem;right:1.8rem;background:var(--c-gradient);color:#fff;border:0;border-radius:50%;width:54px;height:54px;font-size:1.2rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 10px 28px -8px rgba(22,119,255,.55);opacity:0;pointer-events:none;transition:.45s;}
.scroll-top.visible {opacity:1;pointer-events:auto;}

/* Responsive nav */
@media (max-width:880px){
  .main-nav ul {position:absolute;top:100%;right:1rem;background:rgba(12,20,36,.95);backdrop-filter:blur(18px);flex-direction:column;padding:1.4rem 1.6rem;border:1px solid var(--c-border);border-radius:var(--radius-lg);min-width:200px;transform:translateY(-10px);opacity:0;pointer-events:none;transition:.45s;}
  .main-nav ul.open {opacity:1;transform:none;pointer-events:auto;}
  .nav-toggle {display:flex;}
}

/* Utilities */
.center {text-align:center;}

/* Scroll reveal animation */
.reveal {opacity:0;transform:translateY(30px);transition:.9s cubic-bezier(.3,.65,.3,1);}
.reveal.visible {opacity:1;transform:none;}

/* Hide focus only when using mouse */
:focus-visible {outline:2px solid var(--c-primary-accent);outline-offset:2px;}

/* Fancy separators */
.section:after {content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:60%;max-width:620px;height:1px;background:linear-gradient(90deg,transparent,#2e4a72,transparent);opacity:.4;}
.section:last-of-type:after {display:none;}

/* Scrollbar (webkit) */
::-webkit-scrollbar {width:10px;background:#0d1829;}
::-webkit-scrollbar-thumb {background:linear-gradient(#173152,#264e7e);border-radius:20px;border:2px solid #0d1829;}
::-webkit-scrollbar-thumb:hover {background:linear-gradient(#1f4b7c,#2d6fb4);}