/* ══════════════════════════════════════════════════════════
   火世科技 HUOSHI TECHNOLOGY — 官网样式
   设计基调：深空蓝境 (Deep Azure Nocturne)
   主色取自标志 #0093DD，点缀色 #FF6B3D 呼应"火"
   ══════════════════════════════════════════════════════════ */

/* ── 1. Tokens ───────────────────────────────────────────── */
:root{
  /* 品牌 */
  --brand:        #0093DD;
  --brand-600:    #0083C4;
  --brand-400:    #38BDF8;
  --brand-200:    #7FD3FB;
  --ember:        #FF6B3D;

  /* 深色面 */
  --ink-900:      #04080F;
  --ink-850:      #050a16;
  --ink-800:      #070E1D;
  --ink-750:      #0A1425;
  --ink-700:      #0D1B31;
  --ink-600:      #122540;

  /* 浅色面 */
  --paper:        #F4F7FA;
  --paper-2:      #E9EFF5;
  --paper-3:      #DCE6EF;

  /* 文本 */
  --on-dark:      #EAF2F9;
  --on-dark-dim:  #9DB3C8;
  --on-dark-mute: #6B8199;
  --on-light:     #0A1425;
  --on-light-dim: #4A5F76;

  /* 线与面 */
  --line-dark:    rgba(148, 190, 226, .13);
  --line-dark-2:  rgba(148, 190, 226, .07);
  --line-light:   rgba(10, 20, 37, .10);
  --line-light-2: rgba(10, 20, 37, .06);

  /* 字体 */
  --f-sans:  "Noto Sans SC", -apple-system, BlinkMacSystemFont, "PingFang SC",
             "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --f-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", Georgia, serif;
  --f-lat:   "Instrument Serif", "Noto Serif SC", Georgia, serif;
  --f-mono:  "DM Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* 尺度 */
  --wrap: 1280px;
  --pad:  clamp(20px, 5vw, 56px);
  --sec-y: clamp(72px, 10vw, 148px);
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 30px;

  /* 阴影 */
  --sh-md: 0 18px 44px -22px rgba(2, 10, 22, .55);
  --sh-lg: 0 40px 90px -40px rgba(2, 10, 22, .7);
  --sh-glow: 0 0 0 1px rgba(0,147,221,.28), 0 22px 60px -26px rgba(0,147,221,.5);

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* ── 2. Reset ────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth;
  scroll-padding-top:104px;
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
  font-family:var(--f-sans);
  font-weight:300;
  font-size:16px;
  line-height:1.78;
  color:var(--on-dark);
  background:var(--ink-850);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,h5{ margin:0; font-weight:700; line-height:1.24; }
p{ margin:0; }
::selection{ background:var(--brand); color:#fff; }
:focus-visible{ outline:2px solid var(--brand-400); outline-offset:3px; border-radius:4px; }

.svg-sprite{ position:absolute; width:0; height:0; overflow:hidden; }
.ic{ width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:1.6;
     stroke-linecap:round; stroke-linejoin:round; flex:none; }
.ic--sm{ width:.9em; height:.9em; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

/* ── 3. 滚动进度 ─────────────────────────────────────────── */
.scroll-progress{
  position:fixed; inset:0 0 auto 0; height:2px; z-index:120;
  background:rgba(148,190,226,.08);
}
.scroll-progress span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--brand),var(--brand-400) 60%,var(--ember));
  box-shadow:0 0 12px rgba(0,147,221,.7);
}

/* ── 4. 导航 ─────────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .45s var(--ease), border-color .45s var(--ease),
             backdrop-filter .45s var(--ease), padding .45s var(--ease);
  border-bottom:1px solid transparent;
  padding-top:22px; padding-bottom:22px;
}
.nav.is-stuck{
  padding-top:12px; padding-bottom:12px;
  background:rgba(5,10,22,.82);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  border-bottom-color:var(--line-dark);
}
.nav__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad);
  display:flex; align-items:center; gap:26px;
}
.brand img{ height:42px; width:auto; transition:opacity .3s var(--ease); }
.brand:hover img{ opacity:.82; }

.nav__menu{ display:flex; align-items:center; gap:4px; margin-left:auto; }
.nav__link{
  position:relative; isolation:isolate;
  padding:9px 16px; font-size:15.5px; font-weight:500;
  color:var(--on-dark-dim); letter-spacing:.05em; transition:color .3s var(--ease);
}
.nav__link::before{
  content:""; position:absolute; inset:0; z-index:-1; border-radius:100px;
  background:rgba(148,190,226,.09);
  opacity:0; transition:opacity .3s var(--ease);
}
.nav__link::after{
  content:""; position:absolute; left:16px; right:16px; bottom:1px; height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,var(--brand),var(--brand-400));
  transform:scaleX(0); transform-origin:left;
  transition:transform .42s var(--ease-out);
}
.nav__link:hover{ color:var(--on-dark); }
.nav__link:hover::before{ opacity:1; }
.nav__link:hover::after,
.nav__link.is-active::after{ transform:scaleX(1); }
.nav__link.is-active{ color:#fff; }
.nav__link.is-active::before{ opacity:1; }

.nav__actions{ display:flex; align-items:center; gap:14px; }
.nav__actions .nav__cta{ padding:11px 22px; font-size:14.5px; }
.nav__toggle{
  display:none; width:42px; height:42px; align-items:center; justify-content:center;
  border:1px solid var(--line-dark); border-radius:var(--r-sm);
  font-size:21px; color:var(--on-dark); background:rgba(148,190,226,.05);
}
.nav__toggle .ic--close{ display:none; }
.nav__toggle[aria-expanded="true"] .ic--menu{ display:none; }
.nav__toggle[aria-expanded="true"] .ic--close{ display:block; }
.nav-scrim{
  position:fixed; inset:0; z-index:90; background:rgba(3,7,14,.7);
  backdrop-filter:blur(3px); opacity:0; transition:opacity .4s var(--ease);
}
.nav-scrim.is-on{ opacity:1; }

/* ── 5. 按钮 ─────────────────────────────────────────────── */
.btn{
  position:relative; display:inline-flex; align-items:center; gap:.6em;
  padding:14px 26px; border-radius:100px; font-size:15px; font-weight:500;
  letter-spacing:.03em; overflow:hidden; isolation:isolate;
  transition:transform .35s var(--ease-out), box-shadow .35s var(--ease),
             background-color .35s var(--ease), color .35s var(--ease),
             border-color .35s var(--ease);
}
.btn .ic{ width:1.05em; height:1.05em; transition:transform .4s var(--ease-out); }
.btn:hover .ic{ transform:translateX(4px); }
.btn--sm{ padding:9px 18px; font-size:13.5px; }
.btn--primary{
  color:#fff; background:var(--brand);
  box-shadow:0 12px 30px -14px rgba(0,147,221,.9);
}
.btn--primary::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg,var(--brand-600),var(--brand) 45%,var(--brand-400));
  opacity:0; transition:opacity .4s var(--ease);
}
.btn--primary:hover{
  transform:translateY(-2px);
  box-shadow:0 20px 42px -16px rgba(0,147,221,.95);
}
.btn--primary:hover::before{ opacity:1; }
.btn--ghost{
  color:var(--on-dark); border:1px solid var(--line-dark);
  background:rgba(148,190,226,.04);
}
.btn--ghost:hover{
  border-color:rgba(0,147,221,.55); background:rgba(0,147,221,.1);
  transform:translateY(-2px);
}
.btn--quiet{
  color:var(--on-dark-dim); padding-left:0; padding-right:4px;
}
.btn--quiet:hover{ color:var(--brand-200); }
.btn--quiet:hover .ic{ transform:translateX(6px); }

