@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');

/* ---------- tokens ---------- */
:root{
	--navy-900:#0A1830;
	--navy-800:#0F2242;
	--navy-700:#173259;
	--mint-500:#20C9A6;
	--mint-400:#3EE2C0;
	--mint-100:#E4FBF4;
	--ink-900:#101826;
	--ink-600:#5B6472;
	--ink-400:#8A93A3;
	--line-200:#E5E9EF;
	--bg-100:#F5F7FA;
	--white:#FFFFFF;
	--radius-lg:16px;
	--radius-md:12px;
	--radius-sm:8px;
	--shadow-card:0 4px 20px rgba(16,24,38,0.06);
	--max:1160px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;font-size:18px;}
body{
	margin:0;
	font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic',sans-serif;
	color:var(--ink-900);
	background:var(--white);
	line-height:1.65;
	word-break:keep-all;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,p{margin:0;}
h1,h2,h3,h4{line-height:1.2;}

.wrap{max-width:var(--max);margin:0 auto;padding:0 24px;}
.eyebrow{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:16px;
	font-weight:700;
	letter-spacing:0.08em;
	color:var(--mint-500);
	text-transform:uppercase;
	margin-bottom:14px;
}
.eyebrow::before{
	content:'';
	width:16px;height:2px;
	background:var(--mint-500);
	border-radius:1px;
}
.section{padding:30px 0;}
.section-tight{padding:40px 0;}
.section-title{font-size:50px;font-weight:800;line-height:1.2;letter-spacing:-0.01em;color:var(--ink-900);}
.section-sub{margin-top:10px;font-size:21px;color:var(--ink-600);}
.section-head{margin-bottom:10px;}
.section-alt{background:var(--bg-100);}
.section-dark{background:var(--navy-900);color:var(--white);}
.section-dark .section-sub{color:rgba(255,255,255,0.68);}
.section-dark .eyebrow{color:var(--mint-400);}

/* ---------- in-section sub block header ---------- */
.block-head{margin-bottom:28px;}
.block-title{font-size:30px;font-weight:800;color:var(--ink-900);}
.block-sub{margin-top:8px;font-size:18px;color:var(--ink-600);max-width:720px;}
.section-divider{height:1px;background:var(--line-200);margin:56px 0 48px;}

.btn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:16px 30px;
	border-radius:999px;
	font-weight:700;
	font-size:17px;
	border:1px solid transparent;
	cursor:pointer;
	transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-primary{background:var(--mint-500);color:var(--navy-900);box-shadow:0 0 0 rgba(62,226,192,0);}
.btn-primary:hover{background:var(--mint-400);transform:translateY(-2px);box-shadow:0 12px 28px rgba(62,226,192,0.35);}
.btn-outline{border-color:rgba(255,255,255,0.35);color:var(--white);}
.btn-outline:hover{border-color:var(--white);background:rgba(255,255,255,0.06);}
.btn-navy{background:var(--navy-900);color:var(--white);}
.btn-navy:hover{background:var(--navy-700);transform:translateY(-1px);}

/* ---------- header ---------- */
.site-header{
	position:sticky;top:0;z-index:100;
	background:rgba(255,255,255,0.92);
	backdrop-filter:saturate(180%) blur(10px);
	border-bottom:1px solid var(--line-200);
	transition:transform .3s ease;
}
.site-header.is-hidden{transform:translateY(-100%);}
@media (prefers-reduced-motion: reduce){
	.site-header{transition:none;}
}
.site-header .wrap{
	height:80px;
	display:flex;align-items:center;justify-content:space-between;
}
.logo{display:flex;align-items:center;}
.site-header .logo{margin-left:16px;}
.logo img{height:58px;width:auto;display:block;}
.gnb{display:flex;align-items:center;gap:56px;}
.gnb a{font-size:18px;font-weight:600;color:var(--ink-900);transition:color .15s ease;}
.gnb a:hover{color:var(--mint-500);}
.gnb a.active{color:var(--navy-900);}
.gnb-item{position:relative;display:flex;align-items:center;align-self:stretch;}
.gnb-item > a{display:flex;align-items:center;gap:5px;}
.gnb-item > a::after{
	content:'';
	width:7px;height:7px;
	border-right:1.5px solid currentColor;
	border-bottom:1.5px solid currentColor;
	transform:rotate(45deg) translateY(-2px);
	opacity:0.6;
}
.gnb-dropdown{
	position:absolute;top:100%;left:50%;
	transform:translateX(-50%);
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-md);
	box-shadow:0 16px 32px rgba(16,24,38,0.14);
	padding:8px;
	min-width:210px;
	display:flex;flex-direction:column;gap:2px;
	opacity:0;visibility:hidden;pointer-events:none;
	transition:opacity .15s ease;
	z-index:50;
}
.gnb-item:hover .gnb-dropdown,
.gnb-item:focus-within .gnb-dropdown{
	opacity:1;visibility:visible;pointer-events:auto;
}
.gnb-dropdown a{
	padding:11px 14px;border-radius:8px;
	font-size:16px;white-space:nowrap;
	transition:background .15s ease,color .15s ease;
}
.gnb-dropdown a:hover, .gnb-dropdown a.active{background:var(--bg-100);color:var(--navy-900);}
.header-cta{display:flex;align-items:center;gap:22px;}
.header-cta .btn{padding:12px 24px;font-size:17px;}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:6px;}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--navy-900);margin:5px 0;}

