@charset "utf-8";
/* Product page: shared branding with scoped, responsive content layouts. */
.kj-cms {font-size:15px;background:#fff;color:#142e43}
.kj-cms *, .kj-cms *::before, .kj-cms *::after {box-sizing:border-box}
.kj-cms h1,.kj-cms h2,.kj-cms h3,.kj-cms p,.kj-cms figure {margin:0}
.kj-cms main p {line-height:1.95;color:#536576}
.kj-cms .shell {width:min(1160px,calc(100% - 80px));margin-inline:auto}
.kj-cms .section {padding-block:96px;scroll-margin-top:110px}
.kj-cms .eyebrow {font-size:10px;font-weight:700;letter-spacing:.14em;color:#075fd8;margin-bottom:20px}
.kj-cms h2 {font-size:clamp(27px,3vw,39px);line-height:1.55;letter-spacing:-.035em;margin-bottom:25px}
.kj-cms h3 {font-size:19px;line-height:1.6}
.kj-cms .split {display:grid;grid-template-columns:1fr 1fr;gap:70px}
.kj-cms .align-center {align-items:center}
.kj-cms .pale {background:#f1f5f8}
.kj-cms .body-lead {font-size:20px;font-weight:700;color:#142e43;margin-bottom:16px}
.kj-cms .note,.kj-cms figcaption {font-size:11px;line-height:1.8;color:#647687;margin-top:18px}
.kj-cms .section-intro {max-width:740px}
.kj-cms .button {display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:54px;padding:16px 22px;font-size:13px;font-weight:700;border-radius:2px;text-decoration:none}
.kj-cms .primary {background:#075fd8;color:#fff}
.kj-cms .primary:hover {background:#044bb0}
.kj-cms .text-link {font-size:12px;font-weight:700;text-decoration:none;border-bottom:1px solid;padding-block:8px;color:#142e43}
.kj-cms .actions {display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:30px}
/* Opening and noninteractive management-screen illustration. */
.kj-cms .cms-hero {padding:75px 0 80px;background:radial-gradient(ellipse at 90% 10%,#dbedff,transparent 65%),#f3f8fc;overflow:hidden}
.kj-cms .hero-grid {display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.kj-cms h1 {font-size:clamp(32px,3.4vw,49px);line-height:1.45;letter-spacing:-.045em;font-weight:700}
.kj-cms h1 span {color:#075fd8}
.kj-cms .hero-sub {font-size:18px;font-weight:700;color:#142e43;margin-top:25px}
.kj-cms .lead {font-size:13px;margin-top:20px}
.kj-cms .hero-copy {animation:cms-in .8s both}
.kj-cms .hero-screen {background:white;border:1px solid #dce5ec;border-radius:9px;box-shadow:0 25px 65px #15385f16;transform:perspective(1600px) rotateY(-5deg);animation:cms-in 1s .15s both;overflow:hidden}
.kj-cms .screen-top {padding:18px 20px;display:flex;justify-content:space-between;align-items:center;background:#142e43;color:#fff;font-size:14px}
.kj-cms .screen-top>span {font-size:8px;letter-spacing:.1em;color:#b7cee2}
.kj-cms .screen-body {display:grid;grid-template-columns:100px minmax(0,1fr);min-height:390px}
.kj-cms .screen-nav {padding:23px 10px;background:#f0f4f8;display:flex;flex-direction:column;gap:8px;font-size:11px}
.kj-cms .screen-nav strong {font-size:8px;color:#647687;margin-bottom:10px}
.kj-cms .screen-nav span {padding:8px;border-radius:3px}
.kj-cms .screen-nav .selected {background:#075fd8;color:#fff}
.kj-cms .screen-editor {padding:22px;min-width:0}
.kj-cms .editor-heading {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:20px;font-size:14px}
.kj-cms .status {font-size:10px;background:#eef2f6;padding:4px 8px;border-radius:3px}
.kj-cms .screen-editor small {display:block;font-size:10px;color:#647687;margin:12px 0 6px}
.kj-cms .field {padding:12px;border:1px solid #dce5ec;border-radius:3px;font-size:11px;line-height:1.9}
.kj-cms .document {min-height:100px}
.kj-cms .fake-line {height:5px;background:#e8edf2;width:95%;margin-top:12px}
.kj-cms .fake-line.short {width:67%}
.kj-cms .ai-panel {background:#edf5ff;border:1px solid #c9dff7;padding:14px;margin-top:16px;border-radius:4px;font-size:12px}
.kj-cms .ai-panel b {color:#075fd8}
.kj-cms .ai-panel p {font-size:11px;margin-block:6px}
.kj-cms .chips {display:flex;flex-wrap:wrap;gap:5px}
.kj-cms .chips span {background:white;padding:4px 7px;font-size:10px;border:1px solid #cfdeee;border-radius:3px}
.kj-cms .screen-bottom {margin-top:17px;font-size:10px;display:flex;justify-content:space-between;color:#536576}
.kj-cms .screen-bottom span {color:#075fd8}
.kj-cms .hero-screen figcaption {padding:12px 18px;margin:0;border-top:1px solid #dce5ec;font-size:10px}
.kj-cms .concept-note {display:flex;gap:25px;padding-block:25px;border-bottom:1px solid #dce5ec}
.kj-cms .concept-note strong {font-size:11px;flex:0 0 105px;padding-top:3px}
.kj-cms .concept-note p {font-size:11px}
/* Feature navigation and detail sections. */
.kj-cms .roles {display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.kj-cms .roles span {padding:9px 15px;background:#f1f5f8;border-left:2px solid #075fd8;font-size:12px}
.kj-cms .features {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.kj-cms .feature {position:relative;display:block;padding:28px 25px 40px;background:#fff;border:1px solid #dce5ec;text-decoration:none;color:#142e43;transition:border-color .2s,box-shadow .2s}
.kj-cms .feature:hover {border-color:#075fd8;box-shadow:0 8px 20px #15385f0a}
.kj-cms .number {display:block;color:#075fd8;font-size:11px;font-weight:700;letter-spacing:.1em;margin-bottom:20px}
.kj-cms .feature h3 {font-size:18px;margin-bottom:12px}
.kj-cms .feature p {font-size:13px}
.kj-cms .arrow {position:absolute;right:22px;bottom:15px;color:#075fd8;font-size:20px}
.kj-cms .comparison {padding:30px;border:1px solid #dce5ec;border-radius:5px}
.kj-cms .label {display:block;font-size:11px;font-weight:700;color:#647687;margin-bottom:15px}
.kj-cms .comparison p {font-size:14px}
.kj-cms .suggestion {margin-top:24px;background:#edf5ff;padding:22px;border-left:3px solid #075fd8}
.kj-cms .suggestion .label {color:#075fd8}
.kj-cms .navy {background:#142e43;color:white}
.kj-cms .navy .eyebrow {color:#83beff}
.kj-cms .navy p,.kj-cms .navy figcaption {color:#c2d1df}
.kj-cms .workflow {margin-top:40px}
.kj-cms .workflow ol {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;list-style:none;padding:0;margin:0}
.kj-cms .workflow li {position:relative;border:1px solid #ffffff40;padding:25px 20px;background:#ffffff06}
.kj-cms .workflow li:not(:last-child)::after {content:'→';position:absolute;right:-21px;top:47px;color:#83beff}
.kj-cms .workflow small {color:#83beff;font-size:10px}
.kj-cms .workflow h3 {font-size:25px;margin-block:14px 7px}
.kj-cms .workflow li p {font-size:12px}
.kj-cms .return-path {margin-top:18px;padding:12px;border-bottom:1px dashed #83beff80;text-align:center;color:#b7d8ff;font-size:12px}
.kj-cms .governance-grid {display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:36px}
.kj-cms .panel {padding:32px;border:1px solid #dce5ec}
.kj-cms .panel>p {font-size:13px;margin-top:14px}
.kj-cms .permission-row {display:flex;justify-content:space-between;gap:15px;padding:15px 0;border-bottom:1px solid #dce5ec;font-size:12px}
.kj-cms .permission-row:first-of-type {margin-top:15px}
.kj-cms .permission-row span {color:#647687}
.kj-cms .plain-list {list-style:none;margin:10px 0 0;padding:0}
.kj-cms .plain-list li {padding:15px 0;border-bottom:1px solid #dce5ec;font-size:12px}
.kj-cms .plain-list b,.kj-cms .plain-list span {display:block}
.kj-cms .plain-list span {color:#647687;margin-top:4px}
.kj-cms .integration-map {text-align:center;padding:30px}
.kj-cms .integration-center {background:#142e43;color:white;padding:25px;font-size:27px;font-weight:700;max-width:280px;margin:auto}
.kj-cms .integration-center small {display:block;font-size:11px;font-weight:400;color:#c2d1df;margin-top:8px}
.kj-cms .connectors {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding-top:45px;position:relative}
.kj-cms .connectors::before {content:'';position:absolute;top:0;left:50%;height:25px;border-left:1px solid #9db2c8}
.kj-cms .connectors span {position:relative;padding:18px 5px;background:white;border:1px solid #cad7e3;font-size:12px}
.kj-cms .connectors span::before {content:'';position:absolute;top:-21px;left:-6px;right:-6px;height:20px;border-top:1px solid #9db2c8}
.kj-cms .support-flow {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;margin:40px 0 0;border-top:1px solid #dce5ec;gap:25px}
.kj-cms .support-flow li {padding-top:25px}
.kj-cms .support-flow p {font-size:12px;margin-top:10px}
.kj-cms .contact-section {padding:80px 0;background:#edf5fc;text-align:center}
.kj-cms .contact-section p {font-size:14px}
.kj-cms .contact-section .button {margin-top:30px}
.kj-cms .back-link {display:block;width:fit-content;margin:25px auto 0;font-size:11px;color:#536576}
.kj-cms .skip-link {position:fixed;top:-100px;left:15px;z-index:10000;background:white;padding:15px}
.kj-cms .skip-link:focus {top:10px}
/* Motion is progressive: content is visible until the observer is ready. */
@keyframes cms-in {from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
.kj-cms .reveal.is-pending {opacity:0;transform:translateY(20px)}
.kj-cms .reveal {transition:opacity .65s,transform .65s}
@media(max-width:1000px){.kj-cms .hero-grid{grid-template-columns:1fr;gap:45px}.kj-cms .hero-screen{max-width:650px;width:100%;transform:none}.kj-cms .hero-copy{max-width:700px}.kj-cms h1{font-size:48px}.kj-cms .split{gap:35px}.kj-cms .features{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.kj-cms .shell{width:calc(100% - 48px)}.kj-cms .section{padding-block:60px}.kj-cms .cms-hero{padding:48px 0}.kj-cms h1{font-size:clamp(29px,7vw,44px)}.kj-cms .hero-sub{font-size:15px}.kj-cms .lead{font-size:12px}.kj-cms .lead br{display:none}.kj-cms .split,.kj-cms .governance-grid{grid-template-columns:1fr;gap:28px}.kj-cms .concept-note{display:block}.kj-cms .concept-note strong{display:block;margin-bottom:8px}.kj-cms .features{grid-template-columns:1fr;gap:12px;margin-top:25px}.kj-cms .feature{padding:23px 22px 32px}.kj-cms .feature .number{margin-bottom:12px}.kj-cms .workflow ol{grid-template-columns:1fr;gap:25px}.kj-cms .workflow li{padding:20px}.kj-cms .workflow li:not(:last-child)::after{content:'↓';top:auto;bottom:-26px;left:50%;right:auto}.kj-cms .workflow h3{margin-top:5px}.kj-cms .return-path{text-align:left}.kj-cms .support-flow{grid-template-columns:1fr 1fr;gap:20px}.kj-cms .panel,.kj-cms .comparison{padding:23px}.kj-cms .integration-map{padding:12px 0}.kj-cms .screen-body{grid-template-columns:62px minmax(0,1fr);min-height:0}.kj-cms .screen-nav{padding:16px 4px;font-size:9px}.kj-cms .screen-nav strong{font-size:6px}.kj-cms .screen-nav span{padding:7px 4px}.kj-cms .screen-editor{padding:13px}.kj-cms .editor-heading{font-size:12px}.kj-cms .screen-top{padding:14px}.kj-cms .screen-top>span{font-size:7px}.kj-cms .field{padding:9px;font-size:10px}.kj-cms .ai-panel{padding:10px}.kj-cms .screen-bottom{font-size:8px}.kj-cms .contact-section{padding-block:60px}.kj-cms .contact-section p br{display:none}.kj-cms .actions{gap:16px}.kj-cms .button{max-width:100%;font-size:12px;gap:15px}.kj-cms main p{font-size:14px}.kj-cms main .note,.kj-cms main figcaption{font-size:11px}.kj-cms .ai-panel p{font-size:10px}.kj-cms .concept-note p{font-size:11px}.kj-cms .eyebrow{font-size:9px}}
@media(prefers-reduced-motion:reduce){.kj-cms *{animation:none!important;transition:none!important}.kj-cms .reveal.is-pending{opacity:1;transform:none}}
@media print{.kj-cms .reveal.is-pending{opacity:1;transform:none}.kj-cms .hero-copy,.kj-cms .hero-screen{animation:none}.kj-cms .section{padding-block:30px}}

/* Concept illustration and matching explanatory captions. */
.kj-cms .cms-story {margin-top:-38px;margin-bottom:80px;padding:25px 30px 28px;border:1px solid #dce5ec;border-radius:6px;background:#fff;overflow:hidden}
.kj-cms .cms-story img {display:block;width:100%;height:auto;max-width:100%;margin:0 auto}
.kj-cms .cms-story-labels {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:10px}
.kj-cms .cms-story-labels>div {border-top:2px solid #dce9f7;padding-top:18px}
.kj-cms .cms-story-labels span {display:block;color:#075fd8;font-size:10px;font-weight:700;letter-spacing:.05em;margin-bottom:8px}
.kj-cms .cms-story-labels strong {display:block;color:#142e43;font-size:18px;line-height:1.6}
.kj-cms .cms-story-labels p {font-size:12px;line-height:1.9;margin-top:8px}
.kj-cms .cms-story figcaption {border-top:1px solid #e3eaf0;padding-top:15px;margin-top:24px}
@media(max-width:767px){.kj-cms .cms-story{margin-top:-20px;margin-bottom:55px;padding:14px 14px 20px}.kj-cms .cms-story-labels{grid-template-columns:1fr;gap:16px;margin-top:15px}.kj-cms .cms-story-labels>div{padding-top:12px}.kj-cms .cms-story-labels strong{font-size:17px}.kj-cms .cms-story-labels p{font-size:12px;margin-top:4px}}

/* Product-name-led hero with dedicated AI CMS artwork. */
.kj-cms .hero-grid {grid-template-columns:1fr 1fr;gap:38px;align-items:center}
.kj-cms .cms-hero {padding-block:58px 65px}
.kj-cms h1.product-name {font-family:"Helvetica Neue",Arial,sans-serif;font-size:clamp(52px,5.5vw,80px);font-weight:800;letter-spacing:-.055em;line-height:1.12;color:#075fd8;white-space:nowrap}
.kj-cms .product-concept {font-size:clamp(22px,2.1vw,30px);font-weight:700;letter-spacing:-.03em;line-height:1.6;color:#142e43;margin-top:25px}
.kj-cms .hero-art {margin:0;min-width:0;animation:cms-in 1s .15s both}
.kj-cms .hero-art img {display:block;width:100%;max-width:100%;height:auto;border-radius:8px}
.kj-cms .hero-art figcaption {margin-top:12px;text-align:center;font-size:10px}
.kj-cms .cms-screen-section {padding-bottom:85px}
.kj-cms .cms-screen-section .hero-screen {max-width:720px;width:100%;margin:30px auto 0;transform:none;animation:none}
@media(max-width:1000px){.kj-cms .hero-grid{grid-template-columns:1fr 1fr;gap:25px}.kj-cms h1.product-name{font-size:clamp(45px,5.5vw,65px)}.kj-cms .product-concept{font-size:23px}.kj-cms .hero-sub{font-size:15px}.kj-cms .hero-sub br{display:none}}
@media(max-width:767px){.kj-cms .cms-hero{padding-block:38px 35px}.kj-cms .hero-grid{grid-template-columns:1fr;gap:24px}.kj-cms h1.product-name{font-size:clamp(43px,10.6vw,70px)}.kj-cms main .product-concept{font-size:22px;line-height:1.6;margin-top:19px}.kj-cms .hero-sub{margin-top:16px}.kj-cms .hero-art{width:100%;max-width:480px;margin-inline:auto}.kj-cms .hero-art figcaption{font-size:10px}.kj-cms .cms-screen-section{padding-bottom:55px}.kj-cms .hero-copy .lead{display:none}.kj-cms .hero-copy .actions{margin-top:22px}}
@media(prefers-reduced-motion:reduce){.kj-cms .hero-art{animation:none}}

/* Shallow abstract hero: product name and catchphrase over the artwork. */
.kj-cms .cms-hero { position:relative; isolation:isolate; display:flex; align-items:center; min-height:50vh; min-height:50svh; padding:38px 0; overflow:hidden; background:#eff8ff; }
.kj-cms .hero-background { position:absolute; inset:0; z-index:-1; }
.kj-cms .hero-background img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center; }
.kj-cms .hero-background::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#eff8ffa6 0%,#eff8ff33 48%,transparent 76%); }
.kj-cms .hero-grid { display:block; }
.kj-cms .hero-copy { position:relative; max-width:680px; }
.kj-cms .hero-copy .eyebrow { font-size:9px; margin:0 0 14px; }
.kj-cms h1.product-name { position:static; inset:auto; width:auto; height:auto; margin:0; padding:0; background:none; font-size:clamp(44px,4.6vw,68px); line-height:1.1; }
.kj-cms .hero-copy .product-concept { margin-top:16px; font-size:clamp(21px,2vw,28px); line-height:1.5; }
.kj-cms .hero-copy .hero-sub { margin-top:14px; font-size:14px; line-height:1.85; }
.kj-cms .hero-copy .lead { display:none; }
.kj-cms .hero-copy .actions { margin-top:22px; gap:20px; }
.kj-cms .hero-copy .button { min-height:44px; padding:12px 18px; font-size:12px; }
.kj-cms .hero-copy .text-link { font-size:11px; }
@media(max-width:767px) {
    .kj-cms { padding-top:0; }
    .kj-cms > nav[aria-label="パンくず"] { display:none; }
    .kj-cms #header { background:transparent; box-shadow:none; }
    .kj-cms #header.hd-shadow { background:#fffffff5; }
    .kj-cms .cms-hero { min-height:50vh; min-height:50svh; padding:100px 0 24px; align-items:flex-start; }
    .kj-cms .hero-background img { object-position:65% center; }
    .kj-cms .hero-background::after { background:linear-gradient(180deg,#eff8fff2 0%,#eff8ffdb 38%,#eff8ff88 62%,#eff8ff0d 100%); }
    .kj-cms .hero-copy .eyebrow { font-size:8px; letter-spacing:.07em; margin-bottom:12px; }
    .kj-cms h1.product-name { font-size:clamp(44px,12vw,68px); }
    .kj-cms .hero-copy .product-concept { font-size:clamp(18px,4.8vw,24px); margin-top:14px; }
    .kj-cms .hero-copy .hero-sub { font-size:12px; margin-top:12px; }
    .kj-cms .hero-copy .actions { margin-top:18px; gap:14px; }
}

/* Reset legacy article gutters only on this product landing page. */
.kj-cms #main { width:100%; min-height:0; margin:0; padding:0; background:transparent; }
@media(max-width:767px) {
    .kj-cms .cms-hero { padding-top:96px; padding-bottom:24px; }
    .kj-cms .hero-copy { width:100%; max-width:none; }
    .kj-cms .hero-copy .product-concept { margin-top:12px; font-size:clamp(18px,4.7vw,22px); line-height:1.65; color:#142e43; }
    .kj-cms .hero-copy .hero-sub { margin-top:12px; font-size:13px; line-height:1.8; font-weight:400; }
    .kj-cms .hero-copy .actions { margin-top:16px; align-items:flex-start; flex-direction:column; gap:10px; }
    .kj-cms .hero-copy .button { min-height:48px; }
}

/* Original vector diagrams: problem, assistance, and the human decision. */
.kj-cms .cms-viz-defs { position:absolute; width:0; height:0; overflow:hidden; }
.kj-cms .cms-viz-icon { display:block; flex:0 0 auto; width:48px; height:48px; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; color:#075fd8; }
.kj-cms .cms-feature-viz { display:grid; grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr); align-items:center; gap:5px; margin-top:22px; padding-top:20px; border-top:1px solid #e1eaf3; }
.kj-cms .cms-feature-viz > div { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-width:0; min-height:124px; padding:12px 6px; border-radius:12px; text-align:center; }
.kj-cms .cms-viz-before { background:#f3f5f7; color:#687e90; }
.kj-cms .cms-viz-before .cms-viz-icon { color:#8294a4; }
.kj-cms .cms-viz-after { background:#eaf4ff; color:#0755b7; }
.kj-cms .cms-feature-viz span { font-size:10px; line-height:1.7; }
.kj-cms .cms-viz-arrow { color:#075fd8; text-align:center; font-size:18px!important; }
.kj-cms .cms-ai-examples { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.kj-cms .cms-ai-example { min-width:0; padding:20px 16px; border:1px solid #dce5ec; border-radius:14px; background:#f5faff; }
.kj-cms .cms-viz-title { display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:16px; color:#142e43; font-size:13px; text-align:center; }
.kj-cms .cms-viz-input,.kj-cms .cms-viz-output { padding:11px 8px; border-radius:6px; background:white; font-size:11px; line-height:1.7; text-align:center; overflow-wrap:anywhere; }
.kj-cms .cms-viz-output { background:#075fd8; color:white; }
.kj-cms .cms-viz-down { margin-block:7px; text-align:center; color:#075fd8; font-size:18px; }
.kj-cms .cms-viz-down span { font-size:9px; }
.kj-cms .cms-ai-example p { margin-top:12px; font-size:11px; text-align:center; }
.kj-cms .cms-human-check { display:flex; align-items:center; gap:12px; margin-top:16px; padding:16px; border:1px solid #b7dbc8; background:#f1faf5; border-radius:10px; font-size:11px; line-height:1.8; }
.kj-cms .cms-human-check .cms-viz-icon { color:#188059; width:36px; height:36px; }
.kj-cms .cms-human-check strong { display:block; color:#188059; }
.kj-cms .cms-organization-viz { margin-top:22px; padding:20px 10px; border-radius:12px; background:#f2f7fc; }
.kj-cms .cms-org-parent { display:flex; flex-direction:column; align-items:center; gap:10px; padding-bottom:24px; color:#075fd8; font-size:13px; }
.kj-cms .cms-org-branches { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; border-top:1px solid #bad2ee; }
.kj-cms .cms-org-branches > div { position:relative; display:flex; flex-direction:column; align-items:center; gap:8px; padding:24px 5px 8px; text-align:center; }
.kj-cms .cms-org-branches > div::before { content:''; position:absolute; height:15px; border-left:1px solid #bad2ee; top:0; }
.kj-cms .cms-org-branches b { font-size:12px; }
.kj-cms .cms-org-branches span { font-size:10px; line-height:1.7; color:#647687; }
.kj-cms .cms-org-branches .cms-viz-icon { width:36px; height:36px; }
.kj-cms .cms-security-viz { display:flex; flex-direction:column; align-items:center; gap:8px; margin-block:22px; padding:20px; background:#f2f7fc; border-radius:12px; }
.kj-cms .cms-security-viz > div { display:flex; align-items:center; gap:15px; width:100%; padding:12px; border:1px solid #d5e3f0; border-radius:8px; background:white; font-size:12px; line-height:1.7; }
.kj-cms .cms-security-viz .cms-security-gate { border-color:#b7dbc8; background:#edf9f2; }
.kj-cms .cms-security-gate .cms-viz-icon { color:#188059; }
.kj-cms .workflow .cms-viz-icon { color:#83beff; margin-bottom:16px; }
.kj-cms .support-flow .cms-viz-icon { margin-bottom:18px; }
@media(max-width:767px) {
    .kj-cms .cms-feature-viz { margin-top:18px; padding-top:16px; }
    .kj-cms .cms-feature-viz > div { min-height:114px; }
    .kj-cms .cms-ai-examples { gap:10px; }
    .kj-cms .cms-ai-example { padding:16px 10px; }
    .kj-cms .cms-ai-example p { font-size:11px; }
    .kj-cms .cms-viz-title { font-size:12px; }
    .kj-cms .cms-security-viz { padding:12px; }
    .kj-cms .workflow .cms-viz-icon { float:right; margin:0 0 10px 10px; }
}
@media(max-width:360px) {
    .kj-cms .cms-ai-examples { grid-template-columns:1fr; }
    .kj-cms .cms-org-branches { gap:0; }
    .kj-cms .cms-org-branches b { font-size:11px; }
}

/* One original illustration atlas keeps six feature scenes visually consistent. */
.kj-cms .cms-feature-art { width:100%; aspect-ratio:1; margin-top:20px; background-image:url("images/feature-illustrations.png"); background-size:300% 200%; background-repeat:no-repeat; border-radius:12px; }
.kj-cms .cms-feature-art-1 { background-position:0% 0%; }
.kj-cms .cms-feature-art-2 { background-position:50% 0%; }
.kj-cms .cms-feature-art-3 { background-position:100% 0%; }
.kj-cms .cms-feature-art-4 { background-position:0% 100%; }
.kj-cms .cms-feature-art-5 { background-position:50% 100%; }
.kj-cms .cms-feature-art-6 { background-position:100% 100%; }
.kj-cms .cms-feature-benefit { display:flex; flex-direction:column; align-items:center; gap:5px; margin-top:12px; padding:15px 10px; background:#f0f7ff; border-radius:10px; text-align:center; font-size:12px; line-height:1.8; }
.kj-cms .cms-feature-benefit > span { color:#647687; }
.kj-cms .cms-feature-benefit > strong { color:#075fd8; font-size:13px; }
@media(max-width:767px) {
    .kj-cms .cms-feature-art { max-width:340px; margin:18px auto 0; }
}

/* Concrete editorial use cases, with existing artwork and readable process steps. */
.kj-cms .cms-usecases-lead { max-width:800px; font-size:16px; line-height:2; }
.kj-cms .cms-usecase-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:36px; }
.kj-cms .cms-usecase { min-width:0; padding:28px; border:1px solid #dce5ec; border-radius:16px; background:#fff; }
.kj-cms .cms-usecase-top { display:grid; grid-template-columns:minmax(0,1fr) 142px; gap:18px; align-items:center; }
.kj-cms .cms-usecase-label { color:#075fd8; font-size:11px; font-weight:700; line-height:1.7; }
.kj-cms .cms-usecase h3 { margin-top:12px; color:#142e43; font-size:21px; line-height:1.65; letter-spacing:-.035em; }
.kj-cms .cms-usecase .cms-feature-art { margin:0; border-radius:10px; }
.kj-cms .cms-usecase-description { margin-top:18px; font-size:13px; line-height:1.9; }
.kj-cms .cms-usecase-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; list-style:none; padding:0; margin:22px 0 0; }
.kj-cms .cms-usecase-steps li { position:relative; display:flex; align-items:center; justify-content:center; padding:12px 7px; border-radius:7px; background:#edf5ff; color:#0755b7; text-align:center; font-size:10px; line-height:1.8; }
.kj-cms .cms-usecase-steps li:not(:last-child)::after { content:'→'; position:absolute; right:-13px; color:#7da7d6; }
.kj-cms .cms-usecase-benefit { margin-top:18px; padding-top:16px; border-top:1px solid #e1eaf3; font-size:13px; font-weight:700; color:#188059; }
@media(max-width:1000px) {
    .kj-cms .cms-usecase { padding:22px; }
    .kj-cms .cms-usecase-top { grid-template-columns:minmax(0,1fr) 105px; gap:12px; }
    .kj-cms .cms-usecase h3 { font-size:18px; }
}
@media(max-width:767px) {
    .kj-cms .cms-usecase-grid { grid-template-columns:1fr; gap:18px; margin-top:26px; }
    .kj-cms .cms-usecase-top { grid-template-columns:minmax(0,1fr) 112px; }
    .kj-cms .cms-usecases-lead { font-size:14px; }
    .kj-cms .cms-usecase h3 { font-size:19px; }
    .kj-cms .cms-usecase-label { font-size:10px; }
    .kj-cms .cms-usecase-description { font-size:13px; }
}
@media(max-width:360px) {
    .kj-cms .cms-usecase { padding:18px; }
    .kj-cms .cms-usecase-top { grid-template-columns:minmax(0,1fr) 85px; }
    .kj-cms .cms-usecase h3 { font-size:17px; }
}

/* Refined product narrative; retain artwork, color and progressive motion. */
.kj-cms .cms-design-note { margin-block:20px 0; font-size:11px; line-height:1.8; color:#647687; }
.kj-cms .cms-screen-section { padding-top:64px; padding-bottom:80px; }
.kj-cms .cms-screen-stage { padding:28px 32px 0; margin-top:32px; border:1px solid #d6e5f5; border-radius:20px; background:linear-gradient(145deg,#e7f3ff,#f6faff); }
.kj-cms .cms-screen-section .hero-screen { max-width:1060px; margin:0 auto; box-shadow:0 20px 55px #15385f1c; }
.kj-cms .cms-screen-stage .screen-body { grid-template-columns:150px minmax(0,1fr); min-height:440px; }
.kj-cms .cms-screen-stage .screen-editor { padding:28px 36px; }
.kj-cms .cms-screen-stage .field { font-size:14px; }
.kj-cms .cms-screen-stage .ai-panel { border:1px solid #b4d5fd; border-radius:10px; }
.kj-cms [data-screen-point] { position:relative; }
.kj-cms [data-screen-point]::after { content:attr(data-screen-point); position:absolute; top:8px; right:8px; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#075fd8; color:white; font:700 11px Arial,sans-serif; }
.kj-cms .cms-screen-callouts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; padding:0; margin:28px 0 0; gap:24px; }
.kj-cms .cms-screen-callouts li { padding-top:16px; border-top:2px solid #c4dcf8; }
.kj-cms .cms-screen-callouts b,.kj-cms .cms-screen-callouts span { display:block; font-size:13px; line-height:1.8; }
.kj-cms .cms-screen-callouts b { color:#075fd8; }
.kj-cms .cms-screen-callouts span { margin-top:6px; color:#647687; }
.kj-cms .cms-theme-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:34px; }
.kj-cms .cms-theme { min-width:0; padding:24px; border:1px solid #dce5ec; border-radius:14px; background:white; }
.kj-cms .cms-theme .cms-feature-art { max-width:240px; margin:0 auto 18px; }
.kj-cms .cms-theme .cms-theme-label { color:#075fd8; font-size:11px; font-weight:700; }
.kj-cms .cms-theme h3 { margin:10px 0 12px; font-size:21px; line-height:1.65; }
.kj-cms .cms-theme > p { font-size:13px; }
.kj-cms details { margin-top:20px; border-top:1px solid #dce5ec; padding-top:14px; font-size:12px; line-height:1.9; }
.kj-cms summary { cursor:pointer; color:#075fd8; font-weight:700; }
.kj-cms summary:focus-visible { outline:2px solid #075fd8; outline-offset:5px; }
.kj-cms details ul { padding-left:18px; margin:12px 0 0; }
.kj-cms details li + li { margin-top:10px; }
.kj-cms .cms-custom-story { margin-top:32px; padding:12px; border-radius:14px; background:white; overflow:hidden; }
.kj-cms .cms-custom-story img { display:block; width:100%; height:auto; }
.kj-cms .cms-custom-story figcaption { margin:0; padding:8px; color:#647687; font-size:10px; text-align:center; }
.kj-cms .cms-custom-options { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 0; padding:0; list-style:none; }
.kj-cms .cms-custom-options li { border:1px solid #ffffff36; padding:8px 14px; border-radius:6px; font-size:12px; color:#c2d1df; }
.kj-cms .cms-public-layout { display:grid; grid-template-columns:1.5fr 1fr; gap:50px; align-items:center; }
.kj-cms .cms-public-layout p { max-width:540px; font-size:14px; }
.kj-cms .cms-public-art .cms-feature-art { max-width:320px; margin:0 auto; }
.kj-cms .cms-public-points { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin-top:28px; }
.kj-cms .cms-public-points article { padding-top:20px; border-top:2px solid #c4dcf8; }
.kj-cms .cms-public-points h3 { font-size:16px; margin-bottom:10px; }
.kj-cms .cms-public-points p { font-size:12px; }
.kj-cms .cms-technical-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:34px; }
.kj-cms .cms-technical-grid > .panel { min-width:0; border-radius:14px; background:white; }
.kj-cms .cms-technical-grid .cms-feature-art { max-width:220px; margin:0 auto 20px; }
.kj-cms .cms-technical-grid .integration-map { padding:28px 0 0; }
.kj-cms .cms-technical-grid .integration-center { font-size:22px; }
.kj-cms .cms-support-summary { margin-top:58px; }
.kj-cms .cms-support-summary .support-flow { margin-top:24px; }
.kj-cms .cms-support-summary .support-flow h3 { font-size:17px; }
.kj-cms #ai,.kj-cms #workflow,.kj-cms #integration,.kj-cms #support { scroll-margin-top:110px; }
.kj-cms .reveal { transition-delay:var(--cms-reveal-delay,0ms); }
@media(max-width:1000px) {
    .kj-cms .cms-theme-grid { gap:16px; }
    .kj-cms .cms-theme { padding:20px; }
    .kj-cms .cms-theme h3 { font-size:18px; }
    .kj-cms .cms-public-points { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:767px) {
    .kj-cms .cms-screen-section { padding-top:42px; padding-bottom:54px; }
    .kj-cms .cms-screen-stage { margin-top:24px; padding:12px 8px 0; border-radius:12px; }
    .kj-cms .cms-screen-stage .screen-body { grid-template-columns:minmax(0,1fr); min-height:0; }
    .kj-cms .cms-screen-stage .screen-nav { display:none; }
    .kj-cms .cms-screen-stage .screen-editor { padding:18px 14px; }
    .kj-cms .cms-screen-stage .field { font-size:12px; }
    .kj-cms .cms-screen-stage .ai-panel p { font-size:12px; padding-right:12px; }
    .kj-cms .cms-screen-stage .screen-bottom { font-size:10px; padding-right:26px; flex-wrap:wrap; }
    .kj-cms .cms-screen-callouts { grid-template-columns:1fr; gap:12px; margin-top:20px; }
    .kj-cms .cms-screen-callouts li { padding-top:12px; }
    .kj-cms .cms-screen-callouts span { margin-top:2px; font-size:12px; }
    .kj-cms .cms-theme-grid,.kj-cms .cms-technical-grid { grid-template-columns:1fr; gap:18px; }
    .kj-cms .cms-theme { padding:24px; }
    .kj-cms .cms-theme h3 { font-size:22px; }
    .kj-cms .cms-theme .cms-feature-art { max-width:220px; }
    .kj-cms .cms-public-layout { grid-template-columns:1fr; gap:18px; }
    .kj-cms .cms-public-art .cms-feature-art { max-width:250px; }
    .kj-cms .cms-public-points { gap:20px 16px; }
    .kj-cms .cms-public-points h3 { font-size:15px; }
    .kj-cms .cms-custom-story { margin-top:25px; padding:6px; }
    .kj-cms .cms-custom-options { gap:8px; }
    .kj-cms .cms-custom-options li { font-size:11px; padding:7px 10px; }
    .kj-cms .cms-support-summary { margin-top:40px; }
    .kj-cms .reveal { transition-duration:.45s; }
}

/* Supplied product logo; trim transparent margins through layout, keeping the original intact. */
.kj-cms h1.product-name { position:relative; width:min(520px,100%); height:auto; aspect-ratio:6.2; overflow:hidden; line-height:0; }
.kj-cms h1.product-name .cms-product-logo { position:absolute; top:50%; left:-8%; display:block; width:117%; max-width:none; height:auto; transform:translateY(-50%); }
@media(max-width:767px) {
    .kj-cms h1.product-name { width:min(360px,100%); }
}

/* Prominent AI lettering with smaller KJ / CMS; retain the complete mark. */
.kj-cms h1.product-name { aspect-ratio:4; }
.kj-cms h1.product-name .cms-product-logo { width:140%; left:-20%; }

/* Editable text wordmark: tune these variables without regenerating an image. */
.kj-cms h1.product-name {
    --wordmark-ai-size:clamp(58px,6vw,82px);
    --wordmark-small-ratio:.60;
    --wordmark-weight:300;
    --wordmark-gap:.16em;
    --wordmark-spacing:-.035em;
    position:static;
    display:flex;
    align-items:center;
    gap:var(--wordmark-gap);
    width:fit-content;
    max-width:100%;
    height:auto;
    aspect-ratio:auto;
    overflow:visible;
    margin:0;
    padding:0;
    background:none;
    font-family:"Helvetica Neue","Segoe UI",Arial,sans-serif;
    font-size:var(--wordmark-ai-size);
    font-weight:var(--wordmark-weight);
    line-height:1.12;
    letter-spacing:var(--wordmark-spacing);
    color:#052653;
    white-space:nowrap;
}
.kj-cms .product-name > span {
    display:block;
    flex:0 0 auto;
    font-family:inherit;
    font-weight:inherit;
    line-height:inherit;
    letter-spacing:inherit;
}
.kj-cms .cms-wordmark-kj,.kj-cms .cms-wordmark-cms { font-size:calc(1em * var(--wordmark-small-ratio)); }
.kj-cms .cms-wordmark-ai { font-size:1em; color:#245cff; }
@supports ((background-clip:text) or (-webkit-background-clip:text)) {
    .kj-cms .cms-wordmark-ai {
        background:linear-gradient(115deg,#006dff 5%,#3346ff 52%,#8b16f6 100%);
        -webkit-background-clip:text;
        background-clip:text;
        -webkit-text-fill-color:transparent;
        color:transparent;
    }
}
@media(max-width:767px) {
    .kj-cms h1.product-name { --wordmark-ai-size:clamp(48px,15vw,66px); }
}
@media print {
    .kj-cms .cms-wordmark-ai { background:none; color:#245cff; -webkit-text-fill-color:#245cff; }
}