/* ==========================================================================
   AI Automation page — built on the home page tokens.
   Signature pieces: live workflow canvas, before/after flows, service explorer,
   ROI estimator, guardrail panel, conversational enquiry.
   ========================================================================== */
html.ai-active { scroll-padding-top: 110px; }
/* Only one <main> is shown at a time (see the router at the end of the file) */
main[hidden] { display: none !important; }
.x-wrap { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.x-k { display: inline-flex; align-items: center; gap: 10px; font-family: var(--f-mono); font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--blue-700); }
.x-k::before { content: ""; width: 18px; height: 1px; background: currentColor; }
.x-dark .x-k { color: var(--teal); }
.x-h2 { font-size: clamp(36px, 4.6vw, 68px); letter-spacing: -.045em; line-height: 1.02; }
.x-h2 em { color: var(--blue); }
.x-dark .x-h2 em { color: var(--teal); }
.x-lead { font-size: clamp(16.5px, 1.3vw, 18.5px); line-height: 1.6; color: var(--text-2); max-width: 560px; }
.x-dark .x-lead { color: var(--on-dark-2); }
.x-head { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 24px clamp(32px, 6vw, 96px); align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
.x-head .x-k { margin-bottom: 18px; }
.x-sec { padding: clamp(80px, 10vw, 140px) 0; position: relative; }
.x-dark { background: var(--ink-950); color: var(--on-dark); margin: 0 var(--inset); border-radius: var(--r-xl); overflow: hidden; isolation: isolate; }
.x-mono { font-family: var(--f-mono); }

/* reveal */
.js .rv { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--ease), transform 1.1s var(--ease-out); transition-delay: var(--d, 0s); }
.js .rv.is-in { opacity: 1; transform: none; }

