數據品質健檢
確認資料格式 、欄位完整性 、資料期間與 異常，讓 MES、設備與品 質資料能被可 靠使用。
:root {
--teal: #2aaca2;
--teal-deep: #0e736d
;
--teal-dark: #07524f
;
--charcoal: #212d39;
--ink: #16343a;
--heading: #16343a;
--body: #39515a;
--muted: #657982;
--line: #d5dfe1;
--wash: #f3f6f5;
--tint: #eaf5f4;
--paper: #fff;
--max: 1240px;
--radius: 2px;
}
* { box-sizing: border
-box; }
html { scroll-behavior
: smooth; scroll
-padding-top: 82px
; }
body { margin: 0;
color: var(--ink);
background: var
(--paper); font
-family: Verdana,
"PingFang TC",
"Microsoft
JhengHei", sans
-serif; font-size:
16px; line-height:
1.75; -webkit-font
-smoothing:
antialiased; }
a { color: inherit; }
button, input, select,
textarea { font:
inherit; }
:focus-visible {
outline: 3px solid
var(--teal);
outline-offset:
4px; }
.container { width:
min(calc(100% -
56px), var(--max
)); margin-inline:
auto; }
.term, h1, h2, h3,
strong, small,
button, label {
word-break: keep
-all; }
h1, h2, h3, p { margin
-top: 0; }
h1, h2, h3 { text-wrap
: pretty; }
h1 { margin-bottom:
22px; color: var
(--heading); font
-size: clamp(2
.8rem, 5.3vw, 5
.2rem); line
-height: 1.02;
letter-spacing:
-.045em; }
h2 { margin-bottom:
16px; color: var
(--heading); font
-size: clamp(2rem,
3.2vw, 3.2rem);
line-height: 1.14;
letter-spacing:
-.025em; }
h3 { margin-bottom:
10px; color: var
(--heading); font
-size: clamp(1
.2rem, 1.8vw, 1
.55rem); line
-height: 1.4; }
p, li { text-wrap:
pretty; }
.eyebrow { margin: 0 0
16px; color: var
(--teal-deep);
font-size: 13px;
font-weight: 700;
letter-spacing:
.05em; line-height
: 1.45; text
-transform:
uppercase; }
.lead { max-width:
700px; color: var
(--body); font
-size: clamp(1
.03rem, 1.3vw, 1
.17rem); line
-height: 1.82; }
.section { padding:
104px 0; border
-bottom: 1px solid
var(--line); }
.section-head {
display: grid;
grid-template
-columns: minmax(0
, 1.05fr) minmax
(340px, .75fr);
gap: 72px; align
-items: end;
margin-bottom:
56px; }
.section-head .lead {
margin-bottom: 0;
padding: 4px 0 4px
24px; border-left:
2px solid var
(--teal-deep); }
.button { display:
inline-flex; min
-height: 48px;
align-items:
center; justify
-content: center;
padding: 0 18px;
border: 1px solid
var(--teal-deep);
border-radius: var
(--radius); color:
white; background:
var(--teal-deep);
font-size: 14px;
font-weight: 700;
text-decoration:
none; transition:
.18s ease; }
.button:hover { border
-color: var(--teal
-dark); background
: var(--teal-dark
); }
.button.outline {
color: var(--teal
-deep); background
: white; }
.button.outline:hover
{ color: white;
background: var
(--teal-deep); }
.text-link { color:
var(--teal-deep);
font-size: 15px;
font-weight: 700;
text-decoration:
none; }
.text-link:hover {
text-decoration:
underline; text
-underline-offset:
4px; }
.site-header {
position: sticky;
top: 0; z-index:
20; border-bottom:
1px solid var
(--line);
background: rgba
(255,255,255,.96);
backdrop-filter:
blur(12px); }
.nav { min-height:
76px; display:
flex; align-items:
center; justify
-content: space
-between; gap:
28px; }
.brand img { display:
block; width:
144px; height:
auto; }
.nav-links { display:
flex; align-items:
center; gap: 22px;
color: var(--body
); font-size: 14px
; }
.nav-links a { text
-decoration: none;
}
.nav-links a:not(.nav
-cta):hover {
color: var(--teal
-deep); }
.nav-cta { padding:
9px 13px; border:
1px solid var
(--teal-deep);
color: white;
background: var
(--teal-deep);
font-weight: 700;
}
.hero { color: white;
background: var
(--charcoal); }
.hero-grid { display:
grid; grid
-template-columns:
minmax(0, .92fr)
minmax(430px, 1
.08fr); gap: 82px;
align-items:
center; min-height
: 650px; padding:
92px 0 84px; }
.hero .eyebrow { color
: #83d8d1; }
.hero h1 { max-width:
720px; color:
#d9f1ee; }
.hero h1 span { color:
#83d8d1; }
.hero-subtitle { max
-width: 650px;
margin: 0 0 26px;
padding: 18px 0;
border-top: 2px
solid #83d8d1;
border-bottom: 1px
solid rgba(255,255
,255,.32); color:
white; font-size:
clamp(1.35rem, 2
.25vw, 2rem); line
-height: 1.36; }
.hero .lead { max
-width: 620px;
margin-bottom:
30px; color: rgba
(255,255,255,.86);
font-size: 18px; }
.hero-actions {
display: flex;
flex-wrap: wrap;
gap: 10px; }
.hero .button { color:
var(--charcoal);
border-color:
white; background:
white; }
.hero .button:hover {
color: var(--teal
-deep); border
-color: var(--tint
); background: var
(--tint); }
.hero .button.outline
{ color: white;
border-color: rgba
(255,255,255,.5);
background:
transparent; }
.hero .button.outline
:hover { border
-color: white;
background: rgba
(255,255,255,.08);
}
.hero-visual {
position: relative
; min-height:
470px; display:
grid; place-items:
center; }
.hero-visual > img {
width: min(100%,
560px); border:
1px solid rgba(131
,216,209,.55);
background: rgba
(255,255,255,.04);
}
.hero-monitor {
position: absolute
; right: -18px;
bottom: 8px; width
: min(330px, 65%);
padding: 16px;
border: 1px solid
#83d8d1; color:
var(--ink);
background: rgba
(255,255,255,.96);
box-shadow: 14px
14px 0 rgba(7,82
,79,.55); }
.monitor-top { display
: flex; align
-items: center;
justify-content:
space-between;
margin-bottom:
15px; padding
-bottom: 11px;
border-bottom: 1px
solid var(--line);
font-size: 12px;
font-weight: 700;
}
.monitor-status {
color: var(--teal
-deep); }
.monitor-chart {
display: grid;
height: 110px;
grid-template
-columns: repeat
(10, 1fr); gap:
7px; align-items:
end; margin: 12px
0 18px; padding:
12px; border: 1px
solid var(--line);
background: var
(--wash); }
.monitor-chart i {
display: block;
background: var
(--teal); }
.monitor-chart i:nth
-child(1) { height
: 35%; } .monitor
-chart i:nth-child
(2) { height: 45%;
} .monitor-chart i
:nth-child(3) {
height: 40%; }
.monitor-chart i
:nth-child(4) {
height: 58%; }
.monitor-chart i
:nth-child(5) {
height: 52%; }
.monitor-chart i
:nth-child(6) {
height: 70%; }
.monitor-chart i
:nth-child(7) {
height: 62%; }
.monitor-chart i
:nth-child(8) {
height: 76%; }
.monitor-chart i
:nth-child(9) {
height: 82%; }
.monitor-chart i
:nth-child(10) {
height: 88%; }
.monitor-row { display
: flex; justify
-content: space
-between; gap:
12px; font-size:
12px; }
.monitor-row strong {
color: var(--teal
-deep); }
.proof-bar { border
-top: 1px solid
rgba(255,255,255
,.3); background:
#1c2935; }
.proof-bar-inner {
display: grid;
grid-template
-columns: repeat(4
, 1fr); }
.proof-bar-item {
padding: 21px 24px
; border-right:
1px solid rgba(255
,255,255,.14); }
.proof-bar-item:last
-child { border
-right: 0; }
.proof-bar-item strong
{ display: block;
margin-bottom: 4px
; color: white;
font-size: 16px; }
.proof-bar-item span {
color: rgba(255
,255,255,.78);
font-size: 14px;
line-height: 1.55;
}
.problem { background:
var(--wash); }
.problem-list { border
-top: 1px solid
var(--ink); }
.problem-item {
display: grid;
grid-template
-columns: 58px
minmax(190px,
.75fr) 1.25fr; gap
: 24px; padding:
28px 0; border
-bottom: 1px solid
var(--line); }
.problem-item small {
display: grid;
width: 36px;
height: 36px;
place-items:
center; border:
1px solid var
(--teal-deep);
color: var(--teal
-deep); font-size:
12px; font-weight:
700; }
.problem-item h3 {
margin-bottom: 0;
font-size: 21px; }
.problem-item p {
margin-bottom: 0;
color: var(--body
); font-size: 16px
; line-height: 1.7
; }
.capabilities {
background: white;
}
.capability-grid {
display: grid;
grid-template
-columns: repeat(4
, 1fr); border-top
: 1px solid var
(--ink); border
-bottom: 1px solid
var(--ink); }
.capability-item { min
-height: 230px;
padding: 26px 24px
28px 0; border
-right: 1px solid
var(--line); }
.capability-item +
.capability-item {
padding-left: 24px
; }
.capability-item:last
-child { border
-right: 0; }
.capability-item small
{ display: block;
margin-bottom:
38px; color: var
(--teal-deep);
font-size: 14px;
font-weight: 700;
}
.capability-item h3 {
margin-bottom:
10px; }
.capability-item p {
margin: 0; color:
var(--body); font
-size: 15px; line
-height: 1.72; }
.advantage { color:
white; background:
var(--ink); }
.advantage .section
-head { border
-color: rgba(255
,255,255,.28); }
.advantage .eyebrow {
color: var(--teal
); }
.advantage .section
-head h2,
.advantage .lead {
color: white; }
.advantage .lead {
color: rgba(255
,255,255,.76); }
.advantage-grid {
display: grid;
grid-template
-columns: repeat(4
, 1fr); border-top
: 1px solid rgba
(255,255,255,.28);
border-bottom: 1px
solid rgba(255,255
,255,.28); }
.advantage-item { min
-height: 250px;
padding: 26px 24px
28px 0; border
-right: 1px solid
rgba(255,255,255
,.2); }
.advantage-item +
.advantage-item {
padding-left: 24px
; }
.advantage-item:last
-child { border
-right: 0; }
.advantage-item small
{ display: block;
margin-bottom:
38px; color: var
(--teal); font
-size: 14px; font
-weight: 700; }
.advantage-item h3 {
margin-bottom:
10px; color: white
; }
.advantage-item p {
margin: 0; color:
rgba(255,255,255
,.76); font-size:
15px; line-height:
1.72; }
.domain-twin {
background: var
(--wash); }
.domain-twin-grid {
display: grid;
grid-template
-columns: repeat(3
, 1fr); border-top
: 1px solid var
(--ink); border
-bottom: 1px solid
var(--ink); }
.domain-twin-item {
min-height: 220px;
padding: 26px 24px
28px 0; border
-right: 1px solid
var(--line); }
.domain-twin-item +
.domain-twin-item
{ padding-left:
24px; }
.domain-twin-item:last
-child { border
-right: 0; }
.domain-twin-item
small { display:
block; margin
-bottom: 38px;
color: var(--teal
-deep); font-size:
14px; font-weight:
700; }
.domain-twin-item h3 {
margin-bottom:
10px; }
.domain-twin-item p {
margin: 0; color:
var(--body); font
-size: 15px; line
-height: 1.72; }
.faq { background:
white; }
.faq-list { border-top
: 1px solid var
(--ink); border
-bottom: 1px solid
var(--line); }
.faq-list details {
padding: 22px 0;
border-bottom: 1px
solid var(--line);
}
.faq-list details:last
-child { border
-bottom: 0; }
.faq-list summary {
cursor: pointer;
color: var(--ink);
font-size: 18px;
font-weight: 700;
}
.faq-list details p {
max-width: 820px;
margin: 14px 0 0;
color: var(--body
); line-height: 1
.75; }
.contact-form
-placeholder .form
-note { margin: 0;
color: var(--body
); font-size: 14px
; }
.domain-twin-cta {
margin: 28px 0 0;
color: var(--body
); font-size: 16px
; }
.domain-twin-cta a {
color: var(--teal
-deep); font
-weight: 700; text
-decoration:
underline; text
-underline-offset:
4px; }
.operations {
background: var
(--tint); }
.operations-flow {
display: grid;
grid-template
-columns: repeat(4
, 1fr); border-top
: 1px solid var
(--ink); border
-bottom: 1px solid
var(--ink); }
.operation-step {
position: relative
; display: flex;
min-height: 196px;
flex-direction:
column; align
-items: flex-start
; padding: 28px
24px 24px 0;
border: 0; border
-right: 1px solid
rgba(29,43,51,.22
); color: var
(--ink); text
-align: left;
background:
transparent;
cursor: pointer; }
.operation-step +
.operation-step {
padding-left: 24px
; }
.operation-step:last
-child { border
-right: 0; }
.operation-step:not
(:last-child
)::after { content
: "→"; position:
absolute; top:
25px; right: 17px;
color: var(--teal
-deep); font-size:
20px; }
.operation-step small
{ display: grid;
width: 36px;
height: 36px; flex
: 0 0 36px; place
-items: center;
margin: 0 0 34px;
border: 1px solid
currentColor;
color: var(--teal
-deep); font-size:
14px; font-weight:
700; }
.operation-step h3 {
min-height: 34px;
margin: 0 0 7px; }
.operation-step p {
max-width: 220px;
margin: 0; color:
var(--body); font
-size: 15px; line
-height: 1.68; }
.operation-step[aria
-selected="true"]
{ background: rgba
(255,255,255,.28);
}
.operation-step[aria
-selected="true"]
small { color:
white; border
-color: var(--teal
-deep); background
: var(--teal-deep
); }
.operation-step[aria
-selected="true"]
h3 { color: var
(--teal-deep); }
.operation-detail {
display: grid;
grid-template
-columns: 220px
1fr; gap: 30px;
margin-top: 28px;
padding: 24px 0 0;
border-top: 1px
solid var(--ink);
}
.operation-detail
strong { font-size
: 17px; }
.operation-detail p {
max-width: 700px;
margin: 0; color:
var(--body); font
-size: 16px; }
.dashboard {
background: white;
}
.dashboard-shell {
border: 1px solid
var(--ink);
background: white;
box-shadow: inset
4px 0 0 var(--teal
-deep); }
.dashboard-nav {
display: grid;
grid-template
-columns: 1.05fr
repeat(3, .65fr);
border-bottom: 1px
solid var(--ink);
}
.dashboard-nav-title {
display: flex;
align-items:
center; padding:
20px 28px; color:
var(--ink); font
-size: 18px; font
-weight: 700; }
.dashboard-nav-title
span { display:
block; margin-left
: 12px; color: var
(--teal-deep);
font-size: 14px; }
.dashboard-nav button
{ display: flex;
align-items:
center; justify
-content: center;
gap: 9px; min
-height: 76px;
padding: 14px;
border: 0; border
-left: 1px solid
var(--line); color
: var(--body);
background: white;
font-size: 14px;
font-weight: 700;
cursor: pointer;
transition:
background .18s
ease, color .18s
ease; }
.dashboard-nav
button[aria
-selected="true"]
{ color: var
(--teal-deep);
background: var
(--tint); }
.dashboard-nav button
:hover { color:
var(--teal-deep);
background: var
(--wash); }
.dash-glyph { display:
inline-flex; align
-items: center;
width: auto; min
-width: 0; height:
auto; padding: 0;
border: 0; color:
var(--teal-deep);
font: 700 10px/1
ui-monospace,
SFMono-Regular,
Menlo, monospace;
letter-spacing:
.08em; white-space
: nowrap; }
.dashboard-main {
padding: 0 38px
34px; }
.dashboard-context {
display: grid;
grid-template
-columns: auto
minmax(0, 1fr)
auto; align-items:
center; gap: 18px;
margin: 0 -38px;
padding: 20px 38px
; border-bottom:
1px solid var
(--line);
background: var
(--wash); }
.dashboard-context
-label { color:
var(--teal-deep);
font-size: 14px;
font-weight: 700;
}
.dashboard-context
strong { font-size
: clamp(1.25rem, 2
.2vw, 1.65rem); }
.dashboard-context
span:last-child {
max-width: 370px;
color: var(--body
); font-size: 14px
; text-align:
right; }
.dashboard-content {
display: grid;
grid-template
-columns: minmax(0
, 1.25fr) minmax
(300px, .75fr);
gap: 42px; padding
-top: 32px; }
.proof-intro { margin
-bottom: 24px; }
.proof-intro h3 {
margin-bottom: 7px
; font-size: clamp
(1.55rem, 2.5vw,
2rem); }
.proof-intro p { max
-width: 680px;
margin: 0; color:
var(--body); font
-size: 16px; }
.proof-flow { display:
grid; grid
-template-columns:
repeat(3, 1fr);
margin: 0; padding
: 0; list-style:
none; border-top:
1px solid var
(--ink); border
-bottom: 1px solid
var(--ink); }
.proof-node { position
: relative; min
-height: 190px;
padding: 24px 22px
24px 0; }
.proof-node + .proof
-node { padding
-left: 22px;
border-left: 1px
solid var(--line);
}
.proof-node + .proof
-node::before {
content: "→";
position: absolute
; top: 25px; left:
-10px; display:
grid; width: 20px;
height: 20px;
place-items:
center; color: var
(--teal-deep);
background: white;
font-size: 16px; }
.proof-node-number {
display: block;
margin-bottom:
34px; color: var
(--teal-deep);
font-size: 30px;
font-weight: 700;
letter-spacing:
-.06em; }
.proof-node strong {
display: block;
margin-bottom: 7px
; font-size: 17px;
line-height: 1.35;
}
.proof-node span {
display: block;
color: var(--body
); font-size: 14px
; line-height: 1
.65; }
.proof-ledger { align
-self: stretch;
padding: 26px;
border: 1px solid
var(--ink);
background: var
(--tint); }
.proof-ledger h4 {
margin: 0 0 7px;
font-size: 18px; }
.proof-ledger > p {
margin: 0 0 18px;
color: var(--body
); font-size: 14px
; }
.proof-ledger dl {
margin: 0; border
-top: 1px solid
rgba(29,43,51,.35
); }
.proof-ledger dl div {
display: grid;
grid-template
-columns: 92px 1fr
; gap: 14px;
padding: 13px 0;
border-bottom: 1px
solid rgba(29,43
,51,.2); }
.proof-ledger dt {
color: var(--body
); font-size: 13px
; }
.proof-ledger dd {
margin: 0; color:
var(--ink); font
-size: 14px; font
-weight: 700; }
.dashboard-boundary {
display: grid;
grid-template
-columns: 140px
1fr; gap: 24px;
margin-top: 30px;
padding-top: 18px;
border-top: 1px
solid var(--ink);
}
.dashboard-boundary
strong { color:
var(--teal-deep);
font-size: 14px; }
.dashboard-boundary p
{ margin: 0; color
: var(--body);
font-size: 14px; }
.case { background:
var(--wash); }
.case-layout { display
: grid; grid
-template-columns:
1fr 1fr; border
-top: 1px solid
var(--ink); border
-bottom: 1px solid
var(--ink); }
.case-copy { padding:
34px 46px 34px 0;
}
.case-copy h3 { font
-size: 2rem; }
.case-copy p { max
-width: 580px;
color: var(--body
); }
.case-result { display
: grid; align
-content: center;
padding: 34px 42px
; border-left: 1px
solid var(--line);
background: var
(--tint); }
.case-result strong {
display: block;
margin-bottom: 8px
; color: var
(--teal-deep);
font-size: clamp(3
.6rem, 6vw, 5.2rem
); line-height: 1;
letter-spacing:
-.08em; }
.case-result span {
color: var(--body
); font-size: 16px
; }
.case-note { margin:
18px 0 0; color:
var(--muted); font
-size: 13px; }
.fit { background:
white; }
.fit-list { display:
grid; grid
-template-columns:
repeat(3, 1fr);
border-top: 1px
solid var(--ink);
border-bottom: 1px
solid var(--line);
}
.fit-item { min-width:
0; min-height:
230px; padding:
28px 34px 28px 0;
}
.fit-item + .fit-item
{ padding-left:
30px; border-left:
1px solid var
(--line); }
.trust-icon { display:
grid; width: 46px;
height: 46px; flex
: 0 0 46px; place
-items: center;
margin-bottom:
24px; overflow:
hidden; border:
1px solid var
(--teal-deep);
color: var(--teal
-deep); }
.trust-icon svg {
display: block;
width: 24px;
height: 24px; max
-width: 100%; max
-height: 100%;
overflow: visible;
fill: none; stroke
: currentColor;
stroke-width: 1.7;
stroke-linecap:
square; stroke
-linejoin: miter;
}
.fit-item h3 { margin
-bottom: 8px; }
.fit-item p { margin
-bottom: 0; color:
var(--body); font
-size: 15px; line
-height: 1.72; }
.contact { color:
white; background:
var(--teal-dark);
}
.contact .eyebrow {
color: #bde9e5; }
.contact h2 { color:
white; }
.contact .lead { color
: rgba(255,255,255
,.78); }
.contact-layout {
display: grid;
grid-template
-columns: .9fr 1
.1fr; gap: 72px;
align-items: start
; }
.contact-note { margin
-top: 26px; color:
rgba(255,255,255
,.68); font-size:
13px; line-height:
1.7; }
.contact-form {
display: grid; gap
: 17px; padding:
32px; color: var
(--ink);
background: white;
}
.form-grid { display:
grid; grid
-template-columns:
1fr 1fr; gap: 15px
; }
.field { display: grid
; gap: 7px; }
.field label { color:
var(--body); font
-size: 13px; font
-weight: 700; }
.field input, .field
select, .field
textarea { width:
100%; padding:
11px 12px; border:
1px solid var
(--line); border
-radius: 0; color:
var(--ink);
background: white;
}
.field textarea { min
-height: 110px;
resize: vertical;
}
.contact-form .button
{ justify-self:
start; margin-top:
5px; }
.success { display:
none; margin: 0;
padding: 12px;
color: var(--teal
-deep); background
: var(--tint);
font-size: 14px; }
.success.is-visible {
display: block; }
footer { padding: 30px
0; color: var
(--muted); font
-size: 13px; }
footer .container {
display: flex;
justify-content:
space-between; gap
: 20px; }
@media (max-width:
980px) {
.nav-links { gap:
12px; font-size:
12px; }
.hero-grid, .section
-head, .contact
-layout { grid
-template
-columns: 1fr;
gap: 38px; }
.hero-grid { padding
: 70px 0 60px; }
.hero-visual { min
-height: 420px;
}
.dashboard-content {
grid-template
-columns: 1fr; }
.case-layout { grid
-template
-columns: 1fr; }
.case-result {
border-top: 1px
solid var(--line
); border-left:
0; }
}
@media (max-width:
720px) {
.container { width:
min(calc(100% -
36px), var(--max
)); }
.site-header {
position:
relative; }
.nav { min-height:
66px; }
.brand img { width:
122px; }
.nav-links a:not
(.nav-cta) {
display: none; }
.nav-cta { padding:
8px 10px; }
.section { padding:
72px 0; }
.hero h1 { font-size
: clamp(2.6rem,
12vw, 4.3rem); }
.hero .lead { font
-size: 16px; }
.hero-visual { min
-height: 330px;
}
.hero-visual > img {
width: 92%; }
.hero-monitor {
right: -2px;
bottom: 0; width
: 62%; padding:
12px; }
.monitor-chart {
height: 84px;
margin-bottom:
12px; }
.proof-bar-inner {
grid-template
-columns: 1fr
1fr; }
.proof-bar-item {
padding: 16px
14px; border
-bottom: 1px
solid rgba(255
,255,255,.14); }
.proof-bar-item:nth
-child(2) {
border-right: 0;
}
.problem-item { grid
-template
-columns: 44px
1fr; gap: 14px;
padding: 23px 0;
}
.problem-item p {
grid-column: 2;
}
.capability-grid {
grid-template
-columns: 1fr
1fr; }
.capability-item:nth
-child(2) {
border-right: 0;
}
.capability-item:nth
-child(-n+2) {
border-bottom:
1px solid var
(--line); }
.capability-item:nth
-child(3) {
padding-left: 0;
}
.advantage-grid {
grid-template
-columns: 1fr
1fr; }
.advantage-item:nth
-child(2) {
border-right: 0;
}
.advantage-item:nth
-child(-n+2) {
border-bottom:
1px solid rgba
(255,255,255,.2
); }
.advantage-item:nth
-child(3) {
padding-left: 0;
}
.domain-twin-grid {
grid-template
-columns: 1fr; }
.domain-twin-item,
.domain-twin
-item + .domain
-twin-item { min
-height: auto;
padding: 22px 0;
border-right: 0;
border-bottom:
1px solid var
(--line); }
.domain-twin-item
:last-child {
border-bottom: 0
; }
.domain-twin-item
small { margin
-bottom: 13px; }
.operations-flow {
grid-template
-columns: 1fr; }
.operation-step,
.operation-step
+ .operation
-step { min
-height: auto;
padding: 20px 0;
border-right: 0;
border-bottom:
1px solid rgba
(29,43,51,.22);
}
.operation-step:last
-child { border
-bottom: 0; }
.operation-step:not
(:last-child
)::after {
content: ""; top
: auto; right: 0
; bottom: -1px;
width: 100%;
border-top: 1px
solid rgba(29,43
,51,.22); }
.operation-step
small { margin
-bottom: 13px; }
.operation-detail,
.dashboard
-boundary { grid
-template
-columns: 1fr;
gap: 8px; }
.dashboard-nav {
grid-template
-columns: repeat
(3, 1fr); }
.dashboard-nav-title
{ display: none;
}
.dashboard-nav
button { min
-height: 66px;
padding: 10px
7px; border-left
: 0; font-size:
12px; }
.dashboard-nav
button:first-of
-type { border
-left: 0; }
.dashboard-main {
padding: 0 18px
24px; }
.dashboard-context {
grid-template
-columns: 1fr;
gap: 5px; margin
: 0 -18px;
padding: 18px; }
.dashboard-context
span:last-child
{ max-width:
none; text-align
: left; }
.proof-flow { grid
-template
-columns: 1fr; }
.proof-node, .proof
-node + .proof
-node { min
-height: auto;
padding: 20px 0;
border-left: 0;
border-bottom:
1px solid var
(--line); }
.proof-node:last
-child { border
-bottom: 0; }
.proof-node + .proof
-node::before {
display: none; }
.proof-node-number {
margin-bottom:
12px; }
.case-copy { padding
: 28px 0; }
.case-result {
padding: 28px 0;
}
.fit-list { grid
-template
-columns: 1fr; }
.fit-item, .fit-item
+ .fit-item {
min-height: auto
; padding: 25px
0; border-left:
0; border-bottom
: 1px solid var
(--line); }
.fit-item:last-child
{ border-bottom:
0; }
.form-grid { grid
-template
-columns: 1fr; }
.contact-form {
padding: 22px; }
footer .container {
display: block;
}
footer .container
span:last-child
{ display: block
; margin-top:
8px; }
}
@media (prefers
-reduced-motion:
reduce) {
*, *::before,
*::after {
scroll-behavior:
auto !important;
transition
-duration: .01ms
!important; }
}
/* AutoML draft
contact form: keep
the native
Elementor Form
source, but make
it read as part of
this page. */
.elementor-element
-d992a64.elementor
-widget-form {
width: min(calc(100%
- 56px), var
(--max));
margin: -1px auto
104px;
padding: 32px;
border: 1px solid
rgba(255,255,255
,.22);
background: var
(--teal-dark);
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-form {
display: grid;
grid-template
-columns: repeat
(2, minmax(0,
1fr));
gap: 18px 20px;
padding: 28px;
background: #fff;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group {
margin: 0;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group-message,
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-type-submit {
grid-column: 1 / -1;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-label {
display: block;
margin: 0 0 6px;
color: var(--ink);
font-size: 13px;
font-weight: 700;
line-height: 1.4;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field,
.elementor-element
-d992a64.elementor
-widget-form
select {
width: 100%;
min-height: 46px;
padding: 10px 12px;
border: 1px solid
var(--line);
border-radius: 0;
color: var(--ink);
background: #fff;
box-shadow: none;
}
.elementor-element
-d992a64.elementor
-widget-form
textarea.elementor
-field {
min-height: 118px;
resize: vertical;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-button
{
min-height: 48px;
padding: 0 22px;
border: 1px solid
var(--teal-deep
);
border-radius: var
(--radius);
color: #fff;
background: var
(--teal-deep);
font-size: 14px;
font-weight: 700;
}
.elementor-element
-d992a64.elementor
-widget-form
.elementor-button
:hover {
border-color: var
(--teal-dark);
background: var
(--teal-dark);
}
@media (max-width:
700px) {
.elementor-element
-d992a64
.elementor
-widget-form {
width: calc(100% -
32px);
margin-bottom:
64px;
padding: 16px;
}
.elementor-element
-d992a64
.elementor
-widget-form
.elementor-form
{
grid-template
-columns: 1fr;
gap: 16px;
padding: 20px;
}
.elementor-element
-d992a64
.elementor
-widget-form
.elementor-field
-group-message,
.elementor-element
-d992a64
.elementor
-widget-form
.elementor-field
-type-submit {
grid-column: auto;
}
}
/* Impeccable polish:
a readable,
illustrative model
-run dashboard
with safe
responsive bounds.
*/
.hero-visual {
overflow: visible;
}
.hero-monitor { width:
min(510px, 100%);
right: -24px;
padding: 18px; }
.monitor-note { margin
: -6px 0 12px;
color: var(--muted
); font-size: 11px
; letter-spacing:
.02em; }
.monitor-grid {
display: grid;
grid-template
-columns: repeat(3
, minmax(0, 1fr));
gap: 8px; margin:
0 0 12px; }
.monitor-kpi { min
-width: 0; padding
: 10px; border:
1px solid var
(--line);
background: var
(--wash); }
.monitor-kpi span,
.monitor-bottom
span { display:
block; color: var
(--muted); font
-size: 9px; font
-weight: 700;
letter-spacing:
.08em; }
.monitor-kpi strong {
display: block;
margin: 4px 0 1px;
color: var(--ink);
font-size: 16px;
line-height: 1.2;
white-space:
nowrap; }
.monitor-kpi small {
display: block;
color: var(--body
); font-size: 10px
; line-height: 1
.35; }
.monitor-chart-wrap {
padding: 12px;
border: 1px solid
var(--line);
background:
#fbfcfc; }
.monitor-chart-head,
.monitor-axis {
display: flex;
justify-content:
space-between; gap
: 8px; color: var
(--muted); font
-size: 9px; font
-weight: 700;
letter-spacing:
.04em; }
.monitor-chart-head
span:last-child {
color: var(--teal
-deep); }
.monitor-chart {
height: 88px;
margin: 9px 0 7px;
padding: 10px;
background: linear
-gradient(to
bottom,
transparent 49%,
var(--line) 50%,
transparent 51%);
}
.monitor-chart i {
background: var
(--teal-deep);
opacity: .82; }
.monitor-chart i:nth
-child(2n) {
background: var
(--teal); }
.monitor-axis span:nth
-child(2) { font
-weight: 400;
letter-spacing: 0;
}
.monitor-bottom {
display: grid;
grid-template
-columns: 1fr 1fr;
gap: 14px; margin
-top: 13px;
padding-top: 12px;
border-top: 1px
solid var(--line);
}
.monitor-bottom strong
{ display: block;
margin-top: 4px;
color: var(--ink);
font-size: 11px;
line-height: 1.35;
}
@media (max-width:
980px) {
.hero-grid { grid
-template
-columns: 1fr; }
.hero-visual { min
-height: 0;
margin-top: 8px;
}
.hero-monitor {
position:
relative; right:
auto; bottom:
auto; width: min
(560px, 100%);
margin: 0 auto;
}
}
@media (max-width:
720px) {
.hero-grid { padding
: 58px 0 48px; }
.hero-visual {
display: block;
width: 100%; }
.hero-monitor {
width: 100%;
padding: 14px;
box-shadow: 8px
8px 0 rgba(7,82
,79,.55); }
.monitor-kpi strong
{ font-size:
14px; }
.monitor-chart {
height: 78px;
gap: 5px; }
.monitor-bottom {
gap: 10px; }
}
@media (max-width:
980px) {
.hero-grid > *,
.hero-visual,
.hero-monitor,
.monitor-grid,
.monitor-chart
-wrap { min
-width: 0; }
.hero-monitor { max
-width: 100%;
box-sizing:
border-box; }
}
html, body { overflow
-x: hidden; }
html { overflow-x:
hidden !important;
}
body { overflow-x:
hidden !important;
}
@media (max-width:
720px) {
.hero h1 { word
-break: normal;
overflow-wrap:
anywhere; }
.hero h1 span {
white-space:
normal; }
}
/* Keep the contact
sequence aligned
with contact-us
while retaining
the same Elementor
Form source. */
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group-name {
order: 1; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group-email {
order: 2; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group
-field_5f40d93 {
order: 3; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group
-field_6afcc7e {
order: 4; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group
-field_b45dc56 {
order: 5; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-group-message {
order: 6; }
.elementor-element
-d992a64.elementor
-widget-form
.elementor-field
-type-submit {
order: 7; }
/* responsive typography
QA */
#pai-automl-page .hero
.hero-grid{grid
-template-columns
:minmax(0,.7fr) minmax
(0,1.3fr)!important
;gap:120px!important
;align-items
:center!important}
#pai-automl-page .hero
h1{font-size:clamp(2
.35rem,2.75vw,3.65rem
)!important;line
-height:1.08!important
;max-width
:10ch!important;word
-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important
;letter-spacing
:-.03em!important}
#pai-automl-page .hero h1
span{white-space
:normal!important}
#pai-automl-page .hero
.hero-subtitle,#pai
-automl-page .hero
.lead{max-width
:100%!important;word
-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important}
@media(max-width:1200px
){#pai-automl-page
.hero .hero-grid{grid
-template-columns
:minmax(0,1fr) minmax
(0,.9fr)!important;gap
:56px!important}#pai
-automl-page .hero
h1{font-size:clamp(2
.25rem,3.8vw,3.4rem
)!important;max-width
:9.5ch!important}}
@media(max-width:860px
){#pai-automl-page
.hero .hero-grid{grid
-template-columns
:1fr!important;gap
:30px!important}#pai
-automl-page .hero
h1{font-size:clamp(2
.25rem,8vw,3.3rem
)!important;max-width
:12ch!important}}
#pai-automl-page#pai
-automl-page .hero
.hero-subtitle.hero
-subtitle{word-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important}
#pai-automl-page#pai
-automl-page .hero
.lead.lead{word-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important}
/* responsive typography
QA - root-safe */
.hero.hero .hero-grid{grid
-template-columns
:minmax(0,.9fr) minmax
(0,1.1fr)!important
;gap:80px!important
;align-items
:center!important}
.hero.hero .hero-grid
>div{min-width
:0!important}
.hero.hero h1{font-size
:clamp(2.5rem,3.2vw,4
.35rem)!important;line
-height:1.06!important
;letter-spacing
:-.03em!important;max
-width:24ch!important
;word-break
:normal!important
;overflow-wrap
:normal!important
;hyphens
:none!important;white
-space
:normal!important}
.hero.hero h1 span{display
:inline!important
;white-space
:normal!important}
.hero.hero .hero
-visual{min-width
:0!important;max-width
:100%!important}
.hero.hero .hero-subtitle
,.hero.hero .lead{max
-width:100%!important
;word-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important}
@media(max-width:1200px){
.hero.hero .hero
-grid{grid-template
-columns:minmax(0,1fr)
minmax(0,.95fr
)!important;gap
:44px!important}.hero
.hero h1{font-size
:clamp(2.35rem,4.6vw,3
.8rem)!important;max
-width
:22ch!important}}
@media(max-width:860px){
.hero.hero .hero
-grid{grid-template
-columns:1fr!important
;gap:32px!important}
.hero.hero h1{font
-size:clamp(2.35rem
,8vw,3.5rem)!important
;max-width
:20ch!important}.hero
.hero .hero
-visual{order
:2!important}}
.hero.hero .hero-grid{grid
-template-columns
:minmax(0,.7fr) minmax
(0,1.3fr)!important
;gap:120px!important}
.hero.hero h1{font-size
:clamp(2.35rem,2.75vw
,3.65rem)!important
;max-width
:10ch!important;word
-break
:normal!important
;overflow-wrap
:anywhere!important}
.hero.hero .hero-subtitle
,.hero.hero .lead{word
-break
:normal!important
;overflow-wrap
:anywhere!important
;white-space
:normal!important}
@media(max-width:1200px){
.hero.hero .hero
-grid{grid-template
-columns:minmax(0,1fr)
minmax(0,.9fr
)!important;gap
:56px!important}.hero
.hero h1{font-size
:clamp(2.25rem,3.8vw,3
.4rem)!important;max
-width:9
.5ch!important}}
@media(max-width:860px){
.hero.hero .hero
-grid{grid-template
-columns:1fr!important
;gap:30px!important}
.hero.hero h1{font
-size:clamp(2.25rem
,8vw,3.3rem)!important
;max-width
:12ch!important}}
/* final Chinese hero
balance */
.hero.hero .hero-grid{
grid-template-columns
:minmax(0,.92fr)
minmax(0,1.08fr
)!important;
gap:72px!important;
align-items
:center!important
}
.hero.hero .hero-grid
>div{min-width
:0!important}
.hero.hero h1{
font-size:clamp(2.35rem
,2.65vw,3.45rem
)!important;
line-height:1
.08!important;
max-width:12ch!important
;
word-break
:normal!important;
overflow-wrap
:normal!important;
white-space
:normal!important;
letter-spacing
:-.03em!important;
text-wrap
:balance!important
}
.hero.hero h1 span{
display:inline
-block!important;
white-space
:nowrap!important
}
.hero.hero .hero-subtitle,
.hero.hero .lead{
max-width:100%!important
;
word-break
:normal!important;
overflow-wrap
:anywhere!important;
white-space
:normal!important
}
.hero.hero .hero-visual{
min-width:0!important;
max-width:100%!important
;
justify-items
:end!important
}
.hero.hero .hero-monitor{
width:100%!important;
max-width
:620px!important;
margin-inline
:auto!important
}
@media(max-width:1200px){
.hero.hero .hero-grid{
grid-template-columns
:minmax(0,1fr)
minmax(0,.95fr
)!important;
gap:48px!important
}
.hero.hero h1{
font-size:clamp(2
.25rem,3.6vw,3
.3rem)!important;
max-width
:12ch!important
}
}
@media(max-width:860px){
.hero.hero .hero-grid{
grid-template-columns
:1fr!important;
gap:30px!important
}
.hero.hero h1{
font-size:clamp(2
.25rem,8vw,3.3rem
)!important;
max-width
:12ch!important
}
.hero.hero .hero-visual{
order:2!important;
justify-items
:center!important
}
.hero.hero .hero
-monitor{max-width
:100%!important}
}
01
02
03
04
01
02
03
04
01
02
03
04
01
02
03
製造業 AutoML Virtual Data Scientist
AutoML：製造 業的虛擬資料科學 家，將資料轉化 為決策能力。
製造業 AutoML 是為結構化製 造 資料設計的無 程式碼機器學 習能力。
它能自動完成 資料品質檢查 、特徵工程、 模型比較、驗 證與解釋，協 助製程、品質 與設備團隊把 MES、量測、設 備訊號與批次 資料轉成可驗 證、可解釋的 預測模型。
AUTOML /
MODEL RUN
●
MODEL READY
Illustrative
run coating
thickness
VALIDATION
0.94
R²holdout set
FEATURES
18
after
screening
RUN TIME
24
mincandidate
search
PREDICTED VS
ACTUALRMSE 0
.18
lowvalidation
sampleshigh
TOP FEATURE
Line
speed
MODEL
VERSIONv1.4
explainable
AutoML 核心能力
從資料品質到 模型品質，四項 能力串起建模循 環。
從資料準備、 特徵探索，到模 型訓練、驗證與 解釋，AutoML 協助製程、品質 與設備團隊把資 料轉成可執行的 改善依據。
自動特徵工程
整理時間、批 次、設備與製 程欄位，生成 能反映製程變 化、也方便團 隊理解的特徵 。
自動產生模型
比較多種演算 法與參數組合 ，從模型表現 與驗證結果檢 查是否適合產 線條件。
模型品質分析
從驗證結果、 關鍵因子與適 用範圍理解預 測依據，支援 部署、預測與 參數最佳化。
製造導入優勢
從製造問題出 發，讓模型更接 近現場決策。
製造團隊需要 的不只是模型， 而是能連回製程 、品質與設備判 斷的 AI 工作方式。
製造場域優先
從品質、良率 、設備與製程 指標開始，對 應製造現場真 正需要改善的 問題。
讓現場團隊參 與
無程式碼操作 降低建模門檻 ，讓製程、品 質與設備團隊 能直接參與驗 證與改善。
看見關鍵因子
把模型結果連 回可理解的製 程變數與影響 關係，讓團隊 知道結果為何 發生。
從模型走向改 善
支援虛擬量測 、參數最佳化 、品質預測與 異常偵測，將 分析帶回實際 工作流程。
製造場景
從一個可量化 的製造問題開始 。
AutoML 不只是自動選模 型，而是把企業 資料、製程脈絡 與現場判斷整理 成能被驗證、被 複用的模型資產 。
虛擬量測
用歷史製程與 設備資料預測 難以即時取得 的品質指標， 減少等待量測 的時間，讓工 程師更早處置 偏移。
品質與良率預 測
從製程條件、 設備訊號與原 料批次找出關 鍵因子，支援 製程調整、品 質改善與原因 分析。
異常偵測與設 備維護
以可用的正常 運轉樣本為基 礎，整合設備 訊號、Alarm 與製程條件， 辨 識設備異常與 製程風險，協 助安排點檢與 維護。
製程參數最佳 化
探索多變量關 聯與參數組合 ，在品質、產 能與耗損之間 找出較穩定的 操作窗口。
AutoML 工作流程
從資料處理到決 策應用，AutoM L 串起完整建模流 程。
從資料處理、 特徵工程與自動 建模，到評估、 解釋、後續分析 與部署，把自動 化能力與製程團 隊的判斷放在同 一個流程裡。
先把製造問題
轉成可建模的任
務
先設定預測目 標、評估標準與 資料條件；之後 由 AutoML 自動完成特徵工 程、模型探索、 解釋與部署，讓 現場知識成為模 型品質的一部分 。
模型證據與應用
模型不只給答 案，也要說清楚 為什麼。
切換不同視角 時，分別看見預 測依據、模型比 較與後續分析， 讓模型輸出更容 易被理解、驗證 與採用。
目前模型
鍍層厚度預測
製程條件、設
備訊號、原料
批次與歷史量
測
預測必須有可 回看的依據。
不是只得到一 個預測值；工 程師需要知道 哪些變數真正 影響結果，以 及模型是在什 麼條件下被驗 證。
- 01目標與資料 設定預測目標 、資料範圍與 評估條件。
- 02 預測依據 查看關鍵因子 、模型解釋與 驗證結果。
- 03 使用邊界 確認模型適用 範圍與人工覆 核條件。
使用邊界
模型輸出提供 決策依據，不 取代現場專業 判斷；高風險 使用情境應保 留人工覆核與 版本管理。
製造應用成果
把模型成果連回 實際製造指標。
案例不是裝飾， 而是讓決策者知道 資料條件、模型輸 出與現場改善如何 接在一起。
製造業應用案例
從設備與製程資 料，找出更好的參 數組合。
Profet AI 的製造應用涵蓋參 數最佳化、虛擬量 測與異常偵測；從 明確的製造指標開 始，逐步驗證資料 、模型與改善成果 。
閱讀製造應用案例 →Domain Twin
把單一模型成 果，累積成可複 用的製造知識。
Domain Twin 不是單一模型， 而是把資料、模 型、AI 應用與製造 know-how 串起來，讓一次 驗證過的成果能 被理解、延伸與 傳承。
AutoML
將製造資料轉 成可解釋的預 測模型，找出 品質、設備與 製程改善方向 。
AI Studio
把模型與企業 知識帶進日常 工作流程，支 援團隊更快取 得可用的判斷 依據。
AILM
整理模型、流 程與改善經驗 ，讓成果可被 追溯、複用並 逐步累積。
想從一個 AutoML 題目開始，逐步 建立可複用的製 造 AI 能力？ 了解 Domain Twin → 探索 AI Studio →
常見問題
開始導入 AutoML 前，先確認三件事 。
把資料條件、製 造目標與現場判斷 放在一起，通常比 先談演算法更重要 。
AutoML 適合哪些製造問題 ？
適合有結構化歷 史資料、目標可以 量化的問題，例如 虛擬量測、品質與 良率預測、異常偵 測、設備維護與製 程參數最佳化。
導入前需要準備什 麼？
先確認資料來源 、欄位意義、資料 期間、預測目標與 現場評估方式。A utoML 可協助檢查資料品 質，但資料清理與 業務定義仍需要由 企業團隊完成。
模型建立後可以怎 麼使用？
可依情境進行預 測、參數最佳化、 後續分析或部署； 模型輸出提供判斷 依據，實際採用仍 需搭配資料範圍與 製程專業判斷。
適合開始的條件
哪些資料與問題 適合導入製造業 AutoML？
不需要先建立完 整資料科學團隊； 先找出一個資料來 源清楚、目標可量 化、現場有人負責 的製造問題。
已有結構化資料
例如 MES、設備訊號、 品 質量測、Alarm、 Sensor 或歷史報表。
有可量化目標
例如降低誤差、 提升良率、減少耗 損、提前發現異常 或縮短量測等待。
有現場決策者
由製程、品質、設 備或 IT/OT 團隊共同驗證模型 是否真的能進入工 作流程。
從一個真實製造問 題開始
帶入一個場景，看 看 AutoML 能否先幫你建立一 個模型。
告訴我們目前最 想改善的預測、品 質、設備或製程問 題，我們會一起確 認資料條件與適合 的示範方式。
請在網站表單選 擇「預約顧問展示 」，我們會依你的 製造情境確認資料 條件與適合的導入 方式。
延伸探索
從模型能力，延 伸到可持續的製造 AI 應用。
AutoML 協助建立可驗證的 預測模型；進一步 結合領域知識與工 作流，讓模型真正 進入企業的日常決 策。