/* ---------- hero ---------- */
.hero{
	background:var(--navy-900);
	color:var(--white);
	position:relative;
	overflow:hidden;
	padding:120px 0 100px;
}
.hero-aurora{
	position:absolute;inset:0;
	z-index:0;
	pointer-events:none;
}
.hero-aurora::before,
.hero-aurora::after{
	content:'';
	position:absolute;
	width:900px;height:900px;
	border-radius:50%;
	filter:blur(90px);
	opacity:0.5;
}
.hero-aurora::before{
	top:-380px;right:-200px;
	background:radial-gradient(circle at 30% 30%, rgba(62,226,192,0.55), rgba(62,226,192,0) 65%);
	animation:auroraDrift1 22s ease-in-out infinite;
}
.hero-aurora::after{
	bottom:-420px;left:-260px;
	background:radial-gradient(circle at 60% 60%, rgba(32,120,201,0.45), rgba(32,120,201,0) 65%);
	animation:auroraDrift2 26s ease-in-out infinite;
}
@keyframes auroraDrift1{
	0%,100%{transform:translate(0,0) scale(1);}
	50%{transform:translate(-60px,40px) scale(1.12);}
}
@keyframes auroraDrift2{
	0%,100%{transform:translate(0,0) scale(1);}
	50%{transform:translate(50px,-30px) scale(1.08);}
}
.hero-net{
	position:absolute;inset:0;
	z-index:1;
	opacity:0.55;
}
.hero-grid{
	position:absolute;inset:0;
	z-index:1;
	background-image:
		linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
	background-size:56px 56px;
	mask-image:radial-gradient(700px 500px at 70% 20%, #000 0%, transparent 75%);
	-webkit-mask-image:radial-gradient(700px 500px at 70% 20%, #000 0%, transparent 75%);
}
.hero .wrap{
	position:relative;
	z-index:2;
}

/* ---------- hero slider ---------- */
.hero-slides{
	position:relative;
}
.hero-slide{
	position:absolute;
	inset:0;
	width:100%;
	display:grid;
	grid-template-columns:1.1fr 0.9fr;
	gap:40px;
	align-items:center;
	opacity:0;
	transform:translateY(14px);
	transition:opacity .6s ease, transform .6s ease;
	pointer-events:none;
}
.hero-slide.is-active{
	position:relative;
	opacity:1;
	transform:translateY(0);
	pointer-events:auto;
}
.hero-controls{
	position:relative;
	z-index:2;
	margin-top:48px;
	display:flex;align-items:center;justify-content:center;gap:20px;
}
.hero-arrow{
	width:36px;height:36px;border-radius:50%;
	border:1px solid rgba(255,255,255,0.2);
	background:rgba(255,255,255,0.04);
	color:var(--white);
	font-size:20px;line-height:1;
	cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	transition:border-color .2s ease, background .2s ease;
}
.hero-arrow:hover{border-color:rgba(62,226,192,0.6);background:rgba(62,226,192,0.1);}
.hero-dots{display:flex;gap:10px;}
.hero-dot{
	width:9px;height:9px;border-radius:50%;padding:0;border:0;
	background:rgba(255,255,255,0.25);
	cursor:pointer;
	transition:background .2s ease, transform .2s ease;
}
.hero-dot:hover{background:rgba(255,255,255,0.5);}
.hero-dot.is-active{background:var(--mint-400);transform:scale(1.25);}
.hero-progress{
	position:relative;z-index:2;
	max-width:200px;margin:14px auto 0;
	height:2px;border-radius:2px;
	background:rgba(255,255,255,0.12);
	overflow:hidden;
}
.hero-progress-fill{
	height:100%;width:0%;
	background:var(--mint-400);
	border-radius:2px;
}
.hero-progress-fill.is-running{
	animation:heroProgress 3s linear;
}
@keyframes heroProgress{
	from{width:0%;}
	to{width:100%;}
}

/* ---------- hero art panels (slides 2~4) ---------- */
.art-panel{
	width:100%;
	max-width:520px;
	border-radius:20px;
	background:linear-gradient(160deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01));
	border:1px solid rgba(255,255,255,0.1);
	overflow:hidden;
	filter:drop-shadow(0 20px 40px rgba(0,0,0,0.35));
}
.art-svg{width:100%;height:auto;display:block;}
.art-svg .flow-path{
	stroke-dasharray:6 6;
	animation:flowDash 3.5s linear infinite;
}
@keyframes flowDash{
	to{stroke-dashoffset:-120;}
}
.art-svg .pulse-dot{
	animation:pulseDot 2.2s ease-in-out infinite;
}
@keyframes pulseDot{
	0%,100%{opacity:1;r:5;}
	50%{opacity:0.5;r:7;}
}
.art-panel-lg{max-width:540px;}
.art-svg .radar-ring{
	transform-box:fill-box;transform-origin:center;
	opacity:0;
	animation:radarPing 3s ease-out infinite;
}
@keyframes radarPing{
	0%{transform:scale(0.55);opacity:0.7;}
	80%,100%{transform:scale(1.7);opacity:0;}
}
.hero-badge{
	display:inline-flex;align-items:center;gap:8px;
	padding:8px 16px;border-radius:999px;
	background:rgba(32,201,166,0.14);
	border:1px solid rgba(32,201,166,0.35);
	color:var(--mint-400);
	font-size:16px;font-weight:700;
	margin-bottom:24px;
}
.hero-badge .dot-pulse{
	width:7px;height:7px;border-radius:50%;
	background:var(--mint-400);
	box-shadow:0 0 0 0 rgba(62,226,192,0.6);
	animation:dotPulse 2s ease-out infinite;
}
@keyframes dotPulse{
	0%{box-shadow:0 0 0 0 rgba(62,226,192,0.55);}
	70%{box-shadow:0 0 0 8px rgba(62,226,192,0);}
	100%{box-shadow:0 0 0 0 rgba(62,226,192,0);}
}
.hero h1{
	font-size:66px;line-height:1.22;font-weight:800;letter-spacing:-0.01em;
}
.hero h1 em{
	font-style:normal;
	background:linear-gradient(100deg, var(--mint-400) 0%, #7FF2D8 35%, var(--mint-400) 60%, #3EE2C0 100%);
	background-size:250% auto;
	-webkit-background-clip:text;background-clip:text;color:transparent;
	animation:shimmerText 6s ease-in-out infinite;
}
@keyframes shimmerText{
	0%{background-position:0% 50%;}
	50%{background-position:100% 50%;}
	100%{background-position:0% 50%;}
}
.hero-desc{margin-top:22px;font-size:23px;color:rgba(255,255,255,0.7);max-width:540px;}
.hero-cta{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap;}
.hero-visual{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:20px;
	perspective:1400px;
}

.hero-visual::before{
	content:'';
	position:absolute;
	width:70%;height:70%;
	border-radius:50%;
	background:radial-gradient(circle, rgba(62,226,192,0.28), transparent 70%);
	filter:blur(40px);
	z-index:0;
	animation:heroGlowPulse 4s ease-in-out infinite;
}
@keyframes heroGlowPulse{
	0%,100%{opacity:0.75;transform:scale(1);}
	50%{opacity:1;transform:scale(1.08);}
}

/* ---------- problem cards ---------- */
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}

.problem-card{
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-md);
	padding:28px 24px;
}
.num-badge{
	width:62px;height:62px;border-radius:50%;
	background:linear-gradient(160deg, var(--mint-100), #C9F5E8);
	color:var(--mint-500);
	display:flex;align-items:center;justify-content:center;
	font-weight:800;font-size:26px;margin-bottom:20px;
	box-shadow:0 8px 20px rgba(32,201,166,0.22);
}
.problem-card h3{font-size:21px;font-weight:700;margin-bottom:10px;}
.problem-card p{font-size:17px;color:var(--ink-600);}

.callout{
	margin-top:40px;
	background:var(--navy-900);
	color:var(--white);
	border-radius:var(--radius-lg);
	padding:34px 40px;
	font-size:25px;font-weight:600;
}
.callout .mint{color:var(--mint-400);font-weight:800;}

/* ---------- compare table ---------- */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.compare-card{border-radius:var(--radius-lg);padding:32px;}
.compare-card.off{background:var(--bg-100);border:1px solid var(--line-200);}
.compare-card.on{background:var(--navy-900);color:var(--white);}
.compare-card h3{font-size:23px;font-weight:800;margin-bottom:22px;}
.compare-row{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(0,0,0,0.06);font-size:17px;}
.compare-card.on .compare-row{border-top-color:rgba(255,255,255,0.12);}
.compare-row .k{color:var(--ink-400);}
.compare-card.on .compare-row .k{color:rgba(255,255,255,0.5);}
.compare-row .v{font-weight:700;text-align:right;max-width:60%;}

/* ---------- value / product teaser ---------- */
.value-card{
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-md);
	padding:32px 28px;
	box-shadow:var(--shadow-card);
}
.value-card .num-badge{
	background:linear-gradient(160deg, var(--navy-800), var(--navy-900));
	color:var(--mint-400);
	box-shadow:0 8px 20px rgba(10,24,48,0.35), 0 0 0 1px rgba(62,226,192,0.18) inset;
}
.value-card h3{font-size:22px;font-weight:700;margin-bottom:10px;color:var(--ink-900);}
.value-card p{font-size:17px;color:var(--ink-600);}
.value-card .logo-chip{margin-bottom:20px;justify-content:flex-start;padding:14px 16px 14px 0;border:none;min-height:auto;}
.value-card .logo-chip img{max-height:36px;}