/* ---------- HERO ---------- */
.x-hero { position: relative; margin: var(--inset); border-radius: var(--r-xl); background: var(--ink-950); color: var(--on-dark); overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(56px, 6vw, 96px)) 0 clamp(48px, 5vw, 72px); }
.x-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background-image: linear-gradient(rgba(190,205,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(190,205,255,.06) 1px, transparent 1px); background-size: 64px 64px; -webkit-mask: radial-gradient(ellipse 70% 80% at 70% 40%, #000 30%, transparent 80%); mask: radial-gradient(ellipse 70% 80% at 70% 40%, #000 30%, transparent 80%); }
.x-hero::after { content: ""; position: absolute; z-index: -1; right: -10%; top: -30%; width: 900px; height: 900px; background: radial-gradient(closest-side, rgba(47,107,255,.28), rgba(123,108,255,.12) 45%, transparent 70%); }
.x-hero__grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.x-crumbs { display: flex; gap: 8px; margin-bottom: 28px; font-family: var(--f-label); font-size: 13px; color: var(--on-dark-3); }
.x-crumbs a:hover { color: #fff; }
.x-hero h1 { font-size: clamp(44px, 5.6vw, 88px); letter-spacing: -.05em; line-height: .98; color: #fff; }
.x-hero h1 em { color: var(--teal); }
.x-hero .x-lead { margin-top: 24px; color: var(--on-dark-2); }
.x-hero .x-k { color: var(--teal); }
.x-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
/* Inner pages use the home page buttons (.btn, see "Buttons" near the top) — no page-specific button styles.
   On their dark panels the primary button fills white on hover, as in the home hero. */
.vh .btn--primary, .x-dark .btn--primary, .ab-hero .btn--primary, .ab-sec--dark .btn--primary, .ac-hero .btn--primary, .ac-band--alt .btn--primary,
.k-dark .btn--primary, .ki-hero .btn--primary, .kb-hero .btn--primary, .kb-stage .btn--primary, .kh-banner .btn--primary, .kl-hero .btn--primary, .ka-hero .btn--primary, .ki-term .btn--primary, .ka-glow .btn--primary, .kp-secure .btn--primary, .k-tiers .is-pick .btn--primary { --btn-fill: #fff; --btn-fg-h: var(--text); }
.x-hero__proof { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line-dark); font-size: 14px; color: var(--on-dark-2); }
.x-hero__proof b { color: #fff; font-weight: 600; }

/* Workflow canvas */
.wf { position: relative; border-radius: 22px; background: linear-gradient(180deg, rgba(21,26,54,.75), rgba(8,10,22,.9)); border: 1px solid var(--line-dark-2); box-shadow: 0 60px 120px -50px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.06); overflow: hidden; }
.wf__bar { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--line-dark); }
.wf__dots { display: flex; gap: 6px; }
.wf__dots i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.14); }
.wf__tabs { display: flex; gap: 4px; padding: 3px; border-radius: 10px; background: rgba(255,255,255,.05); overflow-x: auto; scrollbar-width: none; }
.wf__tabs button { flex: none; padding: 7px 12px; border-radius: 8px; font-family: var(--f-label); font-size: 12.5px; font-weight: 500; color: var(--on-dark-2); transition: background .25s, color .25s; }
.wf__tabs button:hover { color: #fff; }
.wf__tabs button[aria-selected="true"] { background: rgba(94,242,225,.14); color: var(--teal); }
.wf__status { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-family: var(--f-mono); font-size: 11.5px; color: var(--teal); white-space: nowrap; }
.wf__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 0 rgba(94,242,225,.6); animation: wfPing 1.6s infinite; }
@keyframes wfPing { 70%, 100% { box-shadow: 0 0 0 8px rgba(94,242,225,0); } }
.wf svg.wf__graph { display: block; width: 100%; height: auto; }
.wf .lnk { fill: none; stroke: rgba(190,205,255,.18); stroke-width: 1.5; stroke-dasharray: 4 5; }
.wf .lnk.is-hot { stroke: rgba(94,242,225,.55); stroke-dasharray: none; transition: stroke .3s; }
.wf .nd rect { fill: #0E1328; stroke: rgba(190,205,255,.16); stroke-width: 1.2; transition: stroke .35s, fill .35s; }
.wf .nd .k { font-family: var(--f-mono); font-size: 10px; letter-spacing: .08em; fill: #7F8AB5; text-transform: uppercase; }
.wf .nd .t { font-family: "Inter", sans-serif; font-size: 13.5px; font-weight: 600; fill: #EEF1FF; }
.wf .nd .s { font-family: "Inter", sans-serif; font-size: 11px; fill: #A3ACCF; }
.wf .nd .ic { fill: rgba(94,242,225,.12); transition: fill .35s; }
.wf .nd .ic-g { fill: none; stroke: var(--teal); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.wf .nd.is-on rect { stroke: var(--teal); fill: #102A35; }
.wf .nd.is-done rect { stroke: rgba(94,242,225,.35); }
.wf .nd.is-on .ic { fill: rgba(94,242,225,.3); }
.wf .nd--ai rect { fill: #121A40; stroke: rgba(47,107,255,.5); }
.wf .nd--ai.is-on rect { fill: #17245A; stroke: #7FA2FF; }
.wf .nd--ai .ic { fill: rgba(47,107,255,.25); }
.wf .nd--ai .ic-g { stroke: #9DB8FF; }
.wf .ring { fill: none; stroke: #7FA2FF; stroke-width: 1.5; stroke-dasharray: 30 200; opacity: 0; transform-box: fill-box; transform-origin: center; }
.wf .nd--ai.is-on .ring { opacity: 1; animation: wfSpin 1s linear infinite; }
@keyframes wfSpin { to { transform: rotate(360deg); } }
.wf .pkt { fill: var(--teal); filter: drop-shadow(0 0 6px rgba(94,242,225,.9)); opacity: 0; }
.wf__log { margin: 0; padding: 14px 18px 16px; list-style: none; border-top: 1px solid var(--line-dark); height: 148px; overflow: hidden; font-family: var(--f-mono); font-size: 12px; line-height: 1.85; color: var(--on-dark-2); display: flex; flex-direction: column; justify-content: flex-end; }
.wf__log li { display: grid; grid-template-columns: 70px 92px minmax(0, 1fr); gap: 10px; white-space: nowrap; animation: logIn .45s var(--ease-out); }
.wf__log li span:first-child { color: #59628A; }
.wf__log li b { font-weight: 500; color: var(--teal); }
.wf__log li b.k-ai { color: #9DB8FF; }
.wf__log li b.hm { color: #FFC56B; }
.wf__log li em { font-style: normal; overflow: hidden; text-overflow: ellipsis; font-family: var(--f-mono); letter-spacing: 0; }
@keyframes logIn { from { opacity: 0; transform: translateY(8px); } }

/* client strip */
.x-trust { padding: 34px 0; }
.x-trust .x-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 40px; }
.x-trust p { font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.x-trust ul { display: flex; flex-wrap: wrap; gap: 10px 34px; margin: 0; padding: 0; list-style: none; }
.x-trust li { font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.02em; color: #8A90A6; transition: color .3s; }
.x-trust li:hover { color: var(--text); }

/* ---------- BEFORE / AFTER ---------- */
.ba__tabs { display: inline-flex; gap: 4px; padding: 5px; border-radius: 999px; background: var(--paper-2); margin-bottom: 28px; flex-wrap: wrap; }
.ba__tabs button { padding: 10px 18px; border-radius: 999px; font-family: var(--f-label); font-size: 14.5px; font-weight: 500; color: var(--text-2); transition: background .3s, color .3s; }
.ba__tabs button[aria-selected="true"] { background: var(--ink-950); color: #fff; }
.ba { display: grid; grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr); align-items: stretch; }
.ba__col { padding: 28px; border-radius: 22px; border: 1px solid var(--line); }
.ba__col h3 { display: flex; justify-content: space-between; align-items: baseline; font-size: 20px; margin-bottom: 18px; }
.ba__col h3 small { font-family: var(--f-mono); font-size: 12px; font-weight: 500; letter-spacing: .06em; color: var(--text-3); }
.ba__before { background: #FAFAFB; }
.ba__before ol { list-style: none; margin: 0; padding: 0; counter-reset: b; display: grid; gap: 8px; }
.ba__before li { counter-increment: b; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: #fff; border: 1px dashed rgba(10,12,24,.16); font-size: 15px; color: var(--text-2); }
.ba__before li::before { content: counter(b); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--paper-2); font-family: var(--f-mono); font-size: 12px; color: var(--text-3); }
.ba__before li span { font-family: var(--f-mono); font-size: 11.5px; color: #B45309; background: #FFF7E6; padding: 3px 8px; border-radius: 999px; }
.ba.is-swap .ba__before li { animation: baStrike .6s var(--ease-out) both; animation-delay: calc(var(--i) * .06s); }
@keyframes baStrike { from { opacity: 0; transform: translateX(-10px); } }
.ba__arrow { display: grid; place-items: center; }
.ba__arrow svg { width: 54px; height: 54px; }
.ba__arrow circle { fill: var(--blue); }
.ba__arrow path { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ba__after { background: var(--ink-950); color: var(--on-dark); border-color: transparent; position: relative; overflow: hidden; }
.ba__after h3 small { color: var(--teal); }
.ba__flow { position: relative; display: grid; gap: 10px; }
.ba__flow::before { content: ""; position: absolute; left: 21px; top: 20px; bottom: 20px; width: 2px; background: linear-gradient(var(--teal), var(--blue)); opacity: .5; }
.ba__step { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; padding: 10px 14px 10px 0; }
.ba__step i { position: relative; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: #121A40; border: 1px solid rgba(127,162,255,.4); font-style: normal; font-family: var(--f-mono); font-size: 11px; color: #9DB8FF; }
.ba__step.is-ai i { background: rgba(94,242,225,.12); border-color: rgba(94,242,225,.5); color: var(--teal); }
.ba__step.is-human i { background: rgba(255,197,107,.12); border-color: rgba(255,197,107,.5); color: #FFC56B; }
.ba__step strong { display: block; font-family: var(--f-label); font-size: 15px; font-weight: 600; color: #fff; }
.ba__step span { font-size: 13.5px; color: var(--on-dark-2); }
.ba.is-swap .ba__step { animation: baIn .7s var(--ease-out) both; animation-delay: calc(.25s + var(--i) * .1s); }
@keyframes baIn { from { opacity: 0; transform: translateY(14px); } }
.ba__note { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line-dark); font-size: 14px; color: var(--on-dark-2); }
.ba__note b { color: var(--teal); font-weight: 600; }

/* ---------- SERVICE EXPLORER ---------- */
.sx { background: var(--paper-2); }
.sx__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; justify-content: space-between; padding: 12px; border-radius: 18px; background: #fff; border: 1px solid var(--line); position: sticky; top: calc(var(--header-h) + 18px); z-index: 20; box-shadow: 0 20px 40px -30px rgba(10,12,24,.4); }
.sx__filters { display: flex; gap: 4px; flex-wrap: wrap; }
.sx__filters button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; font-family: var(--f-label); font-size: 14px; font-weight: 500; color: var(--text-2); transition: background .25s, color .25s; }
.sx__filters button b { font-family: var(--f-mono); font-size: 11px; font-weight: 500; padding: 2px 7px; border-radius: 999px; background: var(--paper-2); color: var(--text-3); }
.sx__filters button:hover { background: var(--paper-2); }
.sx__filters button[aria-pressed="true"] { background: var(--ink-950); color: #fff; }
.sx__filters button[aria-pressed="true"] b { background: rgba(255,255,255,.14); color: #fff; }
.sx__search { position: relative; flex: 0 1 320px; }
.sx__search input { width: 100%; height: 44px; padding: 0 14px 0 40px; border-radius: 12px; border: 1px solid var(--line); background: var(--paper-2); font: inherit; font-size: 14.5px; color: var(--text); transition: border-color .25s, background .25s; }
.sx__search input:focus { outline: none; border-color: var(--blue); background: #fff; }
.sx__search svg { position: absolute; left: 13px; top: 13px; width: 18px; height: 18px; fill: none; stroke: var(--text-3); stroke-width: 1.8; stroke-linecap: round; }
.sx__group { margin-top: 36px; scroll-margin-top: 190px; }
.sx__group[hidden] { display: none; }
.sx__ghead { display: flex; align-items: baseline; gap: 16px; padding: 0 6px 14px; }
.sx__ghead span { font-family: var(--f-serif); font-style: italic; font-size: 42px; line-height: 1; color: var(--blue); }
.sx__ghead h3 { font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.03em; }
.sx__ghead p { margin-left: auto; font-size: 14.5px; color: var(--text-3); max-width: 420px; text-align: right; }
.sx__list { border-radius: 20px; background: #fff; border: 1px solid var(--line); overflow: hidden; }
.sxr { border-top: 1px solid var(--line); scroll-margin-top: 190px; transition: background .3s; }
.sxr:first-child { border-top: 0; }
.sxr[hidden] { display: none; }
.sxr__h { display: grid; grid-template-columns: 60px minmax(0, 1.2fr) minmax(0, 1fr) 40px; align-items: center; gap: 16px; width: 100%; padding: 20px 22px; text-align: left; cursor: pointer; }
.sxr__h:hover { background: #FAFBFD; }
.sxr__n { font-family: var(--f-mono); font-size: 12px; color: var(--text-3); }
.sxr__t { font-family: var(--f-display); font-size: clamp(17px, 1.5vw, 20px); font-weight: 600; letter-spacing: -.02em; color: var(--text); }
.sxr__tag { font-size: 14px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sxr__pm { justify-self: end; position: relative; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .3s, border-color .3s, transform .5s var(--ease-out); }
.sxr__pm::before, .sxr__pm::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 1.6px; margin: -.8px 0 0 -6px; background: var(--text); transition: transform .4s var(--ease-out), background .3s; }
.sxr__pm::after { transform: rotate(90deg); }
.sxr.is-open .sxr__pm { background: var(--blue); border-color: var(--blue); transform: rotate(180deg); }
.sxr.is-open .sxr__pm::before, .sxr.is-open .sxr__pm::after { background: #fff; }
.sxr.is-open .sxr__pm::after { transform: rotate(0deg); }
.sxr.is-open { background: linear-gradient(180deg, #F5F8FF, #fff 60%); }
.sxr.is-flash { animation: sxFlash 2s var(--ease); }
@keyframes sxFlash { 0%, 35% { box-shadow: inset 4px 0 0 var(--blue); background: #EEF3FF; } }
.sxr__b { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .55s var(--ease-out); }
.sxr.is-open .sxr__b { grid-template-rows: 1fr; }
.sxr__in { overflow: hidden; }
.sxr__body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, .8fr); gap: 32px; padding: 4px 22px 28px 98px; }
.sxr__body > p { font-size: 16px; line-height: 1.65; color: var(--text-2); }
.sxr__body ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sxr__body li { position: relative; padding-left: 26px; font-size: 14.5px; color: var(--text); }
.sxr__body li::before { content: ""; position: absolute; left: 0; top: 3px; width: 17px; height: 17px; border-radius: 6px; background: #EEF3FF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 8.2 2.2 2.2 4.8-4.8' fill='none' stroke='%232F6BFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.sxr__meta { display: grid; align-content: start; gap: 10px; }
.sxr__meta small { font-family: var(--f-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.sxr__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sxr__chips span { padding: 5px 10px; border-radius: 8px; background: var(--paper-2); font-family: var(--f-mono); font-size: 12px; color: var(--text-2); }
.sxr__cta { display: inline-flex; align-items: center; gap: 8px; justify-self: start; margin-top: 6px; padding: 10px 16px; border-radius: 999px; background: var(--ink-950); color: #fff; font-family: var(--f-label); font-size: 13.5px; font-weight: 600; transition: background .25s; }
.sxr__cta:hover { background: var(--blue); }
.sxr__cta svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sx__empty { margin-top: 36px; padding: 40px; text-align: center; border-radius: 20px; border: 1px dashed var(--line-2); color: var(--text-3); }
.sx__empty[hidden] { display: none; }

/* ---------- ROI ESTIMATOR ---------- */
.roi { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.roi__in, .roi__out { border-radius: 24px; padding: clamp(24px, 3vw, 40px); }
.roi__in { background: rgba(255,255,255,.04); border: 1px solid var(--line-dark-2); display: grid; gap: 26px; }
.roi__f label { display: flex; justify-content: space-between; align-items: baseline; font-family: var(--f-label); font-size: 14.5px; font-weight: 500; color: var(--on-dark-2); margin-bottom: 12px; }
.roi__f output { font-family: var(--f-mono); font-size: 15px; color: #fff; }
.roi__f input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 6px; border-radius: 6px; background: linear-gradient(90deg, var(--teal) var(--p, 50%), rgba(255,255,255,.12) var(--p, 50%)); outline: none; }
.roi__f input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 5px solid var(--teal); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.4); }
.roi__f input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 5px solid var(--teal); cursor: pointer; }
.roi__out { background: linear-gradient(150deg, #0F2D6B, #1A3FA0 55%, #2F6BFF); display: flex; flex-direction: column; }
.roi__out small { font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.roi__big { margin-top: 10px; font-family: var(--f-display); font-size: clamp(48px, 6vw, 84px); font-weight: 600; letter-spacing: -.04em; line-height: 1; color: #fff; font-variant-numeric: tabular-nums; }
.roi__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.2); }
.roi__row strong { display: block; font-family: var(--f-display); font-size: 30px; font-weight: 600; letter-spacing: -.03em; color: #fff; font-variant-numeric: tabular-nums; }
.roi__row span { font-size: 13.5px; color: rgba(255,255,255,.72); }
.roi__out p { margin-top: auto; padding-top: 28px; font-size: 13px; color: rgba(255,255,255,.7); }
.roi__out .btn { margin-top: 18px; align-self: flex-start; }

/* ---------- PROCESS ---------- */
.px { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; padding-top: 34px; }
.px__track { position: absolute; left: 0; right: 0; top: 10px; height: 2px; background: var(--line); }
.px__track i { position: absolute; inset: 0; background: linear-gradient(90deg, var(--blue), var(--teal)); transform-origin: 0 50%; transform: scaleX(var(--prog, 0)); }
.px li { list-style: none; position: relative; }
.px li::before { content: ""; position: absolute; top: -30px; left: 0; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid var(--line-2); transition: background .4s, border-color .4s, box-shadow .4s; }
.px li.is-lit::before { background: var(--blue); border-color: var(--blue); box-shadow: 0 0 0 6px rgba(47,107,255,.15); }
.px small { font-family: var(--f-mono); font-size: 12px; color: var(--text-3); }
.px strong { display: block; margin: 8px 0; font-family: var(--f-display); font-size: 21px; font-weight: 600; letter-spacing: -.02em; }
.px p { font-size: 14.5px; line-height: 1.55; color: var(--text-2); }
.px em { display: inline-block; margin-top: 12px; padding: 4px 10px; border-radius: 999px; background: #EEF3FF; font-style: normal; font-family: var(--f-mono); font-size: 11.5px; color: var(--blue-700); }

/* ---------- GUARDRAILS ---------- */
.gr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.gr__panel { border-radius: 22px; background: linear-gradient(180deg, #10152E, #0A0D1D); border: 1px solid var(--line-dark-2); overflow: hidden; }
.gr__top { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--line-dark); font-family: var(--f-mono); font-size: 12px; color: var(--on-dark-3); }
.gr__top b { color: var(--teal); font-weight: 500; }
.gr__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; padding: 18px 20px; border-bottom: 1px solid var(--line-dark); }
.gr__row:last-child { border-bottom: 0; }
.gr__row strong { display: block; font-family: var(--f-label); font-size: 15px; font-weight: 600; color: #fff; }
.gr__row span { font-size: 13.5px; color: var(--on-dark-2); }
.tg { position: relative; width: 46px; height: 26px; border-radius: 999px; background: rgba(255,255,255,.12); transition: background .4s var(--ease); }
.tg::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .45s var(--ease-out); }
.gr__panel.is-on .tg { background: var(--teal); }
.gr__panel.is-on .tg::after { transform: translateX(20px); }
.gr__panel.is-on .gr__row:nth-child(2) .tg { transition-delay: .1s; } .gr__panel.is-on .gr__row:nth-child(2) .tg::after { transition-delay: .1s; }
.gr__panel.is-on .gr__row:nth-child(3) .tg { transition-delay: .25s; } .gr__panel.is-on .gr__row:nth-child(3) .tg::after { transition-delay: .25s; }
.gr__panel.is-on .gr__row:nth-child(4) .tg { transition-delay: .4s; } .gr__panel.is-on .gr__row:nth-child(4) .tg::after { transition-delay: .4s; }
.gr__panel.is-on .gr__row:nth-child(5) .tg { transition-delay: .55s; } .gr__panel.is-on .gr__row:nth-child(5) .tg::after { transition-delay: .55s; }
.gr__panel.is-on .gr__row:nth-child(6) .tg { transition-delay: .7s; } .gr__panel.is-on .gr__row:nth-child(6) .tg::after { transition-delay: .7s; }
.gr ul { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 12px; }
.gr ul li { display: flex; gap: 12px; font-size: 15.5px; color: var(--on-dark-2); }
.gr ul li b { color: #fff; font-weight: 600; }

/* ---------- INDUSTRIES MARQUEE ---------- */
/* Giant word marquee: grey uppercase names on three rows, alternating direction;
   the name passing the centre of the middle row lights up blue */
.mq { overflow: hidden; padding: 6px 0; -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.mq + .mq { margin-top: clamp(12px, 2.4vw, 40px); }
.mq__t { display: flex; align-items: center; width: max-content; animation: mq var(--dur, 60s) linear infinite; }
.mq--rev .mq__t { animation-direction: reverse; }
@keyframes mq { to { transform: translateX(-50%); } }
.mq__i { display: inline-flex; align-items: center; gap: clamp(28px, 3.4vw, 54px); padding-right: clamp(28px, 3.4vw, 54px); white-space: nowrap; cursor: default; }
.mq__i::before { content: ""; flex: none; width: clamp(9px, .8vw, 13px); height: clamp(9px, .8vw, 13px); border-radius: 50%; background: #8FB1FF; transition: background .5s var(--ease); }
.mq__i strong { font-family: var(--f-display); font-size: clamp(54px, 7.2vw, 108px); font-weight: 700; letter-spacing: -.01em; line-height: 1.05; text-transform: uppercase; color: #D7DAE0; transition: color .6s var(--ease); }
.mq__i:hover strong, .mq__i.is-hot strong { color: #1462D6; }
.mq__i:hover::before, .mq__i.is-hot::before { background: #1462D6; }
.x-ind { background: #F6F7F9; }

/* ---------- FAQ ---------- */
.fq { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); }
.fq details { border-bottom: 1px solid var(--line); }
.fq details:first-of-type { border-top: 1px solid var(--line); }
.fq summary { display: grid; grid-template-columns: minmax(0, 1fr) 32px; gap: 20px; align-items: center; padding: 22px 0; cursor: pointer; list-style: none; font-family: var(--f-display); font-size: clamp(18px, 1.5vw, 21px); font-weight: 600; letter-spacing: -.02em; }
.fq summary::-webkit-details-marker { display: none; }
.fq summary::after { content: "+"; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--line-2); font-family: var(--f-label); font-weight: 400; font-size: 20px; transition: transform .4s var(--ease-out), background .3s, color .3s; }
.fq details[open] summary::after { transform: rotate(45deg); background: var(--ink-950); color: #fff; border-color: var(--ink-950); }
.fq details p { padding: 0 52px 24px 0; font-size: 16px; line-height: 1.65; color: var(--text-2); }

/* ---------- CONVERSATIONAL ENQUIRY ---------- */
.cv { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(32px, 5vw, 80px); }
.cv__form { font-family: var(--f-display); font-size: clamp(24px, 2.6vw, 38px); font-weight: 500; letter-spacing: -.025em; line-height: 1.75; color: #fff; }
.cv__form .f { display: inline-block; position: relative; }
.cv__form input, .cv__form select { display: inline-block; min-width: 0; padding: 0 4px; border: 0; border-bottom: 2px solid rgba(94,242,225,.45); background: transparent; color: var(--teal); font: inherit; letter-spacing: inherit; border-radius: 0; transition: border-color .25s; }
.cv__form input::placeholder { color: rgba(163,172,207,.5); }
.cv__form select { cursor: pointer; max-width: 100%; }
.cv__form select option { color: #000; font-size: 16px; }
.cv__form input:focus, .cv__form select:focus { outline: none; border-bottom-color: var(--teal); }
.cv__form .is-bad { border-bottom-color: #FB7185; }
.cv__form .w-name { width: 7.5em; } .cv__form .w-co { width: 8em; } .cv__form .w-pain { width: 100%; } .cv__form .w-mail { width: 10.5em; } .cv__form .w-ph { width: 7em; }
.cv__send { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 34px; font-family: var(--f-body); }
.cv__send p { font-size: 14px; letter-spacing: 0; line-height: 1.5; color: var(--on-dark-3); }
.cv__ok { font-family: var(--f-body); font-size: 16px; letter-spacing: 0; color: var(--teal); }
.cv__ok[hidden] { display: none; }
.cv__side { display: grid; align-content: start; gap: 2px; }
.cv__side a, .cv__side div { display: grid; gap: 4px; padding: 18px 0; border-bottom: 1px solid var(--line-dark); }
.cv__side small { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--on-dark-3); }
.cv__side strong { font-family: var(--f-label); font-size: 17px; font-weight: 600; color: #fff; }
.cv__side a:hover strong { color: var(--teal); }

@media (max-width: 1080px) {
  .x-hero__grid, .x-head, .gr, .fq, .cv, .roi { grid-template-columns: minmax(0, 1fr); }
  .ba { grid-template-columns: minmax(0, 1fr); }
  .ba__arrow { padding: 10px 0; transform: rotate(90deg); }
  .px { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 48px; }
  .px__track { display: none; }
  .px li::before { top: -24px; }
  .sxr__body { grid-template-columns: minmax(0, 1fr); padding-left: 22px; gap: 18px; }
  .sx__ghead p { display: none; }
}
@media (max-width: 680px) {
  .sxr__h { grid-template-columns: 44px minmax(0, 1fr) 34px; }
  .sxr__tag { display: none; }
  .sx__tools { position: static; }
  .sx__search { flex-basis: 100%; }
  .wf__log li { grid-template-columns: 62px 80px minmax(0, 1fr); font-size: 11px; }
  .roi__row { grid-template-columns: minmax(0, 1fr); }
  .px { grid-template-columns: minmax(0, 1fr); }
  .cv__form .w-name, .cv__form .w-co, .cv__form .w-mail, .cv__form .w-ph { width: 100%; }
}

/* ==========================================================================
   AI Capabilities pages — AI Automation, AI Consulting, AI Integration, Artificial Intelligence Services,
   Document AI and Enterprise AI Copilots. Six hidden <main class="acp"> pages share one template that the
   script near the end of this file fills from its data. Section order follows appinventiv.com/ai-consulting-services,
   drawn in Pyzen's theme (inset dark panels, Inter Tight headings, serif italic emphasis).
   ========================================================================== */
.acp { --rule: 1px solid var(--line); background: var(--paper); }
.acp .ac-sec { padding: clamp(80px, 9vw, 130px) 0; position: relative; }
.acp .ac-sec--soft { background: #F6F7F9; }
.acp .x-head { margin-bottom: clamp(36px, 4.5vw, 56px); }
.ac-ic { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 14px; background: #EEF4FF; color: var(--blue-700); }
.ac-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Hero: dark inset panel over a photo ---------- */
.ac-hero { position: relative; isolation: isolate; overflow: hidden; margin: 0; border-radius: 0; background: var(--ink-950); color: #fff; padding: calc(var(--header-h) + clamp(64px, 8vw, 120px)) 0 clamp(40px, 5vw, 64px); }
.ac-hero__bg { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; opacity: .5; transform: scale(1.04); animation: acZoom 18s var(--ease) both; }
@keyframes acZoom { from { transform: scale(1.12); } }
.ac-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(5,6,13,.94) 0%, rgba(5,6,13,.72) 45%, rgba(5,6,13,.35) 100%), linear-gradient(0deg, rgba(5,6,13,.9) 0%, rgba(5,6,13,0) 55%); }
.ac-hero::after { content: ""; position: absolute; z-index: -1; right: -12%; top: -35%; width: 820px; height: 820px; background: radial-gradient(closest-side, rgba(47,107,255,.3), rgba(123,108,255,.12) 45%, transparent 72%); }
.ac-hero .x-crumbs { color: rgba(255,255,255,.6); margin-bottom: 30px; flex-wrap: wrap; }
.ac-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); }
.ac-hero .x-k { color: var(--teal); margin-bottom: 20px; }
.ac-hero h1 { max-width: 14ch; font-size: clamp(42px, 5.4vw, 80px); line-height: 1; letter-spacing: -.045em; color: #fff; }
.ac-hero h1 em { color: var(--teal); }
.ac-hero__lead { margin-top: 26px; max-width: 560px; font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.65; color: rgba(238,241,255,.8); }
.ac-hero .x-hero__ctas { margin-top: 38px; }

/* ---------- Trusted by: client logo strip (on the same #0f0f0f band as core capabilities, as on appinventiv.com) ---------- */
.ac-trust { padding: clamp(44px, 5vw, 64px) 0 0; background: var(--ink-950); }
.ac-trust p { text-align: center; font-family: var(--f-label); font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #a3a3a3; }
.ac-trust--light { background: transparent; }
.ac-trust--light p { color: var(--text-3); }
.ac-marq { position: relative; overflow: hidden; margin-top: 26px; -webkit-mask: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.ac-marq__t { display: flex; width: max-content; gap: 16px; animation: acMarq 46s linear infinite; }
.ac-marq:hover .ac-marq__t { animation-play-state: paused; }
.ac-marq__t span { display: grid; place-items: center; width: 180px; height: 84px; padding: 16px 22px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.ac-marq__t img { max-height: 40px; max-width: 130px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter .3s, opacity .3s; }
.ac-marq__t span:hover img { filter: none; opacity: 1; }
@keyframes acMarq { to { transform: translateX(-50%); } }

/* ---------- Core capabilities: a row of bordered cards on #0f0f0f; the hovered card turns blue, rounds and scales up
   (same values as appinventiv.com/ai-services-and-solutions) ---------- */
.acp .ac-core { overflow-x: clip; isolation: isolate; background: var(--ink-950); color: var(--on-dark); padding-top: clamp(64px, 7vw, 100px); }
.acp .ac-core::before { content: ""; position: absolute; z-index: -1; left: 50%; bottom: -30%; width: min(1100px, 120%); height: 70%; transform: translateX(-50%); background: radial-gradient(closest-side, rgba(47,107,255,.18), rgba(123,108,255,.06) 60%, transparent); pointer-events: none; }
.ac-core .x-h2 { color: #fff; }
.ac-core .x-h2 em { color: var(--teal); }
.ac-core .x-k { color: var(--teal); }
.ac-core .x-lead { color: var(--on-dark-2); }
.ac-caps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; list-style: none; margin: 0; padding: 12px 0 0; }
.ac-caps li { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; justify-content: space-between; gap: 36px; min-height: 300px; padding: 26px 22px 28px; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.01)); cursor: default; transition: transform .6s var(--ease-out), border-color .4s, box-shadow .6s var(--ease-out); }
.ac-caps li::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(130% 90% at 50% 110%, rgba(47,107,255,.55), rgba(123,108,255,.18) 55%, transparent 80%); opacity: 0; transition: opacity .5s var(--ease); }
.ac-caps li::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--grad); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.ac-caps li:hover { transform: translateY(-8px); border-color: rgba(94,242,225,.35); box-shadow: 0 36px 60px -36px rgba(47,107,255,.65); }
.ac-caps li:hover::before { opacity: 1; }
.ac-caps li:hover::after { transform: none; }
.ac-caps__ic { display: block; }
.ac-caps__ic svg { display: block; width: 34px; height: 34px; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .5s var(--ease-out); }
.ac-caps li:hover .ac-caps__ic svg { transform: translateY(-4px); }
.ac-caps strong { display: block; font-family: var(--f-display); font-size: 18.5px; line-height: 1.3; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.ac-caps div span { display: block; margin-top: 10px; font-size: 14px; line-height: 1.6; color: var(--on-dark-2); transition: color .4s; }
.ac-caps li:hover div span { color: rgba(238,241,255,.9); }

/* ---------- Services: vertical tabs with a detail panel ---------- */
/* Service tabs in a row: the chosen tab's underline draws across, then copy rises in and the photo wipes open
   (after kyndryl.com/in/en/consulting) */
.ac-svc__tabs { display: flex; align-items: stretch; border-bottom: 1px solid var(--line-2); }
.ac-svc__tabs button { position: relative; flex: none; max-width: 220px; padding: 0 18px 16px; text-align: left; text-wrap: balance; font-family: var(--f-display); font-size: 16.5px; font-weight: 500; line-height: 1.3; letter-spacing: -.015em; color: var(--text-3); transition: color .3s; }
.ac-svc__tabs button:first-child { padding-left: 0; }
.ac-svc__tabs button::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: -1px; height: 2px; background: var(--blue-700); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.ac-svc__tabs button:first-child::after { left: 0; }
.ac-svc__tabs button:hover { color: var(--text); }
.ac-svc__tabs button[aria-selected="true"] { color: var(--text); font-weight: 700; }
.ac-svc__tabs button[aria-selected="true"]::after { transform: none; }
.ac-svc__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: center; padding-top: clamp(32px, 4vw, 52px); }
.ac-svc__panel[hidden] { display: none; }
.ac-svc__copy > * { opacity: 0; transform: translateY(18px); }
.ac-svc__panel.is-in .ac-svc__copy > * { animation: acSvcUp .7s var(--ease-out) forwards; }
.ac-svc__panel.is-in .ac-svc__copy > :nth-child(2) { animation-delay: .08s; }
.ac-svc__panel.is-in .ac-svc__copy > :nth-child(3) { animation-delay: .16s; }
.ac-svc__panel.is-in .ac-svc__copy > :nth-child(4) { animation-delay: .22s; }
.ac-svc__panel.is-in .ac-svc__copy > :nth-child(5) { animation-delay: .3s; }
@keyframes acSvcUp { to { opacity: 1; transform: none; } }
.ac-svc__copy h3 { font-size: clamp(28px, 2.8vw, 42px); line-height: 1.08; letter-spacing: -.035em; }
.ac-svc__copy > p { margin-top: 16px; max-width: 520px; font-size: 17px; line-height: 1.65; color: var(--text-2); }
.ac-svc__rule { display: block; width: 100px; height: 2px; margin-top: 26px; background: var(--grad); }
.ac-svc__panel.is-in .ac-svc__rule { animation-name: acSvcRule; }
@keyframes acSvcRule { from { opacity: 1; transform: none; width: 0; } to { opacity: 1; transform: none; width: 100px; } }
.ac-svc__copy ul { list-style: none; margin: 24px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; }
.ac-svc__copy li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; font-size: 15px; line-height: 1.5; color: var(--text); }
.ac-svc__copy li svg { width: 20px; height: 20px; margin-top: 1px; fill: none; stroke: var(--blue); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ac-svc__copy .btn { margin-top: 32px; }
.ac-svc__media { position: relative; margin: 0; aspect-ratio: 16 / 11; overflow: hidden; border-radius: var(--r-lg); background: var(--ink-850); box-shadow: 0 40px 80px -50px rgba(10,12,24,.55); }
.ac-svc__media img { width: 100%; height: 100%; object-fit: cover; }
.ac-svc__panel.is-in .ac-svc__media { animation: acSvcWipe 1s var(--ease-out) both; }
.ac-svc__panel.is-in .ac-svc__media img { animation: acSvcZoom 1.6s var(--ease-out) both; }
@keyframes acSvcWipe { from { clip-path: inset(0 0 0 100% round var(--r-lg)); } to { clip-path: inset(0 0 0 0 round var(--r-lg)); } }
@keyframes acSvcZoom { from { transform: scale(1.14); } }
.ac-svc__media figcaption { position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 12px; padding: 8px 18px 8px 8px; border-radius: 999px; background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-family: var(--f-label); font-size: 14px; font-weight: 600; box-shadow: 0 16px 30px -18px rgba(10,12,24,.5); }
.ac-svc__media figcaption .ac-ic { width: 36px; height: 36px; border-radius: 50%; }
.ac-svc__media figcaption .ac-ic svg { width: 18px; height: 18px; }
.ac-svc__panel.is-in figcaption { animation: acPanel .7s var(--ease-out) .45s both; }
@keyframes acPanel { from { opacity: 0; transform: translateY(14px); } }

/* ---------- CTA band ---------- */
.ac-band { position: relative; overflow: hidden; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px 48px; align-items: center; padding: clamp(36px, 5vw, 64px); border-radius: var(--r-xl); background: linear-gradient(115deg, #0D1A4A 0%, #1742C0 52%, #2F6BFF 100%); color: #fff; }
.ac-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size: 48px 48px; -webkit-mask: radial-gradient(ellipse 60% 90% at 85% 50%, #000 20%, transparent 75%); mask: radial-gradient(ellipse 60% 90% at 85% 50%, #000 20%, transparent 75%); }
.ac-band h2 { font-size: clamp(28px, 3vw, 44px); line-height: 1.08; letter-spacing: -.04em; color: #fff; }
.ac-band h2 em { color: var(--teal); }
.ac-band p { margin-top: 12px; max-width: 620px; font-size: 16.5px; line-height: 1.6; color: rgba(238,241,255,.82); }
.ac-band--alt { background: linear-gradient(115deg, #05060D 0%, #151A36 60%, #2A2470 100%); }

/* ---------- Industries: use-case cards ---------- */
.ac-ind { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ac-ind article { display: flex; flex-direction: column; gap: 14px; padding: 26px 24px; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); transition: transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.ac-ind article:hover { transform: translateY(-5px); border-color: rgba(47,107,255,.3); box-shadow: 0 30px 56px -40px rgba(10,12,24,.5); }
.ac-ind h3 { margin-top: 6px; font-size: 19px; letter-spacing: -.025em; }
.ac-ind p { font-size: 14.5px; line-height: 1.6; color: var(--text-2); }

/* ---------- Success stories: home page case studies in a swipeable row ---------- */
.ac-cases { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, calc((100% - 40px) / 3)); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; scrollbar-width: thin; }
.ac-cases .ab-case { scroll-snap-align: start; }
.ab-case { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--r-lg); background: #fff; border: var(--rule); transition: transform .5s var(--ease-out), box-shadow .5s; }
.ab-case:hover { transform: translateY(-6px); box-shadow: 0 34px 60px -40px rgba(11,18,32,.5); }
.ab-case__media { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: var(--paper-2); }
.ab-case__media > img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.ab-case:hover .ab-case__media > img { transform: scale(1.06); }
.ab-case__logo { position: absolute; left: 16px; bottom: 16px; display: grid; place-items: center; height: 52px; padding: 8px 14px; border-radius: 12px; background: rgba(255,255,255,.95); box-shadow: 0 10px 24px -14px rgba(11,18,32,.5); }
.ab-case__logo img { display: block; max-height: 34px; max-width: 130px; width: auto; object-fit: contain; }
.ab-case__body { display: flex; flex: 1; flex-direction: column; padding: 24px; }
.ab-case__tag { font-family: var(--f-label); font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); }
.ab-case h3 { margin-top: 10px; font-size: 22px; line-height: 1.2; letter-spacing: -.025em; }
.ab-case p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--text-2); }
.ab-case a { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 20px; font-family: var(--f-label); font-size: 14.5px; font-weight: 600; color: var(--blue-700); }
.ab-case a svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--ease-out); }
.ab-case a:hover svg { transform: translateX(4px); }
.ac-cases__nav { display: flex; gap: 8px; }
.ac-cases__nav button { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .25s, color .25s; cursor: pointer; }
.ac-cases__nav button:hover { background: var(--ink-950); color: #fff; }
.ac-cases__nav svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- Why Pyzen ---------- */
.ac-why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; border-radius: var(--r-lg); background: var(--line-dark); border: 1px solid var(--line-dark); }
.ac-why article { padding: clamp(26px, 3vw, 40px); background: var(--ink-950); transition: background .35s; }
.ac-why article:hover { background: #0D1022; }
.ac-why .ac-ic { background: rgba(94,242,225,.1); color: var(--teal); }
.ac-why h3 { margin-top: 24px; font-size: 21px; letter-spacing: -.025em; color: #fff; }
.ac-why p { margin-top: 10px; font-size: 15px; line-height: 1.65; color: var(--on-dark-2); }

/* ---------- Roadmap: timeline that fills as you scroll ---------- */
.ac-road { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.ac-road__copy { position: sticky; top: calc(var(--header-h) + 90px); }
.ac-road__copy .x-lead { margin-top: 22px; }
.ac-steps { position: relative; list-style: none; margin: 0; padding: 0 0 0 44px; }
.ac-steps::before, .ac-steps__fill { content: ""; position: absolute; left: 11px; top: 8px; bottom: 8px; width: 2px; border-radius: 2px; background: var(--line); }
.ac-steps__fill { background: linear-gradient(var(--blue), var(--violet), var(--teal)); transform: scaleY(0); transform-origin: 50% 0; }
.ac-steps li { position: relative; padding: 0 0 38px; }
.ac-steps li:last-child { padding-bottom: 0; }
.ac-steps li::before { content: ""; position: absolute; left: -41px; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--line-2); transition: border-color .4s, background .4s, box-shadow .4s; }
.ac-steps li.is-on::before { border-color: var(--blue); background: var(--blue); box-shadow: 0 0 0 6px rgba(47,107,255,.14); }
.ac-steps strong { display: block; font-family: var(--f-display); font-size: clamp(20px, 1.8vw, 24px); font-weight: 600; letter-spacing: -.03em; line-height: 1.2; }
.ac-steps p { margin-top: 8px; max-width: 560px; font-size: 15.5px; line-height: 1.65; color: var(--text-2); }

/* ---------- Engagement options (AI Automation): photo slider with the next slide peeking in at the edge; the arrows,
   a swipe or a click on the peeking photo slide the track, then the copy rises in (after valtech.com) ---------- */
.ac-eng { overflow: hidden; }
.ac-eng__track { --peek: 110px; --gap: 28px; display: flex; gap: var(--gap); transform: translateX(calc(var(--i, 0) * (var(--peek) - var(--gap) - 100%))); transition: transform 1s var(--ease-out); touch-action: pan-y; }
.ac-eng__slide { flex: none; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 3vw, 44px); width: calc(100% - var(--peek)); height: clamp(460px, 46vw, 600px); }
.ac-eng__slide:not(.is-on) { cursor: pointer; }
.ac-eng__media { position: relative; overflow: hidden; margin: 0; background: var(--paper-2); }
.ac-eng__media img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.4s var(--ease-out); }
.ac-eng__slide.is-on .ac-eng__media img { transform: none; }
.ac-eng__pic { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 120px; height: 120px; border-radius: 50%; background: rgba(5,6,13,.82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-family: var(--f-label); font-size: 16px; font-weight: 500; opacity: 0; transform: translate(-50%, -50%) scale(.6); transition: opacity .35s, transform .5s var(--ease-out); }
.ac-eng__slide.is-on .ac-eng__media:hover .ac-eng__pic { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.ac-eng__content { display: flex; flex-direction: column; justify-content: space-between; padding-top: 8px; }
.ac-eng__content > div > * { opacity: 0; transform: translateY(26px); transition: opacity .5s, transform .8s var(--ease-out); }
.ac-eng__slide.is-on .ac-eng__content > div > * { opacity: 1; transform: none; transition-delay: .35s; }
.ac-eng__slide.is-on .ac-eng__content > div > :nth-child(2) { transition-delay: .45s; }
.ac-eng__slide.is-on .ac-eng__content > div > :nth-child(3) { transition-delay: .55s; }
.ac-eng__pre { display: block; font-family: var(--f-label); font-size: 20px; color: var(--text-2); }
.ac-eng__content h3 { margin-top: 6px; font-size: clamp(44px, 5.2vw, 80px); font-weight: 400; line-height: 1; letter-spacing: -.035em; }
.ac-eng__content p { max-width: 520px; font-family: var(--f-label); font-size: clamp(19px, 1.8vw, 27px); font-weight: 400; line-height: 1.45; color: var(--text); }
.ac-eng__content small { display: block; margin-top: 14px; font-family: var(--f-mono); font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--blue-700); }
.ac-eng__row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 30px; }
.ac-eng__arrows { display: flex; gap: 22px; }
.ac-eng__arrows button { display: grid; place-items: center; width: 52px; height: 40px; color: var(--text); transition: transform .35s var(--ease-out), color .3s; }
.ac-eng__arrows button:first-child:hover { transform: translateX(-5px); color: var(--blue-700); }
.ac-eng__arrows button:last-child:hover { transform: translateX(5px); color: var(--blue-700); }
.ac-eng__arrows svg { width: 40px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 760px) {
  .ac-eng__track { --peek: 36px; --gap: 16px; }
  .ac-eng__slide { grid-template-columns: minmax(0, 1fr); grid-template-rows: 300px auto; height: auto; gap: 22px; }
  .ac-eng__content p { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .ac-eng__track, .ac-eng__media img, .ac-eng__content > div > * { transition: none; }
}

/* ---------- Engagement models ---------- */
.ac-models { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ac-models article { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 28px 24px; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); }
.ac-models article::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--grad); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.ac-models article:hover::after { transform: none; }
.ac-models h3 { margin-top: 22px; font-size: 20px; letter-spacing: -.025em; }
.ac-models p { margin-top: 10px; font-size: 14.5px; line-height: 1.6; color: var(--text-2); }
.ac-models small { margin-top: auto; padding-top: 18px; font-family: var(--f-label); font-size: 12.5px; font-weight: 600; color: var(--blue-700); }

/* ---------- Technology stack ---------- */
.ac-tech__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.ac-tech__tabs button { height: 42px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--line-2); font-family: var(--f-label); font-size: 14px; font-weight: 500; color: var(--text-2); transition: background .25s, color .25s, border-color .25s; }
.ac-tech__tabs button[aria-selected="true"] { background: var(--ink-950); border-color: var(--ink-950); color: #fff; }
.ac-tech__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.ac-tech__grid[hidden] { display: none; }
.ac-tech__grid span { display: flex; align-items: center; gap: 12px; height: 64px; padding: 0 18px; border-radius: 14px; background: #fff; border: 1px solid var(--line); font-family: var(--f-label); font-size: 14.5px; font-weight: 600; color: var(--text); animation: acPanel .5s var(--ease-out) both; }
.ac-tech__grid span i { flex: none; width: 10px; height: 10px; border-radius: 3px; background: var(--grad); }

/* ---------- Compliance frameworks ---------- */
.ac-comp { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ac-comp div { padding: 22px; border-radius: var(--r-md); border: 1px solid var(--line); background: #fff; }
.ac-comp strong { display: flex; align-items: center; gap: 10px; font-family: var(--f-display); font-size: 17px; font-weight: 600; letter-spacing: -.02em; }
.ac-comp strong svg { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--blue); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ac-comp p { margin-top: 8px; font-size: 14px; line-height: 1.55; color: var(--text-2); }

/* ---------- Related capabilities ---------- */
.ac-rel { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.ac-rel a { display: flex; flex-direction: column; gap: 14px; padding: 24px 22px; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); transition: transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.ac-rel a:hover { transform: translateY(-5px); border-color: rgba(47,107,255,.35); box-shadow: 0 30px 56px -40px rgba(10,12,24,.5); }
.ac-rel strong { font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.02em; line-height: 1.2; }
.ac-rel span { font-size: 14px; line-height: 1.55; color: var(--text-2); }
.ac-rel em { margin-top: auto; font-family: var(--f-label); font-style: normal; font-size: 14px; font-weight: 600; color: var(--blue-700); }

/* reveal */
.js .acp .ac-rv, .js .acp .ac-rv { opacity: 1 !important; transform: none !important; }
.js .acp .ac-rv.is-in { opacity: 1 !important; transform: none !important; }

@media (max-width: 1080px) {
  .ac-svc__panel, .ac-road { grid-template-columns: minmax(0, 1fr); }
  .ac-svc__media { order: -1; }
  .ac-road__copy { position: static; }
  .ac-caps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ac-caps li { min-height: 260px; }
  .ac-ind, .ac-models, .ac-comp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-why { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac-rel { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ac-svc__tabs { overflow-x: auto; scrollbar-width: none; scroll-snap-type: x mandatory; }
  .ac-svc__tabs::-webkit-scrollbar { display: none; }
  .ac-svc__tabs button { scroll-snap-align: start; }
}
@media (max-width: 680px) {
  .ac-caps, .ac-ind, .ac-models, .ac-comp, .ac-why, .ac-rel, .ac-svc__copy ul { grid-template-columns: minmax(0, 1fr); }
  .ac-caps li { min-height: 0; gap: 26px; padding: 24px 22px; }
  .ac-band { grid-template-columns: minmax(0, 1fr); }
  .ac-cases { grid-auto-columns: 86%; }
  .ac-marq__t span { width: 140px; height: 70px; }
}
@media (prefers-reduced-motion: reduce) {
  .ac-hero__bg, .ac-marq__t { animation: none; }
  .ac-caps li { transition: none; }
  .ac-svc__copy > *, .ac-svc__panel.is-in .ac-svc__copy > *, .ac-svc__panel.is-in .ac-svc__media, .ac-svc__panel.is-in .ac-svc__media img, .ac-svc__panel.is-in figcaption { opacity: 1; transform: none; animation: none; }
}

/* ==========================================================================
   AI capability pages — one layout per topic. AI Automation keeps the shared template above; the other topics are
   composed from their own components: kc- AI Consulting (warm editorial), ki- AI Integration (technical, dark),
   ka- Artificial Intelligence Services (aurora), kd- Document AI (clean mint), kp- Enterprise AI Copilots (lavender).
   k- components are shared between layouts.
   ========================================================================== */
.acp [hidden] { display: none !important; }

/* AI capability heroes with a background video: the video fills the hero under a dark shade, and light heroes
   (Consulting, Document AI, Copilots) switch to white text. */
.k-vidhero { position: relative; isolation: isolate; overflow: hidden; background: #05060D !important; color: #fff; }
.k-vid { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; }
.k-vidcredit { position: absolute; right: 16px; bottom: 12px; z-index: 2; font-family: var(--f-label); font-size: 11.5px; color: rgba(255,255,255,.55); transition: color .25s; }
.k-vidcredit:hover { color: #fff; }
/* Video heroes stay bright: only a soft fade behind the copy on the left and along the bottom edge */
.k-vidshade { position: absolute; inset: 0; z-index: -2; background: var(--hero-shade); pointer-events: none; }
.ac-hero.k-vidhero::before { background: var(--hero-shade); }
.k-vidhero h1, .k-vidhero h1 + p, .k-vidhero [class$="__lead"], .hero.vshow h1, .hero.vshow .hero__copy p, .vh h1, .vh__lead { text-shadow: 0 2px 24px rgba(0,0,0,.45); }
.ac-hero.k-vidhero .ac-hero__bg, .ac-hero.k-vidhero .k-vidshade, .ka-hero.k-vidhero .k-vidshade { display: none; }
.kc-hero.k-vidhero::before { display: none; }
.ka-hero.k-vidhero .ka-hero__aurora { opacity: .35; }
.ka-hero.k-vidhero::after { background: var(--hero-shade); }
.acp .k-vidhero h1 { color: #fff; }
.acp .k-vidhero h1 em { color: var(--teal); }
.acp .k-vidhero .x-crumbs { color: rgba(255,255,255,.62); }
.acp .k-vidhero .x-crumbs a:hover { color: #fff; }
.acp .k-vidhero .x-k { color: var(--teal); }
.acp .k-vidhero .kc-hero__lead, .acp .k-vidhero .kd-hero__lead, .acp .k-vidhero .kp-hero__lead { color: rgba(238,241,255,.82); }
.k-vidhero .btn--primary { --btn-fill: #fff; --btn-fg-h: var(--text); }
:where(.acp) :where(svg[viewBox="0 0 24 24"], svg[viewBox="0 0 20 20"]) { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.k-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.k-sec { position: relative; padding: clamp(80px, 9vw, 130px) 0; }
.k-sec--tight { padding: clamp(40px, 5vw, 64px) 0; }
.k-sec--paper2 { background: #F6F7F9; }
.k-dark { background: var(--ink-950); color: var(--on-dark); }
.k-dark .x-h2 { color: #fff; }
.k-dark .x-h2 em { color: var(--teal); }
.k-dark .x-k { color: var(--teal); }
.k-dark .x-lead { color: var(--on-dark-2); }
.k-dark .ac-cases__nav button { border-color: var(--line-dark-2); color: #fff; }
.k-dark .ac-cases__nav button:hover { background: #fff; color: var(--ink-950); }
.k-link { color: var(--blue); font-weight: 600; }
.k-ctrl { display: grid; gap: 22px; justify-items: start; }
.k-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.k-chips > span:first-child { width: 100%; margin-bottom: 2px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.k-chips > span + span { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; font-family: var(--f-label); font-size: 13px; font-weight: 500; color: var(--text-2); }
.k-ticks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.k-ticks li { display: flex; gap: 10px; font-size: 15px; line-height: 1.5; }
.k-ticks svg { flex: none; width: 18px; height: 18px; margin-top: 1px; stroke-width: 2.2; color: var(--k-tick, var(--blue)); }
.k-progress { height: 2px; margin-top: 26px; border-radius: 2px; overflow: hidden; background: var(--line-dark-2); }
.k-progress i, .k-stepper__bar i { display: block; width: 100%; height: 100%; background: var(--grad); transform: scaleX(.1); transform-origin: 0 50%; transition: transform .3s; }
.is-drag { scroll-snap-type: none !important; cursor: grabbing !important; user-select: none; }

/* Shared: hover-fill list rows */
.k-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.k-rows a { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 48px minmax(0, .9fr) minmax(0, 1.1fr) 44px; gap: 24px; align-items: center; padding: 26px 8px; border-bottom: 1px solid var(--line); color: var(--text); transition: color .4s, padding .5s var(--ease-out); }
.k-rows a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink-950); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .5s var(--ease-out); }
.k-rows a:hover, .k-rows a:focus-visible { color: #fff; padding-left: 24px; padding-right: 24px; }
.k-rows a:hover::before, .k-rows a:focus-visible::before { transform: none; }
.k-rows__ic svg { display: block; width: 28px; height: 28px; stroke-width: 1.5; }
.k-rows strong { font-family: var(--f-display); font-size: clamp(22px, 2.4vw, 34px); font-weight: 600; letter-spacing: -.035em; line-height: 1.1; }
.k-rows__d { font-size: 15.5px; line-height: 1.6; color: var(--text-2); transition: color .4s; }
.k-rows a:hover .k-rows__d, .k-rows a:focus-visible .k-rows__d { color: var(--on-dark-2); }
.k-rows__go { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .4s, border-color .4s, color .4s, transform .5s var(--ease-out); }
.k-rows__go svg { width: 18px; height: 18px; stroke-width: 1.9; }
.k-rows a:hover .k-rows__go { background: var(--teal); border-color: var(--teal); color: var(--ink-950); transform: rotate(-45deg); }

/* Shared: horizontal expanding accordion */
.k-hacc { display: flex; gap: 10px; height: 540px; }
.k-hacc__p { position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; border-radius: 24px; background: linear-gradient(165deg, var(--c1), var(--c2)); color: #fff; transition: flex-grow .8s var(--ease-out); }
.k-hacc__p:nth-child(1) { --c1: #1742C0; --c2: #0D1A4A; }
.k-hacc__p:nth-child(2) { --c1: #5B4FE0; --c2: #1A1442; }
.k-hacc__p:nth-child(3) { --c1: #1F55E6; --c2: #05060D; }
.k-hacc__p:nth-child(4) { --c1: #0E7C86; --c2: #062A33; }
.k-hacc__p:nth-child(5) { --c1: #4B3BC9; --c2: #0D1022; }
.k-hacc__p:nth-child(6) { --c1: #2F6BFF; --c2: #151A36; }
.k-hacc__p.is-on { flex-grow: 5.5; }
.k-hacc__p::after { content: ""; position: absolute; right: -20%; top: -20%; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,255,255,.18), transparent); pointer-events: none; }
.k-hacc__tab { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 24px 10px; color: #fff; text-align: left; }
.k-hacc__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: rgba(255,255,255,.14); }
.k-hacc__ic svg { width: 22px; height: 22px; }
.k-hacc__t { writing-mode: vertical-rl; transform: rotate(180deg); font-family: var(--f-display); font-size: 19px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; transition: opacity .3s; }
.k-hacc__p.is-on .k-hacc__tab { pointer-events: none; align-items: flex-start; padding: 32px; }
.k-hacc__p.is-on .k-hacc__t { opacity: 0; }
.k-hacc__body { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; gap: 16px; min-width: 460px; padding: clamp(28px, 3vw, 40px); opacity: 0; visibility: hidden; transform: translateY(16px); transition: opacity .3s, transform .5s var(--ease-out), visibility 0s .3s; --k-tick: var(--teal); }
.k-hacc__p.is-on .k-hacc__body { opacity: 1; visibility: visible; transform: none; transition: opacity .5s .3s, transform .7s var(--ease-out) .3s, visibility 0s; }
.k-hacc__body h3 { font-size: clamp(26px, 2.6vw, 36px); letter-spacing: -.035em; color: #fff; }
.k-hacc__body > p { max-width: 520px; font-size: 16px; line-height: 1.6; color: rgba(238,241,255,.82); }
.k-hacc__body .k-ticks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.18); }
.k-hacc__body .btn { align-self: flex-start; margin-top: 8px; }

/* Shared: comparison table */
.k-compare { overflow: hidden; border-radius: 24px; border: 1px solid var(--line); background: #fff; }
.k-compare__row { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.k-compare__row + .k-compare__row > * { border-top: 1px solid var(--line); }
.k-compare__row--h span { padding: 18px 28px; font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); background: #F6F7F9; }
.k-compare__row--h span + span { background: var(--ink-950); color: var(--teal); }
.k-compare__no, .k-compare__yes { display: flex; gap: 14px; padding: 24px 28px; font-size: 15px; line-height: 1.6; }
.k-compare__no { background: #FAFAFB; color: var(--text-3); }
.k-compare__yes { background: var(--ink-950); color: var(--on-dark-2); transition: background .3s; }
.k-compare__row + .k-compare__row > .k-compare__yes { border-top-color: var(--line-dark); }
.k-compare__row:hover .k-compare__yes { background: #0D1022; }
.k-compare i { flex: none; margin-top: 3px; }
.k-compare i svg { display: block; width: 18px; height: 18px; stroke-width: 2.2; }
.k-compare__no i { color: #D0455B; }
.k-compare__yes i { color: var(--teal); }
.k-compare__yes strong { display: block; margin-bottom: 4px; font-family: var(--f-display); font-size: 17.5px; font-weight: 600; letter-spacing: -.02em; color: #fff; }

/* Shared: draggable stepper */
.k-stepper__bar { height: 2px; margin-bottom: 30px; border-radius: 2px; overflow: hidden; background: var(--line); }
.k-stepper__track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, calc((100% - 72px) / 4)); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; list-style: none; margin: 0; padding: 0 0 6px; cursor: grab; }
.k-stepper__track::-webkit-scrollbar { display: none; }
.k-stepper__track li { position: relative; scroll-snap-align: start; padding: 30px 26px; border-radius: 22px; background: #fff; border: 1px solid var(--line); }
.k-stepper__track li:not(:last-child)::after { content: ""; position: absolute; top: 37px; left: 56px; right: -24px; border-top: 1px dashed var(--line-2); }
.k-stepper__dot { display: block; width: 14px; height: 14px; margin-bottom: 26px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 6px rgba(47,107,255,.14); }
.k-stepper h3 { font-size: 20px; letter-spacing: -.025em; }
.k-stepper p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--text-2); }

/* Shared: pricing-style tiers */
.k-tiers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.k-tiers article { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 30px 26px; border-radius: 24px; background: #fff; border: 1px solid var(--line); }
.k-tiers article.is-pick { background: var(--ink-950); border-color: var(--ink-950); color: #fff; box-shadow: 0 40px 70px -40px rgba(47,107,255,.6); }
.k-tiers h3 { margin-top: 10px; font-size: 21px; letter-spacing: -.025em; }
.k-tiers p { font-size: 15px; line-height: 1.6; color: var(--text-2); }
.k-tiers small { margin-top: auto; padding-top: 14px; border-top: 1px dashed var(--line-2); font-family: var(--f-label); font-size: 13px; font-weight: 600; color: var(--blue-700); }
.k-tiers .btn { align-self: flex-start; }
.k-tiers .is-pick p { color: var(--on-dark-2); }
.k-tiers .is-pick small { color: var(--teal); border-color: var(--line-dark-2); }
.k-tiers .is-pick .ac-ic { background: rgba(94,242,225,.12); color: var(--teal); }
.k-tiers__tag { position: absolute; top: 18px; right: 18px; padding: 5px 10px; border-radius: 999px; background: var(--teal); color: var(--ink-950); font-family: var(--f-label); font-size: 11.5px; font-weight: 700; }

/* Shared: stack columns, compliance badges, related pills, inline compliance */
.k-stackcols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--ink-950); }
.k-stackcols > div { padding: 26px 24px 8px 0; }
.k-stackcols > div + div { padding-left: 24px; border-left: 1px solid var(--line); }
.k-stackcols h3 { margin-bottom: 18px; font-family: var(--f-mono); font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.k-stackcols ul { list-style: none; margin: 0; padding: 0; }
.k-stackcols li { padding: 10px 0; border-bottom: 1px solid var(--line); font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.02em; transition: padding .3s, color .3s; }
.k-stackcols li:hover { padding-left: 8px; color: var(--blue-700); }
.k-badges { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; margin: 0; padding: 0; }
.k-badges li { position: relative; display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 20px 0 14px; border-radius: 999px; background: #fff; border: 1px solid var(--line-2); font-family: var(--f-display); font-size: 16px; font-weight: 600; cursor: default; outline: none; transition: background .3s, color .3s, border-color .3s; }
.k-badges li > svg { width: 20px; height: 20px; color: var(--blue); }
.k-badges li:hover, .k-badges li:focus-visible { background: var(--ink-950); border-color: var(--ink-950); color: #fff; }
.k-badges li:hover > svg, .k-badges li:focus-visible > svg { color: var(--teal); }
.k-badges span { position: absolute; left: 50%; bottom: calc(100% + 10px); z-index: 3; width: min(260px, 70vw); padding: 12px 14px; border-radius: 12px; background: var(--ink-950); color: var(--on-dark); font-family: var(--f-body); font-size: 13.5px; font-weight: 400; line-height: 1.5; box-shadow: var(--shadow); opacity: 0; transform: translate(-50%, 6px); pointer-events: none; transition: opacity .25s, transform .35s var(--ease-out); }
.k-badges li:hover span, .k-badges li:focus-visible span { opacity: 1; transform: translate(-50%, 0); }
.k-rel { display: flex; flex-wrap: wrap; gap: 12px; }
.k-rel a { display: inline-flex; align-items: center; gap: 12px; padding: 16px 22px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.02em; transition: background .3s, color .3s, border-color .3s; }
.k-rel a:hover { background: var(--ink-950); border-color: var(--ink-950); color: #fff; }
.k-rel svg { width: 18px; height: 18px; stroke-width: 1.9; }
.k-inline { display: grid; grid-template-columns: minmax(0, .55fr) minmax(0, 1.45fr); gap: 20px 40px; align-items: center; padding: 28px 32px; border-radius: 24px; background: #F6F7F9; border: 1px solid var(--line); }
.k-inline > p { font-size: 15.5px; line-height: 1.5; color: var(--text-2); }
.k-inline strong { display: block; margin-bottom: 4px; font-family: var(--f-display); font-size: 20px; letter-spacing: -.02em; color: var(--text); }
.k-inline ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.k-inline li { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px; background: #fff; border: 1px solid var(--line); font-family: var(--f-label); font-size: 13.5px; font-weight: 600; }
.k-inline li svg { width: 16px; height: 16px; color: var(--blue); }

/* Shared: segmented toggle */
.k-toggle__bar { position: relative; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); max-width: 880px; margin: 0 auto; padding: 6px; border-radius: 999px; background: #fff; border: 1px solid var(--line); }
.k-toggle__bar button { position: relative; z-index: 1; min-height: 50px; padding: 0 14px; border-radius: 999px; font-family: var(--f-label); font-size: 14.5px; font-weight: 600; color: var(--text-2); transition: color .4s; }
.k-toggle__bar button[aria-selected="true"] { color: #fff; }
.k-toggle__pill { position: absolute; top: 6px; bottom: 6px; left: 6px; width: calc((100% - 12px) / var(--n)); border-radius: 999px; background: var(--ink-950); transform: translateX(calc(var(--i, 0) * 100%)); transition: transform .55s var(--ease-out); }
.k-toggle__panel { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px 32px; align-items: center; max-width: 960px; margin: 28px auto 0; padding: clamp(26px, 3.5vw, 44px); border-radius: 26px; background: #fff; border: 1px solid var(--line); }
.k-toggle__panel.is-in { animation: acPanel .6s var(--ease-out) both; }
.k-toggle__panel .ac-ic { width: 64px; height: 64px; }
.k-toggle__panel h3 { font-size: clamp(22px, 2.2vw, 30px); letter-spacing: -.03em; }
.k-toggle__panel p { margin-top: 8px; font-size: 15.5px; line-height: 1.6; color: var(--text-2); }
.k-toggle__panel small { display: block; margin-top: 12px; font-family: var(--f-label); font-size: 13px; font-weight: 600; color: var(--blue-700); }

/* Shared: split list, centred FAQ, line grid */
.k-split { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.k-split__copy { position: sticky; top: calc(var(--header-h) + 60px); }
.k-split__copy .x-h2 { margin-top: 18px; }
.k-split__copy .x-lead { margin-top: 22px; }
.k-split__list { list-style: none; margin: 0; padding: 0; }
.k-split__list li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 22px; padding: 28px 0; border-top: 1px solid var(--line); }
.k-split__list li:last-child { border-bottom: 1px solid var(--line); }
.k-split__list h3 { font-size: 21px; letter-spacing: -.025em; }
.k-split__list p { margin-top: 8px; font-size: 15.5px; line-height: 1.65; color: var(--text-2); }
.x-wrap.k-faqc { max-width: 920px; text-align: center; }
.k-faqc .x-h2 { margin-top: 18px; }
.k-faqc__list { display: grid; gap: 10px; margin-top: clamp(32px, 4vw, 48px); text-align: left; }
.k-faqc details { border-radius: 18px; background: #fff; border: 1px solid var(--line); transition: border-color .3s, box-shadow .3s; }
.k-faqc details[open] { border-color: rgba(47,107,255,.35); box-shadow: 0 24px 50px -36px rgba(10,12,24,.4); }
.k-faqc summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 26px; cursor: pointer; list-style: none; font-family: var(--f-display); font-size: 18.5px; font-weight: 600; letter-spacing: -.02em; }
.k-faqc summary::-webkit-details-marker { display: none; }
.k-faqc summary::after { content: ""; flex: none; width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-3px) rotate(45deg); transition: transform .4s var(--ease-out); }
.k-faqc details[open] summary::after { transform: translateY(2px) rotate(225deg); }
.k-faqc details p { padding: 0 26px 24px; font-size: 16px; line-height: 1.65; color: var(--text-2); }
.k-faqc__more { margin-top: 28px; color: var(--text-2); }
.k-faqc__more a { color: var(--blue); font-weight: 600; }
.k-lines { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.k-lines article { position: relative; padding: clamp(26px, 3vw, 40px); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background .4s; }
.k-lines article::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: linear-gradient(90deg, var(--violet), var(--blue)); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.k-lines article:hover { background: #FAFAFF; }
.k-lines article:hover::before { transform: none; }
.k-lines .ac-ic { background: #EEECFF; color: #4B3BC9; }
.k-lines h3 { margin-top: 22px; font-size: 20px; letter-spacing: -.025em; }
.k-lines p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--text-2); }

/* ---------- AI Consulting ---------- */
.kc-hero { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(56px, 7vw, 100px)) 0 clamp(56px, 7vw, 96px); background: radial-gradient(900px 520px at 85% 20%, rgba(47,107,255,.1), transparent 70%), #FBFAF7; }
.kc-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask: radial-gradient(ellipse at 72% 45%, #000 10%, transparent 70%); mask: radial-gradient(ellipse at 72% 45%, #000 10%, transparent 70%); opacity: .7; }
.kc-hero__grid > div { max-width: 760px; }
.kc-hero .x-crumbs, .kd-hero .x-crumbs, .kp-hero .x-crumbs { color: var(--text-3); flex-wrap: wrap; }
.kc-hero .x-crumbs a:hover, .kd-hero .x-crumbs a:hover, .kp-hero .x-crumbs a:hover { color: var(--text); }
.kc-hero .x-k { margin-bottom: 20px; }
.kc-hero h1, .kd-hero h1, .kp-hero h1, .ki-hero h1 { font-size: clamp(40px, 4.8vw, 72px); line-height: 1.02; letter-spacing: -.045em; }
.kc-hero h1 em { font-family: var(--f-serif); font-weight: 400; letter-spacing: -.02em; color: var(--blue-700); }
.kc-hero__lead, .kd-hero__lead, .kp-hero__lead { margin-top: 24px; max-width: 540px; font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.65; color: var(--text-2); }
.kc-hero .x-hero__ctas, .kd-hero .x-hero__ctas, .kp-hero .x-hero__ctas, .ki-hero .x-hero__ctas { margin-top: 34px; }
.acp--consult .ac-trust { background: #FBFAF7; }
.kc-core__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.kc-core__copy { position: sticky; top: calc(var(--header-h) + 60px); }
.kc-core__copy .x-h2 { margin-top: 18px; }
.kc-core__copy .x-lead { margin-top: 22px; }
.kc-stack { list-style: none; margin: 0; padding: 0; }
.kc-stack li { position: sticky; top: calc(var(--header-h) + 40px + var(--k) * 18px); display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px 22px; align-content: start; min-height: 230px; margin-bottom: 28px; padding: 34px; overflow: hidden; border-radius: 26px; background: #fff; border: 1px solid var(--line); box-shadow: 0 30px 60px -40px rgba(10,12,24,.35); }
.kc-stack li:nth-child(2) { background: #EEF3FF; }
.kc-stack li:nth-child(3), .kc-stack li:nth-child(6) { background: var(--ink-950); border-color: var(--ink-950); color: #fff; }
.kc-stack li:nth-child(4) { background: #E9FBF8; }
.kc-stack li:nth-child(5) { background: linear-gradient(135deg, #1742C0, #2F6BFF); border-color: transparent; color: #fff; }
.kc-stack__ic { grid-row: span 2; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: var(--ink-950); color: var(--teal); }
.kc-stack li:nth-child(3) .kc-stack__ic, .kc-stack li:nth-child(5) .kc-stack__ic, .kc-stack li:nth-child(6) .kc-stack__ic { background: rgba(255,255,255,.12); }
.kc-stack__ic svg { width: 26px; height: 26px; }
.kc-stack h3 { align-self: end; font-size: clamp(22px, 2vw, 28px); line-height: 1.15; letter-spacing: -.03em; }
.kc-stack p { max-width: 440px; font-size: 16px; line-height: 1.6; color: var(--text-2); }
.kc-stack li:nth-child(3) p, .kc-stack li:nth-child(5) p, .kc-stack li:nth-child(6) p { color: rgba(238,241,255,.78); }
.kc-stack__big { position: absolute; right: -24px; bottom: -34px; opacity: .07; pointer-events: none; }
.kc-stack__big svg { width: 200px; height: 200px; stroke-width: 1; }
.kc-quote { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; padding: clamp(28px, 4vw, 56px) 0; border-top: 2px solid var(--ink-950); border-bottom: 1px solid var(--line-2); }
.kc-quote__q { grid-column: 1 / -1; font-family: var(--f-serif); font-size: clamp(34px, 4.4vw, 64px); line-height: 1.05; letter-spacing: -.02em; }
.kc-quote__q em { color: var(--blue-700); }
.kc-quote > p:not(.kc-quote__q) { max-width: 560px; font-size: 17px; line-height: 1.6; color: var(--text-2); }

/* ---------- AI Integration ---------- */
.ki-hero { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 clamp(56px, 7vw, 96px); background: var(--ink-950); color: #fff; }
.ki-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(var(--line-dark) 1px, transparent 1px), linear-gradient(90deg, var(--line-dark) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask: radial-gradient(ellipse 70% 80% at 70% 50%, #000 20%, transparent 75%); mask: radial-gradient(ellipse 70% 80% at 70% 50%, #000 20%, transparent 75%); }
.ki-hero__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.ki-hero .x-crumbs { color: var(--on-dark-3); flex-wrap: wrap; }
.ki-hero .x-k { margin-bottom: 20px; color: var(--teal); }
.ki-hero h1 { color: #fff; }
.ki-hero h1 em { color: var(--teal); }
.ki-hero__lead { margin-top: 24px; max-width: 540px; font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.65; color: var(--on-dark-2); }
@keyframes kiDash { to { stroke-dashoffset: -20; } }
@keyframes kiRing { from { transform: scale(.8); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }
/* AI Integration hero infographic: glowing chip, circuit burst, spokes to system icons (transparent, on the dark hero) */
.ki-ai { position: relative; }
.ki-ai > svg { display: block; width: 100%; height: auto; overflow: visible; }
.ki-ai__mark { overflow: hidden; }
.ki-ai__lines { filter: drop-shadow(0 0 3px rgba(94,242,225,.75)); }
.ki-ai__spoke { fill: none; stroke: rgba(170,236,255,.5); stroke-width: 1.1; }
.ki-ai__pulse { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 12 200; stroke-dashoffset: 12; animation: kiAiPulse 3.2s linear infinite; }
@keyframes kiAiPulse { to { stroke-dashoffset: -100; } }
.ki-ai__node { fill: #5EF2E1; }
.ki-ai__burst { fill: none; stroke: rgba(170,236,255,.85); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.ki-ai__bdot { fill: #CFF9FF; animation: kiAiBlink 2.6s ease-in-out infinite; }
@keyframes kiAiBlink { 50% { opacity: .35; } }
.ki-ai__halo { fill: rgba(94,242,225,.08); stroke: rgba(127,233,255,.45); stroke-width: 1.2; transform-box: fill-box; transform-origin: center; animation: kiAiHalo 2.8s ease-in-out infinite; }
@keyframes kiAiHalo { 50% { transform: scale(1.08); opacity: .5; } }
.ki-ai__pins rect { fill: #7FE9FF; }
.ki-ai__chip { fill: url(#kiAiChip); stroke: #7FE9FF; stroke-width: 2; filter: drop-shadow(0 0 18px rgba(94,242,225,.85)); }
.ki-ai__chipline { fill: none; stroke: rgba(127,233,255,.35); stroke-width: 1; }
.ki-ai__logo { filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(127,233,255,.9)); }
.ki-ai__word { fill: #fff; font-family: var(--f-display); font-size: 22px; font-weight: 700; text-anchor: middle; }
.ki-ai__ic { filter: drop-shadow(0 0 5px rgba(94,242,225,.85)); animation: kiAiBlink 3.4s ease-in-out infinite; }
.ki-ai__ic * { fill: none; stroke: #E6FBFF; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ki-code { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 20px; align-items: stretch; }
.ki-code__list { display: grid; gap: 6px; align-content: start; }
.ki-code__list button { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; width: 100%; padding: 16px 18px; border-radius: 14px; border: 1px solid transparent; text-align: left; color: var(--on-dark-2); transition: background .3s, border-color .3s, color .3s; }
.ki-code__list button:hover { background: rgba(255,255,255,.03); }
.ki-code__list button[aria-selected="true"] { background: rgba(47,107,255,.1); border-color: rgba(94,242,225,.3); color: var(--on-dark); }
.ki-code__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(255,255,255,.05); color: var(--teal); }
.ki-code__ic svg { width: 20px; height: 20px; }
.ki-code__list strong { display: block; font-family: var(--f-display); font-size: 16.5px; font-weight: 600; letter-spacing: -.015em; color: #fff; }
.ki-code__list small { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.5; }
.ki-code__win { display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; background: #0A0D1C; border: 1px solid var(--line-dark-2); box-shadow: 0 40px 80px -40px rgba(47,107,255,.5); }
.ki-code__pane { flex: 1; }
.ki-code__bar, .ki-term__bar { display: flex; align-items: center; gap: 7px; padding: 12px 16px; border-bottom: 1px solid var(--line-dark); background: #0D1022; }
.ki-code__bar i, .ki-term__bar i { width: 11px; height: 11px; border-radius: 50%; background: #FF5F57; }
.ki-code__bar i:nth-child(2), .ki-term__bar i:nth-child(2) { background: #FEBC2E; }
.ki-code__bar i:nth-child(3), .ki-term__bar i:nth-child(3) { background: #28C840; }
.ki-code__bar span, .ki-term__bar span { margin-left: 10px; font-family: var(--f-mono); font-size: 12.5px; color: var(--on-dark-3); }
.ki-code pre { margin: 0; padding: 22px 22px 26px; overflow-x: auto; font-family: var(--f-mono); font-size: 13.5px; line-height: 1.75; color: #D6DCF5; outline: none; }
.ki-code .ln { display: block; min-height: 1.75em; white-space: pre; }
.ki-code__pane.is-in .ln { animation: kiLine .45s var(--ease-out) both; animation-delay: calc(var(--l) * 60ms); }
@keyframes kiLine { from { opacity: 0; transform: translateX(-8px); } }
.c-k { color: #C792EA; }
.c-s { color: var(--teal); }
.c-c { color: #6B7499; font-style: italic; }
.ki-code__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 14px 18px; border-top: 1px solid var(--line-dark); font-family: var(--f-mono); font-size: 12px; color: var(--on-dark-3); }
.ki-code__foot span { padding: 4px 9px; border-radius: 6px; background: rgba(255,255,255,.05); color: var(--on-dark); }
.ki-scrolly { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.ki-scrolly__stage { position: sticky; top: calc(var(--header-h) + 40px); height: min(520px, 70vh); overflow: hidden; border-radius: 28px; background: radial-gradient(120% 80% at 80% 0%, rgba(94,242,225,.18), transparent 60%), linear-gradient(160deg, #0D1A4A, #05060D 70%); color: #fff; }
.ki-scrolly__card { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(28px, 3.5vw, 44px); opacity: 0; transform: translateY(18px) scale(.98); transition: opacity .5s var(--ease), transform .7s var(--ease-out); --k-tick: var(--teal); }
.ki-scrolly__card.is-on { opacity: 1; transform: none; }
.ki-scrolly__ic { position: absolute; top: clamp(28px, 3.5vw, 44px); left: clamp(28px, 3.5vw, 44px); display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: rgba(94,242,225,.12); color: var(--teal); }
.ki-scrolly__ic svg { width: 34px; height: 34px; stroke-width: 1.5; }
.ki-scrolly__card h3 { font-size: clamp(26px, 2.6vw, 36px); letter-spacing: -.035em; color: #fff; }
.ki-scrolly__card .k-ticks { margin-top: 20px; color: var(--on-dark); }
.ki-scrolly__steps article { display: flex; flex-direction: column; justify-content: center; gap: 14px; min-height: min(52vh, 460px); padding: 20px 0 20px 28px; border-left: 2px solid var(--line); opacity: .35; transition: opacity .4s, border-color .4s; }
.ki-scrolly__steps article.is-on { opacity: 1; border-color: var(--blue); }
.ki-scrolly__steps h3 { font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.035em; }
.ki-scrolly__steps p { max-width: 460px; font-size: 16.5px; line-height: 1.65; color: var(--text-2); }
.ki-scrolly__steps .btn { align-self: flex-start; margin-top: 6px; }
.ki-scrolly__mini { display: none; }
.ki-scrolly__inline { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.ki-term { overflow: hidden; border-radius: 22px; background: #0A0D1C; border: 1px solid var(--line-dark-2); color: var(--on-dark); }
.ki-term__body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 40px; align-items: end; padding: clamp(28px, 4vw, 52px); }
.ki-term__cmd { grid-column: 1 / -1; font-family: var(--f-mono); font-size: 14px; color: var(--teal); }
.ki-term__cmd span { color: var(--on-dark-3); }
.ki-term__cur { display: inline-block; width: 9px; height: 17px; margin-left: 4px; vertical-align: -3px; background: var(--teal); animation: kiBlink 1s steps(1) infinite; }
@keyframes kiBlink { 50% { opacity: 0; } }
.ki-term h2 { font-size: clamp(28px, 3vw, 44px); line-height: 1.08; letter-spacing: -.04em; color: #fff; }
.ki-term h2 em { color: var(--teal); }
.ki-term__body > div > p { margin-top: 12px; max-width: 600px; font-size: 16.5px; line-height: 1.6; color: var(--on-dark-2); }
.ki-spot { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ki-spot article { position: relative; overflow: hidden; isolation: isolate; padding: 28px 24px; border-radius: 20px; background: #0B0E1E; border: 1px solid var(--line-dark); }
.ki-spot article::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(94,242,225,.16), transparent 60%); opacity: 0; transition: opacity .3s; }
.ki-spot article::after { content: ""; position: absolute; inset: 0; padding: 1px; border-radius: inherit; background: radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), rgba(94,242,225,.75), transparent 60%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); opacity: 0; transition: opacity .3s; pointer-events: none; }
.ki-spot:hover article::before, .ki-spot:hover article::after { opacity: 1; }
.ki-spot__ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: rgba(94,242,225,.08); color: var(--teal); }
.ki-spot__ic svg { width: 22px; height: 22px; }
.ki-spot h3 { margin-top: 22px; font-size: 19px; letter-spacing: -.025em; color: #fff; }
.ki-spot p { margin-top: 8px; font-size: 14.5px; line-height: 1.6; color: var(--on-dark-2); }
.ki-pipe { position: relative; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
.ki-pipe::before, .ki-pipe::after { content: ""; position: absolute; left: 24px; right: 24px; top: 23px; height: 2px; background: var(--line-dark-2); }
.ki-pipe::after { background: linear-gradient(90deg, var(--blue), var(--teal)); transform: scaleX(0); transform-origin: 0 50%; transition: transform 2.4s var(--ease); }
.ki-pipe.is-in::after { transform: none; }
.ki-pipe li { position: relative; z-index: 1; }
.ki-pipe__node { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--ink-950); border: 2px solid var(--line-dark-2); transition: border-color .4s, box-shadow .4s; transition-delay: calc(var(--k) * .4s); }
.ki-pipe__node i { width: 14px; height: 14px; border-radius: 50%; background: var(--line-dark-2); transition: background .4s; transition-delay: calc(var(--k) * .4s); }
.ki-pipe.is-in .ki-pipe__node { border-color: var(--teal); box-shadow: 0 0 0 6px rgba(94,242,225,.1); }
.ki-pipe.is-in .ki-pipe__node i { background: var(--teal); }
.ki-pipe h3 { margin-top: 22px; font-size: 18px; letter-spacing: -.02em; color: #fff; }
.ki-pipe p { margin-top: 8px; font-size: 14.5px; line-height: 1.6; color: var(--on-dark-2); }
.ki-mq { display: grid; gap: 14px; overflow: hidden; -webkit-mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ki-mq__t { display: flex; width: max-content; gap: 14px; animation: acMarq 40s linear infinite; }
.ki-mq__row--rev .ki-mq__t { animation-direction: reverse; animation-duration: 46s; }
.ki-mq:hover .ki-mq__t { animation-play-state: paused; }
.ki-mq__t span { display: inline-flex; align-items: center; gap: 12px; height: 64px; padding: 0 26px; border-radius: 16px; background: #0B0E1E; border: 1px solid var(--line-dark); font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.015em; color: var(--on-dark); white-space: nowrap; }
.ki-mq__t span::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--grad); }

/* ---------- Artificial Intelligence Services ---------- */
.ka-hero { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(64px, 8vw, 120px)) 0 clamp(64px, 8vw, 110px); background: #070815; color: #fff; text-align: center; }
.ka-hero__aurora { position: absolute; inset: -20%; z-index: -2; filter: blur(70px); opacity: .8; }
.ka-hero__aurora i { position: absolute; border-radius: 50%; mix-blend-mode: screen; animation: kaFloat 16s ease-in-out infinite alternate; }
.ka-hero__aurora i:nth-child(1) { left: 12%; top: 22%; width: 44%; height: 48%; background: #2F6BFF; }
.ka-hero__aurora i:nth-child(2) { right: 10%; top: 12%; width: 40%; height: 46%; background: #7B6CFF; animation-duration: 19s; animation-delay: -6s; }
.ka-hero__aurora i:nth-child(3) { left: 34%; bottom: 4%; width: 36%; height: 40%; background: #12B5A3; animation-duration: 22s; animation-delay: -10s; }
@keyframes kaFloat { to { transform: translate(8%, -6%) scale(1.15); } }
.ka-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 40%, transparent 30%, rgba(7,8,21,.85) 80%); }
.ka-hero__in { display: flex; flex-direction: column; align-items: center; }
.ka-hero .x-crumbs { justify-content: center; flex-wrap: wrap; color: rgba(255,255,255,.6); }
.ka-hero .x-k { margin-bottom: 20px; color: var(--teal); }
.ka-hero h1 { max-width: 18ch; font-size: clamp(42px, 6vw, 92px); line-height: .98; letter-spacing: -.05em; color: #fff; }
.ka-hero h1 em { background: linear-gradient(90deg, #8FB1FF, var(--teal)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ka-hero__rot { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; padding: 6px 6px 6px 18px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-family: var(--f-label); font-size: 15px; color: rgba(255,255,255,.8); }
.ka-rot { display: inline-block; height: 34px; overflow: hidden; border-radius: 999px; background: #fff; color: var(--ink-950); }
.ka-rot > span { display: flex; flex-direction: column; animation: kaRot 12s var(--ease) infinite; }
.ka-rot b { display: block; height: 34px; padding: 0 16px; line-height: 34px; font-weight: 700; white-space: nowrap; text-align: left; }
@keyframes kaRot { 0%, 16% { transform: translateY(0); } 20%, 36% { transform: translateY(-16.6667%); } 40%, 56% { transform: translateY(-33.3333%); } 60%, 76% { transform: translateY(-50%); } 80%, 96% { transform: translateY(-66.6667%); } 100% { transform: translateY(-83.3333%); } }
.ka-hero__lead { max-width: 640px; margin-top: 24px; font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.65; color: rgba(238,241,255,.8); }
.ka-hero .x-hero__ctas { justify-content: center; margin-top: 34px; }
.ka-hero__pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 46px 0 0; padding: 0; list-style: none; }
.ka-hero__pills li { padding: 9px 16px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); font-family: var(--f-label); font-size: 13.5px; color: rgba(255,255,255,.85); animation: kaBob 6s ease-in-out infinite; animation-delay: calc(var(--k) * -.8s); }
@keyframes kaBob { 50% { transform: translateY(-6px); } }
.ka-auto { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 56px); align-items: stretch; }
.ka-auto__list { display: grid; align-content: start; }
.ka-auto__list button { position: relative; display: block; width: 100%; padding: 20px 4px 22px; border-top: 1px solid var(--line); text-align: left; color: var(--text-3); transition: color .3s; }
.ka-auto__list button:last-child { border-bottom: 1px solid var(--line); }
.ka-auto__list button:hover, .ka-auto__list button[aria-selected="true"] { color: var(--text); }
.ka-auto__list strong { display: block; font-family: var(--f-display); font-size: clamp(19px, 1.7vw, 23px); font-weight: 600; letter-spacing: -.025em; }
.ka-auto__list span { display: block; max-height: 0; overflow: hidden; opacity: 0; font-size: 15px; line-height: 1.6; color: var(--text-2); transition: max-height .5s var(--ease-out), opacity .4s, margin .5s var(--ease-out); }
.ka-auto__list [aria-selected="true"] span { max-height: 90px; margin-top: 8px; opacity: 1; }
.ka-auto__bar { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--grad); transform: scaleX(0); transform-origin: 0 50%; }
.ka-auto:not(.is-run) [aria-selected="true"] .ka-auto__bar { transform: none; }
.ka-auto.is-run [aria-selected="true"] .ka-auto__bar { animation: kaFill var(--dur, 5s) linear forwards; }
@keyframes kaFill { to { transform: none; } }
.ka-auto__stage { position: relative; min-height: 460px; overflow: hidden; border-radius: 30px; background: #070815; color: #fff; }
.ka-auto__panel { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(28px, 3.5vw, 44px); }
.ka-auto__panel:nth-child(1) { --c1: #8FB1FF; --c2: #2F6BFF; }
.ka-auto__panel:nth-child(2) { --c1: #C4B5FF; --c2: #7B6CFF; }
.ka-auto__panel:nth-child(3) { --c1: #9FF7EC; --c2: #12B5A3; }
.ka-auto__panel:nth-child(4) { --c1: #7DE3FF; --c2: #1F55E6; }
.ka-auto__panel:nth-child(5) { --c1: #FFD58A; --c2: #E0743E; }
.ka-auto__panel:nth-child(6) { --c1: #B9F5D0; --c2: #0E8C7E; }
.ka-auto__panel.is-in { animation: acPanel .7s var(--ease-out) both; }
.ka-auto__panel::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgba(7,8,21,.92)); }
.ka-auto__art { position: absolute; inset: 0; display: grid; place-items: center; }
.ka-auto__orb { position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 35%, var(--c1), var(--c2) 55%, transparent 72%); filter: blur(10px); opacity: .9; animation: kaSpin 14s linear infinite; }
.ka-auto__ring { position: absolute; width: 46%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); animation: kaPulse 3.2s ease-out infinite; }
.ka-auto__ring--2 { animation-delay: 1.6s; }
@keyframes kaPulse { from { transform: scale(.7); opacity: 1; } to { transform: scale(1.5); opacity: 0; } }
@keyframes kaSpin { to { transform: rotate(360deg); } }
.ka-auto__icon { position: relative; display: grid; place-items: center; width: 96px; height: 96px; margin-bottom: 16%; border-radius: 28px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.28); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.ka-auto__icon svg { width: 44px; height: 44px; stroke-width: 1.5; }
.ka-auto__panel h3, .ka-auto__panel p { position: relative; z-index: 1; }
.ka-auto__panel h3 { font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.035em; color: #fff; }
.ka-auto__panel p { max-width: 460px; margin-top: 10px; font-size: 16px; line-height: 1.6; color: rgba(238,241,255,.82); }
.ka-car__track { display: grid; grid-auto-flow: column; grid-auto-columns: min(440px, 84vw); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 6px max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))) 10px; scroll-padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))); cursor: grab; }
.ka-car__track::-webkit-scrollbar { display: none; }
.ka-car__card { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; gap: 14px; min-height: 480px; padding: 30px; border-radius: 28px; scroll-snap-align: start; background: linear-gradient(165deg, var(--c1), var(--c2)); color: #fff; --k-tick: var(--teal); }
.ka-car__card:nth-child(1) { --c1: #1742C0; --c2: #0D1A4A; }
.ka-car__card:nth-child(2) { --c1: #5B4FE0; --c2: #1A1442; }
.ka-car__card:nth-child(3) { --c1: #0E7C86; --c2: #062A33; }
.ka-car__card:nth-child(4) { --c1: #2F6BFF; --c2: #151A36; }
.ka-car__card:nth-child(5) { --c1: #7B6CFF; --c2: #0D1022; }
.ka-car__card:nth-child(6) { --c1: #12B5A3; --c2: #0B2545; }
.ka-car__card::after { content: ""; position: absolute; z-index: -1; right: -30%; top: -30%; width: 80%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,255,255,.22), transparent); transition: transform .8s var(--ease-out); }
.ka-car__card:hover::after { transform: translate(-12%, 12%) scale(1.2); }
.ka-car__card .ac-ic { background: rgba(255,255,255,.14); color: #fff; }
.ka-car__card h3 { margin-top: 18px; font-size: clamp(24px, 2.2vw, 30px); letter-spacing: -.035em; color: #fff; }
.ka-car__card > p { font-size: 15.5px; line-height: 1.6; color: rgba(238,241,255,.82); }
.ka-car__card .k-ticks { margin-top: 4px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.18); }
.ka-car__card .btn { align-self: flex-start; margin-top: auto; }
.ka-glow { position: relative; overflow: hidden; isolation: isolate; padding: 1.5px; border-radius: var(--r-xl); }
.ka-glow::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: 200%; aspect-ratio: 1; background: conic-gradient(from 0deg, transparent 0 60%, var(--teal), var(--violet), var(--blue), transparent 95%); transform: translate(-50%, -50%); animation: kaSpinC 6s linear infinite; }
@keyframes kaSpinC { to { transform: translate(-50%, -50%) rotate(360deg); } }
.ka-glow__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: center; padding: clamp(32px, 4.5vw, 60px); border-radius: calc(var(--r-xl) - 1.5px); background: radial-gradient(80% 140% at 0% 0%, rgba(123,108,255,.25), transparent 60%), #070815; color: #fff; }
.ka-glow h2 { font-size: clamp(28px, 3vw, 44px); line-height: 1.08; letter-spacing: -.04em; color: #fff; }
.ka-glow h2 em { color: var(--teal); }
.ka-glow p { max-width: 600px; margin-top: 12px; font-size: 16.5px; line-height: 1.6; color: var(--on-dark-2); }
.ka-flip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ka-flip__c { min-height: 240px; perspective: 1200px; outline: none; cursor: pointer; }
.ka-flip__in { position: relative; height: 100%; min-height: 240px; transform-style: preserve-3d; transition: transform .8s var(--ease-out); }
.ka-flip__c:hover .ka-flip__in, .ka-flip__c:focus .ka-flip__in { transform: rotateY(180deg); }
.ka-flip__c:focus-visible .ka-flip__b { box-shadow: 0 0 0 3px var(--teal); }
.ka-flip__f, .ka-flip__b { position: absolute; inset: 0; display: flex; flex-direction: column; padding: 26px 24px; border-radius: 22px; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.ka-flip__f { justify-content: space-between; background: #fff; border: 1px solid var(--line); }
.ka-flip__b { justify-content: flex-end; transform: rotateY(180deg); background: linear-gradient(160deg, #2F6BFF, #7B6CFF); color: #fff; }
.ka-flip__ic { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: linear-gradient(135deg, #EEF4FF, #F1EEFF); color: var(--blue-700); }
.ka-flip__ic svg { width: 26px; height: 26px; }
.ka-flip__f h3 { font-size: 21px; letter-spacing: -.025em; }
.ka-flip__f small { display: block; margin-top: 6px; font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.ka-flip__b h3 { font-size: 19px; letter-spacing: -.02em; color: #fff; }
.ka-flip__b p { margin-top: 8px; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.9); }
.ka-type { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-dark-2); }
.ka-type li { display: grid; grid-template-columns: minmax(0, 1fr) 56px; gap: 0 24px; padding: 26px 0; border-bottom: 1px solid var(--line-dark-2); outline: none; cursor: default; }
.ka-type h3 { font-size: clamp(26px, 3.4vw, 50px); line-height: 1.05; letter-spacing: -.045em; color: rgba(238,241,255,.42); transition: color .4s, transform .6s var(--ease-out); }
.ka-type p { grid-column: 1; max-width: 620px; max-height: 0; overflow: hidden; opacity: 0; font-size: 16px; line-height: 1.6; color: var(--on-dark-2); transition: max-height .6s var(--ease-out), opacity .4s, margin .5s var(--ease-out), transform .6s var(--ease-out); }
.ka-type li:hover h3, .ka-type li:focus-visible h3 { color: #fff; transform: translateX(14px); }
.ka-type li:hover p, .ka-type li:focus-visible p { max-height: 120px; margin-top: 12px; opacity: 1; transform: translateX(14px); }
.ka-type__ic { grid-column: 2; grid-row: 1 / span 2; align-self: center; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; border: 1px solid var(--line-dark-2); color: var(--teal); transition: background .4s, color .4s, transform .6s var(--ease-out); }
.ka-type__ic svg { width: 24px; height: 24px; }
.ka-type li:hover .ka-type__ic, .ka-type li:focus-visible .ka-type__ic { background: var(--teal); color: var(--ink-950); transform: rotate(-12deg); }
@media (hover: none) {
  .ka-type h3 { color: #fff; }
  .ka-type p { max-height: none; margin-top: 10px; opacity: 1; }
}
.ka-ring { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.ka-ring__copy .x-h2 { margin-top: 18px; }
.ka-ring__copy .x-lead { margin-top: 22px; }
.ka-ring__dial { position: relative; width: min(100%, 560px); aspect-ratio: 1; margin: 0 auto; }
.ka-ring__track, .ka-ring__arc { position: absolute; inset: 9%; border-radius: 50%; }
.ka-ring__track { border: 1px dashed var(--line-2); }
.ka-ring__arc { background: conic-gradient(from calc(-180deg / var(--n)), var(--blue), var(--violet) calc(360deg / var(--n)), transparent 0); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px)); mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px)); transform: rotate(calc(var(--i, 0) * 360deg / var(--n))); transition: transform .8s var(--ease-out); }
.ka-ring__dial button { position: absolute; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; width: 124px; transform: translate(-50%, -9px); text-align: center; font-family: var(--f-label); font-size: 13px; font-weight: 600; line-height: 1.25; color: var(--text-3); transition: color .3s; }
.ka-ring__dial button i { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--line-2); transition: background .3s, border-color .3s, box-shadow .3s, transform .4s var(--ease-out); }
.ka-ring__dial button span { padding: 3px 8px; border-radius: 8px; background: rgba(255,255,255,.9); }
.ka-ring__dial button:hover, .ka-ring__dial button[aria-selected="true"] { color: var(--text); }
.ka-ring__dial button[aria-selected="true"] i { background: var(--blue); border-color: var(--blue); box-shadow: 0 0 0 7px rgba(47,107,255,.15); transform: scale(1.15); }
.ka-ring__core { position: absolute; inset: 25%; display: grid; place-items: center; border-radius: 50%; text-align: center; background: radial-gradient(circle, #fff 60%, #F3F5FF); box-shadow: inset 0 0 0 1px var(--line), 0 30px 60px -40px rgba(10,12,24,.4); }
.ka-ring__panel { padding: 0 10%; }
.ka-ring__panel.is-in { animation: acPanel .6s var(--ease-out) both; }
.ka-ring__panel h3 { font-size: clamp(18px, 1.8vw, 24px); letter-spacing: -.03em; }
.ka-ring__panel p { margin-top: 8px; font-size: 14px; line-height: 1.55; color: var(--text-2); }
.ka-qa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(32px, 5vw, 72px); }
.ka-qa > div { padding: 26px 0; border-top: 1px solid var(--line); }
.ka-qa h3 { font-size: 19px; line-height: 1.3; letter-spacing: -.02em; }
.ka-qa p { margin-top: 10px; font-size: 15.5px; line-height: 1.65; color: var(--text-2); }

/* ---------- Document AI ---------- */
.kd-soft { background: #F4F8F7; }
.kd-hero { position: relative; overflow: hidden; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 clamp(56px, 7vw, 96px); background: linear-gradient(180deg, #EAF5F2, #fff); }
.kd-hero__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.kd-hero .x-k { margin-bottom: 20px; color: #0E7C6F; }
.kd-hero h1 em { color: #0E8C7E; }
.kd-cmp { position: relative; height: clamp(440px, 40vw, 520px); overflow: hidden; border-radius: 26px; background: #fff; border: 1px solid var(--line); box-shadow: 0 50px 90px -50px rgba(10,40,40,.45); user-select: none; }
.kd-cmp__data, .kd-cmp__scan { position: absolute; inset: 0; padding: clamp(18px, 2.4vw, 30px); }
.kd-cmp__data { background: linear-gradient(180deg, #fff, #F4FAF8); }
.kd-cmp__scan { clip-path: inset(0 calc(100% - var(--pos)) 0 0); background: #E6E0D2; }
.kd-cmp__line { position: absolute; top: 0; bottom: 0; left: var(--pos); z-index: 3; width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 0 1px rgba(10,12,24,.12); pointer-events: none; }
.kd-cmp__line b { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; transform: translate(-50%, -50%); background: var(--ink-950); color: #fff; box-shadow: 0 10px 24px -8px rgba(0,0,0,.5); transition: box-shadow .3s; }
.kd-cmp__line svg { width: 20px; height: 20px; stroke-width: 2; }
.kd-cmp:focus-within .kd-cmp__line b { box-shadow: 0 0 0 4px rgba(18,181,163,.45); }
.kd-cmp input { position: absolute; inset: 0; z-index: 4; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.kd-cmp__tag { position: absolute; bottom: 14px; z-index: 3; padding: 6px 12px; border-radius: 999px; font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; pointer-events: none; }
.kd-cmp__tag--l { left: 14px; background: rgba(10,12,24,.75); color: #fff; }
.kd-cmp__tag--r { right: 14px; background: #0E8C7E; color: #fff; }
.kd-inv { position: relative; height: 100%; padding: 22px 24px; overflow: hidden; background: #FBF8F1 repeating-linear-gradient(0deg, rgba(0,0,0,.025) 0 1px, transparent 1px 3px); color: #3A3A3A; font-family: "Courier New", var(--f-mono); font-size: 12.5px; line-height: 1.5; transform: rotate(-1.4deg); box-shadow: 0 12px 30px -16px rgba(0,0,0,.35); filter: contrast(.92) blur(.25px); }
.kd-inv--clean { background: #fff; color: #1D2433; font-family: var(--f-label); transform: none; filter: none; box-shadow: none; border: 1px solid var(--line); border-radius: 12px; }
.kd-inv mark { background: none; color: inherit; }
.kd-inv--clean mark { border-radius: 3px; background: rgba(18,181,163,.12); outline: 1.5px solid rgba(18,181,163,.7); }
.kd-inv__head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-bottom: 10px; border-bottom: 2px solid #444; }
.kd-inv__head strong { font-size: 15px; letter-spacing: .06em; text-transform: uppercase; }
.kd-inv__head span { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.kd-inv__meta { display: grid; gap: 3px; margin: 12px 0; }
.kd-inv table { width: 100%; border-collapse: collapse; }
.kd-inv th, .kd-inv td { padding: 5px 0; text-align: left; border-bottom: 1px dotted #999; }
.kd-inv th:last-child, .kd-inv td:last-child { text-align: right; }
.kd-inv__tot { display: grid; justify-items: end; gap: 3px; margin-top: 10px; }
.kd-inv__tot b { font-size: 14px; }
.kd-inv__stamp { position: absolute; right: 30px; bottom: 60px; padding: 4px 10px; border: 2px solid rgba(200,40,60,.6); color: rgba(200,40,60,.65); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; transform: rotate(-12deg); }
.kd-inv__sig { position: absolute; left: 26px; bottom: 26px; width: 120px; height: 34px; fill: none; stroke: #2A3A8A; stroke-width: 1.6; stroke-linecap: round; }
.kd-out { position: absolute; right: 18px; top: 18px; bottom: 18px; display: flex; flex-direction: column; width: min(54%, 300px); overflow: hidden; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: 0 30px 60px -30px rgba(10,40,40,.4); font-family: var(--f-label); }
.kd-out__h { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 700; }
.kd-out__h span { padding: 4px 9px; border-radius: 999px; background: #E3F7F3; color: #0E7C6F; font-size: 11px; }
.kd-out dl { display: grid; margin: 0; padding: 4px 16px; }
.kd-out dl div { display: grid; gap: 2px; padding: 9px 0; border-bottom: 1px dashed var(--line); }
.kd-out dl div:last-child { border-bottom: 0; }
.kd-out dt { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.kd-out dd { display: flex; justify-content: space-between; gap: 8px; margin: 0; font-size: 13.5px; font-weight: 600; color: var(--text); }
.kd-out dd em { flex: none; font-style: normal; font-size: 11px; color: #0E8C7E; }
.kd-out dd em::before { content: "✓ "; }
.kd-scan { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.kd-scan__doc { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 16px; padding: 32px 30px 36px; border-radius: 22px; background: #fff; border: 1px solid var(--line); box-shadow: 0 40px 80px -50px rgba(10,40,40,.5); }
.kd-scan__beam { position: absolute; left: 0; right: 0; top: 0; z-index: 2; height: 80px; background: linear-gradient(180deg, transparent, rgba(18,181,163,.16) 70%, rgba(18,181,163,.7) 98%, transparent); pointer-events: none; animation: kdBeam 3.6s var(--ease) infinite; }
@keyframes kdBeam { from { transform: translateY(-90px); } to { transform: translateY(620px); } }
.kd-r { position: relative; display: grid; gap: 8px; padding: 10px; border-radius: 10px; outline: 1.5px dashed transparent; transition: outline-color .3s, background .3s; }
.kd-r.is-on { outline-color: #12B5A3; background: rgba(18,181,163,.07); }
.kd-r__tag { position: absolute; right: 8px; top: -11px; z-index: 3; padding: 3px 9px; border-radius: 999px; background: #12B5A3; color: #fff; font-family: var(--f-label); font-size: 11px; font-weight: 700; opacity: 0; transform: translateY(4px); transition: opacity .3s, transform .4s var(--ease-out); }
.kd-r.is-on .kd-r__tag { opacity: 1; transform: none; }
.kd-l { display: block; height: 8px; border-radius: 4px; background: #E3E8EF; }
.kd-l--hl { background: rgba(255,196,0,.5); }
.kd-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 9px 12px; }
.kd-doc__h { display: flex; align-items: center; justify-content: space-between; }
.kd-doc__h b { padding: 4px 10px; border-radius: 6px; background: var(--ink-950); color: #fff; font-family: var(--f-label); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.kd-doc__tot { display: flex; justify-content: flex-end; align-items: center; gap: 14px; }
.kd-doc__tot b { font-family: var(--f-display); font-size: 18px; }
.kd-doc__q { display: grid; gap: 6px; font-family: var(--f-label); font-size: 13px; }
.kd-doc__q span { justify-self: end; padding: 7px 12px; border-radius: 12px 12px 4px 12px; background: var(--ink-950); color: #fff; }
.kd-doc__q em { justify-self: start; padding: 7px 12px; border-radius: 12px 12px 12px 4px; background: #E3F7F3; color: #0E5E55; font-style: normal; }
.kd-scan__list { display: grid; gap: 8px; }
.kd-scan__list button { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-items: center; width: 100%; padding: 14px 16px; border-radius: 16px; border: 1px solid transparent; text-align: left; transition: background .3s, border-color .3s, box-shadow .3s; }
.kd-scan__list button:hover { background: rgba(255,255,255,.6); }
.kd-scan__list button[aria-selected="true"] { background: #fff; border-color: rgba(18,181,163,.4); box-shadow: 0 20px 40px -30px rgba(10,40,40,.5); }
.acp--doc .ac-ic { background: #E3F7F3; color: #0E7C6F; }
.kd-scan__list strong { display: block; font-family: var(--f-display); font-size: 17px; font-weight: 600; letter-spacing: -.02em; }
.kd-scan__list small { display: block; margin-top: 3px; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.kd-acc { border-top: 1px solid var(--line); --k-tick: #0E8C7E; }
.kd-acc__item { border-bottom: 1px solid var(--line); }
.kd-acc__head { display: grid; grid-template-columns: 48px minmax(0, .9fr) minmax(0, 1.1fr) 40px; gap: 24px; align-items: center; width: 100%; padding: 24px 4px; text-align: left; }
.kd-acc__head strong { font-family: var(--f-display); font-size: clamp(19px, 1.8vw, 24px); font-weight: 600; letter-spacing: -.025em; transition: color .3s; }
.kd-acc__head:hover strong { color: #0E7C6F; }
.kd-acc__d { font-size: 15px; line-height: 1.55; color: var(--text-2); }
.kd-acc__pm { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .3s, border-color .3s, color .3s, transform .5s var(--ease-out); }
.kd-acc__pm::before, .kd-acc__pm::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; background: currentColor; }
.kd-acc__pm::after { transform: rotate(90deg); transition: transform .4s var(--ease-out); }
.is-open .kd-acc__pm { background: #0E8C7E; border-color: #0E8C7E; color: #fff; transform: rotate(180deg); }
.is-open .kd-acc__pm::after { transform: none; }
.kd-acc__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ease-out); }
.is-open .kd-acc__body { grid-template-rows: 1fr; }
.kd-acc__body > div { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; min-height: 0; overflow: hidden; padding-left: 76px; visibility: hidden; transition: visibility 0s .5s; }
.is-open .kd-acc__body > div { padding-bottom: 28px; visibility: visible; transition-delay: 0s; }
.kd-acc__body .k-ticks { flex: 1 1 420px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 28px; }
.kd-drop { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px 36px; align-items: center; padding: clamp(28px, 4vw, 52px); border-radius: var(--r-xl); border: 2px dashed rgba(14,140,126,.45); background: repeating-linear-gradient(-45deg, rgba(18,181,163,.05) 0 14px, transparent 14px 28px), #F4FBF9; transition: border-color .3s; }
.kd-drop:hover { border-color: #0E8C7E; }
.kd-drop__ic { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 24px; background: #fff; border: 1px solid rgba(14,140,126,.25); color: #0E8C7E; animation: kdBob 3s ease-in-out infinite; }
.kd-drop__ic svg { width: 38px; height: 38px; stroke-width: 1.5; }
@keyframes kdBob { 50% { transform: translateY(-8px); } }
.kd-drop h2 { font-size: clamp(26px, 2.8vw, 40px); line-height: 1.1; letter-spacing: -.04em; }
.kd-drop h2 em { color: #0E8C7E; }
.kd-drop p { max-width: 560px; margin-top: 10px; font-size: 16.5px; line-height: 1.6; color: var(--text-2); }
.kd-table { overflow-x: auto; border-radius: 22px; background: #fff; border: 1px solid var(--line); }
.kd-table table { width: 100%; min-width: 640px; border-collapse: collapse; }
.kd-table thead th { padding: 16px 24px; text-align: left; font-family: var(--f-mono); font-size: 11.5px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); background: #F7FAF9; border-bottom: 1px solid var(--line); }
.kd-table tbody th { padding: 18px 24px; text-align: left; font-family: var(--f-display); font-size: 17px; font-weight: 600; letter-spacing: -.02em; white-space: nowrap; }
.kd-tcell { display: flex; align-items: center; gap: 14px; }
.kd-table .ac-ic { width: 40px; height: 40px; border-radius: 12px; }
.kd-table .ac-ic svg { width: 20px; height: 20px; }
.kd-table tbody td { padding: 18px 24px; font-size: 15px; line-height: 1.55; color: var(--text-2); }
.kd-table tbody tr + tr > * { border-top: 1px solid var(--line); }
.kd-table tbody tr { transition: background .25s; }
.kd-table tbody tr:hover { background: #F4FBF9; }
.kd-table td:last-child { width: 72px; }
.kd-table td a { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line-2); transition: background .3s, border-color .3s, color .3s; }
.kd-table td a:hover { background: #0E8C7E; border-color: #0E8C7E; color: #fff; }
.kd-table td a svg { width: 16px; height: 16px; stroke-width: 1.9; }
.kd-why { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.kd-why .x-h2 { margin-top: 18px; }
.kd-why .x-lead { margin-top: 22px; }
.kd-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 32px; list-style: none; margin: 0; padding: 0; }
.kd-checks li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; }
.kd-checks i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #0E8C7E; color: #fff; }
.kd-checks i svg { width: 18px; height: 18px; stroke-width: 2.4; }
.kd-checks h3 { font-size: 18.5px; line-height: 1.3; letter-spacing: -.02em; }
.kd-checks p { margin-top: 6px; font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kd-zig { position: relative; max-width: 1040px; margin: 0 auto; padding: 0; list-style: none; }
.kd-zig::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: linear-gradient(#12B5A3, #2F6BFF); opacity: .35; }
.kd-zig li { position: relative; width: 50%; padding: 0 44px 0 0; }
.kd-zig li + li { margin-top: -40px; }
.kd-zig li:nth-child(even) { margin-left: 50%; padding: 0 0 0 44px; }
.kd-zig li::before { content: ""; position: absolute; top: 26px; right: -9px; z-index: 1; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid #12B5A3; }
.kd-zig li:nth-child(even)::before { right: auto; left: -9px; }
.kd-zig li::after { content: ""; position: absolute; top: 34px; right: 9px; width: 35px; height: 2px; background: rgba(18,181,163,.4); }
.kd-zig li:nth-child(even)::after { right: auto; left: 9px; }
.kd-zig__card { padding: 24px 26px; border-radius: 20px; background: #fff; border: 1px solid var(--line); box-shadow: 0 24px 50px -40px rgba(10,40,40,.5); }
.kd-zig h3 { font-size: 19px; letter-spacing: -.025em; }
.kd-zig p { margin-top: 8px; font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kd-quad { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border-radius: 26px; border: 1px solid var(--line); }
.kd-quad article { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 6px 20px; align-content: start; padding: clamp(26px, 3vw, 40px); background: #fff; transition: background .3s; }
.kd-quad article:nth-child(odd) { border-right: 1px solid var(--line); }
.kd-quad article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
.kd-quad article:hover { background: #F4FBF9; }
.kd-quad .ac-ic { grid-row: span 3; width: 56px; height: 56px; }
.kd-quad h3 { font-size: 21px; letter-spacing: -.025em; }
.kd-quad p { font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kd-quad small { margin-top: 6px; font-family: var(--f-label); font-size: 13px; font-weight: 600; color: #0E7C6F; }
.kd-flow { display: grid; grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1fr) 36px minmax(0, 1fr) 36px minmax(0, 1fr); align-items: stretch; }
.kd-flow__col { padding: 24px 22px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.kd-flow__col h3 { margin-bottom: 14px; font-family: var(--f-mono); font-size: 11.5px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: #0E7C6F; }
.kd-flow__col ul { display: grid; gap: 8px; list-style: none; margin: 0; padding: 0; }
.kd-flow__col li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; background: #F4F8F7; font-family: var(--f-label); font-size: 14px; font-weight: 600; }
.k-tlogo { flex: none; width: 22px; height: 22px; object-fit: contain; }
.k-tlogo--mono { display: grid; place-items: center; border-radius: 6px; background: #E2ECEA; color: #2C5E57; font-family: var(--f-label); font-size: 9.5px; font-weight: 700; letter-spacing: .02em; }
.kd-flow__arrow { display: grid; place-items: center; color: #0E8C7E; }
.kd-flow__arrow svg { width: 20px; height: 20px; stroke-width: 2; animation: kdNudge 1.6s ease-in-out infinite; }
@keyframes kdNudge { 50% { transform: translateX(4px); } }
.kd-faq__search { display: flex; align-items: center; gap: 10px; max-width: 420px; height: 54px; margin-top: 28px; padding: 0 18px; border-radius: 999px; background: #fff; border: 1px solid var(--line-2); transition: border-color .3s, box-shadow .3s; }
.kd-faq__search:focus-within { border-color: #0E8C7E; box-shadow: 0 0 0 4px rgba(18,181,163,.15); }
.kd-faq__search svg { flex: none; width: 20px; height: 20px; color: var(--text-3); }
.kd-faq__search input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 15.5px; color: var(--text); }
.kd-faq__none { padding: 22px 0; color: var(--text-2); }
.kd-faq__none a { color: #0E7C6F; font-weight: 600; }

/* ---------- Enterprise AI Copilots ---------- */
.kp-soft { background: #F5F4FF; }
.acp--copilot .ac-ic { background: #EEECFF; color: #4B3BC9; }
.kp-hero { position: relative; overflow: hidden; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 clamp(56px, 7vw, 96px); background: radial-gradient(800px 500px at 90% 10%, rgba(123,108,255,.18), transparent 70%), radial-gradient(700px 500px at 0% 100%, rgba(94,242,225,.14), transparent 70%), #FAFAFF; }
.kp-hero__grid > div { max-width: 760px; }
.kp-hero .x-k { margin-bottom: 20px; color: #5B4FE0; }
.kp-hero h1 em { color: var(--violet); }
.kp-msg { display: none; max-width: 82%; padding: 12px 15px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; }
.kp-msg.is-shown { display: block; animation: kpIn .5s var(--ease-out) both; }
@keyframes kpIn { from { opacity: 0; transform: translateY(10px); } }
.kp-msg--me { align-self: flex-end; background: var(--ink-950); color: #fff; border-bottom-right-radius: 6px; }
.kp-msg--ai { align-self: flex-start; background: #F1F0FF; color: var(--text); border-bottom-left-radius: 6px; }
.kp-cites { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.kp-cite { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 999px; background: #fff; border: 1px solid rgba(123,108,255,.3); font-family: var(--f-label); font-size: 11.5px; font-weight: 600; color: #4B3BC9; }
.kp-cite::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--violet); }
.kp-acts { display: flex; gap: 8px; margin-top: 10px; }
.kp-acts b { padding: 6px 12px; border-radius: 8px; background: var(--blue); color: #fff; font-family: var(--f-label); font-size: 12.5px; }
.kp-acts b + b { background: #fff; color: var(--text); border: 1px solid var(--line-2); }
.acp--copilot .ac-trust { background: #FAFAFF; }
.kp-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kp-bento__t { display: flex; flex-direction: column; gap: 10px; padding: 26px; border-radius: 24px; background: #fff; border: 1px solid rgba(123,108,255,.14); transition: transform .5s var(--ease-out), box-shadow .5s; }
.kp-bento__t:hover { transform: translateY(-4px); box-shadow: 0 30px 60px -40px rgba(40,30,120,.5); }
.kp-bento__t--0, .kp-bento__t--3, .kp-bento__t--4 { grid-column: span 2; }
.kp-bento h3 { margin-top: 6px; font-size: 20px; letter-spacing: -.025em; }
.kp-bento p { font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kp-ui { display: flex; flex-direction: column; justify-content: center; gap: 10px; min-height: 132px; margin-bottom: 10px; padding: 16px; border-radius: 16px; background: linear-gradient(135deg, #F7F6FF, #EFF7FF); font-family: var(--f-label); font-size: 13px; }
.kp-ui-search { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--line); }
.kp-ui-search svg { flex: none; width: 16px; height: 16px; color: var(--text-3); }
.kp-type { display: inline-block; overflow: hidden; white-space: nowrap; border-right: 2px solid var(--violet); width: 0; animation: kpType 5s steps(26) infinite; }
@keyframes kpType { 0% { width: 0; } 45%, 85% { width: 26ch; } 100% { width: 0; } }
.kp-ui-ans i { display: block; height: 7px; margin-top: 7px; border-radius: 4px; background: #DCD8FF; }
.kp-ui-ans .kp-cite { margin-top: 10px; }
.kp-ui-card { display: grid; gap: 4px; padding: 12px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--line); }
.kp-ui-card b { font-size: 14px; }
.kp-ui-card span { font-size: 12.5px; color: var(--text-3); }
.kp-ui-card .kp-cite { justify-self: start; margin-top: 6px; }
.kp-ui-code { display: grid; gap: 6px; padding: 12px 14px; border-radius: 12px; background: var(--ink-950); color: #D6DCF5; font-family: var(--f-mono); font-size: 12.5px; }
.kp-ui-code .ok { color: var(--teal); }
.kp-ui-bars { display: flex; align-items: flex-end; gap: 8px; height: 70px; }
.kp-ui-bars i { flex: 1; height: var(--h); border-radius: 6px 6px 2px 2px; background: linear-gradient(var(--violet), var(--blue)); transform-origin: bottom; animation: kpGrow 2.4s var(--ease-out) infinite alternate; }
.kp-ui-bars i:nth-child(2) { animation-delay: .2s; }
.kp-ui-bars i:nth-child(3) { animation-delay: .4s; }
.kp-ui-bars i:nth-child(4) { animation-delay: .6s; }
.kp-ui-bars i:nth-child(5) { animation-delay: .8s; }
@keyframes kpGrow { from { transform: scaleY(.45); } }
.kp-ui-q { font-size: 12.5px; color: var(--text-3); }
.kp-ui-bub { display: grid; gap: 8px; }
.kp-ui-bub span { justify-self: end; padding: 8px 12px; border-radius: 12px 12px 4px 12px; background: var(--ink-950); color: #fff; }
.kp-ui-bub .ai { justify-self: start; border-radius: 12px 12px 12px 4px; background: #fff; color: var(--text); border: 1px solid var(--line); }
.kp-ui-lock { display: grid; justify-items: start; gap: 8px; }
.kp-ui-lock svg { width: 26px; height: 26px; color: var(--violet); }
.kp-ui-lock span { padding: 6px 10px; border-radius: 8px; background: #fff; border: 1px solid var(--line); font-weight: 600; }
.kp-ui-lock .no { color: var(--text-3); text-decoration: line-through; }
.kp-convo__tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 28px; }
.kp-convo__tabs button { height: 44px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--line-2); background: #fff; font-family: var(--f-label); font-size: 14px; font-weight: 600; color: var(--text-2); transition: background .3s, color .3s, border-color .3s; }
.kp-convo__tabs button:hover { border-color: var(--violet); }
.kp-convo__tabs button[aria-selected="true"] { background: var(--violet); border-color: var(--violet); color: #fff; }
.kp-convo__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(26px, 3.5vw, 48px); border-radius: 30px; background: #fff; border: 1px solid rgba(123,108,255,.18); --k-tick: var(--violet); }
.kp-convo__panel.is-in { animation: acPanel .6s var(--ease-out) both; }
.kp-convo__copy h3 { margin-top: 18px; font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.035em; }
.kp-convo__copy > p { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--text-2); }
.kp-convo__copy .k-ticks { margin: 22px 0 26px; }
.kp-convo__chat { display: flex; flex-direction: column; justify-content: center; gap: 12px; min-height: 260px; padding: 24px; border-radius: 22px; background: linear-gradient(160deg, #F5F4FF, #EEF6FF); }
.kp-convo__chat .kp-msg { max-width: 88%; }
.kp-convo__chat .kp-msg--ai { background: #fff; animation-delay: .35s; }
.kp-secure { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px 36px; align-items: center; padding: clamp(28px, 4vw, 52px); border-radius: var(--r-xl); background: linear-gradient(120deg, #1A1442, #3B30B8 60%, #7B6CFF); color: #fff; }
.kp-secure__ic { position: relative; display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: rgba(255,255,255,.12); }
.kp-secure__ic::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(255,255,255,.4); animation: kaPulse 2.8s ease-out infinite; }
.kp-secure__ic svg { width: 36px; height: 36px; stroke-width: 1.5; }
.kp-secure h2 { font-size: clamp(26px, 2.8vw, 40px); line-height: 1.1; letter-spacing: -.04em; color: #fff; }
.kp-secure h2 em { color: var(--teal); }
.kp-secure p { max-width: 580px; margin-top: 10px; font-size: 16.5px; line-height: 1.6; color: rgba(238,241,255,.85); }
.kp-wall { columns: 3 300px; column-gap: 16px; }
.kp-wall__b { margin: 0 0 16px; padding: 22px; break-inside: avoid; border-radius: 22px 22px 22px 6px; background: #fff; border: 1px solid rgba(123,108,255,.16); box-shadow: 0 20px 40px -34px rgba(40,30,120,.5); }
.kp-wall__b.is-r { border-radius: 22px 22px 6px 22px; background: linear-gradient(160deg, #fff, #F3F1FF); }
.kp-wall figcaption { display: flex; align-items: center; gap: 12px; font-family: var(--f-display); font-size: 18px; font-weight: 600; letter-spacing: -.02em; }
.kp-wall .ac-ic { width: 40px; height: 40px; border-radius: 12px; }
.kp-wall .ac-ic svg { width: 20px; height: 20px; }
.kp-wall p { margin-top: 12px; font-size: 15.5px; line-height: 1.6; color: var(--text-2); }
.kp-check { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.kp-check__copy { position: sticky; top: calc(var(--header-h) + 60px); }
.kp-check__copy .x-h2 { margin-top: 18px; }
.kp-check__copy .x-lead { margin-top: 22px; }
.kp-check__prog { max-width: 380px; margin-top: 34px; }
.kp-check__prog span { font-family: var(--f-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-3); }
.kp-check__prog div { height: 10px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #E6E3FF; }
.kp-check__prog i { display: block; width: 100%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet), var(--blue)); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); }
.kp-check__list { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.kp-check__list li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 18px; padding: 24px; border-radius: 20px; background: #fff; border: 1px solid rgba(123,108,255,.16); transition: border-color .4s, box-shadow .4s; }
.kp-check__box { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; border: 2px solid var(--line-2); color: transparent; transition: background .4s, border-color .4s, color .4s, transform .5s var(--ease-out); }
.kp-check__box svg { width: 18px; height: 18px; stroke-width: 2.6; }
.kp-check__list li.is-done { border-color: rgba(123,108,255,.45); box-shadow: 0 24px 50px -40px rgba(40,30,120,.55); }
.kp-check__list li.is-done .kp-check__box { background: var(--violet); border-color: var(--violet); color: #fff; transform: scale(1.06); }
.kp-check__list h3 { font-size: 19px; letter-spacing: -.025em; }
.kp-check__list p { margin-top: 6px; font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kp-apps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.kp-apps > div { padding: 24px; border-radius: 22px; background: #fff; border: 1px solid rgba(123,108,255,.16); }
.kp-apps h3 { margin-bottom: 14px; font-family: var(--f-mono); font-size: 11.5px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: #4B3BC9; }
.kp-apps ul { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.kp-apps li { display: flex; align-items: center; gap: 12px; font-family: var(--f-label); font-size: 14.5px; font-weight: 600; }
.kp-apps__av { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: hsl(var(--h) 80% 94%); color: hsl(var(--h) 55% 38%); font-family: var(--f-display); font-size: 15px; font-weight: 700; }
.kp-faq { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.kp-faq__head .x-h2 { margin-top: 18px; }
.kp-faq__head .x-lead { margin-top: 20px; }
.kp-faq__list { display: grid; gap: 14px; }
.kp-faq summary { display: flex; justify-content: flex-end; cursor: pointer; list-style: none; }
.kp-faq summary::-webkit-details-marker { display: none; }
.kp-faq summary .kp-msg { max-width: 86%; font-family: var(--f-display); font-size: 16px; font-weight: 600; animation: none; transition: background .3s; }
.kp-faq summary:hover .kp-msg { background: #1A1F3D; }
.kp-faq details > .kp-msg { max-width: 90%; margin-top: 10px; background: #fff; font-size: 15.5px; }

@media (max-width: 1080px) {
  .ki-hero__grid, .kd-hero__grid, .kc-core__grid, .k-split, .ki-code, .ki-scrolly, .ka-auto, .ka-ring, .kd-scan, .kd-why, .kp-check, .kp-faq, .kp-convo__panel { grid-template-columns: minmax(0, 1fr); }
  .kc-core__copy, .k-split__copy, .kp-check__copy { position: static; }
  .kc-stack li { position: relative; top: auto; }
  .k-tiers, .ki-spot, .ka-flip, .kp-apps, .k-stackcols, .k-lines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .k-stackcols > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .ki-scrolly__stage { display: none; }
  .ki-scrolly__steps article { min-height: 0; padding: 24px 0 24px 22px; opacity: 1; border-color: var(--blue); }
  .ki-scrolly__inline { position: static; width: auto; height: auto; overflow: visible; clip: auto; margin: 4px 0; }
  .ki-scrolly__mini { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: #EEF4FF; color: var(--blue-700); }
  .ki-scrolly__mini svg { width: 22px; height: 22px; }
  .ki-pipe { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .ki-pipe::before, .ki-pipe::after { left: 23px; right: auto; top: 24px; bottom: 24px; width: 2px; height: auto; }
  .ki-pipe::after { transform: scaleY(0); transform-origin: 50% 0; }
  .ki-pipe.is-in::after { transform: none; }
  .ki-pipe li { padding-left: 72px; }
  .ki-pipe__node { position: absolute; left: 0; top: 0; }
  .ki-pipe h3 { margin-top: 10px; }
  .kp-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kp-bento__t--3, .kp-bento__t--4 { grid-column: auto; }
  .kd-flow { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .kd-flow__arrow { height: 30px; transform: rotate(90deg); }
  .k-hacc { flex-direction: column; height: auto; }
  .k-hacc__p { flex: none; }
  .k-hacc__tab { position: relative; flex-direction: row; justify-content: flex-start; align-items: center; gap: 14px; padding: 16px 18px; }
  .k-hacc__p.is-on .k-hacc__tab { padding: 18px 18px 0; }
  .k-hacc__t { writing-mode: horizontal-tb; transform: none; white-space: normal; font-size: 18px; }
  .k-hacc__p.is-on .k-hacc__t { opacity: 1; }
  .k-hacc__body { position: static; display: none; min-width: 0; padding: 18px 22px 24px; }
  .k-hacc__body h3 { display: none; }
  .k-hacc__p.is-on .k-hacc__body { display: flex; }
  .k-compare__row { grid-template-columns: minmax(0, 1fr); }
  .k-compare__row--h { display: none; }
  .k-compare__row + .k-compare__row > .k-compare__yes { border-top: 0; }
  .k-inline { grid-template-columns: minmax(0, 1fr); }
  .k-rows a { grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 6px 18px; }
  .k-rows__d { grid-column: 2; grid-row: 2; }
  .k-rows__go { grid-column: 3; grid-row: 1; width: 40px; height: 40px; }
  .kd-acc__head { grid-template-columns: 44px minmax(0, 1fr) 40px; gap: 6px 18px; }
  .kd-acc__d { grid-column: 2; grid-row: 2; }
  .kd-acc__pm { grid-column: 3; grid-row: 1; }
  .kd-acc__body > div { padding-left: 0; }
  .ka-ring__copy { text-align: left; }
}
@media (max-width: 760px) {
  .ka-ring__dial { width: 100%; aspect-ratio: auto; }
  .ka-ring__track, .ka-ring__arc { display: none; }
  .ka-ring__dial [role="tablist"] { display: flex; flex-wrap: wrap; gap: 8px; }
  .ka-ring__dial button { position: static; flex-direction: row; width: auto; padding: 8px 14px 8px 10px; transform: none; border-radius: 999px; border: 1px solid var(--line-2); }
  .ka-ring__dial button i { width: 12px; height: 12px; }
  .ka-ring__dial button span { padding: 0; background: none; }
  .ka-ring__core { position: static; display: block; margin-top: 18px; padding: 24px; border-radius: 22px; text-align: left; }
  .ka-ring__panel { padding: 0; }
}
@media (max-width: 680px) {
  .k-tiers, .ki-spot, .ka-flip, .kp-apps, .k-stackcols, .k-lines, .kp-bento, .kd-checks, .kd-quad, .ka-qa, .k-hacc__body .k-ticks, .kd-acc__body .k-ticks { grid-template-columns: minmax(0, 1fr); }
  .kp-bento__t--0 { grid-column: auto; }
  .k-stackcols > div + div { padding-left: 0; border-left: 0; }
  .kd-quad article { border-right: 0 !important; border-bottom: 1px solid var(--line); }
  .kc-quote, .ki-term__body, .ka-glow__in, .kd-drop, .kp-secure, .k-toggle__panel { grid-template-columns: minmax(0, 1fr); }
  .k-toggle__bar { grid-template-columns: repeat(2, minmax(0, 1fr)); border-radius: 22px; }
  .k-toggle__pill { display: none; }
  .k-toggle__bar button[aria-selected="true"] { background: var(--ink-950); }
  .kd-zig::before { left: 18px; }
  .kd-zig li, .kd-zig li:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 0 48px; }
  .kd-zig li + li { margin-top: 18px; }
  .kd-zig li::before, .kd-zig li:nth-child(even)::before { left: 9px; right: auto; }
  .kd-zig li::after { display: none; }
  .kd-out { width: 64%; }
}

/* ==========================================================================
   AI by Industry — AI for BFSI (kb-, navy and gold), Healthcare (kh-, calm sky blue), Logistics (kl-, asphalt and
   amber) and Retail (kr-, cream and coral). Photography-led components; shared parts come from the k- kit above.
   ========================================================================== */
.kh-hero .x-crumbs, .kr-hero .x-crumbs { color: var(--text-3); flex-wrap: wrap; }
.kb-hero .x-crumbs, .kl-hero .x-crumbs { color: rgba(255,255,255,.6); flex-wrap: wrap; }
.kb-hero h1, .kh-hero h1, .kl-hero h1, .kr-hero h1 { font-size: clamp(40px, 4.8vw, 72px); line-height: 1.02; letter-spacing: -.045em; }
.kb-hero .x-hero__ctas, .kh-hero .x-hero__ctas, .kl-hero .x-hero__ctas, .kr-hero .x-hero__ctas { margin-top: 34px; }
.kb-hero__lead, .kh-hero__lead, .kl-hero__lead, .kr-hero__lead { margin-top: 24px; max-width: 540px; font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.65; color: var(--text-2); }
.kb-hero__lead, .kl-hero__lead { color: var(--on-dark-2); }

/* ---------- AI for BFSI ---------- */
.kb-navy { background: #0A1330; }
.acp--bfsi .ac-trust { background: #0A1330; }
.kb-navy .x-h2 em, .kb-hero h1 em, .kb-stage .x-h2 em { color: #E9B949; }
.kb-navy .x-k, .kb-hero .x-k, .kb-stage .x-k { color: #E9B949; }
.kb-hero { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 0; background: radial-gradient(900px 600px at 80% 30%, rgba(47,107,255,.25), transparent 70%), #0A1330; color: #fff; }
.kb-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); align-items: center; padding-bottom: clamp(56px, 6vw, 88px); }
.kb-hero .x-k { margin-bottom: 20px; }
.kb-hero h1 { color: #fff; }
.kb-stack { position: relative; height: clamp(380px, 38vw, 520px); }
.kb-stack img, .kb-alert, .kb-chip { transition: translate .6s var(--ease-out); }
.kb-stack img { position: absolute; object-fit: cover; border-radius: 22px; box-shadow: 0 40px 80px -40px rgba(0,0,0,.8); }
.kb-stack__a { left: 6%; top: 6%; width: 68%; height: 62%; transform: rotate(-3deg); }
.kb-stack__b { right: 0; top: 32%; width: 48%; height: 44%; transform: rotate(4deg); border: 4px solid #0A1330; }
.kb-stack__c { left: 0; bottom: 0; width: 44%; height: 36%; transform: rotate(2deg); border: 4px solid #0A1330; }
.kb-alert { position: absolute; right: 2%; top: 0; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; border-radius: 16px; background: rgba(255,255,255,.96); color: var(--text); box-shadow: 0 24px 50px -20px rgba(0,0,0,.6); animation: kbFloat 5s ease-in-out infinite; }
.kb-alert__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #FFF1DD; color: #C77700; }
.kb-alert__ic svg { width: 20px; height: 20px; }
.kb-alert strong { display: block; font-family: var(--f-label); font-size: 14px; }
.kb-alert small { font-size: 12.5px; color: var(--text-3); }
.kb-chip { position: absolute; left: 36%; bottom: 6%; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; background: #E9B949; color: #0A1330; font-family: var(--f-label); font-size: 13.5px; font-weight: 700; box-shadow: 0 20px 40px -18px rgba(0,0,0,.6); animation: kbFloat 6s ease-in-out -2s infinite; }
.kb-chip svg { width: 16px; height: 16px; stroke-width: 2.6; }
@keyframes kbFloat { 50% { transform: translateY(-8px); } }
.kb-tape { overflow: hidden; padding: 15px 0; border-top: 1px solid var(--line-dark); background: rgba(255,255,255,.03); }
.kb-tape__t { display: flex; gap: 44px; width: max-content; animation: acMarq 50s linear infinite; }
.kb-tape span { display: inline-flex; align-items: center; gap: 10px; font-family: var(--f-mono); font-size: 13px; color: var(--on-dark-2); white-space: nowrap; }
.kb-tape b { font-weight: 500; color: #fff; }
.kb-tape i { width: 8px; height: 8px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 4px rgba(34,197,94,.16); }
.kb-tape .is-warn i { background: #F59E0B; box-shadow: 0 0 0 4px rgba(245,158,11,.16); }
.kb-tape .is-info i { background: var(--teal); box-shadow: 0 0 0 4px rgba(94,242,225,.16); }
.kb-reveal { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-dark-2); }
.kb-reveal a { display: grid; grid-template-columns: 120px minmax(0, 1fr) minmax(0, 1fr) 48px; gap: 24px; align-items: center; padding: 30px 0; border-bottom: 1px solid var(--line-dark-2); color: var(--on-dark); transition: padding .5s var(--ease-out); }
.kb-reveal a:hover, .kb-reveal a:focus-visible { padding-left: 18px; }
.kb-reveal__tag { justify-self: start; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(233,185,73,.4); color: #E9B949; font-family: var(--f-mono); font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; }
.kb-reveal strong { font-family: var(--f-display); font-size: clamp(24px, 3vw, 42px); font-weight: 600; line-height: 1.05; letter-spacing: -.04em; color: #fff; transition: color .3s; }
.kb-reveal a:hover strong, .kb-reveal a:focus-visible strong { color: #E9B949; }
.kb-reveal__d { font-size: 15.5px; line-height: 1.6; color: var(--on-dark-2); }
.kb-reveal__go { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--line-dark-2); transition: background .3s, border-color .3s, color .3s, transform .5s var(--ease-out); }
.kb-reveal__go svg { width: 18px; height: 18px; stroke-width: 1.9; }
.kb-reveal a:hover .kb-reveal__go { background: #E9B949; border-color: #E9B949; color: #0A1330; transform: rotate(-45deg); }
.kb-reveal__thumb { display: none; }
.kb-reveal__float { position: fixed; left: 0; top: 0; z-index: 40; width: 300px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; pointer-events: none; opacity: 0; transform: translate(-50%, -50%) scale(.8) rotate(-4deg); box-shadow: 0 40px 80px -30px rgba(0,0,0,.7); transition: opacity .3s, transform .45s var(--ease-out); }
.kb-reveal__float.is-on { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-4deg); }
.kb-stage { position: relative; overflow: hidden; isolation: isolate; padding: clamp(80px, 9vw, 130px) 0; background: #0A1330; color: #fff; }
.kb-stage__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.08); transition: opacity 1s var(--ease), transform 7s linear; }
.kb-stage__bg.is-on { opacity: 1; transform: scale(1); }
.kb-stage::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(10,19,48,.95) 0%, rgba(10,19,48,.8) 45%, rgba(10,19,48,.5) 100%); }
.kb-stage .x-h2 { max-width: 14ch; margin-top: 18px; color: #fff; }
.kb-stage__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); align-items: start; margin-top: clamp(36px, 4.5vw, 56px); }
.kb-stage__tabs { display: grid; }
.kb-stage__tabs button { position: relative; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.14); text-align: left; font-family: var(--f-display); font-size: clamp(18px, 1.6vw, 22px); font-weight: 600; letter-spacing: -.02em; color: rgba(238,241,255,.5); transition: color .3s, padding .4s var(--ease-out); }
.kb-stage__tabs button:last-child { border-bottom: 1px solid rgba(255,255,255,.14); }
.kb-stage__tabs button:hover { color: #fff; }
.kb-stage__tabs button[aria-selected="true"] { padding-left: 14px; color: #fff; }
.kb-stage__tabs i { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #E9B949; transform: scaleX(0); transform-origin: 0 50%; }
.kb-stage:not(.is-run) [aria-selected="true"] i { transform: none; }
.kb-stage.is-run [aria-selected="true"] i { animation: kaFill var(--dur, 7s) linear forwards; }
.kb-stage__panel { padding: clamp(26px, 3.5vw, 44px); border-radius: 26px; background: rgba(10,19,48,.55); border: 1px solid rgba(255,255,255,.14); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); --k-tick: #E9B949; }
.kb-stage__panel.is-in { animation: acPanel .6s var(--ease-out) both; }
.kb-stage__panel .ac-ic { background: rgba(233,185,73,.14); color: #E9B949; }
.kb-stage__panel h3 { margin-top: 20px; font-size: clamp(26px, 2.6vw, 36px); letter-spacing: -.035em; color: #fff; }
.kb-stage__panel > p { margin-top: 12px; font-size: 16.5px; line-height: 1.65; color: rgba(238,241,255,.82); }
.kb-stage__panel .k-ticks { grid-template-columns: 1fr 1fr; gap: 12px 24px; margin: 22px 0 28px; color: #fff; }
.kb-switch { max-width: 980px; margin: 0 auto; }
.kb-switch__bar { display: flex; align-items: center; justify-content: center; gap: 18px; margin-bottom: 34px; font-family: var(--f-label); font-size: 15px; font-weight: 600; color: var(--text-3); }
.kb-switch__bar span { transition: color .3s; }
.kb-switch:not(.is-on) .kb-switch__bar span:first-child, .kb-switch.is-on .kb-switch__bar span:last-child { color: var(--text); }
.kb-switch__btn { position: relative; width: 72px; height: 38px; border-radius: 999px; background: #D7DAE3; transition: background .4s; }
.kb-switch.is-on .kb-switch__btn { background: #0A1330; }
.kb-switch__btn i { position: absolute; left: 4px; top: 4px; width: 30px; height: 30px; border-radius: 50%; background: #fff; box-shadow: 0 4px 10px rgba(0,0,0,.2); transition: transform .5s var(--ease-out), background .4s; }
.kb-switch.is-on .kb-switch__btn i { transform: translateX(34px); background: #E9B949; }
.kb-switch__rows { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.kb-switch__rows li { display: grid; grid-template-columns: minmax(0, .45fr) minmax(0, 1.55fr); gap: 20px; align-items: center; padding: 20px 24px; border-radius: 18px; background: #fff; border: 1px solid var(--line); transition: background .5s, border-color .5s; transition-delay: calc(var(--k) * 90ms); }
.kb-switch.is-on .kb-switch__rows li { background: #0A1330; border-color: #0A1330; }
.kb-switch__rows strong { font-family: var(--f-display); font-size: 17px; letter-spacing: -.02em; transition: color .5s; transition-delay: inherit; }
.kb-switch.is-on .kb-switch__rows strong { color: #E9B949; }
.kb-switch__cell { display: grid; }
.kb-switch__cell p { grid-area: 1 / 1; font-size: 15.5px; line-height: 1.55; transition: opacity .4s, transform .5s var(--ease-out); transition-delay: inherit; }
.kb-switch__off { color: var(--text-2); }
.kb-switch__on { color: #fff; opacity: 0; transform: translateY(10px); }
.kb-switch.is-on .kb-switch__off { opacity: 0; transform: translateY(-10px); }
.kb-switch.is-on .kb-switch__on { opacity: 1; transform: none; }
.kb-tl { display: grid; grid-auto-flow: column; grid-auto-columns: min(340px, 80vw); gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; list-style: none; margin: 0; padding: 6px max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))) 10px; scroll-padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))); cursor: grab; }
.kb-tl::-webkit-scrollbar { display: none; }
.kb-tl li { scroll-snap-align: start; }
.kb-tl figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 20px; }
.kb-tl img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; transition: transform .8s var(--ease-out); }
.kb-tl li:hover img { transform: scale(1.06); }
.kb-tl__dot { position: relative; display: block; height: 2px; margin: 26px 0 22px; background: var(--line-dark-2); }
.kb-tl li:not(:last-child) .kb-tl__dot { margin-right: -22px; }
.kb-tl__dot::before { content: ""; position: absolute; left: 0; top: -6px; width: 14px; height: 14px; border-radius: 50%; background: #E9B949; box-shadow: 0 0 0 6px rgba(233,185,73,.18); }
.kb-tl h3 { font-size: 20px; letter-spacing: -.025em; color: #fff; }
.kb-tl p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--on-dark-2); }
.kb-navy .k-progress { background: var(--line-dark-2); }
.kb-seals { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; list-style: none; margin: 0; padding: 0; }
.kb-seals li { position: relative; display: grid; justify-items: center; align-content: start; text-align: center; }
.kb-seals svg { width: 100%; max-width: 150px; aspect-ratio: 1; animation: kaSpin 24s linear infinite; }
.kb-seals text { font-family: var(--f-mono); font-size: 8.2px; letter-spacing: 1.8px; fill: var(--text-3); }
.kb-seals b { position: absolute; top: 0; left: 50%; z-index: 0; display: grid; place-items: center; width: min(100%, 150px); aspect-ratio: 1; transform: translateX(-50%); font-family: var(--f-display); font-size: 16px; letter-spacing: -.02em; color: #fff; }
.kb-seals b::before { content: ""; position: absolute; inset: 21%; z-index: -1; border-radius: 50%; background: #0A1330; transition: background .3s, transform .5s var(--ease-out); }
.kb-seals li:hover b { color: #0A1330; }
.kb-seals li:hover b::before { background: #E9B949; transform: scale(1.08); }
.kb-seals span { margin-top: 12px; font-size: 13.5px; line-height: 1.5; color: var(--text-2); }

/* ---------- AI for Healthcare ---------- */
.kh-soft { background: #F2F7FB; }
.acp--health .ac-ic { background: #E4F0FB; color: #1E6FB8; }
.kh-hero { position: relative; overflow: hidden; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 clamp(56px, 7vw, 96px); background: radial-gradient(800px 500px at 85% 20%, rgba(56,163,232,.16), transparent 70%), #F7FBFE; }
.kh-hero__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.kh-hero .x-k { margin-bottom: 20px; color: #1E6FB8; }
.kh-hero h1 em { color: #1E88D6; }
.kh-visual { position: relative; padding: 20px 0 30px 40px; }
.kh-visual__img { display: block; width: 100%; aspect-ratio: 5 / 4; object-fit: cover; border-radius: 220px 28px 28px 28px; box-shadow: 0 50px 90px -50px rgba(20,60,100,.5); }
.kh-float { position: absolute; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 18px; background: rgba(255,255,255,.93); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 24px 50px -24px rgba(20,60,100,.45); font-family: var(--f-label); animation: kbFloat 6s ease-in-out infinite; }
.kh-float--a { left: 0; top: 34%; flex-direction: column; align-items: flex-start; gap: 6px; width: 230px; }
.kh-float--b { right: -10px; bottom: 6%; animation-delay: -2s; }
.kh-float--c { right: 8%; top: 4%; font-size: 13px; font-weight: 600; animation-delay: -4s; }
.kh-float--c svg { width: 18px; height: 18px; color: #1E88D6; }
.kh-float--a small { font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.kh-float strong { font-size: 14.5px; }
.kh-float--b small { display: block; font-size: 12.5px; color: var(--text-3); }
.kh-ecg { width: 100%; height: 40px; fill: none; stroke: #E5484D; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 300; animation: khEcg 2.6s linear infinite; }
@keyframes khEcg { from { stroke-dashoffset: 300; } to { stroke-dashoffset: -300; } }
.kh-pill { padding: 4px 10px; border-radius: 999px; background: #FDECEC; color: #C2262E; font-size: 12px; font-weight: 700; }
.kh-tick { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #16A34A; color: #fff; }
.kh-tick svg { width: 18px; height: 18px; stroke-width: 2.6; }
.acp--health .ac-trust { background: #F7FBFE; }
.kh-mosaic { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 230px; gap: 14px; }
.kh-mosaic__t--0 { grid-column: span 2; grid-row: span 2; }
.kh-mosaic__t--3, .kh-mosaic__t--4, .kh-mosaic__t--5 { grid-column: span 2; }
.kh-mosaic__t { position: relative; isolation: isolate; overflow: hidden; margin: 0; border-radius: 24px; outline: none; }
.kh-mosaic__t img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }
.kh-mosaic__t::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, transparent 30%, rgba(6,30,50,.9)); }
.kh-mosaic__t:hover img, .kh-mosaic__t:focus-visible img { transform: scale(1.07); }
.kh-mosaic__t:focus-visible { box-shadow: 0 0 0 3px #1E88D6; }
.kh-mosaic figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px; color: #fff; }
.kh-mosaic figcaption span { display: inline-block; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.18); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.kh-mosaic strong { display: block; margin-top: 10px; font-family: var(--f-display); font-size: clamp(19px, 1.7vw, 24px); letter-spacing: -.025em; }
.kh-mosaic p { max-height: 0; margin-top: 0; overflow: hidden; opacity: 0; font-size: 14.5px; line-height: 1.55; color: rgba(255,255,255,.86); transition: max-height .5s var(--ease-out), opacity .4s, margin .4s; }
.kh-mosaic__t:hover p, .kh-mosaic__t:focus-visible p, .kh-mosaic__t--0 p { max-height: 90px; margin-top: 8px; opacity: 1; }
.kh-acc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.kh-acc__item { border-bottom: 1px solid var(--line); }
.kh-acc__item:first-child { border-top: 1px solid var(--line); }
.kh-acc__item > button { display: grid; grid-template-columns: 48px minmax(0, 1fr) 28px; gap: 16px; align-items: center; width: 100%; padding: 20px 0; text-align: left; }
.kh-acc__item strong { font-family: var(--f-display); font-size: clamp(18px, 1.6vw, 21px); font-weight: 600; letter-spacing: -.02em; transition: color .3s; }
.kh-acc__item > button:hover strong, .kh-acc__item > button[aria-selected="true"] strong { color: #1E6FB8; }
.kh-acc__pm { position: relative; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line-2); transition: transform .4s var(--ease-out), background .3s, border-color .3s, color .3s; }
.kh-acc__pm::before, .kh-acc__pm::after { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 2px; margin: -1px 0 0 -5px; background: currentColor; }
.kh-acc__pm::after { transform: rotate(90deg); }
[aria-selected="true"] .kh-acc__pm { transform: rotate(45deg); background: #1E6FB8; border-color: #1E6FB8; color: #fff; }
.kh-acc__panel { padding: 0 0 26px 64px; --k-tick: #1E88D6; }
.kh-acc__panel.is-in { animation: acPanel .5s var(--ease-out) both; }
.kh-acc__panel > p { font-size: 16px; line-height: 1.6; color: var(--text-2); }
.kh-acc__panel .k-ticks { margin: 16px 0 20px; }
.kh-acc__media { position: sticky; top: calc(var(--header-h) + 40px); aspect-ratio: 4 / 5; overflow: hidden; border-radius: 28px 28px 160px 28px; background: #DCEAF6; }
.kh-acc__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .7s var(--ease), transform 1.2s var(--ease-out); }
.kh-acc__media img.is-on { opacity: 1; transform: none; }
.kh-journey { position: relative; height: 350px; }
.kh-journey__path { position: absolute; left: 0; top: 0; width: 100%; height: 220px; overflow: visible; }
.kh-journey__path path { fill: none; stroke: #1E88D6; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 3000; stroke-dashoffset: 3000; vector-effect: non-scaling-stroke; transition: stroke-dashoffset 2.6s var(--ease); }
.kh-journey.is-in path { stroke-dashoffset: 0; }
.kh-journey ol { list-style: none; margin: 0; padding: 0; }
.kh-journey li { position: absolute; left: var(--x); top: var(--y); width: 180px; transform: translate(-50%, -28px); text-align: center; }
.kh-journey__dot { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto; border-radius: 50%; background: #fff; border: 2px solid #1E88D6; color: #1E6FB8; box-shadow: 0 0 0 8px rgba(30,136,214,.1); transform: scale(0); transition: transform .6s var(--ease-out); transition-delay: calc(.3s + var(--k) * .35s); }
.kh-journey__dot svg { width: 24px; height: 24px; }
.kh-journey.is-in .kh-journey__dot { transform: none; }
.kh-journey h3 { margin-top: 14px; font-size: 17.5px; letter-spacing: -.02em; }
.kh-journey p { margin-top: 6px; font-size: 14px; line-height: 1.55; color: var(--text-2); }
.kh-std { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.kh-std .x-h2 { margin-top: 18px; }
.kh-std .x-lead { margin-top: 22px; }
.kh-std ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; list-style: none; margin: 0; padding: 0; }
.kh-std li { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; padding: 22px; border-radius: 20px; background: #fff; border: 1px solid var(--line); transition: border-color .3s, transform .5s var(--ease-out); }
.kh-std li:hover { border-color: rgba(30,136,214,.4); transform: translateY(-3px); }
.kh-std strong { font-family: var(--f-display); font-size: 18px; letter-spacing: -.02em; }
.kh-std p { margin-top: 4px; font-size: 14.5px; line-height: 1.55; color: var(--text-2); }
.kh-banner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); overflow: hidden; border-radius: var(--r-xl); background: #0B2A45; color: #fff; }
.kh-banner img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; }
.kh-banner > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; padding: clamp(32px, 4.5vw, 60px); }
.kh-banner h2 { font-size: clamp(30px, 3.4vw, 50px); line-height: 1.05; letter-spacing: -.04em; color: #fff; }
.kh-banner h2 em { color: #7CC4F5; }
.kh-banner p { max-width: 460px; font-size: 16.5px; line-height: 1.6; color: rgba(238,241,255,.82); }

/* ---------- AI for Logistics ---------- */
.kl-asphalt { background: #0E1116; }
.acp--logi .ac-trust { background: #0E1116; }
.kl-asphalt .x-h2 em, .kl-hero h1 em { color: #FFB020; }
.kl-asphalt .x-k, .kl-hero .x-k { color: #FFB020; }
.kl-hero { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(48px, 6vw, 90px)) 0 clamp(56px, 7vw, 96px); background: #0E1116; color: #fff; }
.kl-hero__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; opacity: .5; animation: acZoom 18s var(--ease) both; }
.kl-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14,17,22,.96), rgba(14,17,22,.72) 50%, rgba(14,17,22,.5)); }
.kl-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.kl-hero .x-k { margin-bottom: 20px; }
.kl-hero h1 { color: #fff; }
.kl-map { position: relative; }
.kl-map svg { display: block; width: 100%; height: auto; overflow: visible; }
.kl-route { fill: none; stroke: rgba(255,176,32,.4); stroke-width: 2; stroke-dasharray: 6 8; animation: kiDash 1.4s linear infinite; }
.kl-truck { fill: #FFB020; filter: drop-shadow(0 0 6px rgba(255,176,32,.9)); }
.kl-city circle { fill: #0E1116; stroke: #FFB020; stroke-width: 2.5; }
.kl-city .halo { fill: rgba(255,176,32,.2); stroke: none; transform-box: fill-box; transform-origin: center; animation: kiRing 2.8s ease-out infinite; }
.kl-city text { fill: #fff; font-family: var(--f-label); font-size: 14px; font-weight: 600; paint-order: stroke; stroke: rgba(14,17,22,.8); stroke-width: 4px; }
.kl-eta { position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 14px; background: rgba(255,255,255,.96); color: var(--text); font-family: var(--f-label); box-shadow: 0 24px 50px -20px rgba(0,0,0,.6); animation: kbFloat 5s ease-in-out infinite; }
.kl-eta i { width: 10px; height: 10px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 5px rgba(34,197,94,.2); }
.kl-eta strong { display: block; font-size: 13.5px; }
.kl-eta small { font-size: 12px; color: var(--text-3); }
.kl-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kl-cards article { position: relative; isolation: isolate; overflow: hidden; aspect-ratio: 4 / 5; border-radius: 22px; outline: none; }
.kl-cards img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); transition: transform 1s var(--ease-out), filter .6s; }
.kl-cards article::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(14,17,22,0) 30%, rgba(14,17,22,.94)); }
.kl-cards article > div { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px; transform: translateY(calc(100% - 92px)); transition: transform .6s var(--ease-out); }
.kl-cards h3 { font-size: 22px; letter-spacing: -.025em; color: #fff; }
.kl-cards h3::before { content: ""; display: block; width: 32px; height: 3px; margin-bottom: 14px; background: #FFB020; }
.kl-cards p { margin-top: 10px; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.86); opacity: 0; transition: opacity .4s .1s; }
.kl-cards article:hover > div, .kl-cards article:focus-visible > div { transform: none; }
.kl-cards article:hover p, .kl-cards article:focus-visible p { opacity: 1; }
.kl-cards article:hover img, .kl-cards article:focus-visible img { transform: scale(1.08); filter: saturate(1.05); }
.kl-cards article:focus-visible { box-shadow: 0 0 0 3px #FFB020; }
.kl-track__bar { position: relative; height: 100px; margin: 0 clamp(36px, 5vw, 70px) 26px; }
.kl-track__line { position: absolute; left: 0; right: 0; top: 46px; height: 6px; overflow: hidden; border-radius: 6px; background: #E6E8EE; }
.kl-track__line i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #FFB020, #FF7A1A); transform: scaleX(calc(var(--i, 0) / (var(--n) - 1))); transform-origin: 0 50%; transition: transform .9s var(--ease-out); }
.kl-track__truck { position: absolute; top: 0; left: calc(var(--i, 0) * 100% / (var(--n) - 1)); z-index: 2; display: grid; place-items: center; width: 46px; height: 34px; margin-left: -23px; border-radius: 10px; background: #0E1116; color: #FFB020; box-shadow: 0 12px 24px -12px rgba(0,0,0,.6); transition: left .9s var(--ease-out); }
.kl-track__truck svg { width: 22px; height: 22px; }
.kl-track__truck::after { content: ""; position: absolute; left: 50%; bottom: -6px; margin-left: -6px; border: 6px solid transparent; border-top-color: #0E1116; border-bottom: 0; }
.kl-track__bar [role="tab"] { position: absolute; top: 38px; display: flex; flex-direction: column; align-items: center; gap: 12px; transform: translateX(-50%); font-family: var(--f-label); font-size: 13.5px; font-weight: 600; white-space: nowrap; color: var(--text-3); transition: color .3s; }
.kl-track__bar [role="tab"] i { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 3px solid #D4D8E1; transition: border-color .4s, background .4s; }
.kl-track__bar [role="tab"]:hover, .kl-track__bar [aria-selected="true"] { color: var(--text); }
.kl-track__bar [aria-selected="true"] i { background: #FFB020; border-color: #FF7A1A; }
.kl-track__panel { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 56px); align-items: center; padding: clamp(16px, 2vw, 22px); border-radius: 30px; background: #fff; border: 1px solid var(--line); box-shadow: 0 40px 80px -60px rgba(10,12,24,.5); --k-tick: #FF7A1A; }
.kl-track__panel.is-in { animation: acPanel .6s var(--ease-out) both; }
.kl-track__panel img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; }
.kl-track__panel > div { padding-right: clamp(8px, 2vw, 24px); }
.acp--logi .ac-ic { background: #FFF3DC; color: #B26A00; }
.kl-track__panel h3 { margin-top: 18px; font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -.035em; }
.kl-track__panel p { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--text-2); }
.kl-track__panel .k-ticks { margin: 20px 0 26px; }
.kl-tower { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.kl-tower .x-h2 { margin-top: 18px; }
.kl-tower .x-lead { margin-top: 22px; }
.kl-tower .btn { margin-top: 30px; }
.kl-dash { overflow: hidden; border-radius: 22px; background: #12161D; border: 1px solid rgba(255,255,255,.1); box-shadow: 0 50px 100px -50px rgba(255,176,32,.35); }
.kl-dash__bar { display: flex; align-items: center; gap: 7px; padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.08); font-family: var(--f-mono); font-size: 12.5px; color: var(--on-dark-3); }
.kl-dash__bar i { width: 11px; height: 11px; border-radius: 50%; background: #FF5F57; }
.kl-dash__bar i:nth-child(2) { background: #FEBC2E; }
.kl-dash__bar i:nth-child(3) { background: #28C840; }
.kl-dash__bar span { margin-left: 10px; }
.kl-dash__bar b { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-weight: 500; color: #22C55E; }
.kl-dash__bar b::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #22C55E; animation: klBlink 1.4s ease-in-out infinite; }
@keyframes klBlink { 50% { opacity: .3; } }
.kl-dash__body { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 1px; background: rgba(255,255,255,.06); }
.kl-dash__body > div { padding: 20px; background: #12161D; }
.kl-dash small { display: block; margin-bottom: 14px; font-family: var(--f-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--on-dark-3); }
.kl-dash__lanes div { margin-bottom: 16px; }
.kl-dash__lanes span { display: block; margin-bottom: 7px; font-family: var(--f-label); font-size: 13px; color: var(--on-dark); }
.kl-dash__lanes i { display: block; width: var(--w); height: 8px; border-radius: 6px; background: linear-gradient(90deg, #FFB020, #FF7A1A); transform-origin: 0 50%; animation: klGrow 3s var(--ease-out) infinite alternate; }
@keyframes klGrow { from { transform: scaleX(.7); } }
.kl-dash__feed { height: 280px; overflow: hidden; -webkit-mask: linear-gradient(transparent, #000 10%, #000 90%, transparent); mask: linear-gradient(transparent, #000 10%, #000 90%, transparent); }
.kl-dash__feed ul { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; animation: klFeed 18s linear infinite; }
@keyframes klFeed { to { transform: translateY(calc(-50% - 5px)); } }
.kl-dash__feed li { display: grid; gap: 3px; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.04); border-left: 3px solid #22C55E; font-family: var(--f-label); font-size: 13px; color: var(--on-dark-2); }
.kl-dash__feed .is-warn { border-left-color: #F59E0B; }
.kl-dash__feed .is-info { border-left-color: var(--teal); }
.kl-dash__feed b { font-size: 13.5px; color: #fff; }
.kl-dash__feed em { font-style: normal; font-weight: 600; color: #FFB020; }
.kl-road { position: relative; max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; }
.kl-road::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 64px; margin-left: -32px; border-radius: 32px; background: #1A1F28; }
.kl-road::after { content: ""; position: absolute; left: 50%; top: 20px; bottom: 20px; width: 4px; margin-left: -2px; background: repeating-linear-gradient(#FFB020 0 22px, transparent 22px 44px); animation: klLane 1.2s linear infinite; }
@keyframes klLane { to { background-position: 0 44px; } }
.kl-road li { position: relative; z-index: 1; width: 50%; padding: 0 76px 0 0; }
.kl-road li + li { margin-top: -26px; }
.kl-road li:nth-child(even) { margin-left: 50%; padding: 0 0 0 76px; }
.kl-road__sign { position: relative; padding: 22px 24px; border-radius: 14px; background: #FFB020; color: #1A1206; box-shadow: 0 20px 40px -24px rgba(178,106,0,.6); }
.kl-road__sign::after { content: ""; position: absolute; top: 50%; right: -44px; width: 44px; height: 4px; margin-top: -2px; background: #8A5A00; }
.kl-road li:nth-child(even) .kl-road__sign::after { right: auto; left: -44px; }
.kl-road h3 { font-size: 19px; letter-spacing: -.02em; }
.kl-road p { margin-top: 6px; font-size: 15px; line-height: 1.55; color: rgba(26,18,6,.8); }

/* ---------- AI for Retail ---------- */
.kr-soft { background: #FFF6EE; }
.acp--retail .x-h2 em, .acp--retail .k-faqc__more a { color: #E8553A; }
.acp--retail .k-sec .x-k { color: #D9472A; }
.acp--retail .ac-band { background: linear-gradient(115deg, #6E1F0F 0%, #D9472A 55%, #FF8A65 100%); }
.acp--health .k-sec .x-h2 em { color: #1E88D6; }
.acp--health .k-sec .x-k { color: #1E6FB8; }
.acp--logi .k-sec:not(.k-dark) .x-h2 em { color: #D97706; }
.acp--logi .k-sec:not(.k-dark) .x-k { color: #B26A00; }
.acp .x-dark .x-h2 em { color: var(--teal); }
.acp--retail .ac-ic { background: #FFE9E1; color: #D9472A; }
.kr-hero { position: relative; overflow: hidden; padding: calc(var(--header-h) + clamp(32px, 4vw, 56px)) 0 0; background: radial-gradient(700px 500px at 0% 10%, rgba(255,107,74,.13), transparent 70%), #FFFAF5; }
.kr-hero__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
.kr-hero__grid > div:first-child { padding-bottom: clamp(48px, 6vw, 80px); }
.kr-hero .x-k { margin-bottom: 20px; color: #D9472A; }
.kr-hero h1 em { color: #FF6B4A; }
.acp--retail .ac-trust { background: #FFFAF5; }
.kr-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; height: clamp(520px, 52vw, 680px); overflow: hidden; -webkit-mask: linear-gradient(transparent, #000 12%, #000 88%, transparent); mask: linear-gradient(transparent, #000 12%, #000 88%, transparent); }
.kr-col > div { display: grid; gap: 14px; animation: krUp 32s linear infinite; }
.kr-col--1 > div { animation-direction: reverse; animation-duration: 38s; }
.kr-col--2 > div { animation-duration: 27s; }
.kr-cols:hover .kr-col > div { animation-play-state: paused; }
@keyframes krUp { to { transform: translateY(calc(-50% - 7px)); } }
.kr-col img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 20px; }
.kr-hot { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .5fr); gap: 24px; align-items: start; }
.kr-hot__img { position: relative; }
.kr-hot__img > img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 28px; }
.kr-hot__pt { position: absolute; z-index: 2; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; background: rgba(255,255,255,.35); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: background .3s, transform .3s; }
.kr-hot__pt:hover { transform: scale(1.15); }
.kr-hot__pt i { position: absolute; inset: 8px; border-radius: 50%; background: #fff; animation: krPing 2s ease-out infinite; }
.kr-hot__pt.is-on { background: rgba(255,107,74,.5); }
.kr-hot__pt.is-on i { background: #FF6B4A; }
@keyframes krPing { from { box-shadow: 0 0 0 0 rgba(255,255,255,.75); } to { box-shadow: 0 0 0 18px rgba(255,255,255,0); } }
.kr-hot__card { position: absolute; z-index: 3; width: 280px; margin: 28px 0 0 -30px; padding: 18px; border-radius: 18px; background: #fff; box-shadow: 0 30px 60px -30px rgba(60,20,10,.55); }
.kr-hot__card.is-l { margin-left: -250px; }
.kr-hot__card.is-up { translate: 0 calc(-100% - 56px); }
.kr-hot__card.is-in { animation: acPanel .45s var(--ease-out) both; }
.kr-hot__card strong { display: block; margin-top: 12px; font-family: var(--f-display); font-size: 18px; letter-spacing: -.02em; }
.kr-hot__card p { margin-top: 6px; font-size: 14.5px; line-height: 1.55; color: var(--text-2); }
.kr-hot__list { display: grid; gap: 8px; }
.kr-hot__list button { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid transparent; text-align: left; font-family: var(--f-label); font-size: 14.5px; font-weight: 600; color: var(--text-2); transition: background .3s, border-color .3s, color .3s; }
.kr-hot__list button:hover { color: var(--text); }
.kr-hot__list button[aria-selected="true"] { background: #fff; border-color: rgba(255,107,74,.35); color: var(--text); box-shadow: 0 16px 32px -24px rgba(60,20,10,.5); }
.kr-hot__list .ac-ic { width: 38px; height: 38px; border-radius: 11px; }
.kr-hot__list .ac-ic svg { width: 18px; height: 18px; }
.kr-deck { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.kr-deck__list { display: grid; }
.kr-deck__list button { display: flex; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); text-align: left; font-family: var(--f-display); font-size: clamp(18px, 1.7vw, 23px); font-weight: 600; letter-spacing: -.02em; color: var(--text-3); transition: color .3s; }
.kr-deck__list button::before { content: ""; flex: none; width: 0; height: 3px; border-radius: 3px; background: #FF6B4A; transition: width .4s var(--ease-out); }
.kr-deck__list button:hover, .kr-deck__list [aria-current="true"] { color: var(--text); }
.kr-deck__list [aria-current="true"]::before { width: 26px; }
.kr-deck__nav { margin-top: 24px; }
.kr-deck__stack { position: relative; height: 600px; margin: 56px 80px 0 0; }
.kr-card { position: absolute; inset: 0; display: grid; grid-template-rows: 44% minmax(0, 1fr); overflow: hidden; border-radius: 28px; background: #fff; border: 1px solid rgba(60,20,10,.08); box-shadow: 0 40px 80px -50px rgba(60,20,10,.45); transform: translate(calc(var(--p) * 24px), calc(var(--p) * -16px)) scale(calc(1 - var(--p) * .05)); z-index: calc(20 - var(--p)); opacity: clamp(0, calc(1.25 - var(--p) * .3), 1); transition: transform .7s var(--ease-out), opacity .5s; --k-tick: #FF6B4A; }
.kr-card img { width: 100%; height: 100%; object-fit: cover; }
.kr-card > div { padding: 22px 28px; overflow: hidden; }
.kr-card h3 { margin-top: 12px; font-size: 24px; letter-spacing: -.03em; }
.kr-card p { margin-top: 6px; font-size: 15px; line-height: 1.55; color: var(--text-2); }
.kr-card .k-ticks { grid-template-columns: 1fr 1fr; gap: 8px 20px; margin: 14px 0 18px; }
.kr-card .k-ticks li { font-size: 14px; }
.kr-words { overflow: hidden; padding: clamp(26px, 4vw, 46px) 0; background: #FF6B4A; color: #fff; }
.kr-words__t { display: flex; width: max-content; animation: acMarq 34s linear infinite; }
.kr-words span { display: inline-flex; align-items: center; font-family: var(--f-display); font-size: clamp(44px, 7vw, 110px); font-weight: 700; line-height: 1; letter-spacing: -.05em; white-space: nowrap; }
.kr-words span::after { content: ""; display: inline-block; width: .3em; height: .3em; margin: 0 .55em; border-radius: 50%; background: #FFD8CC; }
.kr-words span:nth-child(even) { color: transparent; -webkit-text-stroke: 1.5px #fff; }
.kr-polar { display: grid; grid-auto-flow: column; grid-auto-columns: min(300px, 76vw); gap: 34px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; list-style: none; margin: 0; padding: 22px max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))) 24px; scroll-padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))); cursor: grab; }
.kr-polar::-webkit-scrollbar { display: none; }
.kr-polar li { scroll-snap-align: start; transform: rotate(var(--r)); transition: transform .5s var(--ease-out); }
.kr-polar li:hover { transform: rotate(0) translateY(-6px); }
.kr-polar figure { margin: 0; padding: 12px 12px 18px; border-radius: 4px; background: #fff; box-shadow: 0 24px 50px -28px rgba(60,20,10,.45); }
.kr-polar img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; pointer-events: none; }
.kr-polar figcaption { margin-top: 14px; font-family: var(--f-serif); font-size: 25px; line-height: 1.1; }
.kr-polar p { margin-top: 16px; padding: 0 6px; font-size: 15px; line-height: 1.6; color: var(--text-2); }
.kr-soft .k-progress { background: rgba(60,20,10,.12); }

@media (max-width: 1080px) {
  .kb-hero__grid, .kh-hero__grid, .kl-hero__grid, .kr-hero__grid, .kb-stage__grid, .kh-acc, .kh-std, .kl-tower, .kr-hot, .kr-deck, .kl-track__panel { grid-template-columns: minmax(0, 1fr); }
  .kb-reveal a { grid-template-columns: minmax(0, 1fr) 44px; gap: 10px 18px; }
  .kb-reveal__tag { grid-column: 1; }
  .kb-reveal strong, .kb-reveal__d { grid-column: 1; }
  .kb-reveal__go { grid-column: 2; grid-row: 1 / span 3; }
  .kb-reveal__thumb { display: block; grid-column: 1 / -1; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; }
  .kb-reveal__float { display: none; }
  .kb-seals { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kh-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kh-mosaic__t--0, .kh-mosaic__t--3, .kh-mosaic__t--4, .kh-mosaic__t--5 { grid-column: span 2; grid-row: auto; }
  .kh-acc__media { display: none; }
  .kh-journey { height: auto; }
  .kh-journey__path { display: none; }
  .kh-journey ol { display: grid; gap: 22px; }
  .kh-journey li { position: static; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 4px 16px; width: auto; transform: none; text-align: left; }
  .kh-journey__dot { grid-row: span 2; margin: 0; transform: none; }
  .kh-journey h3 { margin-top: 4px; }
  .kh-banner { grid-template-columns: minmax(0, 1fr); }
  .kh-banner img { min-height: 260px; }
  .kl-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kr-cols { height: 460px; }
  .kr-hot__card { position: static; width: auto; margin: 14px 0 0; translate: none !important; }
  .kr-deck__stack { margin-right: 60px; }
  .kl-track__bar { overflow-x: auto; }
}
@media (max-width: 680px) {
  .kb-seals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kb-stage__panel .k-ticks, .kr-card .k-ticks, .kh-std ul, .kl-cards { grid-template-columns: minmax(0, 1fr); }
  .kb-switch__rows li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .kh-mosaic { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 260px; }
  .kh-mosaic__t--0, .kh-mosaic__t--3, .kh-mosaic__t--4, .kh-mosaic__t--5 { grid-column: auto; }
  .kh-mosaic p { max-height: 90px; margin-top: 8px; opacity: 1; }
  .kh-float--a { display: none; }
  .kh-visual { padding-left: 0; }
  .kl-road::before { left: 26px; }
  .kl-road::after { left: 26px; }
  .kl-road li, .kl-road li:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 0 76px; }
  .kl-road li + li { margin-top: 16px; }
  .kl-road__sign::after, .kl-road li:nth-child(even) .kl-road__sign::after { right: auto; left: -18px; width: 18px; }
  .kl-track__bar { margin: 0 0 20px; height: 90px; }
  .kl-track__bar [role="tab"] span { display: none; }
  .kl-dash__body { grid-template-columns: minmax(0, 1fr); }
  .kr-cols { height: 360px; }
  .kr-deck__stack { height: 640px; margin: 40px 40px 0 0; }
  .kr-card { transform: translate(calc(var(--p) * 12px), calc(var(--p) * -10px)) scale(calc(1 - var(--p) * .04)); }
}
@media (hover: none) {
  .kh-mosaic p { max-height: 90px; margin-top: 8px; opacity: 1; }
  .kl-cards article > div { transform: none; }
  .kl-cards p { opacity: 1; }
}
@media (hover: none), (prefers-reduced-motion: reduce) {
  .ki-ai__pulse, .ki-ai__bdot, .ki-ai__halo, .ki-ai__ic, .ki-term__cur, .ki-mq__t,
  .ka-hero__aurora i, .ka-rot > span, .ka-hero__pills li, .ka-auto__orb, .ka-auto__ring, .ka-glow::before,
  .kd-scan__beam, .kd-drop__ic, .kd-flow__arrow svg, .kp-ui-bars i, .kp-secure__ic::before,
  .kb-alert, .kb-chip, .kb-tape__t, .kb-seals svg, .kh-float, .kh-ecg, .kl-route, .kl-city .halo, .kl-eta, .kl-dash__lanes i, .kl-dash__feed ul, .kl-road::after, .kr-col > div, .kr-hot__pt i, .kr-words__t, .kl-hero__bg { animation: none !important; }
  .kp-type { width: auto; border-right: 0; animation: none !important; }
  .kl-truck { display: none; }
  .kh-journey__path path { transition: none; stroke-dashoffset: 0; }
  .kh-journey__dot { transform: none; transition: none; }
}