main{padding-top:44px;padding-bottom:36px}
.name-meaning{display:flex;gap:40px;margin-bottom:44px;align-items:start}
.name-meaning section{border:0;padding:0}
.name-meaning section+section{padding-left:40px;border-left:1px solid var(--line)}
.name-meaning h2{font-size:24px;margin-bottom:8px}
.name-meaning p{font-size:14px}
.concept{padding-top:0}
.concept h1{font-size:clamp(32px,4.2vw,51px);line-height:1.18;letter-spacing:-.04em;margin:0 0 18px;max-width:none}
.concept-intro{font-size:16px}
.concept-map{margin-top:46px}
.axis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end;padding-bottom:28px}
.axis>span{font-size:14px;font-weight:600;text-align:center}
.axis small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:5px;min-height:19px}
html[lang=en] .axis small{visibility:hidden}
.map-row{margin-bottom:20px}
.track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}
.band{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 26px;border-radius:12px;min-height:94px;text-decoration:none;line-height:1.5;transition:transform .15s,box-shadow .15s}
.band:hover{transform:translateY(-2px);box-shadow:0 7px 20px #2929290d}
.band-copy{display:flex;flex-direction:column;gap:5px}
.band-copy strong{font-size:21px;font-weight:650;letter-spacing:-.025em}
.band-copy>span{font-size:14px}
.brief-band{grid-column:1 / 3;}
.insight-band{grid-column:2 / 4;}
.intelligence-band{grid-column:3 / 5;}
.band b{font-size:20px;font-weight:400}
.ai-line{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:16px;color:var(--muted)}
.ai-line>span:first-child{font-size:12px;font-weight:700;border:1px solid var(--line);border-radius:20px;padding:2px 10px}
.ai-line p{font-size:13px}.ai-line>span:last-child{display:none}
.project-note{font-size:13px;margin-top:36px;color:var(--muted)}
@media(max-width:600px){main{padding-top:32px}.name-meaning{gap:20px;margin-bottom:36px}.name-meaning section+section{padding-left:20px}.name-meaning h2{font-size:19px}.name-meaning p{font-size:12px}.concept-map{margin-top:34px}.axis{padding-bottom:22px}.axis>span{font-size:10px;letter-spacing:-.02em}.axis small{font-size:11px}.band{padding:16px 12px;gap:4px;min-height:102px}.band-copy strong{font-size:17px}.band-copy>span{font-size:12px}.band b{display:none}.map-row{margin-bottom:18px}.concept h1{font-size:32px}.concept-intro{font-size:14px}.ai-line{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){.band{transition:none}.band:hover{transform:none}}

/* Expanded home wordmark, compact on narrow screens. */
.home-brand{display:inline-flex;text-decoration:none;flex-shrink:0}
.home-brand .brand-expanded{display:flex;flex-direction:column;gap:1px;color:var(--ink)}
.home-brand .brand-line{display:flex;align-items:baseline;gap:7px;color:var(--ink);line-height:1.08}
.home-brand strong{font-size:29px;font-weight:750;letter-spacing:-.045em}
.home-brand .brand-context{font-size:15px;font-weight:400;letter-spacing:-.02em;color:var(--muted)}
.home-brand .brand-dot{font-size:29px;color:var(--blue);margin-left:-7px}
.home-brand .brand-compact{display:none;color:var(--ink)}
@media(max-width:600px){.home-brand .brand-expanded{display:none}.home-brand .brand-compact{display:inline}}

/* Equal neutral surfaces: service meaning comes from position, not hue. */
.band{color:var(--ink);background:linear-gradient(135deg,rgba(255,255,255,.58),rgba(255,255,255,.12));border:1px solid rgba(37,42,45,.12);border-radius:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 4px 14px rgba(37,42,45,.035);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.band-copy>span{color:var(--muted)}
.band b{color:var(--muted)}
.band:hover{border-color:rgba(37,42,45,.3);box-shadow:inset 0 1px 0 #ffffff,0 8px 20px rgba(37,42,45,.065)}
.band:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(prefers-reduced-transparency:reduce){.band{background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none}}

/* DIKW axis labels use a lighter chip outline than service links. */
.axis{column-gap:16px}
.axis>span{padding:12px 8px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
@media(max-width:600px){.axis{column-gap:6px}.axis>span{padding:10px 2px;border-radius:9px;font-size:9px}.axis small{font-size:11px}}

/* Refined hierarchy and shared DIKW center lines. */
.concept-map{margin-top:32px}
.axis{column-gap:0;padding-bottom:26px}
.axis>span{justify-self:center;width:auto;min-width:108px;padding:8px 14px;border-radius:9px;font-size:12px;background:transparent;box-shadow:none}
.axis small{font-size:11px;min-height:17px;margin-top:2px}
.track{grid-template-columns:repeat(8,minmax(0,1fr))}
.brief-band{grid-column:2 / 4}
.insight-band{grid-column:4 / 6}
.intelligence-band{grid-column:6 / 8}
.concept .band{min-height:102px;padding:20px;border-radius:14px;box-shadow:inset 0 1px 0 #fff,0 2px 6px #00000003}
.concept .band:hover{transform:none;box-shadow:inset 0 1px 0 #fff,0 3px 10px #00000008;border-color:#999}
.band-copy strong{font-size:20px}
.band-copy>span{font-size:13px}
.map-row{margin-bottom:22px}
.ai-line{padding-top:4px}
.project-note{margin-top:48px}
.home-brand .brand-expanded{display:grid;grid-template-columns:18px auto;column-gap:6px;margin-left:-24px}
.home-brand .brand-line{grid-column:1 / 3;display:grid;grid-template-columns:18px auto auto;column-gap:6px;justify-content:start}
.home-brand .brand-line:first-child strong{grid-column:2}
.home-brand .brand-line:first-child .brand-context{grid-column:3}
.home-brand .brand-line:last-child .brand-context:not(.brand-domain){grid-column:1}
.home-brand .brand-line:last-child strong{grid-column:2}
@media(max-width:600px){
.home-brand .brand-expanded{display:none}
.axis>span{min-width:0;width:calc(100% - 6px);padding:8px 2px;font-size:9px}
.axis small{font-size:10px}
.track{grid-template-columns:repeat(4,minmax(0,1fr))}
.brief-band{grid-column:1 / 3}.insight-band{grid-column:2 / 4}.intelligence-band{grid-column:3 / 5}
.concept .band{padding:16px 12px;min-height:96px}
.band-copy strong{font-size:17px}.band-copy>span{font-size:12px}
.concept-map{margin-top:28px}.map-row{margin-bottom:18px}
}

/* Conceptual axes: DIKW stages and a shared technology dimension, not scores. */
.view-controls{display:flex;justify-content:flex-end;gap:4px;margin:24px 0 18px}
.view-controls button{font-size:12px;color:var(--muted);background:transparent;border:1px solid transparent;border-radius:7px;padding:7px 12px;cursor:pointer;line-height:1.4}
.view-controls button[aria-pressed=true]{color:var(--ink);background:var(--surface);border-color:var(--line)}
.concept-map{display:flex;flex-direction:column;margin-top:0;--axis-space:48px}
.coordinate-plot{position:relative;margin-left:var(--axis-space);border-left:1px solid #999;border-bottom:1px solid #999;padding:24px 0 12px}
.plot-rows{background-image:linear-gradient(to right,transparent calc(12.5% - .5px),#e5e5e5 calc(12.5% - .5px),#e5e5e5 calc(12.5% + .5px),transparent calc(12.5% + .5px),transparent calc(37.5% - .5px),#e5e5e5 calc(37.5% - .5px),#e5e5e5 calc(37.5% + .5px),transparent calc(37.5% + .5px),transparent calc(62.5% - .5px),#e5e5e5 calc(62.5% - .5px),#e5e5e5 calc(62.5% + .5px),transparent calc(62.5% + .5px),transparent calc(87.5% - .5px),#e5e5e5 calc(87.5% - .5px),#e5e5e5 calc(87.5% + .5px),transparent calc(87.5% + .5px))}
.technology-axis{position:absolute;left:-44px;top:0;bottom:0;display:flex;align-items:center;justify-content:center;width:32px}
.technology-axis span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:600;letter-spacing:.03em;white-space:nowrap}
.concept-map .axis{margin-left:var(--axis-space);padding:18px 0 0}
.concept-map .ai-line{margin-top:20px}
.concept-map[data-view=chips] .axis{order:-1;margin:0;padding:0 0 26px}
.concept-map[data-view=chips] .coordinate-plot{margin:0;border:0;padding:0}
.concept-map[data-view=chips] .technology-axis{display:none}
.concept-map[data-view=chips] .plot-rows{background:none}
@media(max-width:600px){.concept-map{--axis-space:28px}.technology-axis{left:-28px;width:22px}.technology-axis span{font-size:10px}.view-controls{justify-content:flex-start}.concept-map .axis>span{font-size:8px}.concept-map .axis small{font-size:10px}.concept .band{min-height:96px}}

/* Technology axis rises upward: Brief below Insight below Intelligence. */
.concept-map[data-view=coordinates] .plot-rows{display:flex;flex-direction:column-reverse}

.band-copy strong{font-size:18px;font-weight:600;letter-spacing:.025em}
@media(max-width:600px){.band-copy strong{font-size:13px;letter-spacing:.015em}}

/* Reserve equal headline space across languages before the diagram. */
.concept h1{font-size:clamp(32px,4.2vw,51px);line-height:1.18;min-height:2.36em;margin-bottom:0;text-wrap:balance}
.concept-map{margin-top:44px}
@media(max-width:600px){.concept h1{font-size:32px;min-height:4.72em}.concept-map{margin-top:32px}}
.concept .band{min-height:124px}
@media(max-width:600px){.concept .band{min-height:120px}}

/* Pill-shaped DIKW labels in all viewport sizes. */
.concept-map .axis>span{border-radius:999px}

/* Compact service chips, with space for two-line translations. */
.concept .band{min-height:90px;padding:14px 18px;border-radius:12px;gap:10px}
.band-copy{gap:4px}
.band-copy strong{font-size:16px;line-height:1.35}
.band-copy>span{font-size:12px;line-height:1.5}
.band b{font-size:17px}
@media(max-width:600px){.concept .band{min-height:88px;padding:12px 10px;gap:4px}.band-copy strong{font-size:12px}.band-copy>span{font-size:11px}}

/* Only service names are enclosed; explanations sit beneath each chip. */
.service-point{min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center}
.concept .service-point .band{display:inline-flex;align-items:center;justify-content:center;height:46px;min-height:46px;padding:10px 12px;border-radius:8px;width:160px;max-width:100%;gap:0;line-height:1.2;text-align:center}
.service-point .band strong{font-size:14px;line-height:1.2;font-weight:600;letter-spacing:.025em}
.service-caption{font-size:12px;line-height:1.5;margin:9px 0 0;min-height:36px;color:var(--muted)}
@media(max-width:600px){.concept .service-point .band{height:42px;min-height:42px;width:140px;padding:9px 8px}.service-point .band strong{font-size:11px}.service-caption{font-size:11px;min-height:33px}}
.concept h1{word-break:keep-all;overflow-wrap:normal}
html[lang^="zh"] .concept h1{word-break:normal;overflow-wrap:anywhere}

/* Always-visible navigation cue, without moving the centered service name. */
.concept .service-point .band{position:relative;cursor:pointer}
.concept .service-point .band::after{content:"→";position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:14px;line-height:1;color:var(--muted);transition:transform .15s ease,color .15s ease}
.concept .service-point .band:hover,.concept .service-point .band:focus-visible{border-color:#000}
.concept .service-point .band:hover::after,.concept .service-point .band:focus-visible::after{color:#000;transform:translate(3px,-50%)}
@media(max-width:600px){.concept .service-point .band::after{right:7px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.concept .service-point .band::after{transition:none}.concept .service-point .band:hover::after,.concept .service-point .band:focus-visible::after{transform:translateY(-50%)}}
