1018 lines
71 KiB
HTML
1018 lines
71 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="海南荣刻科技有限公司，专注数据治理、人工智能、垂类模型优化与模型私有化部署，为企业提供数据到 AI 落地的全链路解决方案。">
|
|
<meta name="theme-color" content="#061018">
|
|
<title data-i18n="title">海南荣刻科技有限公司 - 数据筑基 · AI 落地</title>
|
|
<style>
|
|
*, *::before, *::after { box-sizing: border-box; }
|
|
|
|
:root {
|
|
color-scheme: dark;
|
|
--ink-1000: #03080d;
|
|
--ink-950: #061018;
|
|
--ink-900: #0a1721;
|
|
--ink-850: #0d1d29;
|
|
--ink-800: #102431;
|
|
--paper: #f2f7f8;
|
|
--white: #ffffff;
|
|
--text: #eaf4f5;
|
|
--text-soft: #9bb0b7;
|
|
--text-faint: #6e858d;
|
|
--cyan: #36e4da;
|
|
--cyan-bright: #72fff1;
|
|
--blue: #4a8dff;
|
|
--violet: #9277ff;
|
|
--success: #79efa9;
|
|
--warning: #ffcf66;
|
|
--line: rgba(183, 229, 231, .13);
|
|
--line-strong: rgba(114, 255, 241, .34);
|
|
--surface: rgba(13, 29, 41, .78);
|
|
--surface-solid: #0d1d29;
|
|
--ambient: 0 24px 100px rgba(0, 0, 0, .34);
|
|
--glow: 0 0 48px rgba(54, 228, 218, .11);
|
|
--radius-sm: 10px;
|
|
--radius-md: 16px;
|
|
--radius-lg: 24px;
|
|
--max-width: 1200px;
|
|
--nav-height: 72px;
|
|
--ease: cubic-bezier(.2, .8, .2, 1);
|
|
--mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
|
}
|
|
|
|
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-height) + 20px); }
|
|
body {
|
|
margin: 0;
|
|
min-width: 320px;
|
|
overflow-x: hidden;
|
|
background: var(--ink-950);
|
|
color: var(--text);
|
|
font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
|
|
font-size: 16px;
|
|
line-height: 1.7;
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
|
|
body.menu-open { overflow: hidden; }
|
|
a { color: inherit; text-decoration: none; }
|
|
button { color: inherit; font: inherit; }
|
|
img { max-width: 100%; display: block; }
|
|
::selection { color: var(--ink-1000); background: var(--cyan); }
|
|
|
|
.skip-link {
|
|
position: fixed;
|
|
top: 12px;
|
|
left: 12px;
|
|
z-index: 2000;
|
|
padding: 10px 16px;
|
|
border-radius: 8px;
|
|
color: var(--ink-1000);
|
|
background: var(--cyan-bright);
|
|
transform: translateY(-160%);
|
|
transition: transform .2s;
|
|
}
|
|
.skip-link:focus { transform: translateY(0); }
|
|
|
|
:focus-visible {
|
|
outline: 2px solid var(--cyan-bright);
|
|
outline-offset: 4px;
|
|
}
|
|
|
|
.container { width: min(calc(100% - 48px), var(--max-width)); margin-inline: auto; }
|
|
.mono { font-family: var(--mono); letter-spacing: .06em; }
|
|
|
|
.navbar {
|
|
position: fixed;
|
|
inset: 0 0 auto;
|
|
z-index: 1000;
|
|
height: var(--nav-height);
|
|
border-bottom: 1px solid transparent;
|
|
background: rgba(6, 16, 24, .62);
|
|
backdrop-filter: blur(18px) saturate(135%);
|
|
-webkit-backdrop-filter: blur(18px) saturate(135%);
|
|
transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
|
|
}
|
|
|
|
.navbar.scrolled {
|
|
border-bottom-color: var(--line);
|
|
background: rgba(6, 16, 24, .91);
|
|
box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
|
|
}
|
|
|
|
.nav-inner {
|
|
width: min(calc(100% - 48px), var(--max-width));
|
|
height: 100%;
|
|
margin-inline: auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 28px;
|
|
}
|
|
|
|
.brand { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; }
|
|
.brand-mark {
|
|
display: grid;
|
|
place-items: center;
|
|
width: 34px;
|
|
height: 34px;
|
|
border: 1px solid var(--line-strong);
|
|
border-radius: 9px;
|
|
background: linear-gradient(145deg, rgba(54, 228, 218, .16), rgba(74, 141, 255, .05));
|
|
color: var(--cyan-bright);
|
|
font: 700 11px/1 var(--mono);
|
|
box-shadow: inset 0 0 18px rgba(54, 228, 218, .08);
|
|
}
|
|
.brand-copy { display: flex; flex-direction: column; line-height: 1.15; }
|
|
.brand-name { color: var(--white); font-weight: 750; letter-spacing: .04em; }
|
|
.brand-en { margin-top: 4px; color: var(--text-faint); font: 500 8px/1 var(--mono); letter-spacing: .16em; }
|
|
|
|
.nav-links { display: flex; align-items: center; gap: 28px; }
|
|
.nav-link {
|
|
position: relative;
|
|
padding-block: 9px;
|
|
color: var(--text-soft);
|
|
font-size: 14px;
|
|
font-weight: 550;
|
|
transition: color .2s ease;
|
|
}
|
|
.nav-link::after {
|
|
content: "";
|
|
position: absolute;
|
|
inset: auto 50% 2px;
|
|
width: 4px;
|
|
height: 4px;
|
|
border-radius: 50%;
|
|
background: var(--cyan);
|
|
box-shadow: 0 0 12px var(--cyan);
|
|
opacity: 0;
|
|
transform: translateX(-50%) scale(0);
|
|
transition: opacity .2s ease, transform .2s ease;
|
|
}
|
|
.nav-link:hover, .nav-link.active { color: var(--white); }
|
|
.nav-link.active::after { opacity: 1; transform: translateX(-50%) scale(1); }
|
|
|
|
.nav-actions { display: flex; align-items: center; gap: 10px; }
|
|
.lang-switch {
|
|
display: inline-flex;
|
|
padding: 3px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 9px;
|
|
background: rgba(255, 255, 255, .025);
|
|
}
|
|
.lang-btn {
|
|
min-width: 34px;
|
|
padding: 5px 8px;
|
|
border: 0;
|
|
border-radius: 6px;
|
|
background: transparent;
|
|
color: var(--text-faint);
|
|
font: 650 11px/1.4 var(--mono);
|
|
cursor: pointer;
|
|
}
|
|
.lang-btn.active { color: var(--ink-1000); background: var(--cyan); }
|
|
|
|
.nav-cta, .button {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 10px;
|
|
min-height: 46px;
|
|
border: 1px solid transparent;
|
|
border-radius: 10px;
|
|
padding: 0 20px;
|
|
font-size: 14px;
|
|
font-weight: 700;
|
|
cursor: pointer;
|
|
transition: transform .25s var(--ease), box-shadow .25s ease, border-color .25s ease, background .25s ease;
|
|
}
|
|
.nav-cta { min-height: 38px; padding-inline: 16px; color: var(--ink-1000); background: var(--cyan); }
|
|
.nav-cta:hover, .button-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 34px rgba(54, 228, 218, .2); }
|
|
|
|
.menu-btn {
|
|
display: none;
|
|
width: 42px;
|
|
height: 42px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 10px;
|
|
background: rgba(255, 255, 255, .03);
|
|
cursor: pointer;
|
|
}
|
|
.menu-btn span { display: block; width: 18px; height: 1px; margin: 5px auto; background: var(--text); transition: transform .25s, opacity .2s; }
|
|
.menu-btn.open span:first-child { transform: translateY(6px) rotate(45deg); }
|
|
.menu-btn.open span:nth-child(2) { opacity: 0; }
|
|
.menu-btn.open span:last-child { transform: translateY(-6px) rotate(-45deg); }
|
|
|
|
.hero {
|
|
position: relative;
|
|
min-height: 920px;
|
|
padding: 150px 0 90px;
|
|
overflow: hidden;
|
|
isolation: isolate;
|
|
background:
|
|
radial-gradient(circle at var(--pointer-x, 72%) var(--pointer-y, 28%), rgba(54, 228, 218, .13), transparent 25%),
|
|
radial-gradient(circle at 14% 22%, rgba(74, 141, 255, .12), transparent 28%),
|
|
linear-gradient(180deg, #061018 0%, #07131c 65%, #091721 100%);
|
|
}
|
|
.hero::before {
|
|
content: "";
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: -2;
|
|
opacity: .45;
|
|
background-image: linear-gradient(rgba(176, 235, 237, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(176, 235, 237, .045) 1px, transparent 1px);
|
|
background-size: 56px 56px;
|
|
mask-image: linear-gradient(to bottom, #000 0%, transparent 88%);
|
|
-webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 88%);
|
|
}
|
|
.hero::after {
|
|
content: "";
|
|
position: absolute;
|
|
inset: auto 0 0;
|
|
z-index: -1;
|
|
height: 220px;
|
|
background: linear-gradient(transparent, rgba(9, 23, 33, .96));
|
|
pointer-events: none;
|
|
}
|
|
|
|
.hero-layout {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, .88fr) minmax(520px, 1.12fr);
|
|
align-items: center;
|
|
gap: clamp(56px, 7vw, 96px);
|
|
}
|
|
|
|
.eyebrow {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
margin-bottom: 24px;
|
|
color: var(--cyan);
|
|
font: 650 11px/1.4 var(--mono);
|
|
letter-spacing: .14em;
|
|
text-transform: uppercase;
|
|
}
|
|
.eyebrow::before { content: ""; width: 30px; height: 1px; background: currentColor; box-shadow: 0 0 12px currentColor; }
|
|
|
|
h1, h2, h3, p { margin-top: 0; }
|
|
.hero h1 {
|
|
max-width: 660px;
|
|
margin-bottom: 26px;
|
|
color: var(--white);
|
|
font-size: clamp(48px, 4.45vw, 64px);
|
|
font-weight: 780;
|
|
line-height: 1.06;
|
|
letter-spacing: -.055em;
|
|
}
|
|
.hero h1 .accent { color: var(--cyan-bright); text-shadow: 0 0 36px rgba(114, 255, 241, .16); }
|
|
.hero-description { max-width: 590px; margin-bottom: 36px; color: var(--text-soft); font-size: clamp(16px, 1.45vw, 18px); line-height: 1.85; }
|
|
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 44px; }
|
|
.button-primary { color: var(--ink-1000); background: var(--cyan); }
|
|
.button-secondary { border-color: var(--line); color: var(--text); background: rgba(255, 255, 255, .025); }
|
|
.button-secondary:hover { border-color: var(--line-strong); background: rgba(54, 228, 218, .055); transform: translateY(-2px); }
|
|
.button-arrow { font-family: var(--mono); transition: transform .2s ease; }
|
|
.button:hover .button-arrow { transform: translateX(3px); }
|
|
|
|
.hero-proof { display: flex; flex-wrap: wrap; gap: 22px; color: var(--text-faint); font: 550 11px/1.4 var(--mono); letter-spacing: .06em; }
|
|
.hero-proof span { display: inline-flex; align-items: center; gap: 8px; }
|
|
.hero-proof span::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--success); box-shadow: 0 0 10px rgba(121, 239, 169, .6); }
|
|
|
|
.control-room { position: relative; }
|
|
.control-room::before {
|
|
content: "";
|
|
position: absolute;
|
|
inset: 8% -6% -8% 14%;
|
|
z-index: -1;
|
|
border-radius: 50%;
|
|
background: rgba(54, 228, 218, .12);
|
|
filter: blur(70px);
|
|
opacity: .55;
|
|
}
|
|
.console {
|
|
border: 1px solid rgba(167, 232, 233, .2);
|
|
border-radius: var(--radius-lg);
|
|
overflow: hidden;
|
|
background: rgba(6, 17, 25, .84);
|
|
box-shadow: var(--ambient), var(--glow), inset 0 1px 0 rgba(255, 255, 255, .035);
|
|
backdrop-filter: blur(20px);
|
|
-webkit-backdrop-filter: blur(20px);
|
|
}
|
|
.console-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 20px;
|
|
min-height: 56px;
|
|
padding: 0 20px;
|
|
border-bottom: 1px solid var(--line);
|
|
background: rgba(255, 255, 255, .018);
|
|
}
|
|
.window-label { display: flex; align-items: center; gap: 10px; color: var(--text-faint); font: 600 10px/1 var(--mono); letter-spacing: .13em; }
|
|
.window-dots { display: inline-flex; gap: 5px; }
|
|
.window-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--text-faint); opacity: .45; }
|
|
.system-status { display: inline-flex; align-items: center; gap: 8px; color: var(--success); font: 650 9px/1 var(--mono); letter-spacing: .12em; }
|
|
.system-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; animation: statusPulse 2.4s ease-in-out infinite; }
|
|
|
|
.console-body { display: grid; grid-template-columns: 164px 1fr; min-height: 440px; }
|
|
.pipeline-nav { padding: 22px 14px; border-right: 1px solid var(--line); background: rgba(255, 255, 255, .012); }
|
|
.pipeline-title { margin: 0 8px 18px; color: var(--text-faint); font: 600 9px/1.3 var(--mono); letter-spacing: .13em; }
|
|
.pipeline-step {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-columns: 26px 1fr;
|
|
align-items: center;
|
|
gap: 8px;
|
|
min-height: 54px;
|
|
padding: 9px 8px;
|
|
border: 1px solid transparent;
|
|
border-radius: 9px;
|
|
color: var(--text-faint);
|
|
font-size: 11px;
|
|
}
|
|
.pipeline-step + .pipeline-step { margin-top: 5px; }
|
|
.pipeline-step.active { border-color: rgba(54, 228, 218, .18); color: var(--text); background: rgba(54, 228, 218, .06); }
|
|
.step-index { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid var(--line); border-radius: 7px; font: 650 9px/1 var(--mono); }
|
|
.active .step-index { border-color: var(--line-strong); color: var(--cyan); background: rgba(54, 228, 218, .08); }
|
|
.step-copy small { display: block; margin-top: 2px; color: var(--text-faint); font: 500 7px/1.4 var(--mono); letter-spacing: .07em; }
|
|
|
|
.orchestrator { min-width: 0; padding: 24px; }
|
|
.orchestrator-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
|
|
.orchestrator-kicker { margin-bottom: 7px; color: var(--cyan); font: 600 9px/1.2 var(--mono); letter-spacing: .14em; }
|
|
.orchestrator h2 { margin-bottom: 0; color: var(--white); font-size: 19px; line-height: 1.35; letter-spacing: -.02em; }
|
|
.live-badge { padding: 6px 9px; border: 1px solid rgba(121, 239, 169, .2); border-radius: 7px; color: var(--success); background: rgba(121, 239, 169, .05); font: 650 8px/1 var(--mono); letter-spacing: .1em; }
|
|
|
|
.engine-map {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 10px;
|
|
min-height: 184px;
|
|
padding: 18px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 14px;
|
|
background: linear-gradient(135deg, rgba(74, 141, 255, .05), rgba(54, 228, 218, .025));
|
|
overflow: hidden;
|
|
}
|
|
.engine-map::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 1px;
|
|
background: linear-gradient(transparent, var(--cyan), transparent);
|
|
box-shadow: 0 0 18px var(--cyan);
|
|
opacity: .4;
|
|
animation: scan 5s linear infinite;
|
|
}
|
|
.engine-node {
|
|
position: relative;
|
|
z-index: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 8px;
|
|
min-width: 0;
|
|
padding: 13px;
|
|
border: 1px solid rgba(179, 230, 232, .1);
|
|
border-radius: 10px;
|
|
background: rgba(6, 16, 24, .72);
|
|
}
|
|
.engine-node-name { min-width: 0; }
|
|
.engine-node-name strong { display: block; overflow: hidden; color: var(--text); font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
|
|
.engine-node-name small { display: block; margin-top: 3px; color: var(--text-faint); font: 500 7px/1.2 var(--mono); letter-spacing: .07em; }
|
|
.node-state { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px rgba(54, 228, 218, .7); }
|
|
.node-state.blue { background: var(--blue); box-shadow: 0 0 10px rgba(74, 141, 255, .7); }
|
|
.node-state.violet { background: var(--violet); box-shadow: 0 0 10px rgba(146, 119, 255, .7); }
|
|
.node-state.green { background: var(--success); box-shadow: 0 0 10px rgba(121, 239, 169, .7); }
|
|
|
|
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 10px; }
|
|
.metric { padding: 13px 14px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255, 255, 255, .018); }
|
|
.metric-label { display: block; margin-bottom: 7px; color: var(--text-faint); font: 550 7px/1.2 var(--mono); letter-spacing: .08em; }
|
|
.metric strong { color: var(--white); font: 700 18px/1 var(--mono); }
|
|
.metric strong em { color: var(--cyan); font-size: 9px; font-style: normal; }
|
|
|
|
.console-foot {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 14px;
|
|
margin-top: 12px;
|
|
color: var(--text-faint);
|
|
font: 500 7px/1.4 var(--mono);
|
|
letter-spacing: .07em;
|
|
}
|
|
.console-progress { width: 96px; height: 3px; overflow: hidden; border-radius: 3px; background: rgba(255, 255, 255, .08); }
|
|
.console-progress i { display: block; width: 76%; height: 100%; background: linear-gradient(90deg, var(--blue), var(--cyan)); box-shadow: 0 0 10px var(--cyan); }
|
|
|
|
.signal-bar {
|
|
position: relative;
|
|
z-index: 2;
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
margin-top: 76px;
|
|
border-block: 1px solid var(--line);
|
|
}
|
|
.signal-item { padding: 21px 24px; border-right: 1px solid var(--line); }
|
|
.signal-item:last-child { border-right: 0; }
|
|
.signal-index { display: block; margin-bottom: 6px; color: var(--cyan); font: 650 9px/1 var(--mono); letter-spacing: .12em; }
|
|
.signal-name { color: var(--text-soft); font-size: 13px; font-weight: 600; }
|
|
|
|
.section { position: relative; padding: 124px 0; overflow: hidden; }
|
|
.section-header { display: grid; grid-template-columns: minmax(0, .8fr) minmax(300px, .48fr); align-items: end; gap: 64px; margin-bottom: 60px; }
|
|
.section-number { display: block; margin-bottom: 18px; color: var(--cyan); font: 650 10px/1 var(--mono); letter-spacing: .14em; }
|
|
.section-title { max-width: 760px; margin-bottom: 0; color: var(--white); font-size: clamp(38px, 4.25vw, 58px); font-weight: 750; line-height: 1.1; letter-spacing: -.045em; }
|
|
.section-desc { max-width: 520px; margin-bottom: 0; color: var(--text-soft); font-size: 16px; line-height: 1.85; }
|
|
|
|
.about { background: #091721; }
|
|
.about::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 88% 22%, rgba(74, 141, 255, .08), transparent 25%); }
|
|
.about-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(480px, 1.2fr); gap: 70px; align-items: start; }
|
|
.about-copy p { color: var(--text-soft); font-size: 16px; line-height: 1.95; }
|
|
.about-copy p + p { margin-top: 20px; }
|
|
.about-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 34px; }
|
|
.fact { padding: 20px; border-top: 1px solid var(--line-strong); background: linear-gradient(180deg, rgba(54, 228, 218, .04), transparent); }
|
|
.fact strong { display: block; margin-bottom: 8px; color: var(--white); font: 700 28px/1 var(--mono); }
|
|
.fact span { color: var(--text-faint); font-size: 12px; }
|
|
|
|
.capability-chain { position: relative; display: grid; gap: 10px; }
|
|
.chain-card {
|
|
display: grid;
|
|
grid-template-columns: 54px minmax(0, 1fr) auto;
|
|
align-items: center;
|
|
gap: 18px;
|
|
min-height: 98px;
|
|
padding: 20px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 14px;
|
|
background: rgba(255, 255, 255, .018);
|
|
transition: border-color .25s ease, background .25s ease, transform .25s var(--ease);
|
|
}
|
|
.chain-card:hover { border-color: var(--line-strong); background: rgba(54, 228, 218, .035); transform: translateX(4px); }
|
|
.chain-index { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid var(--line); border-radius: 12px; color: var(--cyan); font: 700 12px/1 var(--mono); }
|
|
.chain-copy h3 { margin-bottom: 4px; color: var(--white); font-size: 17px; }
|
|
.chain-copy p { margin-bottom: 0; color: var(--text-faint); font-size: 12px; line-height: 1.55; }
|
|
.chain-state { color: var(--success); font: 650 8px/1 var(--mono); letter-spacing: .1em; }
|
|
|
|
.services { background: var(--ink-950); }
|
|
.services::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .28; background-image: radial-gradient(rgba(182, 229, 230, .14) .7px, transparent .7px); background-size: 24px 24px; mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent); -webkit-mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent); }
|
|
.services-layout { position: relative; display: grid; grid-template-columns: 1.18fr .82fr .82fr; gap: 14px; }
|
|
.service-card {
|
|
position: relative;
|
|
min-height: 280px;
|
|
padding: 28px;
|
|
border: 1px solid var(--line);
|
|
border-radius: var(--radius-md);
|
|
overflow: hidden;
|
|
background: rgba(13, 29, 41, .62);
|
|
transition: transform .3s var(--ease), border-color .3s ease, background .3s ease, box-shadow .3s ease;
|
|
}
|
|
.service-card:hover { transform: translateY(-5px); border-color: rgba(114, 255, 241, .28); background: rgba(16, 36, 49, .82); box-shadow: 0 24px 60px rgba(0, 0, 0, .2); }
|
|
.service-card.featured { grid-row: span 2; min-height: 574px; padding: 34px; background: linear-gradient(155deg, rgba(54, 228, 218, .105), rgba(13, 29, 41, .72) 46%, rgba(74, 141, 255, .06)); }
|
|
.service-card::after { content: ""; position: absolute; top: 0; left: 26px; right: 26px; height: 1px; background: linear-gradient(90deg, transparent, rgba(114, 255, 241, .46), transparent); opacity: 0; transition: opacity .3s; }
|
|
.service-card:hover::after, .service-card.featured::after { opacity: 1; }
|
|
.service-code { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 70px; color: var(--cyan); font: 650 9px/1 var(--mono); letter-spacing: .11em; }
|
|
.featured .service-code { margin-bottom: 105px; }
|
|
.service-state { color: var(--text-faint); }
|
|
.service-card h3 { max-width: 390px; margin-bottom: 14px; color: var(--white); font-size: 23px; line-height: 1.3; letter-spacing: -.025em; }
|
|
.featured h3 { font-size: 34px; }
|
|
.service-card p { margin-bottom: 0; color: var(--text-soft); font-size: 13px; line-height: 1.8; }
|
|
.service-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 32px; }
|
|
.service-tag { padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--text-faint); background: rgba(0, 0, 0, .12); font: 550 8px/1 var(--mono); letter-spacing: .06em; }
|
|
|
|
.advantages { background: var(--paper); color: #102129; }
|
|
.advantages .section-number { color: #087c78; }
|
|
.advantages .section-title { color: #07161c; }
|
|
.advantages .section-desc { color: #52666d; }
|
|
.proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid rgba(9, 50, 58, .13); border-radius: 20px; overflow: hidden; background: var(--white); box-shadow: 0 24px 80px rgba(8, 28, 34, .08); }
|
|
.proof-card { min-height: 330px; padding: 28px; border-right: 1px solid rgba(9, 50, 58, .1); }
|
|
.proof-card:last-child { border-right: 0; }
|
|
.proof-code { display: block; margin-bottom: 92px; color: #168985; font: 700 10px/1 var(--mono); letter-spacing: .12em; }
|
|
.proof-card h3 { margin-bottom: 14px; color: #0a1d24; font-size: 20px; line-height: 1.35; letter-spacing: -.02em; }
|
|
.proof-card p { margin-bottom: 0; color: #667980; font-size: 13px; line-height: 1.8; }
|
|
|
|
.offices { background: #08141d; }
|
|
.office-network { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
|
|
.office-card { position: relative; min-height: 380px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; background: linear-gradient(150deg, rgba(74, 141, 255, .07), rgba(13, 29, 41, .72)); }
|
|
.office-card:last-child { background: linear-gradient(150deg, rgba(54, 228, 218, .07), rgba(13, 29, 41, .72)); }
|
|
.office-coordinate { display: flex; align-items: center; justify-content: space-between; margin-bottom: 94px; color: var(--text-faint); font: 600 9px/1 var(--mono); letter-spacing: .11em; }
|
|
.office-live { display: inline-flex; align-items: center; gap: 7px; color: var(--success); }
|
|
.office-live::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 8px currentColor; }
|
|
.office-card h3 { margin-bottom: 14px; color: var(--white); font-size: 28px; letter-spacing: -.03em; }
|
|
.office-card p { max-width: 470px; margin-bottom: 28px; color: var(--text-soft); font-size: 14px; line-height: 1.85; }
|
|
.office-tags { display: flex; flex-wrap: wrap; gap: 8px; }
|
|
.office-tag { padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--text-faint); font: 550 8px/1 var(--mono); letter-spacing: .07em; }
|
|
|
|
.contact { padding: 124px 0 70px; background: var(--ink-1000); }
|
|
.contact-shell { position: relative; padding: clamp(34px, 5vw, 66px); border: 1px solid rgba(114, 255, 241, .2); border-radius: 28px; overflow: hidden; background: linear-gradient(135deg, rgba(54, 228, 218, .09), rgba(74, 141, 255, .045) 45%, rgba(146, 119, 255, .055)); box-shadow: var(--ambient); }
|
|
.contact-shell::before { content: ""; position: absolute; width: 360px; height: 360px; right: -130px; top: -180px; border-radius: 50%; background: rgba(54, 228, 218, .1); filter: blur(65px); }
|
|
.contact-head { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 40px; margin-bottom: 58px; }
|
|
.contact h2 { max-width: 760px; margin-bottom: 0; color: var(--white); font-size: clamp(40px, 5vw, 68px); line-height: 1.08; letter-spacing: -.05em; }
|
|
.contact-lead { max-width: 330px; margin-bottom: 4px; color: var(--text-soft); font-size: 14px; line-height: 1.8; }
|
|
.contact-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
|
|
.contact-item { min-height: 160px; padding: 28px 26px 0 0; }
|
|
.contact-item + .contact-item { padding-left: 26px; border-left: 1px solid var(--line); }
|
|
.contact-label { display: block; margin-bottom: 22px; color: var(--cyan); font: 650 9px/1 var(--mono); letter-spacing: .11em; }
|
|
.contact-item h3 { margin-bottom: 9px; color: var(--white); font-size: 17px; }
|
|
.contact-value { display: inline-block; color: var(--text-soft); font-size: 14px; overflow-wrap: anywhere; transition: color .2s ease; }
|
|
a.contact-value:hover { color: var(--cyan-bright); }
|
|
|
|
footer { padding: 0 0 34px; background: var(--ink-1000); }
|
|
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 28px; border-top: 1px solid var(--line); color: var(--text-faint); font-size: 11px; }
|
|
.footer-signal { color: var(--text-faint); font: 550 8px/1 var(--mono); letter-spacing: .1em; }
|
|
|
|
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
|
|
.reveal.is-visible { opacity: 1; transform: translateY(0); }
|
|
.delay-1 { transition-delay: .08s; }
|
|
.delay-2 { transition-delay: .16s; }
|
|
.delay-3 { transition-delay: .24s; }
|
|
|
|
@keyframes statusPulse { 0%, 100% { opacity: 1; } 50% { opacity: .38; } }
|
|
@keyframes scan { from { left: -4%; } to { left: 104%; } }
|
|
|
|
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
|
|
.navbar { background: rgba(6, 16, 24, .96); }
|
|
.console { background: #07131c; }
|
|
}
|
|
|
|
@media (max-width: 1100px) {
|
|
.nav-links { gap: 18px; }
|
|
.hero { min-height: auto; }
|
|
.hero-layout { grid-template-columns: 1fr; }
|
|
.hero-copy { max-width: 760px; }
|
|
.control-room { width: min(100%, 700px); margin-left: auto; }
|
|
.section-header { gap: 36px; }
|
|
.about-grid { grid-template-columns: 1fr; }
|
|
.about-copy { max-width: 800px; }
|
|
.services-layout { grid-template-columns: repeat(2, 1fr); }
|
|
.service-card.featured { grid-row: auto; grid-column: span 2; min-height: 440px; }
|
|
.featured .service-code { margin-bottom: 110px; }
|
|
.proof-grid { grid-template-columns: repeat(2, 1fr); }
|
|
.proof-card:nth-child(2) { border-right: 0; }
|
|
.proof-card:nth-child(-n+2) { border-bottom: 1px solid rgba(9, 50, 58, .1); }
|
|
}
|
|
|
|
@media (max-width: 860px) {
|
|
:root { --nav-height: 66px; }
|
|
.nav-inner, .container { width: min(calc(100% - 36px), var(--max-width)); }
|
|
.menu-btn { display: block; }
|
|
.nav-links {
|
|
position: fixed;
|
|
inset: var(--nav-height) 0 auto;
|
|
display: grid;
|
|
gap: 0;
|
|
padding: 18px;
|
|
border-bottom: 1px solid var(--line);
|
|
background: rgba(6, 16, 24, .98);
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
transform: translateY(-12px);
|
|
transition: opacity .25s ease, transform .25s var(--ease);
|
|
}
|
|
.nav-links.open { opacity: 1; pointer-events: auto; transform: translateY(0); }
|
|
.nav-link { padding: 14px 6px; border-bottom: 1px solid var(--line); font-size: 15px; }
|
|
.nav-link::after { display: none; }
|
|
.nav-actions { padding-top: 14px; justify-content: space-between; }
|
|
.nav-cta { min-height: 42px; }
|
|
.hero { padding-top: 126px; }
|
|
.hero-layout { gap: 58px; }
|
|
.hero h1 { font-size: clamp(45px, 10vw, 68px); }
|
|
.signal-bar { grid-template-columns: repeat(2, 1fr); }
|
|
.signal-item:nth-child(2) { border-right: 0; }
|
|
.signal-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
|
|
.section { padding: 96px 0; }
|
|
.section-header { grid-template-columns: 1fr; gap: 24px; margin-bottom: 46px; }
|
|
.office-network { grid-template-columns: 1fr; }
|
|
.contact-head { grid-template-columns: 1fr; gap: 24px; }
|
|
.contact-grid { grid-template-columns: 1fr; }
|
|
.contact-item { min-height: auto; padding: 24px 0; }
|
|
.contact-item + .contact-item { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
|
|
}
|
|
|
|
@media (max-width: 620px) {
|
|
.nav-inner, .container { width: min(calc(100% - 28px), var(--max-width)); }
|
|
.brand-en { display: none; }
|
|
.hero { padding: 112px 0 64px; background: radial-gradient(circle at 78% 18%, rgba(54, 228, 218, .11), transparent 25%), linear-gradient(180deg, #061018, #091721); }
|
|
.hero::before { background-size: 42px 42px; }
|
|
.hero h1 { font-size: clamp(40px, 13.5vw, 58px); }
|
|
.hero-description { font-size: 15px; }
|
|
.hero-actions { display: grid; }
|
|
.button { width: 100%; }
|
|
.hero-proof { display: grid; grid-template-columns: 1fr; gap: 10px; }
|
|
.console-header { padding-inline: 14px; }
|
|
.window-label { font-size: 8px; }
|
|
.console-body { grid-template-columns: 1fr; }
|
|
.pipeline-nav { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; padding: 12px; border-right: 0; border-bottom: 1px solid var(--line); }
|
|
.pipeline-title { display: none; }
|
|
.pipeline-step { display: block; min-height: auto; padding: 8px 4px; text-align: center; }
|
|
.pipeline-step + .pipeline-step { margin-top: 0; }
|
|
.step-index { margin: 0 auto; }
|
|
.step-copy { display: none; }
|
|
.orchestrator { padding: 16px; }
|
|
.orchestrator-head { align-items: center; }
|
|
.orchestrator h2 { font-size: 16px; }
|
|
.engine-map { min-height: 170px; padding: 10px; }
|
|
.engine-node { padding: 10px; }
|
|
.engine-node-name strong { font-size: 9px; }
|
|
.metric { padding: 11px 8px; }
|
|
.metric strong { font-size: 15px; }
|
|
.signal-item { padding: 17px 14px; }
|
|
.section-title { font-size: 38px; }
|
|
.about-facts { grid-template-columns: 1fr; }
|
|
.chain-card { grid-template-columns: 46px 1fr; padding: 16px; }
|
|
.chain-index { width: 46px; height: 46px; }
|
|
.chain-state { display: none; }
|
|
.services-layout { grid-template-columns: 1fr; }
|
|
.service-card.featured { grid-column: auto; min-height: 400px; }
|
|
.service-card, .featured { min-height: 270px; padding: 24px; }
|
|
.service-code, .featured .service-code { margin-bottom: 70px; }
|
|
.featured h3 { font-size: 28px; }
|
|
.proof-grid { grid-template-columns: 1fr; }
|
|
.proof-card { min-height: 250px; border-right: 0; border-bottom: 1px solid rgba(9, 50, 58, .1); }
|
|
.proof-card:last-child { border-bottom: 0; }
|
|
.proof-code { margin-bottom: 56px; }
|
|
.office-card { min-height: 340px; padding: 26px; }
|
|
.office-coordinate { margin-bottom: 76px; }
|
|
.contact { padding-top: 90px; }
|
|
.contact-shell { padding: 28px 22px; border-radius: 20px; }
|
|
.contact h2 { font-size: 40px; }
|
|
.footer-inner { align-items: flex-start; flex-direction: column; }
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
html { scroll-behavior: auto; }
|
|
*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
|
|
.reveal { opacity: 1; transform: none; }
|
|
.hero { background: linear-gradient(180deg, #061018, #091721); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a class="skip-link" href="#main" data-i18n="skip">跳到主要内容</a>
|
|
|
|
<nav class="navbar" id="navbar" aria-label="主导航" data-i18n-aria="nav_label">
|
|
<div class="nav-inner">
|
|
<a class="brand" href="#home" aria-label="荣刻科技首页" data-i18n-aria="home_label">
|
|
<span class="brand-mark" aria-hidden="true">RK</span>
|
|
<span class="brand-copy">
|
|
<span class="brand-name" data-i18n="brand">荣刻科技</span>
|
|
<span class="brand-en">RONCARVE TECHNOLOGY</span>
|
|
</span>
|
|
</a>
|
|
|
|
<div class="nav-links" id="navLinks">
|
|
<a class="nav-link" href="#about" data-i18n="nav_about">能力链路</a>
|
|
<a class="nav-link" href="#services" data-i18n="nav_services">解决方案</a>
|
|
<a class="nav-link" href="#advantages" data-i18n="nav_advantages">核心优势</a>
|
|
<a class="nav-link" href="#offices" data-i18n="nav_offices">交付网络</a>
|
|
<div class="nav-actions">
|
|
<div class="lang-switch" id="langSwitch" aria-label="语言切换" data-i18n-aria="lang_label">
|
|
<button class="lang-btn active" type="button" data-lang="zh" aria-pressed="true">中</button>
|
|
<button class="lang-btn" type="button" data-lang="en" aria-pressed="false">EN</button>
|
|
</div>
|
|
<a class="nav-cta" href="#contact" data-i18n="nav_contact">预约咨询</a>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="menu-btn" id="menuBtn" type="button" aria-label="打开导航菜单" aria-expanded="false" aria-controls="navLinks">
|
|
<span></span><span></span><span></span>
|
|
</button>
|
|
</div>
|
|
</nav>
|
|
|
|
<main id="main">
|
|
<section class="hero" id="home">
|
|
<div class="container">
|
|
<div class="hero-layout">
|
|
<div class="hero-copy reveal is-visible">
|
|
<span class="eyebrow" data-i18n="hero_eyebrow">AI + DATA INFRASTRUCTURE</span>
|
|
<h1><span data-i18n="hero_line1">让企业数据</span><br><span class="accent" data-i18n="hero_line2">成为 AI 生产力</span></h1>
|
|
<p class="hero-description" data-i18n="hero_desc">从数据治理、模型优化到私有化部署，荣刻科技为企业构建可落地、可持续、可掌控的 AI 能力体系。</p>
|
|
<div class="hero-actions">
|
|
<a class="button button-primary" href="#contact"><span data-i18n="hero_primary">预约 AI 场景诊断</span><span class="button-arrow" aria-hidden="true">→</span></a>
|
|
<a class="button button-secondary" href="#services" data-i18n="hero_secondary">查看解决方案</a>
|
|
</div>
|
|
<div class="hero-proof" aria-label="核心能力摘要">
|
|
<span data-i18n="proof_data">7 年数据技术积累</span>
|
|
<span data-i18n="proof_private">支持私有化部署</span>
|
|
<span data-i18n="proof_delivery">成都 / 海口双城交付</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="control-room reveal delay-1" aria-label="AI 数据控制台示意">
|
|
<div class="console">
|
|
<div class="console-header">
|
|
<div class="window-label"><span class="window-dots" aria-hidden="true"><i></i><i></i><i></i></span> RONCARVE / AI CONTROL ROOM</div>
|
|
<span class="system-status" data-i18n="console_online">SYSTEM ONLINE</span>
|
|
</div>
|
|
<div class="console-body">
|
|
<aside class="pipeline-nav" aria-label="AI 落地链路">
|
|
<p class="pipeline-title">PIPELINE</p>
|
|
<div class="pipeline-step active"><span class="step-index">01</span><span class="step-copy" data-i18n="pipe_data">数据接入<small>DATA INTAKE</small></span></div>
|
|
<div class="pipeline-step"><span class="step-index">02</span><span class="step-copy" data-i18n="pipe_govern">治理加工<small>GOVERN</small></span></div>
|
|
<div class="pipeline-step"><span class="step-index">03</span><span class="step-copy" data-i18n="pipe_model">模型编排<small>ORCHESTRATE</small></span></div>
|
|
<div class="pipeline-step"><span class="step-index">04</span><span class="step-copy" data-i18n="pipe_deploy">安全部署<small>DEPLOY</small></span></div>
|
|
</aside>
|
|
<div class="orchestrator">
|
|
<div class="orchestrator-head">
|
|
<div>
|
|
<p class="orchestrator-kicker">INTELLIGENCE ORCHESTRATOR</p>
|
|
<h2 data-i18n="console_title">企业 AI 能力编排中枢</h2>
|
|
</div>
|
|
<span class="live-badge">LIVE</span>
|
|
</div>
|
|
<div class="engine-map">
|
|
<div class="engine-node"><span class="engine-node-name"><strong data-i18n="node_data">企业数据底座</strong><small>DATA FOUNDATION</small></span><i class="node-state"></i></div>
|
|
<div class="engine-node"><span class="engine-node-name"><strong data-i18n="node_knowledge">行业知识库</strong><small>KNOWLEDGE BASE</small></span><i class="node-state blue"></i></div>
|
|
<div class="engine-node"><span class="engine-node-name"><strong data-i18n="node_model">垂类模型</strong><small>VERTICAL MODEL</small></span><i class="node-state violet"></i></div>
|
|
<div class="engine-node"><span class="engine-node-name"><strong data-i18n="node_private">私有部署环境</strong><small>PRIVATE CLOUD</small></span><i class="node-state green"></i></div>
|
|
</div>
|
|
<div class="metric-grid">
|
|
<div class="metric"><span class="metric-label" data-i18n="metric_data">DATA EXP.</span><strong>7<em> YRS</em></strong></div>
|
|
<div class="metric"><span class="metric-label" data-i18n="metric_projects">DELIVERED</span><strong>30<em> +</em></strong></div>
|
|
<div class="metric"><span class="metric-label" data-i18n="metric_clients">CLIENTS</span><strong>10<em> +</em></strong></div>
|
|
</div>
|
|
<div class="console-foot"><span>SECURE PIPELINE · FULL-CHAIN DELIVERY</span><span class="console-progress"><i></i></span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="signal-bar reveal delay-2" aria-label="全链路能力">
|
|
<div class="signal-item"><span class="signal-index">01 / DATA</span><span class="signal-name" data-i18n="signal1">数据治理</span></div>
|
|
<div class="signal-item"><span class="signal-index">02 / MODEL</span><span class="signal-name" data-i18n="signal2">模型优化</span></div>
|
|
<div class="signal-item"><span class="signal-index">03 / DEPLOY</span><span class="signal-name" data-i18n="signal3">私有部署</span></div>
|
|
<div class="signal-item"><span class="signal-index">04 / OPERATE</span><span class="signal-name" data-i18n="signal4">持续运营</span></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section about" id="about">
|
|
<div class="container">
|
|
<div class="section-header reveal">
|
|
<div><span class="section-number">01 / CAPABILITY CHAIN</span><h2 class="section-title" data-i18n="about_title">从数据底座到 AI 业务价值</h2></div>
|
|
<p class="section-desc" data-i18n="about_desc">我们不是只交付一个模型，而是围绕企业数据、场景与安全边界，搭建完整的 AI 落地链路。</p>
|
|
</div>
|
|
<div class="about-grid">
|
|
<div class="about-copy reveal">
|
|
<p data-i18n="about_p1">荣刻科技早年深耕数据治理与数据加工处理，形成了扎实的数据工程能力。伴随人工智能技术发展，公司进一步拓展 AI 业务，构建“数据 + 模型 + 部署 + 运营”的双轮驱动体系。</p>
|
|
<p data-i18n="about_p2">核心团队汇聚国内顶尖高校人才与一线互联网企业资深从业者，在成都、海口设有办公场地，具备从技术研发到项目交付的完整服务能力。</p>
|
|
<div class="about-facts">
|
|
<div class="fact"><strong>7 YEARS</strong><span data-i18n="about_fact1">数据治理与加工经验</span></div>
|
|
<div class="fact"><strong>2 CITIES</strong><span data-i18n="about_fact2">研发与运营协同网络</span></div>
|
|
</div>
|
|
</div>
|
|
<div class="capability-chain">
|
|
<article class="chain-card reveal"><span class="chain-index">01</span><div class="chain-copy"><h3 data-i18n="chain1_title">数据治理</h3><p data-i18n="chain1_desc">清洗、标注、加工与知识资产沉淀</p></div><span class="chain-state">READY</span></article>
|
|
<article class="chain-card reveal delay-1"><span class="chain-index">02</span><div class="chain-copy"><h3 data-i18n="chain2_title">模型与应用</h3><p data-i18n="chain2_desc">智能对话、客服、音频与行业模型优化</p></div><span class="chain-state">READY</span></article>
|
|
<article class="chain-card reveal delay-2"><span class="chain-index">03</span><div class="chain-copy"><h3 data-i18n="chain3_title">安全部署</h3><p data-i18n="chain3_desc">私有环境交付，核心数据保持域内流转</p></div><span class="chain-state">SECURE</span></article>
|
|
<article class="chain-card reveal delay-3"><span class="chain-index">04</span><div class="chain-copy"><h3 data-i18n="chain4_title">持续运营</h3><p data-i18n="chain4_desc">效果评估、流程优化与业务能力迭代</p></div><span class="chain-state">ACTIVE</span></article>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section services" id="services">
|
|
<div class="container">
|
|
<div class="section-header reveal">
|
|
<div><span class="section-number">02 / SOLUTIONS</span><h2 class="section-title" data-i18n="services_title">让 AI 真正进入业务流程</h2></div>
|
|
<p class="section-desc" data-i18n="services_desc">从标准化产品到定制开发，以企业真实场景为起点，交付可验证、可迭代的 AI 能力。</p>
|
|
</div>
|
|
<div class="services-layout">
|
|
<article class="service-card featured reveal">
|
|
<div class="service-code"><span>SYSTEM / CORE</span><span class="service-state">PRIMARY CAPABILITY</span></div>
|
|
<h3 data-i18n="srv_core_title">企业 AI 中台与智能升级</h3>
|
|
<p data-i18n="srv_core_desc">将知识、模型与业务流程统一编排，让 AI 能力稳定进入决策、运营、客服与内容生产环节。</p>
|
|
<div class="service-tags"><span class="service-tag">WORKFLOW</span><span class="service-tag">KNOWLEDGE</span><span class="service-tag">AGENT</span><span class="service-tag">INSIGHT</span></div>
|
|
</article>
|
|
<article class="service-card reveal delay-1"><div class="service-code"><span>S01</span><span class="service-state">DIALOGUE</span></div><h3 data-i18n="srv1_title">智能对话助手</h3><p data-i18n="srv1_desc">支持多轮交互、知识库问答与情感识别，适配客服、办公和教育场景。</p></article>
|
|
<article class="service-card reveal delay-2"><div class="service-code"><span>S02</span><span class="service-state">SERVICE</span></div><h3 data-i18n="srv2_title">企业智能客服</h3><p data-i18n="srv2_desc">覆盖售前咨询、售后支持与工单处理，提升响应效率与服务一致性。</p></article>
|
|
<article class="service-card reveal delay-1"><div class="service-code"><span>S03</span><span class="service-state">AUDIO</span></div><h3 data-i18n="srv3_title">AI 音频生成</h3><p data-i18n="srv3_desc">支持多语种、多风格语音内容生产，服务于配音、播报与数字人场景。</p></article>
|
|
<article class="service-card reveal delay-2"><div class="service-code"><span>S04</span><span class="service-state">MODEL</span></div><h3 data-i18n="srv4_title">垂类模型优化</h3><p data-i18n="srv4_desc">围绕金融、医疗、法律、制造等场景进行模型微调、评测和持续优化。</p></article>
|
|
<article class="service-card reveal"><div class="service-code"><span>S05</span><span class="service-state">PRIVATE</span></div><h3 data-i18n="srv5_title">模型私有化部署</h3><p data-i18n="srv5_desc">构建安全可靠的企业专属模型环境，满足核心数据不出域与高标准合规需求。</p></article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section advantages" id="advantages">
|
|
<div class="container">
|
|
<div class="section-header reveal">
|
|
<div><span class="section-number">03 / PROOF</span><h2 class="section-title" data-i18n="adv_title">技术之外，更重视可靠交付</h2></div>
|
|
<p class="section-desc" data-i18n="adv_desc">成熟的数据能力、跨领域团队和双城服务网络，让方案从概念验证走向长期运行。</p>
|
|
</div>
|
|
<div class="proof-grid">
|
|
<article class="proof-card reveal"><span class="proof-code">P01 / TEAM</span><h3 data-i18n="adv1_title">复合型核心团队</h3><p data-i18n="adv1_desc">核心成员来自国内顶尖高校与一线互联网企业，兼具研发能力和项目经验。</p></article>
|
|
<article class="proof-card reveal delay-1"><span class="proof-code">P02 / DATA</span><h3 data-i18n="adv2_title">扎实的数据底座</h3><p data-i18n="adv2_desc">长期的数据治理与加工实践，为知识库、模型训练和 AI 应用提供可靠基础。</p></article>
|
|
<article class="proof-card reveal delay-2"><span class="proof-code">P03 / DELIVERY</span><h3 data-i18n="adv3_title">场景化项目交付</h3><p data-i18n="adv3_desc">根据行业、流程与安全边界灵活组合能力，以实际业务指标验证实施效果。</p></article>
|
|
<article class="proof-card reveal delay-3"><span class="proof-code">P04 / SERVICE</span><h3 data-i18n="adv4_title">持续服务体系</h3><p data-i18n="adv4_desc">成都研发与海口运营协同，为全国客户提供及时、高效的项目支持。</p></article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section offices" id="offices">
|
|
<div class="container">
|
|
<div class="section-header reveal">
|
|
<div><span class="section-number">04 / DELIVERY NETWORK</span><h2 class="section-title" data-i18n="offices_title">双城协同，服务全国</h2></div>
|
|
<p class="section-desc" data-i18n="offices_desc">研发、交付、运营与客户服务相互协同，让项目推进保持清晰节奏与稳定响应。</p>
|
|
</div>
|
|
<div class="office-network">
|
|
<article class="office-card reveal">
|
|
<div class="office-coordinate"><span>30.5728° N · 104.0668° E</span><span class="office-live">ONLINE</span></div>
|
|
<h3 data-i18n="office1_title">成都 · 研发中心</h3>
|
|
<p data-i18n="office1_desc">技术研发与项目交付核心基地，承担 AI 产品研发、模型训练、系统集成与项目实施。</p>
|
|
<div class="office-tags"><span class="office-tag" data-i18n="office1_tag1">研发总部</span><span class="office-tag" data-i18n="office1_tag2">项目交付</span><span class="office-tag" data-i18n="office1_tag3">技术支持</span></div>
|
|
</article>
|
|
<article class="office-card reveal delay-1">
|
|
<div class="office-coordinate"><span>20.0440° N · 110.1999° E</span><span class="office-live">ONLINE</span></div>
|
|
<h3 data-i18n="office2_title">海口 · 运营中心</h3>
|
|
<p data-i18n="office2_desc">商务运营与客户服务基地，负责市场拓展、项目运营管理及华南区域客户服务。</p>
|
|
<div class="office-tags"><span class="office-tag" data-i18n="office2_tag1">商务运营</span><span class="office-tag" data-i18n="office2_tag2">客户服务</span><span class="office-tag" data-i18n="office2_tag3">华南区域</span></div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="contact" id="contact">
|
|
<div class="container">
|
|
<div class="contact-shell reveal">
|
|
<div class="contact-head">
|
|
<div><span class="section-number">05 / START A PROJECT</span><h2 data-i18n="contact_title">从真实业务场景开始</h2></div>
|
|
<p class="contact-lead" data-i18n="contact_desc">告诉我们你的数据基础、业务目标与安全要求，一起判断 AI 最值得从哪里落地。</p>
|
|
</div>
|
|
<div class="contact-grid">
|
|
<div class="contact-item"><span class="contact-label">CHANNEL / PHONE</span><h3 data-i18n="contact_phone">电话沟通</h3><a class="contact-value" href="tel:+8618482223118">+86 184 8222 3118</a></div>
|
|
<div class="contact-item"><span class="contact-label">CHANNEL / EMAIL</span><h3 data-i18n="contact_email">邮件咨询</h3><a class="contact-value" href="mailto:chermack@163.com">chermack@163.com</a></div>
|
|
<div class="contact-item"><span class="contact-label">CHANNEL / WECHAT</span><h3 data-i18n="contact_wechat">微信联系</h3><span class="contact-value" data-i18n="contact_wechat_desc">来电或邮件后获取微信，添加时请备注“商务合作”</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<div class="container footer-inner">
|
|
<span>© <span id="year">2026</span> <span data-i18n="footer_company">海南荣刻科技有限公司</span></span>
|
|
<span class="footer-signal">DATA-DRIVEN · AI-POWERED · SECURE DELIVERY</span>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
(function () {
|
|
'use strict';
|
|
|
|
const i18n = {
|
|
zh: {
|
|
title: '海南荣刻科技有限公司 - 数据筑基 · AI 落地', skip: '跳到主要内容', brand: '荣刻科技', nav_label: '主导航', home_label: '荣刻科技首页', lang_label: '语言切换', menu_open: '打开导航菜单', menu_close: '关闭导航菜单',
|
|
nav_about: '能力链路', nav_services: '解决方案', nav_advantages: '核心优势', nav_offices: '交付网络', nav_contact: '预约咨询',
|
|
hero_eyebrow: 'AI + DATA INFRASTRUCTURE', hero_line1: '让企业数据', hero_line2: '成为 AI 生产力',
|
|
hero_desc: '从数据治理、模型优化到私有化部署，荣刻科技为企业构建可落地、可持续、可掌控的 AI 能力体系。',
|
|
hero_primary: '预约 AI 场景诊断', hero_secondary: '查看解决方案', proof_data: '7 年数据技术积累', proof_private: '支持私有化部署', proof_delivery: '成都 / 海口双城交付',
|
|
console_online: '系统在线', pipe_data: '数据接入', pipe_govern: '治理加工', pipe_model: '模型编排', pipe_deploy: '安全部署', console_title: '企业 AI 能力编排中枢',
|
|
node_data: '企业数据底座', node_knowledge: '行业知识库', node_model: '垂类模型', node_private: '私有部署环境', metric_data: '数据经验', metric_projects: '交付项目', metric_clients: '服务客户',
|
|
signal1: '数据治理', signal2: '模型优化', signal3: '私有部署', signal4: '持续运营',
|
|
about_title: '从数据底座到 AI 业务价值', about_desc: '我们不是只交付一个模型，而是围绕企业数据、场景与安全边界，搭建完整的 AI 落地链路。',
|
|
about_p1: '荣刻科技早年深耕数据治理与数据加工处理，形成了扎实的数据工程能力。伴随人工智能技术发展，公司进一步拓展 AI 业务，构建“数据 + 模型 + 部署 + 运营”的双轮驱动体系。',
|
|
about_p2: '核心团队汇聚国内顶尖高校人才与一线互联网企业资深从业者，在成都、海口设有办公场地，具备从技术研发到项目交付的完整服务能力。',
|
|
about_fact1: '数据治理与加工经验', about_fact2: '研发与运营协同网络',
|
|
chain1_title: '数据治理', chain1_desc: '清洗、标注、加工与知识资产沉淀', chain2_title: '模型与应用', chain2_desc: '智能对话、客服、音频与行业模型优化', chain3_title: '安全部署', chain3_desc: '私有环境交付，核心数据保持域内流转', chain4_title: '持续运营', chain4_desc: '效果评估、流程优化与业务能力迭代',
|
|
services_title: '让 AI 真正进入业务流程', services_desc: '从标准化产品到定制开发，以企业真实场景为起点，交付可验证、可迭代的 AI 能力。',
|
|
srv_core_title: '企业 AI 中台与智能升级', srv_core_desc: '将知识、模型与业务流程统一编排，让 AI 能力稳定进入决策、运营、客服与内容生产环节。',
|
|
srv1_title: '智能对话助手', srv1_desc: '支持多轮交互、知识库问答与情感识别，适配客服、办公和教育场景。', srv2_title: '企业智能客服', srv2_desc: '覆盖售前咨询、售后支持与工单处理，提升响应效率与服务一致性。',
|
|
srv3_title: 'AI 音频生成', srv3_desc: '支持多语种、多风格语音内容生产，服务于配音、播报与数字人场景。', srv4_title: '垂类模型优化', srv4_desc: '围绕金融、医疗、法律、制造等场景进行模型微调、评测和持续优化。', srv5_title: '模型私有化部署', srv5_desc: '构建安全可靠的企业专属模型环境，满足核心数据不出域与高标准合规需求。',
|
|
adv_title: '技术之外，更重视可靠交付', adv_desc: '成熟的数据能力、跨领域团队和双城服务网络，让方案从概念验证走向长期运行。',
|
|
adv1_title: '复合型核心团队', adv1_desc: '核心成员来自国内顶尖高校与一线互联网企业，兼具研发能力和项目经验。', adv2_title: '扎实的数据底座', adv2_desc: '长期的数据治理与加工实践，为知识库、模型训练和 AI 应用提供可靠基础。', adv3_title: '场景化项目交付', adv3_desc: '根据行业、流程与安全边界灵活组合能力，以实际业务指标验证实施效果。', adv4_title: '持续服务体系', adv4_desc: '成都研发与海口运营协同，为全国客户提供及时、高效的项目支持。',
|
|
offices_title: '双城协同，服务全国', offices_desc: '研发、交付、运营与客户服务相互协同，让项目推进保持清晰节奏与稳定响应。',
|
|
office1_title: '成都 · 研发中心', office1_desc: '技术研发与项目交付核心基地，承担 AI 产品研发、模型训练、系统集成与项目实施。', office1_tag1: '研发总部', office1_tag2: '项目交付', office1_tag3: '技术支持',
|
|
office2_title: '海口 · 运营中心', office2_desc: '商务运营与客户服务基地，负责市场拓展、项目运营管理及华南区域客户服务。', office2_tag1: '商务运营', office2_tag2: '客户服务', office2_tag3: '华南区域',
|
|
contact_title: '从真实业务场景开始', contact_desc: '告诉我们你的数据基础、业务目标与安全要求，一起判断 AI 最值得从哪里落地。', contact_phone: '电话沟通', contact_email: '邮件咨询', contact_wechat: '微信联系', contact_wechat_desc: '来电或邮件后获取微信，添加时请备注“商务合作”', footer_company: '海南荣刻科技有限公司'
|
|
},
|
|
en: {
|
|
title: 'Hainan Roncarve Technology - Data Foundation · AI Delivery', skip: 'Skip to main content', brand: 'Roncarve Tech', nav_label: 'Main navigation', home_label: 'Roncarve Tech home', lang_label: 'Language selector', menu_open: 'Open navigation menu', menu_close: 'Close navigation menu',
|
|
nav_about: 'Capabilities', nav_services: 'Solutions', nav_advantages: 'Advantages', nav_offices: 'Delivery', nav_contact: 'Book a Call',
|
|
hero_eyebrow: 'AI + DATA INFRASTRUCTURE', hero_line1: 'Turn enterprise data', hero_line2: 'into AI productivity',
|
|
hero_desc: 'From data governance and model optimization to private deployment, Roncarve builds practical, sustainable and controllable enterprise AI systems.',
|
|
hero_primary: 'Book an AI Discovery Call', hero_secondary: 'Explore Solutions', proof_data: '7 years in data technology', proof_private: 'Private deployment ready', proof_delivery: 'Chengdu / Haikou delivery',
|
|
console_online: 'SYSTEM ONLINE', pipe_data: 'Data Intake', pipe_govern: 'Govern', pipe_model: 'Orchestrate', pipe_deploy: 'Deploy', console_title: 'Enterprise AI Orchestration Hub',
|
|
node_data: 'Enterprise Data', node_knowledge: 'Knowledge Base', node_model: 'Vertical Model', node_private: 'Private Environment', metric_data: 'DATA EXP.', metric_projects: 'DELIVERED', metric_clients: 'CLIENTS',
|
|
signal1: 'Data Governance', signal2: 'Model Optimization', signal3: 'Private Deployment', signal4: 'Continuous Operations',
|
|
about_title: 'From data foundation to AI business value', about_desc: 'We deliver more than a model. We build the complete path around your data, scenarios and security boundaries.',
|
|
about_p1: 'Roncarve began with deep expertise in data governance and processing, building a strong data engineering foundation. As AI evolved, we expanded into a dual-engine system spanning data, models, deployment and operations.',
|
|
about_p2: 'Our core team brings together talent from leading Chinese universities and experienced professionals from major internet companies. With offices in Chengdu and Haikou, we cover both R&D and project delivery.',
|
|
about_fact1: 'Data governance and processing', about_fact2: 'R&D and operations network',
|
|
chain1_title: 'Data Governance', chain1_desc: 'Cleaning, labeling, processing and knowledge assets', chain2_title: 'Models & Apps', chain2_desc: 'Dialogue, service, audio and vertical model tuning', chain3_title: 'Secure Deployment', chain3_desc: 'Private delivery with core data remaining in-domain', chain4_title: 'Continuous Operations', chain4_desc: 'Evaluation, workflow optimization and iteration',
|
|
services_title: 'Put AI inside real business workflows', services_desc: 'From standardized products to custom development, we start with real enterprise scenarios and deliver measurable, iterative AI capabilities.',
|
|
srv_core_title: 'Enterprise AI Platform & Transformation', srv_core_desc: 'Orchestrate knowledge, models and workflows so AI can reliably support decisions, operations, service and content production.',
|
|
srv1_title: 'Conversational AI', srv1_desc: 'Multi-turn interaction, knowledge Q&A and sentiment recognition for service, office and education.', srv2_title: 'Enterprise AI Service', srv2_desc: 'Cover pre-sales, after-sales and ticket workflows to improve speed and consistency.',
|
|
srv3_title: 'AI Audio Generation', srv3_desc: 'Multi-language, multi-style voice production for dubbing, broadcasting and digital humans.', srv4_title: 'Vertical Model Tuning', srv4_desc: 'Fine-tuning, evaluation and optimization for finance, healthcare, legal and manufacturing.', srv5_title: 'Private Model Deployment', srv5_desc: 'Secure, dedicated model environments for in-domain data and demanding compliance needs.',
|
|
adv_title: 'Reliable delivery beyond technology', adv_desc: 'Mature data capabilities, a cross-functional team and a dual-city service network take solutions from proof of concept to long-term operation.',
|
|
adv1_title: 'Cross-functional Core Team', adv1_desc: 'Talent from leading universities and internet companies combines strong R&D with delivery experience.', adv2_title: 'A Solid Data Foundation', adv2_desc: 'Long-term data governance and processing practices support knowledge, training and AI applications.', adv3_title: 'Scenario-based Delivery', adv3_desc: 'Capabilities are composed around industry, process and security needs, then validated by real metrics.', adv4_title: 'Continuous Service', adv4_desc: 'Chengdu R&D and Haikou operations provide responsive support for clients nationwide.',
|
|
offices_title: 'Two cities, nationwide delivery', offices_desc: 'R&D, delivery, operations and client service work together to keep every project clear and responsive.',
|
|
office1_title: 'Chengdu · R&D Center', office1_desc: 'Our core R&D and delivery base for AI products, model training, systems integration and implementation.', office1_tag1: 'R&D HQ', office1_tag2: 'Delivery', office1_tag3: 'Tech Support',
|
|
office2_title: 'Haikou · Operations Center', office2_desc: 'Our business operations and client service base for market development, project operations and Southern China.', office2_tag1: 'Operations', office2_tag2: 'Client Service', office2_tag3: 'South China',
|
|
contact_title: 'Start with one real business scenario', contact_desc: 'Tell us about your data foundation, business goal and security needs. We will identify where AI can create value first.', contact_phone: 'Call Us', contact_email: 'Email Us', contact_wechat: 'Connect on WeChat', contact_wechat_desc: 'Contact us by phone or email to receive our WeChat details.', footer_company: 'Hainan Roncarve Technology Co., Ltd.'
|
|
}
|
|
};
|
|
|
|
const navbar = document.getElementById('navbar');
|
|
const menuBtn = document.getElementById('menuBtn');
|
|
const navLinks = document.getElementById('navLinks');
|
|
const langSwitch = document.getElementById('langSwitch');
|
|
const reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
let currentLanguage = 'zh';
|
|
|
|
function applyLanguage(lang) {
|
|
const selected = i18n[lang] ? lang : 'zh';
|
|
currentLanguage = selected;
|
|
document.documentElement.lang = selected === 'zh' ? 'zh-CN' : 'en';
|
|
document.querySelectorAll('[data-i18n]').forEach(function (element) {
|
|
const key = element.dataset.i18n;
|
|
if (i18n[selected][key]) element.textContent = i18n[selected][key];
|
|
});
|
|
document.querySelectorAll('[data-i18n-aria]').forEach(function (element) {
|
|
const key = element.dataset.i18nAria;
|
|
if (i18n[selected][key]) element.setAttribute('aria-label', i18n[selected][key]);
|
|
});
|
|
menuBtn.setAttribute('aria-label', i18n[selected][navLinks.classList.contains('open') ? 'menu_close' : 'menu_open']);
|
|
document.querySelectorAll('.lang-btn').forEach(function (button) {
|
|
const active = button.dataset.lang === selected;
|
|
button.classList.toggle('active', active);
|
|
button.setAttribute('aria-pressed', String(active));
|
|
});
|
|
try { localStorage.setItem('site_lang', selected); } catch (error) { /* Storage may be disabled. */ }
|
|
}
|
|
|
|
function closeMenu() {
|
|
menuBtn.classList.remove('open');
|
|
navLinks.classList.remove('open');
|
|
menuBtn.setAttribute('aria-expanded', 'false');
|
|
menuBtn.setAttribute('aria-label', i18n[currentLanguage].menu_open);
|
|
document.body.classList.remove('menu-open');
|
|
}
|
|
|
|
langSwitch.addEventListener('click', function (event) {
|
|
const button = event.target.closest('.lang-btn');
|
|
if (button) applyLanguage(button.dataset.lang);
|
|
});
|
|
|
|
menuBtn.addEventListener('click', function () {
|
|
const open = !navLinks.classList.contains('open');
|
|
menuBtn.classList.toggle('open', open);
|
|
navLinks.classList.toggle('open', open);
|
|
menuBtn.setAttribute('aria-expanded', String(open));
|
|
menuBtn.setAttribute('aria-label', i18n[currentLanguage][open ? 'menu_close' : 'menu_open']);
|
|
document.body.classList.toggle('menu-open', open);
|
|
});
|
|
|
|
navLinks.querySelectorAll('a').forEach(function (link) { link.addEventListener('click', closeMenu); });
|
|
document.addEventListener('keydown', function (event) { if (event.key === 'Escape') closeMenu(); });
|
|
|
|
window.addEventListener('scroll', function () { navbar.classList.toggle('scrolled', window.scrollY > 24); }, { passive: true });
|
|
|
|
const observedSections = document.querySelectorAll('main section[id]');
|
|
const navAnchors = document.querySelectorAll('.nav-link');
|
|
const sectionObserver = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (!entry.isIntersecting) return;
|
|
navAnchors.forEach(function (anchor) { anchor.classList.toggle('active', anchor.getAttribute('href') === '#' + entry.target.id); });
|
|
});
|
|
}, { rootMargin: '-35% 0px -55% 0px', threshold: 0 });
|
|
observedSections.forEach(function (section) { sectionObserver.observe(section); });
|
|
|
|
if (!reduceMotion && 'IntersectionObserver' in window) {
|
|
const revealObserver = new IntersectionObserver(function (entries, observer) {
|
|
entries.forEach(function (entry) {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add('is-visible');
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
}, { threshold: .12, rootMargin: '0px 0px -40px' });
|
|
document.querySelectorAll('.reveal:not(.is-visible)').forEach(function (element) { revealObserver.observe(element); });
|
|
} else {
|
|
document.querySelectorAll('.reveal').forEach(function (element) { element.classList.add('is-visible'); });
|
|
}
|
|
|
|
if (!reduceMotion && window.matchMedia('(pointer: fine)').matches) {
|
|
const hero = document.querySelector('.hero');
|
|
let frame;
|
|
hero.addEventListener('pointermove', function (event) {
|
|
if (frame) cancelAnimationFrame(frame);
|
|
frame = requestAnimationFrame(function () {
|
|
const rect = hero.getBoundingClientRect();
|
|
hero.style.setProperty('--pointer-x', ((event.clientX - rect.left) / rect.width * 100).toFixed(1) + '%');
|
|
hero.style.setProperty('--pointer-y', ((event.clientY - rect.top) / rect.height * 100).toFixed(1) + '%');
|
|
});
|
|
});
|
|
}
|
|
|
|
let savedLang = 'zh';
|
|
try { savedLang = localStorage.getItem('site_lang') || 'zh'; } catch (error) { /* Storage may be disabled. */ }
|
|
applyLanguage(savedLang);
|
|
document.getElementById('year').textContent = String(new Date().getFullYear());
|
|
navbar.classList.toggle('scrolled', window.scrollY > 24);
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|