/* ── 6. Hero ─────────────────────────────────────────────── */
.hero{
  position:relative; min-height:min(100svh, 900px);
  display:flex; align-items:center;
  padding:152px 0 92px;
  background:
    radial-gradient(120% 90% at 78% 8%, #0B2340 0%, rgba(11,35,64,0) 58%),
    radial-gradient(90% 70% at 8% 92%, #07203A 0%, rgba(7,32,58,0) 60%),
    var(--ink-850);
  overflow:hidden;
}
.hero__glow{
  position:absolute; top:-22%; right:-6%; width:min(760px,86vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(0,147,221,.30) 0%, rgba(0,147,221,.08) 38%, transparent 68%);
  filter:blur(12px); pointer-events:none;
  animation:floatGlow 16s ease-in-out infinite alternate;
}
@keyframes floatGlow{
  from{ transform:translate3d(0,0,0) scale(1); }
  to  { transform:translate3d(-40px,34px,0) scale(1.08); }
}
.hero__grid-lines{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(to right, rgba(148,190,226,.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,190,226,.055) 1px, transparent 1px);
  background-size:78px 78px;
  mask-image:radial-gradient(120% 90% at 50% 30%, #000 20%, transparent 78%);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 30%, #000 20%, transparent 78%);
}
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:.85; }

.hero__inner{
  position:relative; display:grid; gap:clamp(40px,5vw,64px);
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr); align-items:center;
}
.hero__eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-mono); font-size:12px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--brand-200);
  padding:8px 16px 8px 14px; border:1px solid rgba(0,147,221,.3); border-radius:100px;
  background:rgba(0,147,221,.07);
}
.dot-pulse{
  width:7px; height:7px; border-radius:50%; background:var(--brand-400); flex:none;
  box-shadow:0 0 0 0 rgba(56,189,248,.6); animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(56,189,248,.55); }
  70%{ box-shadow:0 0 0 9px rgba(56,189,248,0); }
  100%{ box-shadow:0 0 0 0 rgba(56,189,248,0); }
}
.hero__title{
  margin:26px 0 0;
  font-family:var(--f-serif); font-weight:900;
  font-size:clamp(2.6rem, 6.2vw, 5.1rem);
  line-height:1.1; letter-spacing:-.015em; color:#fff;
}
.hero__title span{ display:block; }
.hero__title > span:nth-child(1){ --d:.06s; }
.hero__title > span:nth-child(2){ --d:.14s; }
.hero__title > span:nth-child(3){ --d:.22s; }
.hero__title .grad{
  font-style:normal;
  background:linear-gradient(100deg,var(--brand-400) 0%,var(--brand) 45%,var(--ember) 130%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero__lead{
  margin-top:26px; max-width:52ch; font-size:clamp(15.5px,1.35vw,17.5px);
  color:var(--on-dark-dim); font-weight:300; line-height:1.95;
  --d:.3s;
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin-top:38px; --d:.38s; }
.hero__trust{
  display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:38px;
  font-size:13.5px; color:var(--on-dark-mute);
  --d:.46s;
}
.hero__trust li{ display:flex; align-items:center; gap:8px; }
.hero__trust .ic{ color:var(--brand); }

/* 轨道视觉 */
.hero__visual{ position:relative; aspect-ratio:1; max-width:560px; justify-self:center; width:100%; --d:.3s; }
.orbit{ position:absolute; inset:0; }
.orbit__svg{ width:100%; height:100%; overflow:visible; }
.orbit__rings{ transform-origin:260px 260px; animation:spin 46s linear infinite; }
.orbit__rings ellipse:nth-child(2){ animation:spinRev 34s linear infinite; transform-origin:260px 260px; }
.orbit__core{ transform-origin:260px 260px; animation:breathe 6.5s ease-in-out infinite; }
.orbit__nodes circle{ animation:nodePulse 3.6s ease-in-out infinite; }
.orbit__nodes circle:nth-child(2){ animation-delay:.6s; }
.orbit__nodes circle:nth-child(3){ animation-delay:1.2s; }
.orbit__nodes circle:nth-child(4){ animation-delay:1.8s; }
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes spinRev{ to{ transform:rotate(-360deg); } }
@keyframes breathe{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.045); opacity:.86; } }
@keyframes nodePulse{ 0%,100%{ opacity:1; r:4; } 50%{ opacity:.4; } }