/* ---------- large-scale search cards (도입사례) ---------- */
.scale-card{
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-md);
	padding:36px 28px;
	text-align:center;
	box-shadow:var(--shadow-card);
}
.scale-card .scale-icon{
	width:64px;height:64px;border-radius:50%;
	background:linear-gradient(160deg, var(--navy-800), var(--navy-900));
	color:var(--mint-400);
	box-shadow:0 8px 20px rgba(10,24,48,0.35), 0 0 0 1px rgba(62,226,192,0.18) inset;
	display:flex;align-items:center;justify-content:center;
	font-size:28px;margin:0 auto 18px;
}
.scale-card h3{font-size:21px;font-weight:700;margin-bottom:10px;color:var(--ink-900);}
.scale-card p{font-size:16px;color:var(--ink-600);}

/* TESS "Proven at Scale" 고객 사례 카드 - 이미지/텍스트 2배 확대 */
.proven-scale-card{padding:64px 56px;}
.proven-scale-card .logo-chip{justify-content:center;margin-bottom:32px;padding:24px 0;}
.proven-scale-card .logo-chip img{max-height:180px;filter:none;opacity:1;}
.proven-scale-card h3{font-size:44px;margin-bottom:20px;}
.proven-scale-card p{font-size:26px;}

/* ---------- stats ---------- */
.stat-bar{
	background:var(--navy-900);
	border-radius:var(--radius-lg);
	padding:44px 20px;
	display:grid;
	grid-template-columns:repeat(4,1fr);
	color:var(--white);
	text-align:center;
}
.stat-bar .stat + .stat{border-left:1px solid rgba(255,255,255,0.12);}
.stat b{display:block;font-size:54px;font-weight:800;color:var(--mint-400);}
.stat span{display:block;margin-top:8px;font-size:16px;color:rgba(255,255,255,0.65);}

