/* What we do (2026-10-16): one page, two parts. 01 custom services (what we build to order) and
   02 products (every service in Level 1–4, grouped, since 2026-10-20; plus the certification & compliance
   add-on), then short terms.
   Old section ids (levels, compare, certification, erp-demo, how, …) stay as anchors so links keep working. */
.wwd-anchor{display:block;height:0}

/* Hero: two doors, one per part of the page. */
.wwd-hero .lead{max-width:760px}
.wwd-jump{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:980px;margin-top:44px;animation:rise 1s var(--ease) .6s both}
.wwd-jump a{display:flex;align-items:center;gap:18px;padding:22px 24px;border-radius:20px;border:1px solid var(--line);background:rgba(16,27,37,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .3s,background .3s}
.wwd-jump b{display:grid;place-items:center;width:46px;height:46px;flex:none;border-radius:50%;background:var(--cyan);color:var(--ink);font-size:15px;font-weight:700}
.wwd-jump__copy{display:grid;gap:4px;flex:1}
.wwd-jump strong{font-size:19px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.wwd-jump__copy>span{font-size:14.5px;line-height:1.5;color:var(--muted)}
.wwd-jump>a>.ic{flex:none;font-size:20px;color:var(--cyan);rotate:90deg;transition:translate .35s var(--ease)}
.wwd-jump a:hover{border-color:rgba(102,217,239,.55);background:rgba(16,27,37,.9)}
.wwd-jump a:hover>.ic{translate:0 4px}

/* 01 Custom services */
.wsvc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.3vw,18px)}
.wsvc>li{display:flex}
.wsvc>li>a{flex:1;display:flex;flex-direction:column;padding:28px 26px 22px;border-radius:22px;border:1px solid var(--line-soft);background:var(--panel);transition:transform .5s var(--ease),border-color .3s}
.wsvc__ico{width:52px;height:52px;display:grid;place-items:center;flex:none;border-radius:14px;background:var(--cyan-soft);color:var(--cyan);font-size:26px}
.wsvc strong{display:block;margin-top:22px;font-size:clamp(19px,1.4vw,22px);font-weight:600;letter-spacing:-.015em;line-height:1.3}
.wsvc__txt{margin-top:10px;font-size:15px;line-height:1.6;color:var(--muted)}
.wsvc__eg{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.wsvc__eg li{padding:5px 11px;border-radius:30px;background:rgba(214,232,240,.07);font-size:13px;font-weight:550;line-height:1.35;color:#d3dee3}
.wsvc .link{margin-top:auto;padding-top:18px;font-size:14px}
@media(hover:hover){.wsvc>li>a:hover{transform:translateY(-6px);border-color:rgba(102,217,239,.45)}.wsvc>li>a:hover .link .ic{transform:translateX(5px)}}
.wwd-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.3vw,18px);margin-top:clamp(12px,1.3vw,18px)}
.wwd-note{display:flex;align-items:flex-start;gap:18px;padding:24px 26px;border-radius:20px;border:1px solid rgba(102,217,239,.18);background:rgba(102,217,239,.05);scroll-margin-top:110px}
.wwd-note__ico{width:46px;height:46px;display:grid;place-items:center;flex:none;border-radius:13px;background:var(--cyan-soft);color:var(--cyan);font-size:23px}
.wwd-note h3{font-size:18px;font-weight:600;line-height:1.35;letter-spacing:-.01em}
.wwd-note p{margin-top:6px;font-size:15px;line-height:1.6;color:var(--muted)}
.wwd-note p a{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}
.wwd-note .link{margin-top:6px;font-size:14.5px}

/* 02 Products: a jump bar, one block per level (name and purpose on the left, every service grouped on
   the right), then the add-on. */
