.page-ketl{--ketl-ink:#07162f;--ketl-blue:#075ed1;--ketl-cyan:#37c1ff;--ketl-line:#d9e3ef;--ketl-soft:#f4f7fb}.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:96px 0}.ketl-intro{overflow:hidden;background:#06152d;color:#fff}.ketl-intro-grid{position:relative;display:grid;grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr);align-items:center;gap:70px}.ketl-intro-grid:before{position:absolute;inset:auto -20% -55% 28%;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(14,126,255,.32),transparent 66%);content:"";pointer-events:none}.ketl-intro-copy{position:relative;z-index:1}.ketl-intro-copy .eyebrow,.ketl-section-head .eyebrow,.ketl-workflow-copy .eyebrow,.ketl-spec-title .eyebrow{margin:0 0 18px;color:var(--ketl-blue);font-size:12px;font-weight:900;letter-spacing:.16em}.ketl-intro-copy .eyebrow{color:#63c9ff}.ketl-intro-copy h2,.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{margin:0;color:var(--ketl-ink);font-size:clamp(32px,4vw,54px);line-height:1.16;letter-spacing:-.045em}.ketl-intro-copy h2{color:#fff}.ketl-intro-copy>p:not(.eyebrow),.ketl-section-head>p:last-child{margin:22px 0 0;color:#62728a;font-size:16px;line-height:1.82}.ketl-intro-copy>p:not(.eyebrow){color:#b9c8db}.ketl-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.ketl-tags span{padding:8px 12px;border:1px solid rgba(255,255,255,.18);border-radius:6px;background:rgba(255,255,255,.06);color:#dcecff;font-size:11px;font-weight:800}.ketl-brochure-button{display:inline-flex;align-items:center;gap:22px;margin-top:30px;padding:14px 18px;border:1px solid rgba(111,203,255,.55);border-radius:8px;background:rgba(8,99,210,.12);color:#fff;font-size:13px;font-weight:850;transition:.2s ease}.ketl-brochure-button:hover{background:#0873e8;border-color:#0873e8;transform:translateY(-2px)}.ketl-brochure-button span{color:#6fd0ff;font-size:18px}.ketl-intro-visual{position:relative;z-index:1;margin:0;padding:18px;border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(255,255,255,.07);box-shadow:0 30px 80px rgba(0,0,0,.3);backdrop-filter:blur(10px)}.ketl-intro-visual:before{display:block;margin-bottom:14px;color:#83d6ff;font:800 10px/1 monospace;letter-spacing:.12em;content:"K-ETL / INTEGRATION MAP / LIVE"}.ketl-intro-visual img{display:block;width:100%;max-height:560px;object-fit:contain;border-radius:10px;background:#fff}.ketl-value-section{background:#fff}.ketl-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.62fr);align-items:end;gap:50px;margin-bottom:46px}.ketl-section-head .eyebrow{grid-column:1/-1;margin-bottom:-30px}.ketl-section-head>p:last-child{margin:0}.ketl-value-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-template-rows:repeat(2,1fr);gap:12px}.ketl-value{position:relative;min-height:180px;padding:28px;overflow:hidden;border:1px solid var(--ketl-line);border-radius:14px;background:var(--ketl-soft)}.ketl-value:first-child{grid-row:1/3;padding-top:42px;background:linear-gradient(145deg,#0870e4,#073775);color:#fff}.ketl-value>span{color:var(--ketl-blue);font:900 11px/1 monospace}.ketl-value:first-child>span{color:#78d6ff}.ketl-value h3{margin:38px 0 10px;color:var(--ketl-ink);font-size:20px}.ketl-value:first-child h3{margin-top:88px;color:#fff;font-size:28px}.ketl-value p{margin:0;color:#65738a;font-size:14px;line-height:1.72}.ketl-value:first-child p{color:#c9ddf5}.ketl-workflow-section{background:#eaf0f7}.ketl-workflow-grid{display:grid;grid-template-columns:minmax(360px,.7fr) minmax(0,1.3fr);align-items:start;gap:18px}.ketl-workflow-copy,.ketl-workflow-image{border:1px solid #d3deeb;border-radius:16px;background:#fff}.ketl-workflow-copy{padding:38px}.ketl-workflow-copy h2{font-size:clamp(29px,3vw,42px)}.ketl-workflow-image{margin:0;padding:20px;order:2;box-shadow:0 18px 45px rgba(20,49,83,.09)}.ketl-workflow-image:before{display:block;margin-bottom:14px;color:#71839a;font:800 10px/1 monospace;letter-spacing:.12em;content:"AUTOMATION PIPELINE"}.ketl-workflow-image img{display:block;width:100%;border-radius:9px}.ketl-steps{display:grid;gap:0;margin:28px 0 0;padding:0;list-style:none}.ketl-steps li{display:grid;grid-template-columns:34px 1fr;gap:13px;padding:15px 0;border-top:1px solid #e1e7ef}.ketl-steps li>span{color:var(--ketl-blue);font:900 11px/1.4 monospace}.ketl-steps strong{display:block;color:var(--ketl-ink);font-size:14px}.ketl-steps p{margin:4px 0 0;color:#718096;font-size:12px;line-height:1.55}.ketl-screen-section{background:#091a35;color:#fff}.ketl-screen-section .ketl-section-head h2{color:#fff}.ketl-screen-section .ketl-section-head>p:last-child{color:#9dafc6}.ketl-screen-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.ketl-screen{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:#102542}.ketl-screen>div{min-height:154px;padding:24px;order:2}.ketl-screen span{color:#62cbff;font:900 10px/1 monospace;letter-spacing:.11em;text-transform:uppercase}.ketl-screen h3{margin:12px 0 8px;color:#fff;font-size:20px}.ketl-screen p{margin:0;color:#aebdd0;font-size:13px;line-height:1.65}.ketl-screen img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-bottom:1px solid rgba(255,255,255,.12);order:1}.ketl-spec-section{background:#f7f9fc}.ketl-spec-grid{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);gap:80px;align-items:start}.ketl-spec-title h2{font-size:clamp(30px,3.2vw,46px)}.ketl-spec-list{margin:0;border-top:2px solid var(--ketl-ink)}.ketl-spec-list>div{display:grid;grid-template-columns:110px 1fr;gap:22px;padding:19px 0;border-bottom:1px solid var(--ketl-line)}.ketl-spec-list dt{color:var(--ketl-blue);font-size:13px;font-weight:900}.ketl-spec-list dd{margin:0;color:#4e5e74;font-size:14px;line-height:1.65}
@media(max-width:960px){.ketl-intro-grid,.ketl-workflow-grid,.ketl-spec-grid{grid-template-columns:1fr;gap:34px}.ketl-intro-visual{max-width:720px}.ketl-value-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}.ketl-value:first-child{grid-column:1/-1;grid-row:auto}.ketl-value:first-child h3{margin-top:45px}.ketl-screen-list{grid-template-columns:1fr}.ketl-screen{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(220px,.8fr)}.ketl-screen>div{order:2}.ketl-screen img{height:100%;order:1;border:0;border-right:1px solid rgba(255,255,255,.12)}}
@media(max-width:640px){.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:64px 0}.ketl-intro-grid{grid-template-columns:1fr;gap:34px}.ketl-intro-copy h2,.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{font-size:28px}.ketl-intro-copy>p:not(.eyebrow){font-size:14px}.ketl-section-head{display:block;margin-bottom:30px}.ketl-section-head .eyebrow{margin-bottom:14px}.ketl-section-head>p:last-child{margin-top:14px;font-size:14px}.ketl-value-grid{grid-template-columns:1fr}.ketl-value,.ketl-value:first-child{min-height:auto;padding:23px}.ketl-value h3,.ketl-value:first-child h3{margin:26px 0 8px;font-size:19px}.ketl-workflow-copy{padding:24px}.ketl-workflow-image{padding:12px}.ketl-screen{display:flex}.ketl-screen img{height:auto;border-right:0}.ketl-spec-grid{gap:34px}.ketl-spec-list>div{grid-template-columns:72px 1fr;gap:12px;font-size:13px}}