/* ---------- logo grid (client / partner logos) ---------- */
/* 이미지 등록 방법: img/clients/ 폴더에 로고 파일을 넣고 아래 .logo-chip img의 src를 해당 경로로 지정하면
   자동으로 이미지가 표시됩니다. 파일이 없거나 경로가 틀리면 회사명 텍스트로 자동 대체됩니다. */
.logo-grid{
	display:grid;grid-template-columns:repeat(6,1fr);gap:14px;
	margin-top:40px;
}
.logo-chip{
	display:flex;align-items:center;justify-content:center;
	min-height:72px;
	border:1px solid var(--line-200);
	border-radius:var(--radius-sm);
	padding:14px 16px;
	text-align:center;
	background:var(--white);
}
.logo-chip img{
	max-height:30px;max-width:100%;object-fit:contain;
	filter:grayscale(1);opacity:0.75;
	transition:filter .2s ease, opacity .2s ease;
}
.logo-chip:hover img{filter:grayscale(0);opacity:1;}
.logo-chip span{font-size:16px;font-weight:700;color:var(--ink-600);}
.logo-chip img.is-broken{display:none;}
.logo-chip img:not(.is-broken) + span{display:none;}

/* ---------- case cards ---------- */
.case-card{
	border:1px solid var(--line-200);
	border-radius:var(--radius-lg);
	overflow:hidden;
	background:var(--white);
}
.case-card .tag{
	display:inline-block;
	font-size:15px;font-weight:700;color:var(--mint-500);
	background:var(--mint-100);
	padding:4px 12px;border-radius:999px;
	margin-bottom:14px;
}
.case-card .body{padding:28px;}
.case-card h3{font-size:24px;font-weight:800;margin-bottom:10px;}
.case-card p{font-size:17px;color:var(--ink-600);}
.case-card .meta{margin-top:18px;padding-top:18px;border-top:1px solid var(--line-200);font-size:16px;color:var(--ink-400);}

.case-card-featured .logo-chip{justify-content:center;margin-bottom:20px;padding:20px 0 0;border:none;min-height:auto;}
.case-card-featured .logo-chip img{max-height:120px;filter:none;opacity:1;}

/* ---------- 고객사 로고 롤링 캐러셀 (메인, 계속 추가되는 고객사용) ---------- */
.logo-carousel{
	display:flex;
	overflow:hidden;
	margin-top:40px;
	-webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.logo-carousel .logo-track{
	display:flex;
	gap:24px;
	flex-shrink:0;
	width:max-content;
	animation:logoScroll var(--marquee-duration, 30s) linear infinite;
}
.logo-carousel:hover .logo-track{animation-play-state:paused;}
.logo-carousel .logo-chip{
	flex:0 0 var(--logo-item-w, 220px);
	width:var(--logo-item-w, 220px);
	min-height:120px;
	padding:20px;
}
.logo-carousel .logo-chip img{max-height:64px;filter:none;opacity:1;}
.logo-carousel .logo-chip span{font-size:18px;}
@keyframes logoScroll{from{transform:translateX(0);}to{transform:translateX(-100%);}}
@media (prefers-reduced-motion: reduce){
	.logo-carousel .logo-track{animation:none;}
}

/* ---------- usecase ---------- */
.usecase-card{
	background:var(--bg-100);
	border-radius:var(--radius-md);
	padding:28px;
}
.usecase-card .q{
	display:inline-block;
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-sm);
	padding:10px 16px;
	font-size:17px;font-weight:700;color:var(--navy-900);
	margin:14px 0 14px;
}
.usecase-card h3{font-size:20px;font-weight:700;display:flex;align-items:center;gap:10px;}
.usecase-card p{font-size:17px;color:var(--ink-600);}

/* ---------- final cta ---------- */
.final-cta{
	background:var(--navy-900);
	color:var(--white);
	border-radius:var(--radius-lg);
	padding:64px;
	display:flex;justify-content:space-between;align-items:center;gap:24px;
	flex-wrap:wrap;
}
.final-cta h2{font-size:40px;font-weight:800;}
.final-cta p{margin-top:10px;font-size:18px;color:rgba(255,255,255,0.65);}