.hero__cards{ position:absolute; inset:0; pointer-events:none; }
.float-card{
  position:absolute; pointer-events:auto;
  padding:16px 20px; border-radius:var(--r-md);
  border:1px solid var(--line-dark);
  background:rgba(9,17,32,.72);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  box-shadow:var(--sh-lg);
  display:flex; flex-direction:column; gap:4px;
}
.float-card--a{ left:-2%; top:14%; animation:bob 7s ease-in-out infinite; }
.float-card--b{ right:-3%; bottom:13%; animation:bob 8.4s ease-in-out infinite .9s; }
@keyframes bob{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-11px); } }
.float-card__k{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--brand-200);
}
.float-card__v{ font-family:var(--f-serif); font-size:20px; font-weight:600; color:#fff; letter-spacing:.01em; }
.float-card__d{ font-size:12.5px; color:var(--on-dark-mute); }
.float-card__tags{ display:flex; flex-wrap:wrap; gap:6px; max-width:230px; }
.float-card__tags em{
  font-style:normal; font-family:var(--f-mono); font-size:11px; letter-spacing:.03em;
  padding:3px 9px; border-radius:100px; color:var(--on-dark-dim);
  border:1px solid var(--line-dark); background:rgba(148,190,226,.05);
}
.hero__scroll{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:var(--f-mono); font-size:10px; letter-spacing:.34em; color:var(--on-dark-mute);
}
.hero__scroll-line{
  width:1px; height:46px; background:linear-gradient(to bottom,transparent,var(--brand));
  position:relative; overflow:hidden;
}
.hero__scroll-line::after{
  content:""; position:absolute; inset:0; background:#fff;
  animation:scrollDot 2.4s var(--ease) infinite;
}
@keyframes scrollDot{
  0%{ transform:translateY(-100%); } 60%,100%{ transform:translateY(100%); }
}

/* ── 7. 数据条 ───────────────────────────────────────────── */
.stats{
  position:relative; padding:clamp(46px,6vw,74px) 0;
  background:var(--ink-800);
  border-block:1px solid var(--line-dark-2);
}
.stats__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
}
.stat{
  padding:8px clamp(14px,2.4vw,34px);
  border-left:1px solid var(--line-dark);
  display:flex; flex-direction:column; gap:6px;
}
.stat:first-child{ border-left:0; padding-left:0; }
.stat:nth-child(2){ --d:.08s; }
.stat:nth-child(3){ --d:.16s; }
.stat:nth-child(4){ --d:.24s; }
.stat__num{
  font-family:var(--f-mono); font-weight:300; font-size:clamp(2.1rem,4.4vw,3.4rem);
  line-height:1; color:#fff; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
}
.stat__num sup{ font-size:.42em; color:var(--brand); margin-left:.12em; top:-.6em; }
.stat__label{ font-size:13.5px; color:var(--on-dark-mute); letter-spacing:.05em; }

/* ── 8. 通用区块 ─────────────────────────────────────────── */
.section{ position:relative; padding-block:var(--sec-y); }
.section--services{ background:var(--paper); color:var(--on-light); }
.section--process{ background:var(--ink-850); }
.section--work{ background:var(--paper); color:var(--on-light); }
.section--about{
  background:
    radial-gradient(80% 60% at 12% 0%, #0B2340 0%, rgba(11,35,64,0) 60%),
    var(--ink-850);
}
.section--contact{
  background:
    radial-gradient(90% 70% at 84% 0%, rgba(0,147,221,.20) 0%, rgba(0,147,221,0) 62%),
    var(--ink-800);
  border-top:1px solid var(--line-dark-2);
}

.sec-head{ max-width:760px; margin-bottom:clamp(44px,5.4vw,72px); }
.sec-head--center{ margin-inline:auto; text-align:center; }
.sec-head__idx{
  font-family:var(--f-mono); font-size:11.5px; letter-spacing:.28em;
  text-transform:uppercase; color:var(--on-light-dim); margin-bottom:20px;
  display:flex; align-items:center; gap:10px;
}
.sec-head--center .sec-head__idx{ justify-content:center; }
.sec-head__idx span{
  color:var(--brand); border:1px solid rgba(0,147,221,.4); border-radius:100px;
  padding:2px 10px; letter-spacing:.14em;
}
.sec-head__idx--light{ color:var(--on-dark-mute); }
.sec-head__title{
  font-family:var(--f-serif); font-weight:900;
  font-size:clamp(1.95rem,4.1vw,3.5rem); line-height:1.16; letter-spacing:-.01em;
}
.sec-head__title--light{ color:#fff; }
.section--services .sec-head__title,
.section--work .sec-head__title{ color:var(--on-light); }
.sec-head__sub{
  margin-top:22px; font-size:clamp(15px,1.25vw,16.5px);
  color:var(--on-light-dim); max-width:56ch; line-height:1.95;
}
.sec-head--center .sec-head__sub{ margin-inline:auto; }
.section--process .sec-head__sub{ color:var(--on-dark-dim); }
.section--services .sec-head__sub{ color:var(--on-light-dim); }

/* ── 9. 服务 ─────────────────────────────────────────────── */
.svc{
  display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:clamp(28px,3.4vw,56px); align-items:start;
}
.svc__list{ display:flex; flex-direction:column; border-top:1px solid var(--line-light); }
.svc__item{ border-bottom:1px solid var(--line-light); }
.svc__btn{
  width:100%; display:grid; align-items:center; gap:0 16px;
  grid-template-columns:auto 1fr auto;
  padding:19px 14px; text-align:left; position:relative;
  transition:background .4s var(--ease), padding .4s var(--ease);
}
.svc__btn::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:2px;
  background:var(--brand); transform:scaleY(0); transform-origin:center;
  transition:transform .45s var(--ease-out);
}
.svc__no{
  font-family:var(--f-mono); font-size:11.5px; color:var(--on-light-dim);
  letter-spacing:.1em; transition:color .35s var(--ease);
}
.svc__name{
  font-family:var(--f-serif); font-size:clamp(16px,1.5vw,19px); font-weight:600;
  color:var(--on-light); letter-spacing:.01em;
  transition:transform .45s var(--ease-out), color .35s var(--ease);
}
.svc__en{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--on-light-dim); opacity:.6;
  transition:opacity .35s var(--ease), color .35s var(--ease);
}
.svc__btn:hover::before{ transform:scaleY(.55); }
.svc__btn:hover .svc__name{ transform:translateX(7px); }
.svc__item.is-active .svc__btn::before{ transform:scaleY(1); }
.svc__item.is-active .svc__no{ color:var(--brand); }
.svc__item.is-active .svc__name{ color:var(--brand-600); transform:translateX(7px); }
.svc__item.is-active .svc__en{ opacity:1; color:var(--brand-600); }