/* 첫 소개는 밝고 간결하게, 전체 크기는 브로셔보다 웹 화면에 맞게 줄였음. */
.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:70px 0}
.ketl-intro{background:#fff;color:var(--ketl-ink);border-bottom:1px solid var(--ketl-line)}
.ketl-intro-grid{display:block;max-width:850px}
.ketl-intro-grid::before{display:none}
.ketl-intro-copy .eyebrow{color:var(--ketl-blue)}
.ketl-intro-copy h2{max-width:720px;color:var(--ketl-ink);font-size:clamp(29px,3.2vw,44px)}
.ketl-intro-copy>p:not(.eyebrow){max-width:760px;color:#5f7086;font-size:14px;line-height:1.75}
.ketl-tags{margin-top:22px}
.ketl-tags span{padding:7px 10px;border-color:#d8e3ef;background:#f7faff;color:#3f5877}
.ketl-brochure-button{margin-top:22px;padding:11px 15px;border-color:#aac8e9;background:#fff;color:var(--ketl-blue)}
.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{font-size:clamp(27px,3vw,40px)}
.ketl-section-head>p:last-child{font-size:14px;line-height:1.7}
.ketl-section-head{margin-bottom:34px}
.ketl-value{min-height:145px;padding:22px}
.ketl-value h3{margin:26px 0 8px;font-size:18px}
.ketl-value:first-child h3{margin-top:46px;font-size:23px}
.ketl-value p{font-size:13px}
.ketl-workflow-copy{padding:28px}
.ketl-steps{margin-top:22px}
.ketl-steps li{padding:12px 0}
.ketl-workflow-image{padding:15px}
.ketl-screen>div{min-height:116px;padding:18px}
.ketl-screen h3{font-size:17px}
.ketl-screen p{font-size:12px}
.ketl-spec-list>div{padding:15px 0}
.ketl-spec-list dd{font-size:13px}
@media(max-width:640px){.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:46px 0}.ketl-intro-copy h2,.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{font-size:24px}.ketl-intro-copy>p:not(.eyebrow),.ketl-section-head>p:last-child{font-size:13px}.ketl-value,.ketl-value:first-child{padding:19px}.ketl-value h3,.ketl-value:first-child h3{font-size:17px}.ketl-workflow-copy{padding:20px}.ketl-screen>div{min-height:auto;padding:17px}}

/* 브로셔의 세로 이미지를 쓰지 않고 웹 전용 단계 흐름으로 다시 구성했음. */
.ketl-workflow-grid{display:block}
.ketl-workflow-copy{padding:34px;border:1px solid #d5dfeb;border-radius:14px;background:#fff}
.ketl-workflow-copy h2{max-width:680px}
.ketl-steps{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:34px;border-top:1px solid #cbd8e7}
.ketl-steps li{position:relative;display:block;padding:22px 20px 4px 0;border:0}
.ketl-steps li::before{position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--ketl-blue);box-shadow:0 0 0 5px #e8f2ff;content:""}
.ketl-steps li:not(:last-child)::after{position:absolute;top:30px;right:12px;color:#a4b4c8;font-size:16px;content:"→"}
.ketl-steps li>span{display:block;margin-bottom:28px;color:var(--ketl-blue);font:900 11px/1 monospace}
.ketl-steps strong{padding-right:25px;font-size:14px}
.ketl-steps p{padding-right:25px;font-size:11px;line-height:1.55}
@media(max-width:760px){.ketl-workflow-copy{padding:22px}.ketl-steps{grid-template-columns:1fr;margin-top:26px;border-top:0;border-left:1px solid #cbd8e7}.ketl-steps li{padding:0 0 22px 24px}.ketl-steps li::before{top:3px;left:-5px}.ketl-steps li:not(:last-child)::after{display:none}.ketl-steps li>span{margin-bottom:7px}.ketl-steps strong,.ketl-steps p{padding-right:0}}

/* 첫 두 구간은 중심축과 카드 크기를 동일하게 맞춰 대칭으로 정리했음. */
.ketl-intro-grid{max-width:920px;margin:0 auto;text-align:center}
.ketl-intro-copy h2,.ketl-intro-copy>p:not(.eyebrow){margin-right:auto;margin-left:auto}
.ketl-tags{justify-content:center}
.ketl-brochure-button{justify-content:center}
.ketl-value-section .ketl-section-head{display:block;max-width:840px;margin:0 auto 34px;text-align:center}
.ketl-value-section .ketl-section-head .eyebrow{margin-bottom:16px}
.ketl-value-section .ketl-section-head>p:last-child{max-width:650px;margin:14px auto 0}
.ketl-value-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:1fr;gap:12px}
.ketl-value,.ketl-value:first-child{grid-column:auto;grid-row:auto;min-height:190px;padding:24px}
.ketl-value h3,.ketl-value:first-child h3{margin:46px 0 10px;font-size:19px}
@media(max-width:900px){.ketl-value-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ketl-value,.ketl-value:first-child{min-height:170px}}
@media(max-width:560px){.ketl-value-grid{grid-template-columns:1fr}.ketl-value,.ketl-value:first-child{min-height:auto}.ketl-value h3,.ketl-value:first-child h3{margin-top:28px}.ketl-intro-grid{text-align:left}.ketl-tags{justify-content:flex-start}}

/* 제목은 왼쪽, 제목 아래 설명은 좌우 끝이 맞도록 정렬했음. */
.ketl-intro-grid,.ketl-value-section .ketl-section-head{text-align:left}
.ketl-intro-copy h2,.ketl-intro-copy>p:not(.eyebrow){margin-left:0}
.ketl-tags{justify-content:flex-start}
.ketl-value-section .ketl-section-head>p:last-child{margin-left:0;text-align:justify;text-justify:inter-word}
.ketl-intro-copy>p:not(.eyebrow),.ketl-value p,.ketl-workflow-copy p,.ketl-screen p,.ketl-spec-list dd{text-align:justify;text-justify:inter-word}

/* Access Control과 같은 사업페이지 계열의 밝은 색상, 간격, 카드 형태로 통일했음. */
.page-ketl{--ketl-ink:#111827;--ketl-blue:var(--blue);--ketl-line:var(--line);--ketl-soft:var(--surface)}
.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:82px 0;background:#fff;color:var(--text)}
.ketl-intro{border-bottom:0}
.ketl-intro-grid{max-width:none;margin:0;text-align:left}
.ketl-intro-copy{max-width:900px}
.ketl-intro-copy .eyebrow,.ketl-section-head .eyebrow,.ketl-workflow-copy .eyebrow,.ketl-spec-title .eyebrow{margin-bottom:14px;color:var(--blue);font-size:12px;letter-spacing:.12em}
.ketl-intro-copy h2,.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{max-width:900px;color:var(--text);font-size:clamp(30px,3.2vw,46px);line-height:1.25;letter-spacing:-.05em}
.ketl-intro-copy>p:not(.eyebrow),.ketl-section-head>p:last-child{max-width:760px;margin-top:20px;color:var(--muted);font-size:15px;line-height:1.85}
.ketl-tags{gap:8px;margin-top:22px;justify-content:flex-start}
.ketl-tags span{padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--muted)}
.ketl-brochure-button{margin-top:22px;padding:12px 17px;border:1px solid #bfd6f3;border-radius:9px;background:#edf5ff;color:var(--blue)}
.ketl-brochure-button:hover{border-color:var(--blue);background:var(--blue);color:#fff}
.ketl-value-section{padding-top:28px}
.ketl-value-section .ketl-section-head{max-width:none;margin:0 0 34px;text-align:left}
.ketl-value-section .ketl-section-head>p:last-child{margin-left:0}
.ketl-value-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ketl-value,.ketl-value:first-child{min-height:205px;padding:28px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--text)}
.ketl-value>span,.ketl-value:first-child>span{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:#edf5ff;color:var(--blue);font:800 12px/1 sans-serif}
.ketl-value h3,.ketl-value:first-child h3{margin:30px 0 11px;color:var(--text);font-size:19px}
.ketl-value p,.ketl-value:first-child p{color:var(--muted);font-size:13px;line-height:1.75}
.ketl-workflow-section{background:var(--surface)}
.ketl-workflow-copy{padding:36px;border:1px solid var(--line);border-radius:22px;background:#fff}
.ketl-steps{margin-top:36px;border-color:var(--line)}
.ketl-steps li::before{background:var(--blue);box-shadow:0 0 0 5px #edf5ff}
.ketl-steps li>span{color:var(--blue)}
.ketl-steps strong{color:var(--text);font-size:14px}
.ketl-steps p{color:var(--muted)}
.ketl-screen-section{background:#fff;color:var(--text)}
.ketl-screen-section .ketl-section-head h2{color:var(--text)}
.ketl-screen-section .ketl-section-head>p:last-child{color:var(--muted)}
.ketl-screen-list{gap:20px}
.ketl-screen{border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--text)}
.ketl-screen>div{min-height:145px;padding:24px}
.ketl-screen span{color:var(--blue);font-family:inherit;font-weight:800}
.ketl-screen h3{color:var(--text);font-size:19px}
.ketl-screen p{color:var(--muted);font-size:13px;line-height:1.75}
.ketl-screen img{border-color:var(--line);background:#f5f8fc}
.ketl-spec-section{background:var(--surface)}
.ketl-spec-grid{gap:70px}
.ketl-spec-list{border-top:2px solid var(--text)}
.ketl-spec-list>div{border-color:var(--line)}
.ketl-spec-list dt{color:var(--blue)}
.ketl-spec-list dd{color:var(--muted)}
@media(max-width:900px){.ketl-value-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ketl-value,.ketl-value:first-child{min-height:190px}}
@media(max-width:640px){.ketl-intro,.ketl-value-section,.ketl-workflow-section,.ketl-screen-section,.ketl-spec-section{padding:58px 0}.ketl-value-section{padding-top:18px}.ketl-intro-copy h2,.ketl-section-head h2,.ketl-workflow-copy h2,.ketl-spec-title h2{font-size:27px}.ketl-intro-copy>p:not(.eyebrow),.ketl-section-head>p:last-child{font-size:14px}.ketl-value-grid{grid-template-columns:1fr}.ketl-value,.ketl-value:first-child{min-height:auto;padding:24px}.ketl-workflow-copy{padding:24px}.ketl-screen>div{min-height:auto;padding:22px}}
@media(max-width:640px){.ketl-intro-copy>p:not(.eyebrow),.ketl-section-head>p:last-child,.ketl-value p,.ketl-workflow-copy p,.ketl-screen p,.ketl-spec-list dd{text-align:left;text-justify:auto}}

/* container의 중앙 정렬을 유지하고 첫 구간의 과한 높이를 줄였음. */
.ketl-intro{padding:58px 0 48px}
.ketl-intro-grid{width:min(var(--max),calc(100% - 48px));max-width:var(--max);margin-right:auto;margin-left:auto}
.ketl-intro-copy h2{font-size:clamp(28px,2.7vw,40px)}
.ketl-value-section{padding:48px 0 70px}
@media(max-width:640px){.ketl-intro{padding:42px 0 36px}.ketl-intro-grid{width:min(100% - 24px,var(--max))}.ketl-intro-copy h2{font-size:25px}.ketl-value-section{padding:36px 0 52px}}

/* 지원 환경과 문의 카드 사이의 과한 공백을 줄였음. */
.ketl-spec-section{padding:48px 0}
.ketl-spec-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:42px;align-items:center}
.ketl-spec-title h2{max-width:460px;font-size:clamp(27px,2.6vw,36px);line-height:1.3}
.ketl-spec-list>div{padding:12px 0}
.page-ketl .home-cta{padding:22px 0 40px}
.page-ketl .cta-panel{min-height:178px;padding:34px 42px 34px 235px;gap:28px}
.page-ketl .cta-panel::before{left:28px;bottom:0;width:185px;height:185px}
.page-ketl .cta-panel h2{font-size:clamp(26px,2.4vw,35px)}
.page-ketl .cta-panel p{margin-top:10px;font-size:14px}
@media(max-width:900px){.ketl-spec-grid{grid-template-columns:1fr;gap:22px}.ketl-spec-title h2{max-width:none}.page-ketl .cta-panel{padding-left:195px}.page-ketl .cta-panel::before{width:150px;height:150px}}
@media(max-width:640px){.ketl-spec-section{padding:38px 0}.ketl-spec-grid{gap:18px}.ketl-spec-title h2{font-size:24px}.ketl-spec-list>div{padding:11px 0}.page-ketl .home-cta{padding:18px 0 32px}.page-ketl .cta-panel{min-height:0;padding:24px 20px 26px;gap:16px}.page-ketl .cta-panel::before{top:auto;right:-10px;bottom:-18px;left:auto;width:125px;height:125px}.page-ketl .cta-panel h2{font-size:20px}.page-ketl .cta-panel p{font-size:12px}}

/* 하위 메뉴와 소개 제목 사이 간격을 늘리고 아래쪽 여백은 줄였음. */
.ketl-intro{padding-top:110px;padding-bottom:30px}
@media(max-width:640px){.ketl-intro{padding-top:44px;padding-bottom:28px}}