/* ---------- scroll reveal ---------- */
[data-reveal]{
	opacity:0;
	transform:translateY(28px);
	transition:opacity .7s cubic-bezier(.2,.6,.2,1), transform .7s cubic-bezier(.2,.6,.2,1);
}
[data-reveal].is-visible{opacity:1;transform:translateY(0);}
[data-reveal-group] [data-reveal]:nth-child(1){transition-delay:0s;}
[data-reveal-group] [data-reveal]:nth-child(2){transition-delay:.08s;}
[data-reveal-group] [data-reveal]:nth-child(3){transition-delay:.16s;}
[data-reveal-group] [data-reveal]:nth-child(4){transition-delay:.24s;}
[data-reveal-group] [data-reveal]:nth-child(5){transition-delay:.32s;}
[data-reveal-group] [data-reveal]:nth-child(6){transition-delay:.4s;}

/* ---------- hover lift for cards ---------- */
.problem-card, .value-card, .case-card, .usecase-card, .scale-card{
	transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.problem-card:hover, .value-card:hover, .usecase-card:hover, .scale-card:hover{
	transform:translateY(-6px);
	border-color:rgba(32,201,166,0.4);
	box-shadow:0 16px 32px rgba(16,24,38,0.08);
}
.case-card:hover{
	transform:translateY(-6px);
	box-shadow:0 20px 40px rgba(16,24,38,0.12);
}
.logo-chip{transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;}
.logo-chip:hover{transform:translateY(-3px);border-color:rgba(32,201,166,0.4);box-shadow:0 10px 22px rgba(16,24,38,0.08);}

.stat{transition:transform .25s ease;}
.stat-bar:hover .stat{transform:none;}
.stat-bar .stat:hover{transform:translateY(-4px);}

@media (prefers-reduced-motion: reduce){
	.hero-aurora::before, .hero-aurora::after, .hero-badge .dot-pulse, .hero h1 em{animation:none !important;}
	[data-reveal]{opacity:1;transform:none;transition:none;}
	.hero-slide{transition:opacity .3s ease;transform:none;}
	.art-svg .flow-path, .art-svg .pulse-dot, .art-svg .radar-ring, .hero-progress-fill.is-running{animation:none !important;}
	.hero-visual::before{animation:none !important;}
}

/* ---------- page-hero (서브페이지 상단 배너) ---------- */
.page-hero{
	background:var(--navy-900);
	color:var(--white);
	position:relative;
	overflow:hidden;
	padding:48px 0 32px;
}
.page-hero .wrap{position:relative;z-index:2;}
.breadcrumb{
	display:flex;align-items:center;gap:8px;
	font-size:15px;color:rgba(255,255,255,0.5);
	margin-bottom:22px;
}
.breadcrumb a{color:rgba(255,255,255,0.75);}
.breadcrumb a:hover{color:var(--mint-400);}
.page-hero h1{font-size:50px;font-weight:800;line-height:1.28;letter-spacing:-0.01em;max-width:760px;}
.page-hero h1 em{
	font-style:normal;
	background:linear-gradient(100deg, var(--mint-400) 0%, #7FF2D8 35%, var(--mint-400) 60%, #3EE2C0 100%);
	background-size:250% auto;
	-webkit-background-clip:text;background-clip:text;color:transparent;
	animation:shimmerText 6s ease-in-out infinite;
}
.page-hero-desc{margin-top:18px;font-size:20px;color:rgba(255,255,255,0.7);max-width:660px;}
.format-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.format-chip{
	padding:7px 16px;border-radius:999px;
	background:rgba(255,255,255,0.06);
	border:1px solid rgba(255,255,255,0.16);
	font-size:15px;font-weight:600;color:rgba(255,255,255,0.8);
}

/* ---------- pipeline / step-flow (아키텍처) ---------- */
.pipeline-group{margin-bottom:16px;}
.pipeline-group + .pipeline-group{margin-top:40px;}
.pipeline-label{
	display:inline-flex;align-items:center;gap:8px;
	font-size:15px;font-weight:700;color:var(--mint-500);
	background:var(--mint-100);
	padding:6px 14px;border-radius:999px;
	margin-bottom:20px;
}
.step-row{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;}
.step{
	flex:1;min-width:150px;
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-md);
	padding:22px 18px;
	text-align:center;
}
.step .step-icon{
	width:58px;height:58px;border-radius:50%;
	background:linear-gradient(160deg, var(--mint-100), #C9F5E8);
	box-shadow:0 8px 20px rgba(32,201,166,0.22);
	display:flex;align-items:center;justify-content:center;
	font-size:26px;margin:0 auto 14px;
}
.step h4{font-size:17px;font-weight:700;margin-bottom:6px;}
.step p{font-size:15px;color:var(--ink-600);}
.step-arrow{
	display:flex;align-items:center;justify-content:center;
	color:var(--mint-500);font-size:20px;font-weight:700;
	padding:0 6px;flex-shrink:0;
}

/* ---------- hybrid search slider ---------- */
.hybrid-card{
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-lg);
	padding:36px;
	box-shadow:var(--shadow-card);
}
.hybrid-bars{display:flex;justify-content:space-between;margin-bottom:14px;font-size:16px;font-weight:700;}
.hybrid-bars .k-label{color:var(--navy-900);}
.hybrid-bars .v-label{color:var(--mint-500);}
.hybrid-track-wrap{position:relative;height:14px;border-radius:999px;background:var(--bg-100);overflow:hidden;margin-bottom:22px;}
.hybrid-fill{position:absolute;top:0;height:100%;transition:width .1s ease;}
.hybrid-fill[data-fill="keyword"]{left:0;background:var(--navy-700);}
.hybrid-fill[data-fill="vector"]{right:0;background:var(--mint-500);}
.hybrid-range{
	width:100%;
	-webkit-appearance:none;appearance:none;
	height:6px;border-radius:999px;
	background:linear-gradient(90deg, var(--navy-700), var(--mint-500));
	outline:none;
}
.hybrid-range::-webkit-slider-thumb{
	-webkit-appearance:none;appearance:none;
	width:22px;height:22px;border-radius:50%;
	background:var(--white);border:4px solid var(--mint-500);
	box-shadow:0 2px 8px rgba(16,24,38,0.25);
	cursor:pointer;
}
.hybrid-range::-moz-range-thumb{
	width:22px;height:22px;border-radius:50%;
	background:var(--white);border:4px solid var(--mint-500);
	cursor:pointer;
}
.hybrid-example{
	margin-top:26px;padding-top:22px;
	border-top:1px solid var(--line-200);
	font-size:16px;color:var(--ink-600);
}
.hybrid-example .q{color:var(--navy-900);font-weight:700;}

/* ---------- chunking before/after ---------- */
.chunk-compare{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.chunk-card{border-radius:var(--radius-lg);padding:28px;}
.chunk-card.bad{background:var(--bg-100);border:1px solid var(--line-200);}
.chunk-card.good{background:var(--navy-900);color:var(--white);}
.chunk-card h4{font-size:19px;font-weight:800;margin-bottom:16px;}
.chunk-card.bad h4{color:var(--ink-900);}
.chunk-card.good h4{color:var(--mint-400);}
.chunk-text{font-size:16px;line-height:1.9;color:var(--ink-600);}
.chunk-card.good .chunk-text{color:rgba(255,255,255,0.75);}
.chunk-text mark.cut{background:rgba(220,60,80,0.15);color:#C23B54;padding:1px 3px;border-radius:3px;text-decoration:line-through;}
.chunk-text mark.keep{background:rgba(32,201,166,0.18);color:var(--mint-400);padding:1px 3px;border-radius:3px;font-weight:700;text-decoration:none;}
.chunk-card.bad .chunk-text mark.cut{color:#B23350;}
.chunk-note{margin-top:16px;font-size:14px;font-weight:700;}
.chunk-card.bad .chunk-note{color:#C23B54;}
.chunk-card.good .chunk-note{color:var(--mint-400);}

/* ---------- tabs (화면 구성) ---------- */
.tabs-nav{display:flex;gap:10px;margin-bottom:32px;}
.tab-btn{
	padding:12px 22px;border-radius:999px;
	border:1px solid var(--line-200);
	background:var(--white);
	font-size:16px;font-weight:700;color:var(--ink-600);
	cursor:pointer;
	transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.tab-btn:hover{border-color:rgba(32,201,166,0.4);}
.tab-btn.is-active{background:var(--navy-900);color:var(--white);border-color:var(--navy-900);}
.tab-panel{display:none;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.tab-panel.is-active{display:grid;}
.browser-frame{
	background:var(--white);
	border:1px solid var(--line-200);
	border-radius:var(--radius-lg);
	overflow:hidden;
	box-shadow:var(--shadow-card);
}
.browser-bar{
	display:flex;align-items:center;gap:8px;
	padding:10px 14px;background:var(--bg-100);border-bottom:1px solid var(--line-200);
}
.browser-bar .dot{width:8px;height:8px;border-radius:50%;background:var(--line-200);}
.browser-url{
	flex:1;margin-left:8px;background:var(--white);border:1px solid var(--line-200);
	border-radius:6px;padding:5px 10px;font-size:13px;color:var(--ink-400);
}
.browser-body{padding:22px;min-height:220px;}
.browser-body .b-row{display:flex;gap:10px;margin-bottom:10px;}
.browser-body .b-block{background:var(--bg-100);border-radius:6px;height:14px;}
.browser-body .b-block.w-40{width:40%;}
.browser-body .b-block.w-60{width:60%;}
.browser-body .b-block.w-80{width:80%;}
.browser-body .b-block.w-full{width:100%;}
.browser-body .b-card{background:var(--mint-100);border-radius:8px;padding:14px;margin-top:12px;}
.browser-body-shot{padding:0;min-height:0;line-height:0;}
.browser-body-shot img{display:block;width:100%;height:auto;}
.feature-list{list-style:none;padding:0;margin:0;}
.feature-list li{
	display:flex;gap:12px;padding:14px 0;
	border-top:1px solid var(--line-200);
	font-size:16px;color:var(--ink-600);
}
.feature-list li:first-child{border-top:none;}
.feature-list .ico{color:var(--mint-500);font-weight:800;flex-shrink:0;}
.feature-list b{color:var(--ink-900);}

/* ---------- TESS 자산 / 로드맵 ---------- */
.roadmap{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:56px;}
.roadmap-line{
	position:absolute;top:9px;left:2%;right:2%;height:2px;
	background:linear-gradient(90deg, var(--mint-500), var(--mint-400));
	z-index:0;
}
.roadmap-step{position:relative;z-index:1;text-align:center;}
.roadmap-dot{
	width:18px;height:18px;border-radius:50%;
	background:var(--white);border:3px solid var(--mint-500);
	margin:0 auto 16px;
}
.roadmap-step.is-now .roadmap-dot{
	background:var(--mint-500);
	box-shadow:0 0 0 6px rgba(32,201,166,0.18);
}
.roadmap-year{font-size:14px;font-weight:700;color:var(--mint-500);margin-bottom:4px;}
.roadmap-name{font-size:20px;font-weight:800;color:var(--ink-900);margin-bottom:8px;}
.roadmap-step p{font-size:15px;color:var(--ink-600);}

/* ---------- 레퍼런스 맵 (도입사례) ---------- */
.ref-card{
	background:var(--white);border:1px solid var(--line-200);
	border-radius:var(--radius-lg);padding:28px;
	box-shadow:var(--shadow-card);
}
.ref-card-head{display:flex;align-items:flex-start;gap:18px;margin-bottom:20px;}
.ref-card-head .num-badge{margin-bottom:0;flex-shrink:0;}
.ref-card-head h3{font-size:23px;font-weight:800;color:var(--navy-900);margin-bottom:10px;}
.ref-tags{display:flex;gap:6px;flex-wrap:wrap;}
.ref-tag{
	font-size:13px;font-weight:700;padding:5px 11px;border-radius:999px;
	background:var(--bg-100);color:var(--ink-400);
}
.ref-tag.on{background:var(--mint-100);color:var(--mint-500);}
.logo-grid.lg{grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px;}
.logo-grid.lg .logo-chip{min-height:76px;padding:10px;}
.logo-grid.lg .logo-chip img{max-height:56px;}
.logo-grid.lg .logo-chip span{font-size:15px;}

/* ---------- 상세 사례 카드 (도입사례) ---------- */
.case-detail{
	border:1px solid var(--line-200);border-radius:var(--radius-lg);
	background:var(--white);overflow:hidden;margin-bottom:28px;
}
.case-detail-head{padding:32px 32px 0;display:flex;align-items:center;gap:28px;flex-wrap:wrap;}
.case-detail-head h3{font-size:27px;font-weight:800;margin-top:14px;}
.case-logo{
	width:240px;height:160px;flex-shrink:0;
	border-radius:var(--radius-md);
	background:var(--white);border:1px solid var(--line-200);
	display:flex;align-items:center;justify-content:center;
	padding:24px;
}
.case-logo img{max-width:100%;max-height:100%;object-fit:contain;}
.case-detail-meta{
	display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
	margin-top:24px;padding:22px 32px;
	background:var(--bg-100);
	border-top:1px solid var(--line-200);border-bottom:1px solid var(--line-200);
}
.case-detail-meta div{display:flex;flex-direction:column;gap:5px;}
.case-detail-meta b{font-size:13px;color:var(--ink-400);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.case-detail-meta span{font-size:16px;font-weight:700;color:var(--navy-900);}
.case-detail-body{padding:28px 32px 32px;}
.case-detail-body > p{font-size:17px;color:var(--ink-600);margin-bottom:6px;}

/* ---------- 회사 개요 테이블 (회사소개) ---------- */
.info-table{
	width:100%;border-collapse:collapse;
	background:var(--white);border:1px solid var(--line-200);
	border-radius:var(--radius-lg);overflow:hidden;
}
.info-table tr{border-bottom:1px solid var(--line-200);}
.info-table tr:last-child{border-bottom:none;}
.info-table th, .info-table td{padding:18px 24px;text-align:left;font-size:16px;vertical-align:top;}
.info-table th{width:160px;background:var(--bg-100);color:var(--navy-900);font-weight:700;}
.info-table td{color:var(--ink-600);}

/* ---------- 다윗과 골리앗 (회사소개) ---------- */
.goliath-panel{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.goliath-copy p{font-size:19px;line-height:1.8;color:rgba(255,255,255,0.75);margin-bottom:20px;}
.goliath-copy p:last-child{margin-bottom:0;}
.goliath-copy b{color:#fff;font-weight:800;}
.goliath-art{display:flex;justify-content:center;}
@media (max-width:960px){
	.goliath-panel{grid-template-columns:1fr;gap:32px;}
	.goliath-art{order:-1;}
}

/* ---------- 고객사 (업종별 그리드) ---------- */
.customer-group{margin-bottom:40px;}
.customer-group:last-child{margin-bottom:0;}
.customer-group h3{
	font-size:18px;font-weight:800;color:var(--navy-900);
	margin-bottom:16px;
	display:flex;align-items:center;gap:10px;
}
.customer-group h3::before{
	content:'';width:16px;height:2px;background:var(--mint-500);border-radius:1px;
}

/* ---------- 레거시 링크 ---------- */
.legacy-link{
	display:inline-flex;align-items:center;gap:6px;
	font-size:15px;color:var(--ink-400);
	padding-top:8px;
}
.legacy-link:hover{color:var(--ink-600);}

/* ---------- Contact / 오시는길 ---------- */
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.contact-card{
	background:var(--white);border:1px solid var(--line-200);
	border-radius:var(--radius-lg);padding:28px;
	box-shadow:var(--shadow-card);
}
.contact-card .num-badge{
	background:linear-gradient(160deg, var(--navy-800), var(--navy-900));
	color:var(--mint-400);
	box-shadow:0 8px 20px rgba(10,24,48,0.35), 0 0 0 1px rgba(62,226,192,0.18) inset;
}
.contact-card h3{font-size:15px;font-weight:700;color:var(--ink-400);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;}
.contact-card .val{font-size:23px;font-weight:800;color:var(--navy-900);margin-bottom:10px;word-break:break-all;}
.contact-card p{font-size:15px;color:var(--ink-600);}
.map-frame{
	border-radius:var(--radius-lg);overflow:hidden;
	border:1px solid var(--line-200);box-shadow:var(--shadow-card);
}
.map-frame img{width:100%;display:block;}
.map-frame iframe{width:100%;height:420px;border:0;display:block;}
@media (max-width:640px){
	.map-frame iframe{height:300px;}
}
.map-info{
	display:flex;flex-wrap:wrap;gap:28px;
	margin-top:24px;padding:24px 28px;
	background:var(--bg-100);border-radius:var(--radius-lg);
}
.map-info div{display:flex;flex-direction:column;gap:4px;}
.map-info b{font-size:14px;color:var(--ink-400);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.map-info span{font-size:16px;font-weight:700;color:var(--navy-900);}
@media (max-width:960px){
	.contact-cards{grid-template-columns:1fr;}
}

/* ---------- 서브페이지 반응형 ---------- */
@media (max-width:960px){
	.page-hero h1{font-size:36px;}
	.step-row{flex-direction:column;}
	.step-arrow{transform:rotate(90deg);padding:8px 0;}
	.chunk-compare{grid-template-columns:1fr;}
	.tab-panel{grid-template-columns:1fr;}
	.roadmap{grid-template-columns:repeat(2,1fr);row-gap:36px;}
	.roadmap-line{display:none;}
	.case-detail-meta{grid-template-columns:1fr;gap:14px;}
	.logo-grid.lg{grid-template-columns:repeat(2,1fr);}
	.case-logo{width:180px;height:130px;padding:18px;}
}
@media (max-width:640px){
	.page-hero{padding:40px 0 32px;}
	.page-hero h1{font-size:31px;}
	.hybrid-card{padding:24px;}
	.roadmap{grid-template-columns:1fr;}
	.case-detail-head, .case-detail-body{padding-left:22px;padding-right:22px;}
	.case-detail-meta{padding-left:22px;padding-right:22px;}
	.info-table th{width:110px;padding:14px 16px;font-size:15px;}
	.info-table td{padding:14px 16px;font-size:15px;}
	.case-logo{width:150px;height:110px;padding:14px;}
	.ref-card-head{flex-wrap:wrap;}
}

/* ---------- footer ---------- */
.site-footer{background:var(--navy-900);color:rgba(255,255,255,0.6);padding:56px 0 40px;}
.site-footer .logo{margin-bottom:18px;}
.footer-info{font-size:16px;line-height:2;}
.footer-links{margin-top:20px;display:flex;gap:20px;font-size:16px;}
.footer-links a:hover{color:var(--white);}
.footer-bottom{margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.1);font-size:14px;color:rgba(255,255,255,0.4);}

/* ---------- responsive ---------- */
@media (max-width:960px){
	.gnb{
		display:none;
		position:absolute;top:80px;left:0;right:0;
		background:var(--white);
		border-bottom:1px solid var(--line-200);
		flex-direction:column;
		align-items:flex-start;
		gap:0;
		padding:8px 24px 16px;
	}
	.gnb.open{display:flex;}
	.gnb a{width:100%;padding:12px 0;border-top:1px solid var(--line-200);}
	.gnb a:first-child{border-top:none;}
	.gnb-item{width:100%;flex-direction:column;align-items:flex-start;align-self:auto;border-top:1px solid var(--line-200);}
	.gnb > .gnb-item:first-child{border-top:none;}
	.gnb-item > a{width:100%;border-top:none;}
	.gnb-dropdown{
		position:static;transform:none;
		opacity:1;visibility:visible;pointer-events:auto;
		box-shadow:none;border:none;padding:0 0 8px 14px;
		width:100%;min-width:0;
	}
	.gnb-dropdown a{width:100%;padding:9px 0;border-top:none;font-size:15px;color:var(--ink-400);}
	.header-cta .btn-outline{display:none;}
	.nav-toggle{display:block;}
	.hero-slide{grid-template-columns:1fr;}
	.hero-visual{order:-1;aspect-ratio:16/9;perspective:none;}
	.art-panel{max-width:420px;margin:0 auto;}
	.grid-4{grid-template-columns:repeat(2,1fr);}
	.grid-3{grid-template-columns:repeat(2,1fr);}
	.compare{grid-template-columns:1fr;}
	.stat-bar{grid-template-columns:repeat(2,1fr);row-gap:28px;}
	.stat-bar .stat:nth-child(3){border-left:none;}
	.logo-grid{grid-template-columns:repeat(3,1fr);}
	.final-cta{flex-direction:column;align-items:flex-start;}
}
@media (max-width:640px){
	html{font-size:17px;}
	.section{padding:36px 0;}
	.hero{padding:88px 0 64px;}
	.hero h1{font-size:42px;}
	.hero-controls{gap:14px;margin-top:32px;}
	.hero-arrow{width:30px;height:30px;font-size:17px;}
	.section-title{font-size:33px;}
	.grid-4, .grid-3, .grid-2{grid-template-columns:1fr;}
	.logo-grid{grid-template-columns:repeat(2,1fr);}
	.final-cta{padding:40px 28px;}
}