.svc__stage{ position:sticky; top:104px; --d:.1s; }
/* 渐进增强：脚本可用时折叠为标签页；脚本不可用时 8 个服务面板全部平铺可见，
   确保不执行 JS 的爬虫（多数 AI 抓取器）能读到完整服务内容 */
html.js .svc__panel:not(.is-active){ display:none; }
html:not(.js) .svc__panel + .svc__panel{ margin-top:20px; }
html:not(.js) .svc__btn{ cursor:default; }
.svc__panel{
  position:relative; padding:clamp(28px,3.2vw,44px);
  border-radius:var(--r-lg); border:1px solid var(--line-light);
  background:#fff; box-shadow:var(--sh-md);
  overflow:hidden;
  animation:panelIn .55s var(--ease-out) both;
}
@keyframes panelIn{
  from{ opacity:0; transform:translateY(16px); }
  to{ opacity:1; transform:none; }
}
.svc__panel::after{
  content:""; position:absolute; top:0; right:0; width:280px; height:280px;
  background:radial-gradient(circle at 100% 0%, rgba(0,147,221,.13), transparent 70%);
  pointer-events:none;
}
.svc__panel-head{ display:flex; align-items:center; gap:18px; margin-bottom:22px; }
.svc__icon{
  width:52px; height:52px; flex:none; padding:12px; border-radius:var(--r-md);
  color:var(--brand); background:rgba(0,147,221,.09);
  border:1px solid rgba(0,147,221,.2);
  fill:none; stroke:currentColor; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
}
.svc__panel-en{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--brand-600); margin-bottom:4px;
}
.svc__panel-title{
  font-family:var(--f-serif); font-size:clamp(20px,2.1vw,26px); font-weight:700;
  color:var(--on-light);
}
.svc__panel-desc{
  font-size:15.5px; color:var(--on-light-dim); line-height:1.95; max-width:52ch;
}
.svc__chips{ display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; }
.svc__chips li{
  font-size:12.5px; padding:6px 14px; border-radius:100px;
  color:var(--on-light-dim); background:var(--paper-2);
  border:1px solid var(--line-light-2);
}