.lvd-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:clamp(12px,1.3vw,18px)}
.lvd-nav a{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:#fff;font-size:15px;font-weight:600;line-height:1.3;color:var(--paper-ink);box-shadow:0 20px 40px -36px rgba(13,24,32,.5);transition:background .25s}
.lvd-nav b{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:11px;background:var(--paper-ink);color:var(--cyan);font-size:14px;font-weight:700}
.lvd-nav a:hover{background:#e6f6fa}
.lvd{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,2.2fr);gap:clamp(24px,3vw,48px);padding:clamp(26px,3vw,40px);border-radius:22px;background:#fff;box-shadow:0 30px 60px -48px rgba(13,24,32,.5);scroll-margin-top:110px}
.lvd+.lvd{margin-top:clamp(12px,1.3vw,18px)}
.lvd__side{display:flex;flex-direction:column;align-items:flex-start}
.lvd__name{margin-top:6px;font-size:clamp(24px,2vw,30px);font-weight:600;letter-spacing:-.02em;line-height:1.2}
.lvd__txt{margin-top:10px;font-size:16px;line-height:1.6;color:var(--paper-muted)}
.lvd__note{margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--paper);font-size:14px;line-height:1.55;color:var(--paper-muted)}
.lvd__side .link{margin-top:20px;font-size:14.5px}
.lvd__groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px clamp(20px,2.4vw,36px);align-content:start}
.lvd__grp h4{padding-bottom:10px;border-bottom:1px solid var(--paper-line);font-size:12.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan-deep)}
html[lang^=zh] .lvd__grp h4{letter-spacing:.06em}
.lvd__grp ul{display:grid;gap:14px;margin-top:14px}
.lvd__grp li{display:flex;align-items:flex-start;gap:10px}
.lvd__grp .ic{flex:none;font-size:16px;color:var(--cyan-deep);margin-top:3px}
.lvd__grp strong{display:block;font-size:15.5px;font-weight:600;line-height:1.4;color:var(--paper-ink)}
.lvd__grp li div>span{display:block;margin-top:2px;font-size:14.5px;line-height:1.55;color:var(--paper-muted)}
.lv__head{display:flex;align-items:center;justify-content:space-between;align-self:stretch}
.lv__no{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:var(--paper-ink);color:var(--cyan);font-size:19px;font-weight:700;letter-spacing:.02em}
.lv__head .ic{font-size:28px;color:var(--cyan-deep)}
.lv__lvl{display:block;margin-top:22px;font-size:12.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--paper-muted)}
@media(hover:hover){.lvd-nav a:hover b{background:var(--cyan-deep);color:#fff}.lvd__side .link:hover .ic{transform:translateX(5px)}}
.addon{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.05fr);gap:24px clamp(24px,3vw,48px);align-items:center;margin-top:clamp(12px,1.3vw,18px);padding:clamp(26px,3vw,44px);border-radius:22px;background:var(--paper-ink);color:var(--white);scroll-margin-top:110px}
.addon__plus{display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:var(--cyan);color:var(--ink);font-size:42px;font-weight:300;line-height:1}
.addon__tag{font-size:12.5px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}
html[lang^=zh] .addon__tag,html[lang^=zh] .lv__lvl{letter-spacing:.06em}
.addon .h3{margin-top:8px}
.addon__copy>p:not(.addon__tag){margin-top:10px;font-size:15.5px;line-height:1.65;color:#c3d0d6}
.addon .link{margin-top:12px;color:var(--cyan)}
.addon__codes{display:flex;flex-wrap:wrap;gap:8px}
.addon__codes li{padding:8px 13px;border-radius:30px;background:rgba(214,232,240,.08);font-size:13.5px;font-weight:600;line-height:1.3;color:#dfe8ec}
.addon__codes li:nth-child(-n+4){background:var(--cyan-soft);color:var(--cyan)}
.lv-note{margin-top:22px;font-size:14px;line-height:1.6;color:var(--paper-muted)}

/* Terms: four facts, the small print folded away */
.wwd-terms__head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px 32px;margin-bottom:28px}
.wwd-terms__head .h3{margin-top:18px}
.wwd-terms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.wwd-terms li{display:flex;align-items:flex-start;gap:14px;padding:22px;border-radius:18px;border:1px solid var(--line-soft);background:var(--panel)}
.wwd-terms .ic{flex:none;font-size:24px;color:var(--cyan);margin-top:2px}
.wwd-terms strong{display:block;font-size:16.5px;font-weight:600;line-height:1.35}
.wwd-terms li span{display:block;margin-top:4px;font-size:14.5px;line-height:1.5;color:var(--muted)}
.fine{margin-top:12px;border-radius:18px;border:1px solid var(--line-soft);background:var(--panel)}
.fine summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;list-style:none;cursor:pointer;font-size:15px;font-weight:550;color:#dfe8ec}
.fine summary::-webkit-details-marker{display:none}
.fine .chev{width:8px;height:8px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s}
.fine[open] .chev{transform:translateY(2px) rotate(225deg)}
.fine summary:hover{color:var(--cyan)}
.fine__body{padding:0 22px 22px;max-width:980px}
.fine__body p{font-size:14.5px;line-height:1.7;color:var(--muted)}
.fine__body p+p{margin-top:10px}
.fine__body strong{color:#e2ebef;font-weight:600}

@media(max-width:1100px){
  .wsvc,.lvd-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lvd{grid-template-columns:1fr}
  .wwd-terms{grid-template-columns:repeat(2,minmax(0,1fr))}
  .addon{grid-template-columns:auto minmax(0,1fr)}
  .addon__codes{grid-column:1/-1}
}
@media(max-width:720px){
  .wwd-jump{grid-template-columns:1fr;margin-top:32px;gap:10px}
  .wwd-jump a{padding:16px 18px;gap:14px}
  .wwd-jump b{width:40px;height:40px}
  .wwd-jump strong{font-size:17px}
  .wwd-jump__copy>span{font-size:15px}
  .wsvc{grid-template-columns:1fr}
  .wsvc>li>a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 16px;padding:20px}
  .wsvc__ico{grid-row:1/5;width:46px;height:46px;font-size:23px}
  .wsvc strong{margin-top:0;font-size:18.5px}
  .wsvc__txt{margin-top:0;font-size:16px}
  .wsvc .link{padding-top:6px;font-size:14.5px}
  .wwd-notes,.wwd-terms,.lvd__groups{grid-template-columns:1fr}
  .wsvc__eg{grid-column:2;margin-top:4px}
  .lvd-nav a{font-size:14px;padding:10px 12px 10px 10px;gap:10px}
  .lvd-nav b{width:34px;height:34px}
  .lvd{padding:22px}
  .lvd__txt,.lvd__grp strong{font-size:16px}
  .lvd__grp li div>span{font-size:15px}
  .wwd-note{padding:20px;gap:14px}
  .wwd-note p,.addon__copy>p:not(.addon__tag),.fine__body p{font-size:16px}
  .lv__lvl,.addon__tag{font-size:13.5px}
  .addon{grid-template-columns:1fr}
  .addon__plus{width:52px;height:52px;font-size:34px}
  .wwd-terms li{padding:18px}
  .wwd-terms li span{font-size:15px}
  .fine summary{padding:16px 18px;font-size:15.5px}
  .fine__body{padding:0 18px 18px}
}
@media(prefers-reduced-motion:reduce){.wwd-jump{animation:none}}