/* 抽象图形 */
.svc__panel-art{ position:relative; margin-top:30px; height:150px; }
.art--phone{
  display:flex; flex-direction:column; gap:11px; justify-content:center;
  padding-left:36px;
}
.art--phone .art__ring{
  position:absolute; left:0; top:50%; width:96px; height:96px; margin-top:-48px;
  border-radius:26px; border:1.5px solid rgba(0,147,221,.4);
  background:linear-gradient(160deg, rgba(0,147,221,.12), transparent 70%);
}
.art--phone .art__bar{
  height:8px; border-radius:100px;
  background:linear-gradient(90deg,rgba(0,147,221,.55),rgba(0,147,221,.12));
}
.art--phone .art__bar--1{ width:78%; }
.art--phone .art__bar--2{ width:52%; }
.art--phone .art__bar--3{ width:64%; }
.art--grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.art--grid span{
  border-radius:12px; border:1px solid rgba(0,147,221,.22);
  background:linear-gradient(150deg,rgba(0,147,221,.14),rgba(0,147,221,.02));
  animation:artPulse 3.4s ease-in-out infinite;
}
.art--grid span:nth-child(2){ animation-delay:.3s; }
.art--grid span:nth-child(3){ animation-delay:.6s; }
.art--grid span:nth-child(4){ animation-delay:.9s; }
.art--grid span:nth-child(5){ animation-delay:1.2s; }
.art--grid span:nth-child(6){ animation-delay:1.5s; }
@keyframes artPulse{ 0%,100%{ opacity:.55; } 50%{ opacity:1; } }
.art--chart{ display:flex; align-items:flex-end; gap:12px; height:150px; }
.art--chart .art__col{
  flex:1; border-radius:8px 8px 3px 3px;
  background:linear-gradient(to top, rgba(0,147,221,.85), rgba(56,189,248,.18));
  transform-origin:bottom; animation:barGrow 1.1s var(--ease-out) both;
}
.art--chart .art__col--1{ height:38%; }
.art--chart .art__col--2{ height:62%; }
.art--chart .art__col--3{ height:45%; }
.art--chart .art__col--4{ height:84%; }
.art--chart .art__col--5{ height:56%; }
.art--chart .art__col--6{ height:93%; }
.art--chart .art__col--7{ height:70%; }
@keyframes barGrow{ from{ transform:scaleY(.05); opacity:0; } to{ transform:none; opacity:1; } }
.art--browser{
  border:1px solid rgba(0,147,221,.22); border-radius:14px; padding:14px 16px;
  display:flex; flex-direction:column; gap:11px; background:rgba(0,147,221,.03);
}
.art--browser .art__dot{
  width:8px; height:8px; border-radius:50%; background:rgba(0,147,221,.4);
  display:inline-block; margin-right:6px;
}
.art--browser .art__line{ height:7px; border-radius:100px; background:rgba(10,20,37,.1); }
.art--browser .art__line--1{ width:40%; }
.art--browser .art__line--2{ width:72%; }
.art--browser .art__line--3{ width:58%; }
.art--palette{ display:flex; gap:14px; align-items:flex-end; }
.art--palette .art__swatch{
  width:56px; height:56px; border-radius:16px;
  box-shadow:0 14px 28px -16px rgba(10,20,37,.5);
  transition:transform .4s var(--ease-out);
}
.art--palette .art__swatch--1{ background:#0093DD; transform:translateY(-26px); }
.art--palette .art__swatch--2{ background:#0A1830; }
.art--palette .art__swatch--3{ background:#38BDF8; }
.art--palette .art__swatch--4{ background:#FF6B3D; }
.art--palette .art__swatch--5{ background:#F1F5F9; transform:translateY(-14px); }
.art--flow{ display:flex; align-items:center; gap:0; position:relative; }
.art--flow .art__node{
  width:52px; height:52px; border-radius:16px; flex:none;
  border:1px solid rgba(0,147,221,.3);
  background:linear-gradient(150deg,rgba(0,147,221,.16),transparent);
}
.art--flow .art__conn{ flex:1; height:1px; background:rgba(0,147,221,.3); }
.art--neural{ position:relative; }
.art--neural .art__node{
  position:absolute; width:46px; height:46px; border-radius:50%;
  border:1px solid rgba(0,147,221,.35); background:rgba(0,147,221,.1);
}
.art--neural .art__node:nth-child(1){ left:2%;  top:18%; }
.art--neural .art__node:nth-child(2){ left:30%; top:56%; }
.art--neural .art__node:nth-child(3){ left:56%; top:12%; }
.art--neural .art__node:nth-child(4){ right:16%; top:52%; }
.art--neural .art__node:nth-child(5){ right:0; top:10%; width:32px; height:32px; background:rgba(255,107,61,.14); border-color:rgba(255,107,61,.4); }
.art--neural::before{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to right bottom, transparent 49.6%, rgba(0,147,221,.28) 49.6%, rgba(0,147,221,.28) 50.4%, transparent 50.4%);
}
.art--wave{ display:flex; align-items:center; gap:8px; }
.art--wave span{
  width:8px; border-radius:100px; background:linear-gradient(to top,rgba(0,147,221,.8),rgba(56,189,248,.2));
  animation:wave 2.4s ease-in-out infinite;
}
.art--wave span:nth-child(1){ height:24%; animation-delay:0s; }
.art--wave span:nth-child(2){ height:52%; animation-delay:.12s; }
.art--wave span:nth-child(3){ height:80%; animation-delay:.24s; }
.art--wave span:nth-child(4){ height:44%; animation-delay:.36s; }
.art--wave span:nth-child(5){ height:96%; animation-delay:.48s; }
.art--wave span:nth-child(6){ height:60%; animation-delay:.6s; }
.art--wave span:nth-child(7){ height:30%; animation-delay:.72s; }
@keyframes wave{ 0%,100%{ transform:scaleY(.55); } 50%{ transform:scaleY(1); } }

/* ── 10. 流程 ────────────────────────────────────────────── */
.process{
  display:grid; grid-template-columns:repeat(5,1fr); gap:clamp(16px,2vw,28px);
  counter-reset:step;
}
.process__step{
  position:relative; padding:30px 24px 28px;
  border:1px solid var(--line-dark); border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(148,190,226,.045), rgba(148,190,226,.012));
  transition:transform .5s var(--ease-out), border-color .45s var(--ease),
             background .45s var(--ease);
}
.process__step:nth-child(2){ --d:.08s; }
.process__step:nth-child(3){ --d:.16s; }
.process__step:nth-child(4){ --d:.24s; }
.process__step:nth-child(5){ --d:.32s; }
.process__step:hover{
  transform:translateY(-6px); border-color:rgba(0,147,221,.42);
  background:linear-gradient(180deg, rgba(0,147,221,.11), rgba(0,147,221,.02));
}
.process__step::before{
  content:""; position:absolute; top:-1px; left:24px; right:24px; height:1px;
  background:linear-gradient(90deg,var(--brand),transparent);
  transform:scaleX(0); transform-origin:left; transition:transform .55s var(--ease-out);
}
.process__step:hover::before{ transform:scaleX(1); }
.process__no{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.2em; color:var(--brand);
}
.process__ico{
  display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; margin:16px 0 18px; border-radius:13px;
  font-size:22px; color:var(--brand-400);
  background:rgba(0,147,221,.09); border:1px solid rgba(0,147,221,.2);
  transition:transform .5s var(--ease-out), background .45s var(--ease);
}
.process__step:hover .process__ico{ transform:rotate(-8deg) scale(1.06); background:rgba(0,147,221,.17); }
.process__step h3{
  font-family:var(--f-serif); font-size:19px; font-weight:600; color:#fff; margin-bottom:10px;
}
.process__step p{ font-size:14px; color:var(--on-dark-mute); line-height:1.9; }
.process__out{
  display:inline-block; margin-top:18px; font-family:var(--f-mono); font-size:11px;
  letter-spacing:.08em; color:var(--brand-200);
  padding:4px 11px; border-radius:100px; border:1px solid rgba(0,147,221,.26);
  background:rgba(0,147,221,.07);
}

/* ── 11. 案例 ────────────────────────────────────────────── */
.filters{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:clamp(30px,3.6vw,46px); }
.filter{
  padding:9px 20px; border-radius:100px; font-size:13.5px;
  color:var(--on-light-dim); border:1px solid var(--line-light);
  background:#fff; transition:all .35s var(--ease);
}
.filter:hover{ border-color:rgba(0,147,221,.45); color:var(--brand-600); }
.filter.is-active{
  background:var(--ink-800); border-color:var(--ink-800); color:#fff;
  box-shadow:0 10px 24px -14px rgba(10,20,37,.7);
}
.work-grid{
  --wgap:clamp(16px,1.8vw,26px);
  display:grid; grid-template-columns:repeat(12,1fr);
  gap:var(--wgap); grid-auto-flow:row dense;
}
.work{
  grid-column:span 4; min-width:0;
  display:flex; flex-direction:column;
  border-radius:var(--r-lg); overflow:hidden;
  background:#fff; border:1px solid var(--line-light);
  box-shadow:0 8px 26px -22px rgba(10,20,37,.45);
  transition:transform .55s var(--ease-out), box-shadow .45s var(--ease),
             border-color .45s var(--ease), opacity .45s var(--ease);
}
.work--wide{
  grid-column:span 8;
  flex-direction:row; align-items:stretch;
}
.work:hover{
  transform:translateY(-6px);
  box-shadow:0 32px 64px -34px rgba(10,20,37,.55);
  border-color:rgba(0,147,221,.34);
}
.work.is-hidden{ display:none; }

/* 视觉区：深色舞台 + 细网格，避免大片死黑 */
.work__shot{
  position:relative; overflow:hidden; flex:none;
  background:
    radial-gradient(110% 95% at 12% 0%, rgba(0,147,221,.26) 0%, rgba(0,147,221,0) 56%),
    radial-gradient(90% 90% at 100% 100%, rgba(255,107,61,.14) 0%, rgba(255,107,61,0) 58%),
    linear-gradient(150deg,#0D2743 0%, #0A1C33 52%, #06121F 100%);
}
.work__shot::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:
    linear-gradient(to right, rgba(148,190,226,.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148,190,226,.07) 1px, transparent 1px);
  background-size:36px 36px;
  mask-image:radial-gradient(115% 95% at 50% 26%, #000 8%, transparent 76%);
  -webkit-mask-image:radial-gradient(115% 95% at 50% 26%, #000 8%, transparent 76%);
}
.work--wide .work__shot{ width:52%; }
.work:not(.work--wide) .work__shot{ height:248px; width:100%; }

.work__meta{ padding:clamp(20px,2.2vw,30px); display:flex; flex-direction:column; gap:9px; flex:1; }
.work__tag{
  align-self:flex-start; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--brand-600); padding:4px 11px; border-radius:100px;
  background:rgba(0,147,221,.09); border:1px solid rgba(0,147,221,.2);
}
.work__meta h3{
  font-family:var(--f-serif); font-size:clamp(17px,1.7vw,21px); font-weight:700; color:var(--on-light);
}
.work__meta p{ font-size:13.5px; color:var(--on-light-dim); line-height:1.95; }
.work__facts{
  display:flex; flex-wrap:wrap; gap:12px 26px; margin-top:3px; padding-top:14px;
  border-top:1px solid var(--line-light);
}
.work__facts li{ display:flex; flex-direction:column; gap:3px; }
.work__facts span{
  font-family:var(--f-mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--on-light-dim); opacity:.7;
}
.work__facts b{ font-size:13px; font-weight:500; color:var(--on-light); }
.work__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:16px; }
.work__tags li{
  font-size:11.5px; font-family:var(--f-mono); color:var(--on-light-dim);
  padding:3px 10px; border-radius:100px; border:1px solid var(--line-light);
}

/* 案例视觉区：使用与案例文案对应的素材图 */
.work__shot{
  position:relative; overflow:hidden; flex:none;
  background:linear-gradient(150deg,#0D2743 0%, #0A1C33 52%, #06121F 100%);
}
.work__img{
  display:block; width:100%; height:100%;
  object-fit:cover; object-position:center;
  transition:transform .8s var(--ease-out);
}
.work:hover .work__img{ transform:scale(1.045); }
.work--wide .work__shot{ width:52%; }
.work:not(.work--wide) .work__shot{ height:248px; width:100%; }


/* ── 12. 关于 ────────────────────────────────────────────── */
.about{
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(36px,5vw,84px); align-items:center;
}
.about__text{
  margin-top:22px; font-size:16px; color:var(--on-dark-dim); line-height:2.05; max-width:56ch;
}
.about__right{ --d:.12s; }
.about__values{
  display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:40px;
}
.value{
  padding:22px 20px; border-radius:var(--r-md);
  border:1px solid var(--line-dark); background:rgba(148,190,226,.04);
  transition:transform .45s var(--ease-out), border-color .4s var(--ease), background .4s var(--ease);
}
.value:hover{ transform:translateY(-4px); border-color:rgba(0,147,221,.4); background:rgba(0,147,221,.09); }
.value .ic{ font-size:21px; color:var(--brand-400); margin-bottom:12px; }
.value h3{ font-family:var(--f-serif); font-size:17px; color:#fff; margin-bottom:6px; font-weight:600; }
.value p{ font-size:13.5px; color:var(--on-dark-mute); line-height:1.85; }

.about__card{
  position:relative; padding:clamp(26px,3vw,38px); border-radius:var(--r-xl);
  border:1px solid var(--line-dark); overflow:hidden;
  background:linear-gradient(165deg, rgba(11,35,64,.85), rgba(7,14,29,.92));
  box-shadow:var(--sh-lg);
}
.about__card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(70% 50% at 80% 0%, rgba(0,147,221,.22), transparent 70%);
}
.about__card-top{ padding-bottom:26px; border-bottom:1px solid var(--line-dark); margin-bottom:26px; }
.about__card-top img{ height:44px; width:auto; }
.about__facts{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px 18px; }
.about__facts dt{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--on-dark-mute); margin-bottom:6px;
}
.about__facts dd{ margin:0; font-family:var(--f-serif); font-size:21px; font-weight:600; color:#fff; }
.about__quote{ margin:28px 0 0; padding-top:24px; border-top:1px solid var(--line-dark); position:relative; }
.about__quote-ico{ font-size:24px; color:var(--brand); opacity:.6; margin-bottom:10px; }
.about__quote p{ font-family:var(--f-serif); font-size:17px; color:#fff; line-height:1.8; font-style:italic; }
.about__quote cite{
  display:block; margin-top:10px; font-style:normal; font-family:var(--f-mono);
  font-size:11.5px; letter-spacing:.14em; color:var(--on-dark-mute);
}

/* ── 13. 联系 ────────────────────────────────────────────── */
.contact{
  max-width:900px; margin-inline:auto;
}
.contact__info{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,2vw,26px);
  padding:clamp(26px,3vw,42px); border-radius:var(--r-xl);
  border:1px solid var(--line-dark); background:rgba(148,190,226,.035);
  box-shadow:var(--sh-lg);
}
.contact__row{
  display:flex; gap:16px; align-items:flex-start;
  padding:20px 22px; border-radius:var(--r-md);
  border:1px solid var(--line-dark-2); background:rgba(148,190,226,.04);
  transition:transform .45s var(--ease-out), border-color .4s var(--ease), background .4s var(--ease);
}
.contact__row--wide{ grid-column:1/-1; }
.contact__row:hover{
  transform:translateY(-4px); border-color:rgba(0,147,221,.4); background:rgba(0,147,221,.08);
}
.contact__ico{
  width:44px; height:44px; flex:none; display:grid; place-items:center;
  border-radius:var(--r-sm); color:var(--brand-400);
  background:rgba(0,147,221,.09); border:1px solid rgba(0,147,221,.2);
}
.contact__ico .ic{ font-size:20px; }
.contact__k{
  display:block; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--on-dark-mute); margin-bottom:4px;
}
.contact__row a,.contact__row p{ font-size:15.5px; color:var(--on-dark); line-height:1.6; }
.contact__row a{ border-bottom:1px solid rgba(0,147,221,.4); transition:color .3s, border-color .3s; }
.contact__row a:hover{ color:var(--brand-400); border-color:var(--brand-400); }

/* 复制按钮（微信号） */
.copy-btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 12px 5px 14px; border-radius:var(--r-sm);
  font-size:15.5px; line-height:1.6; color:var(--on-dark);
  border:1px solid rgba(0,147,221,.32); background:rgba(0,147,221,.06);
  transition:border-color .3s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.copy-btn .ic{ font-size:14px; color:var(--brand-400); transition:transform .3s var(--ease-out); }
.copy-btn:hover{ border-color:var(--brand-400); background:rgba(0,147,221,.14); color:var(--brand-400); }
.copy-btn:hover .ic{ transform:translateY(-1px) scale(1.08); }
.copy-btn.is-copied{ border-color:#3ddc97; color:#3ddc97; background:rgba(61,220,151,.12); }
.copy-btn.is-copied .ic{ color:#3ddc97; }
.copy-btn__hint{
  margin-left:10px; font-size:12px; color:var(--on-dark-mute); letter-spacing:.04em;
  white-space:nowrap;
}
.copy-btn.is-copied + .copy-btn__hint{ color:#3ddc97; }

/* 复制成功提示 */
.copy-toast{
  position:fixed; left:50%; bottom:34px; z-index:200;
  display:flex; align-items:center; gap:9px;
  padding:12px 22px; border-radius:999px;
  font-size:14px; color:var(--on-dark); white-space:nowrap;
  background:rgba(10,20,37,.92); border:1px solid rgba(61,220,151,.45);
  box-shadow:0 18px 44px -20px rgba(0,0,0,.75);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  opacity:0; transform:translate(-50%,16px); pointer-events:none;
  transition:opacity .32s var(--ease), transform .42s var(--ease-out);
}
.copy-toast .ic{ color:#3ddc97; }
.copy-toast.is-on{ opacity:1; transform:translate(-50%,0); }
.contact__badge{
  grid-column:1/-1;
  display:flex; gap:12px; align-items:flex-start; margin-top:6px; padding:18px 22px;
  border-radius:var(--r-md); background:rgba(0,147,221,.09); border:1px solid rgba(0,147,221,.24);
}
.contact__badge .dot-pulse{ margin-top:8px; }
.contact__badge p{ font-size:13.5px; color:var(--on-dark-dim); line-height:1.85; }

/* ── 14. 页脚 ────────────────────────────────────────────── */
.footer{
  background:var(--ink-900); border-top:1px solid var(--line-dark-2);
  padding:clamp(48px,6vw,76px) 0 30px;
}
.footer__top{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);
  gap:clamp(30px,4vw,60px); padding-bottom:42px; border-bottom:1px solid var(--line-dark-2);
}
.footer__brand img{ height:36px; width:auto; }
.footer__brand p{ margin-top:16px; font-size:14px; color:var(--on-dark-mute); max-width:34ch; }
.footer__entity{
  margin-top:14px; font-style:normal;
  font-size:12.5px; line-height:1.95; color:var(--on-dark-mute);
}
.footer__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.footer__cols h2{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brand-200); margin-bottom:16px; font-weight:400;
}
.footer__cols a{
  display:block; font-size:14px; color:var(--on-dark-mute); padding:6px 0;
  transition:color .3s var(--ease), transform .3s var(--ease);
}
.footer__cols a:hover{ color:var(--on-dark); transform:translateX(4px); }
.footer__bar{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:14px 26px; padding-top:26px;
  font-size:12.5px; color:var(--on-dark-mute);
}
.footer__legal{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 24px;
  font-family:var(--f-mono); font-size:inherit; line-height:inherit;
}
.footer__legal a{ transition:color .3s var(--ease); }
.footer__legal a:hover{ color:var(--brand-400); }
.footer__beian{
  display:inline-flex; align-items:baseline; gap:6px; vertical-align:baseline;
}

.footer__top-btn{
  align-self:center; margin-left:auto; width:42px; height:42px; border-radius:50%;
  display:grid; place-items:center; color:var(--on-dark-dim);
  border:1px solid var(--line-dark); transition:all .35s var(--ease);
}
.footer__top-btn .ic{ transform:rotate(-90deg); transition:transform .35s var(--ease); }
.footer__top-btn:hover{ background:var(--brand); border-color:var(--brand); color:#fff; }
.footer__top-btn:hover .ic{ transform:rotate(-90deg) translateY(-2px); }

/* ── 15. 滚动显现 ────────────────────────────────────────── */
/* 仅在 JS 可用时才隐藏初始态：关闭脚本的爬虫与浏览器仍可读取全部正文 */
html.js .reveal{
  opacity:0; transform:translateY(26px);
  transition:opacity .85s var(--ease-out) var(--d,0s), transform .85s var(--ease-out) var(--d,0s);
}
html.js .reveal.is-in{ opacity:1; transform:none; }

/* ── 16. 响应式 ──────────────────────────────────────────── */
@media (max-width:1080px){
  .nav__link{ padding:9px 11px; font-size:14.5px; }
  .hero__inner{ grid-template-columns:1fr; }
  .hero__visual{ max-width:440px; order:2; }
  .hero__copy{ order:1; }
  .hero{ padding-top:140px; }
  .svc{ grid-template-columns:1fr; }
  .svc__stage{ position:static; }
  .process{ grid-template-columns:repeat(3,1fr); }
  .work{ grid-column:span 6; }
  .work--wide{ grid-column:span 12; }
  .about{ grid-template-columns:1fr; }
  .footer__top{ grid-template-columns:1fr; }
}

@media (max-width:860px){
  .nav{ padding-top:16px; padding-bottom:16px; }
  .nav.is-stuck{ padding-top:10px; padding-bottom:10px; }
  .brand img{ height:36px; }
  .nav__menu{
    position:fixed; inset:0 0 0 auto; width:min(330px,84vw);
    flex-direction:column; align-items:flex-start; gap:2px;
    padding:100px 30px 40px; background:var(--ink-800);
    border-left:1px solid var(--line-dark);
    transform:translateX(101%); transition:transform .5s var(--ease-out);
    box-shadow:-30px 0 70px -30px rgba(0,0,0,.8);
    z-index:95;
  }
  .nav__menu.is-open{ transform:none; }
  .nav__link{
    font-family:var(--f-serif); font-size:21px; font-weight:600; color:var(--on-dark);
    padding:14px 0; width:100%; border-bottom:1px solid var(--line-dark-2);
    opacity:0; transform:translateX(20px);
    transition:opacity .45s var(--ease), transform .45s var(--ease);
  }
  .nav__link::after{ display:none; }
  .nav__link::before{ display:none; }
  .nav__link.is-active{ color:var(--brand-200); }
  .nav__menu.is-open .nav__link{ opacity:1; transform:none; }
  .nav__menu.is-open .nav__link:nth-child(1){ transition-delay:.08s; }
  .nav__menu.is-open .nav__link:nth-child(2){ transition-delay:.14s; }
  .nav__menu.is-open .nav__link:nth-child(3){ transition-delay:.2s; }
  .nav__menu.is-open .nav__link:nth-child(4){ transition-delay:.26s; }
  .nav__menu.is-open .nav__link:nth-child(5){ transition-delay:.32s; }
  .nav__menu.is-open .nav__link:nth-child(6){ transition-delay:.38s; }
  .nav__toggle{ display:flex; }
  .nav__actions{ margin-left:auto; }
  .nav__cta{ display:none; }
  .stats__grid{ grid-template-columns:repeat(2,1fr); row-gap:28px; }
  .stat{ border-left:0; padding:0; }
  .stat:nth-child(odd){ border-right:1px solid var(--line-dark); padding-right:20px; }
  .stat:nth-child(even){ padding-left:20px; }
  .process{ grid-template-columns:repeat(2,1fr); }
  .work{ grid-column:span 12; }
  .work--wide{ flex-direction:column; }
  .work--wide .work__shot{ width:100%; height:280px; }
}

@media (max-width:640px){
  html{ scroll-padding-top:90px; }
  body{ font-size:15px; }
  .hero{ padding:122px 0 76px; min-height:auto; }
  .hero__title{ font-size:clamp(2.1rem,8.6vw,3rem); }
  .hero__lead{ font-size:15px; line-height:1.9; }
  .hero__actions{ gap:12px; }
  .hero__actions .btn{ flex:1; justify-content:center; min-width:150px; }
  .hero__trust{ gap:9px 18px; font-size:12.5px; }
  .hero__visual{ max-width:330px; margin-top:12px; }
  .float-card{ padding:12px 15px; }
  .float-card--a{ left:-2%; top:8%; }
  .float-card--b{ right:-2%; bottom:8%; }
  .float-card__v{ font-size:17px; }
  .float-card__tags{ max-width:160px; }
  .hero__scroll{ display:none; }
  .stat__num{ font-size:2rem; }
  .svc__btn{ grid-template-columns:auto 1fr; row-gap:2px; padding:16px 8px; }
  .svc__en{ grid-column:2; }
  .svc__panel{ padding:24px 20px; }
  .svc__panel-art{ height:120px; }
  .art--chart{ height:120px; }
  .art--palette .art__swatch{ width:44px; height:44px; }
  .process{ grid-template-columns:1fr; }
  .process__step{ padding:24px 20px; }
  .about__values{ grid-template-columns:1fr; }
  .about__facts{ grid-template-columns:1fr 1fr; gap:18px 12px; }
  .about__facts dd{ font-size:18px; }
  .contact__info{ grid-template-columns:1fr; padding:22px 18px; }
  .contact__row{ padding:16px 18px; }
  .footer__cols{ grid-template-columns:1fr 1fr; gap:22px; }
  .footer__legal{ order:3; }
  .footer__top-btn{ margin-left:0; }
}

@media (max-width:420px){
  .brand img{ height:32px; }
  .stats__grid{ grid-template-columns:1fr; }
  .stat:nth-child(odd){ border-right:0; padding-right:0; }
  .stat:nth-child(even){ padding-left:0; }
  .stat:not(:last-child){ padding-bottom:18px; border-bottom:1px solid var(--line-dark); }
  .footer__cols{ grid-template-columns:1fr; }
}

/* ── 17. 无障碍 / 降级 ───────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  html.js .reveal{ opacity:1; transform:none; }
}
@media print{
  .nav,.scroll-progress,.hero__canvas,.hero__scroll,.footer__top-btn{ display:none; }
  body{ background:#fff; color:#000; }
  html.js .reveal{ opacity:1; transform:none; }
}

/* ── 18. 常见问题（FAQ）───────────────────────────────────── */
.section--faq{ background:var(--paper-2); color:var(--on-light); }
.section--faq .sec-head__title{ color:var(--on-light); }
.faq{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,2vw,26px); align-items:start;
}
.faq__item{
  padding:clamp(22px,2.6vw,32px);
  border-radius:var(--r-lg); border:1px solid var(--line-light);
  background:#fff; box-shadow:0 10px 30px -26px rgba(10,20,37,.5);
  transition:opacity .85s var(--ease-out) var(--d,0s),
             transform .85s var(--ease-out) var(--d,0s),
             border-color .45s var(--ease), box-shadow .45s var(--ease);
}
.faq__item:nth-child(even){ --d:.07s; }
.faq__item:hover{
  transform:translateY(-4px);
  border-color:rgba(0,147,221,.34);
  box-shadow:0 28px 54px -34px rgba(10,20,37,.6);
}
.faq__q{
  position:relative; padding-left:28px; margin-bottom:14px;
  font-family:var(--f-serif); font-size:clamp(17px,1.7vw,20px);
  font-weight:700; color:var(--on-light); line-height:1.55;
}
.faq__q::before{
  content:"Q"; position:absolute; left:0; top:1px;
  font-family:var(--f-mono); font-size:14px; font-weight:500;
  color:var(--brand); letter-spacing:.04em;
}
.faq__a{ font-size:14.5px; color:var(--on-light-dim); line-height:1.95; }

@media (max-width:900px){
  .faq{ grid-template-columns:1fr; }
}
