/* ===================== Root & Global ===================== */
:root {
	--brand: #0d6efd;

	/* Header height */
	--header-h: 90px;
	--header-h-small: 60px;
	--header-mh: -90px;

	/* 시스템 라이트/다크 힌트 */
	color-scheme: light dark;
}

/* 전체 배경 / 기본 폰트 */
body {
	font-family: system-ui, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", Segoe UI, Roboto, Helvetica, Arial, sans-serif; 
	min-height: 100vh;
	padding-top: var(--header-h);
}

a {
	color:#000000;
	text-decoration: none;
}
a:hover {
	color:#303030;
}

.post-content img { 
	max-width:100%; 
	height:auto; 
}

/* 헤더 뒤로 본문이 숨지지 않도록 패딩 (축소 상태에서 변수 교체) */
body.is-shrink {
	--header-h: var(--header-h-small);
}

/* 공통 유틸 */
.bg-white { background-color:#fff; }

/* ===================== Header / Navigation ===================== */
/* Shrinkable Header */
#site-header{
	transition: background-color .3s ease, box-shadow .3s ease;
	margin:0;
}

/* 상단 바: 3열 그리드 (좌/중앙/우) + 높이 트랜지션 */
#site-header .topbar {
	display: grid;
	grid-template-columns: 100px 1fr 100px;
	align-items: center;
	gap: 16px;
	min-height: var(--header-h);
	transition: min-height .3s ease, padding .3s ease;
}

/* 축소 시 그림자 + 라운드 */
body.is-shrink #site-header{
	box-shadow: 0 6px 20px rgba(0,0,0,.15);
	margin:0 12px 0 12px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	transition: ease-out 0.3s;
}

/* 로고/SVG 크기 */
#site-header .brand svg { 
	height: 24px;
	transition: height .3s ease;
	margin-left:10px;
}
body.is-shrink #site-header .brand svg { height: 22px; }

/* 내비 여백/폰트 */
#site-header .main-nav .nav-list a{
	display:inline-block; 
	padding: .4rem .5rem;
	transition: padding .3s ease, font-size .3s ease;
}
body.is-shrink #site-header .main-nav .nav-list a{
	padding: .25rem .45rem;
	font-size: .95rem;
}

/* 아이콘 버튼 스케일 */
#site-header .right-actions .icon-btn{
	padding: .35rem;
	font-size: 1.15rem;
	transition: padding .3s ease, font-size .3s ease;
}
body.is-shrink #site-header .right-actions .icon-btn{
	padding: .25rem;
	font-size: 1.05rem;
}

/* 헤더 라이트/다크 색상 */
header { transition: background .25s, color .25s; }
footer { padding-top:30px; }

.brand svg .st0 { 
	fill: currentColor; 
	transition: fill .25s ease;
}

body.is-shrink .light-header {background:rgba(255,255,255,0.75);}
body.is-shrink .dark-header {background:rgba(0,0,0,0.75);}

.light-header,
.light-header .nav-list a,
.light-header .icon-btn i,
.light-header .brand { color:#000; }

.dark-header,
.dark-header .nav-list a,
.dark-header .icon-btn i,
.dark-header .brand { color:#fff; }

.overlay-head .icon-btn i { color:#000 !important; }

/* ===================== Header Navigation Layout ===================== */
/* 중앙 메뉴를 항상 '뷰포트 중앙'에 고정 */
.main-nav {
	justify-self: center;
}
.nav-list {
	display: flex;
	align-items: center;
	gap: 30px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.nav-list a {
	text-decoration: none;
	font-weight: 600;
	opacity: 1;
	font-size: 1.2rem;
	transition: all 0.2s;
}
.nav-list a:hover {
	opacity: 0.75;
	text-decoration: none;
}

/* 우측 아이콘 버튼들 */
.right-actions {
	display: flex;
	align-items: center;
	gap: 10px;
}
.icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius:0;
	border:0;
	background:transparent;
	transition: transform .08s ease, background-color .2s ease, border-color .2s ease;
}
.icon-btn:hover {
	transform: translateY(0px);
}
.icon-btn.lg {
	width: 44px;
	height: 44px;
	border-radius: 12px;
}
.icon-btn i { font-size: 1.6rem; }

/* 상단 로고 */
.brand-img {
	width: auto;
	display: block;
}

/* 컨테이너 1680px */
.container-1680 {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;
	width: 100%;
	padding-right: calc(var(--bs-gutter-x) * 0.5);
	padding-left: calc(var(--bs-gutter-x) * 0.5);
	margin-right: auto;
	margin-left: auto;
	max-width: 1680px;
}

/* 반응형 헤더 */
@media (max-width: 992px) {
	.main-nav { display: none; }
	:root { --header-h: 58px; }
	body { padding-top: var(--header-h); }

	#site-header .topbar {
		display: grid;
		grid-template-columns: 100px 1fr;
	}
}

/* ===================== Overlay Menu ===================== */
.overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.6);
	backdrop-filter: blur(3px);
	display: none;
	z-index: 1050;
}
.overlay[aria-hidden="false"] { display: block; }

.overlay-inner {
	background: var(--bs-body-bg);
	color: var(--bs-body-color);
	width: 100%;
	min-height: 100%;
	padding: 15px 15px 60px;
	display: grid;
	grid-template-rows: auto 1fr auto;
	gap: 24px;
}
.overlay-head { min-height: 56px; }
.overlay-body { display: grid; align-content: start; }

.overlay-nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}
.overlay-nav a {
	display: block;
	font-size: clamp(1.15rem, 2vw, 1.5rem);
	font-weight: 700;
	text-decoration: none;
	padding: 12px 4px;
	border-bottom: 1px solid var(--bs-border-color);
}
.overlay-nav a:hover { text-decoration: underline; }

.overlay-foot {
	display: flex;
	justify-content: flex-start;
}

/* 모션 최소화 설정 존중 */
@media (prefers-reduced-motion: reduce){
	#site-header .topbar,
	#site-header,
	#site-header .brand svg,
	#site-header .main-nav .nav-list a,
	#site-header .right-actions .icon-btn{
		transition: none !important;
	}
}

/* ===================== Hero / Carousel ===================== */
.hero-content h1 {
	margin: 0;
	font-size: 46px;
	font-weight: 700;
	line-height: 56px;
}
.hero-content h1 span {
	color: var(--accent-color);
}
.hero-content p {
	color: color-mix(in srgb, var(--default-color), transparent 0%);
	margin: 30px 0 35px 0;
	font-size: 17px;
	font-weight: 400;
	letter-spacing:0.5px;
}

/* 메인 히어로 (통합 버전) */
.main-hero{
	position: relative;
	overflow: hidden;
	background: #000;
	display:grid;
	place-items:center;
	min-height:80vh;
	text-align:center;
	--count: 7;
	margin-top: var(--header-mh);
}
.main-hero canvas{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	display:block;
	pointer-events:none;
}
.main-hero canvas.bg{ z-index:0; }
.main-hero canvas.lines{ z-index:1; } /* 필요시 사용 */
.main-hero canvas.grain{
	z-index:2;
	opacity:0;
}

.main-hero .hero-content{
	position: relative;
	z-index:3;
	color:#fff;
	text-align:center;
	width:100%;
	padding-top: 70px;
}


/* 반응형 헤더 */
@media (max-width: 720px) {
	.hero-content h1 {
		margin: 0;
		font-size: 26px;
		font-weight: 700;
		line-height: 36px;
	}
	.hero-content p {
		font-size: 14px;
		font-weight: 400;
		letter-spacing:0;
		padding:0 35px;
	}
}


/* 부 히어로 높이 */
.sub-hero-h {
	min-height:360px !important;
	margin-bottom:60px;
}

/* 캐러셀 캡션 중앙정렬 유틸 */
.carousel-caption.caption-center{
	top:50%;
	left:50%;
	bottom:auto;
	right:auto;
	transform:translate(-50%, -50%);
	text-align:center;
	width:100%;
}

/* 히어로 모션 최소화 */
@media (prefers-reduced-motion: reduce){
	.main-hero canvas.bg,
	.main-hero canvas.grain { animation:none; }
}

/* ===================== Card / Portfolio / Blog ===================== */
/* 공통 카드 */
.ws-card{
	border-radius:15px;
	overflow:hidden;
	min-height:320px;
	box-shadow:0 5px 15px rgba(0,0,0,.1);
	transition:transform .25s ease, box-shadow .25s ease;
	background:#111;
}
@media (min-width:992px){
	.ws-card{ min-height:300px; }
}
.ws-card:hover{
	transform:translateY(-4px);
	box-shadow:0 5px 15px rgba(0,0,0,.1);
}

/* 상·하 정렬 */
.ws-inner{
	display:flex;
	flex-direction:column;
	height:100%;
}
.ws-top{ align-self:flex-start; }
.ws-bottom{ align-self:stretch; }

/* 타이포: 배지 크게 / 설명 작게 */
.ws-badge-text{
	font-weight:800;
	line-height:1.1;
	letter-spacing:-.02em;
	font-size:clamp(22px, 3.2vw, 32px);
	margin-bottom:.4rem;
}
.ws-desc{
	font-size:clamp(15px, 1.4vw, 18px);
	line-height:1.55;
	margin:0;
	opacity:.95;
}

/* 배경 (현재는 화이트 고정) */
.ws-bg-1,
.ws-bg-2,
.ws-bg-3,
.ws-bg-4,
.ws-bg-5,
.ws-bg-6 {
	background-color:#ffffff;
}

/* 모션 최소화 환경 */
@media (prefers-reduced-motion: reduce){
	.ws-card{ transition:none; }
}

/* 포트폴리오 카드 */
.portfolio-card-a > a {
	display:block;
	border-radius: 15px;
	overflow: hidden;
	box-shadow:0 5px 15px rgba(0,0,0,.1);
	transition: transform .25s ease, box-shadow .25s ease;
}
.portfolio-card-a > a:hover{
	transform:translateY(-4px);
	box-shadow:0 16px 40px rgba(0,0,0,.18);
}

/* 블로그 카드 */
.blog-card-a {
	display:block;
	border-radius: 15px;
	overflow: hidden;
	box-shadow:0 5px 15px rgba(0,0,0,.1);
	transition: transform .25s ease, box-shadow .25s ease;
	border:0 !important;
}
.blog-card-a:hover{
	transform:translateY(-4px);
	box-shadow:0 16px 40px rgba(0,0,0,.18);
}
.blog-card-a .card-body {
	background-color:transparent !important;
}

/* ===================== About (aboutws) ===================== */
.aboutws{
	--ink:#12151a;
	--muted:#6b7280;
	--line:rgba(18,21,26,.10);
	--soft:#f6f8fb;
	--accent:#2f7cff;
	--accent-2:#ff6b2b;
	--grad: linear-gradient(135deg, rgba(47,124,255,.06), rgba(255,107,43,.06));
}

/* 섹션 여백/경계 */
.aboutws .aboutws-section{
	padding: clamp(2.2rem, 4.2vw, 4rem) 0;
	border-top: 1px solid var(--line);
}
.aboutws .aboutws-section:first-child{ border-top: 0; }

/* HERO 패널 */
.aboutws .aboutws-hero.has-bg{
	background: var(--grad);
	border-radius: 1rem;
	padding: clamp(1.4rem, 3.6vw, 2rem);
}
.aboutws .aboutws-hero .aboutws-hero-media{
	border:1px solid var(--line);
	background:#fff;
	border-radius:.9rem;
	padding:.6rem;
	box-shadow: 0 12px 30px rgba(0,0,0,.06);
}
.aboutws .aboutws-accent-ink{ color: var(--accent); }
.aboutws .aboutws-lead{ color:#3b4250; }

/* 작은 프리헤더 */
.aboutws .aboutws-eyebrow{
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--muted);
	margin-bottom:.35rem;
}

/* 버튼 */
.aboutws .aboutws-btn-accent{
	background: var(--accent);
	color:#fff;
	border:1px solid var(--accent);
}
.aboutws .aboutws-btn-accent:hover{
	filter: brightness(.95);
	color:#fff;
}

/* 칩 */
.aboutws .aboutws-chips{
	display:flex;
	flex-wrap:wrap;
	gap:.5rem;
	margin-bottom:.5rem;
}
.aboutws .chip{
	display:inline-block;
	padding:.35rem .6rem;
	font-size:.85rem;
	border-radius:999px;
	background:rgba(47,124,255,.10);
	border:1px solid rgba(47,124,255,.22);
	color:#214fa8;
	font-weight:600;
}

/* 카드/노트/미디어/맵/팀 */
.aboutws .aboutws-card,
.aboutws .aboutws-note,
.aboutws .aboutws-media,
.aboutws .aboutws-person,
.aboutws .aboutws-map{
	background:#fff;
	border:1px solid var(--line);
	border-radius:1rem;
	padding:1.1rem;
}
.aboutws .aboutws-card.accent-top{ border-top:3px solid var(--accent); }
.aboutws .aboutws-card:hover{
	box-shadow:0 12px 30px rgba(0,0,0,.06);
	transition: box-shadow .2s ease;
}
.aboutws .aboutws-map img{
	border-radius:.75rem;
	width:100%;
	display:block;
}

/* 노트(철학) — 좌측 컬러 라인 */
.aboutws .aboutws-note{
	position:relative;
	padding-left:1rem;
}
.aboutws .aboutws-note::before{
	content:"";
	position:absolute;
	left:0;
	top:.35rem;
	bottom:.35rem;
	width:4px;
	border-radius:4px;
	background:linear-gradient(180deg, var(--accent), var(--accent-2));
}

/* 리스트 */
.aboutws .aboutws-list{
	list-style:none;
	padding-left:0;
	margin-bottom:0;
}
.aboutws .aboutws-list li{
	position:relative;
	padding-left:1.05rem;
	margin-bottom:.35rem;
	color:var(--muted);
}
.aboutws .aboutws-list li::before{
	content:"";
	position:absolute;
	left:0;
	top:.6rem;
	width:.45rem;
	height:.45rem;
	border-radius:50%;
	background: var(--accent);
}

/* 연혁 — 2열 지그재그 타임라인 */
.aboutws .aboutws-timeline2{
	position:relative;
	display:grid;
	grid-template-columns:repeat(12,1fr);
	gap:1rem;
}
.aboutws .aboutws-timeline2::before{
	content:"";
	position:absolute;
	left:50%;
	top:0;
	bottom:0;
	width:2px;
	background: linear-gradient(180deg, rgba(47,124,255,.35), rgba(255,107,43,.35));
	transform: translateX(-50%);
}
.aboutws .aboutws-timeline2 .tl-item{ grid-column: span 6; }
.aboutws .aboutws-timeline2 .tl-item:nth-child(odd){
	grid-column: 1 / span 6;
	padding-right:2rem;
}
.aboutws .aboutws-timeline2 .tl-item:nth-child(even){
	grid-column: 7 / span 6;
	padding-left:2rem;
}

.aboutws .tl-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:.9rem;
	padding:1rem;
	box-shadow: 0 10px 24px rgba(0,0,0,.05);
	position:relative;
}
.aboutws .tl-card::after{
	content:"";
	position:absolute;
	top:1rem;
	width:12px;
	height:12px;
	border-radius:50%;
	background: #fff;
	border:3px solid var(--accent-2);
}
.aboutws .aboutws-timeline2 .tl-item:nth-child(odd) .tl-card::after{ right:-2.6rem; }
.aboutws .aboutws-timeline2 .tl-item:nth-child(even) .tl-card::after{ left:-2.6rem; }

.aboutws .tl-year{
	font-weight:800;
	color:#0f172a;
	margin-bottom:.25rem;
}
.aboutws .tl-text{ color:var(--muted); }

/* 팀 */
.aboutws .aboutws-person{ overflow:hidden; }
.aboutws .aboutws-person img{
	width:100%;
	height:auto;
	border-radius:.75rem;
	display:block;
}
.aboutws .aboutws-badge-soft{
	background: rgba(47,124,255,.10);
	color:#214fa8;
	border:1px solid rgba(47,124,255,.22);
}
.aboutws .aboutws-person-body{ padding:.8rem 0 0; }

/* 타이포 */
.aboutws h1,
.aboutws h2,
.aboutws h3,
.aboutws h4,
.aboutws h5{ color:var(--ink); }

.aboutws p,
.aboutws small,
.aboutws li{ color:var(--muted); }

/* 모바일/태블릿 */
@media (max-width: 991.98px){
	.aboutws .aboutws-timeline2::before{
		left:1rem;
		transform:none;
	}
	.aboutws .aboutws-timeline2{
		grid-template-columns:1fr;
	}
	.aboutws .aboutws-timeline2 .tl-item,
	.aboutws .aboutws-timeline2 .tl-item:nth-child(odd),
	.aboutws .aboutws-timeline2 .tl-item:nth-child(even){
		grid-column: 1 / -1;
		padding-left:2rem;
		padding-right:0;
	}
	.aboutws .tl-card::after{
		left:-2.6rem !important;
		right:auto !important;
	}
}
@media (max-width: 575.98px){
	.aboutws .display-6{ font-size:1.8rem; }
	.aboutws .aboutws-card,
	.aboutws .aboutws-note,
	.aboutws .aboutws-media,
	.aboutws .aboutws-person,
	.aboutws .aboutws-map{
		padding:1rem;
	}
}

/* ===================== Services (svcws) ===================== */
.svcws{
	--ink:#12151a;
	--muted:#6b7280;
	--line:rgba(18,21,26,.10);
	--soft:#f6f8fb;
	--accent:#2f7cff;
	--accent-2:#ff6b2b;
	--grad: linear-gradient(135deg, rgba(47,124,255,.06), rgba(255,107,43,.06));
}

/* 섹션 여백/경계 */
.svcws .svcws-section{
	padding: clamp(2.2rem, 4vw, 4rem) 0;
	border-top: 1px solid var(--line);
}
.svcws .svcws-section:first-child{ border-top: 0; }

/* HERO */
.svcws .svcws-hero.has-bg{
	background: var(--grad);
	border-radius: 1rem;
	padding: clamp(1.4rem, 3.6vw, 2rem);
}
.svcws .svcws-hero .svcws-hero-media{
	border:1px solid var(--line);
	background:#fff;
	border-radius:.9rem;
	padding:.6rem;
	box-shadow: 0 12px 30px rgba(0,0,0,.06);
}
.svcws .svcws-eyebrow{
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--muted);
	margin-bottom:.35rem;
}
.svcws .svcws-accent{ color: var(--accent); }
.svcws .svcws-lead{ color:#3b4250; }

/* 버튼 */
.svcws .svcws-btn-accent{
	background: var(--accent);
	color:#fff;
	border:1px solid var(--accent);
}
.svcws .svcws-btn-accent:hover{
	filter: brightness(.95);
	color:#fff;
}

/* 카드 */
.svcws .svcws-card{
	display:block;
	text-decoration:none;
	background:#fff;
	border:1px solid var(--line);
	border-radius:1rem;
	overflow:hidden;
	transition: transform .2s ease, box-shadow .2s ease;
	padding:3rem;
}
.svcws .svcws-card:hover{
	transform: translateY(-2px);
	box-shadow: 0 12px 30px rgba(0,0,0,.06);
}
.svcws .svcws-card-img{
	width:100%;
	aspect-ratio: 12 / 6.3;
	object-fit:cover;
	display:block;
}
.svcws .svcws-card-body{ padding:1rem; }

/* Why 섹션 체크리스트 */
.svcws .svcws-media{
	border:1px solid var(--line);
	border-radius:1rem;
	padding:.6rem;
	background:#fff;
}
.svcws .svcws-check{
	list-style:none;
	padding-left:0;
	margin-bottom:0;
}
.svcws .svcws-check li{
	position:relative;
	padding-left:1.2rem;
	margin-bottom:.5rem;
	color:var(--ink);
}
.svcws .svcws-check li::before{
	content:"";
	position:absolute;
	left:0;
	top:.5rem;
	width:.55rem;
	height:.55rem;
	border-radius:50%;
	background:linear-gradient(180deg, var(--accent), var(--accent-2));
}

/* 상세(Service Detail) */
.svcws .svcws-detail.has-bg{
	background: var(--grad);
	border-radius: 1rem;
	padding: clamp(1.2rem, 3vw, 1.8rem);
}
.svcws .svcws-kicker{
	display:inline-block;
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:#214fa8;
	background:rgba(47,124,255,.10);
	border:1px solid rgba(47,124,255,.22);
	padding:.25rem .5rem;
	border-radius:999px;
	margin-bottom:.3rem;
}
.svcws .svcws-list{
	list-style:none;
	padding-left:0;
	margin-bottom:0;
}
.svcws .svcws-list li{
	position:relative;
	padding-left:1.05rem;
	margin-bottom:.35rem;
	color:var(--muted);
}
.svcws .svcws-list li::before{
	content:"";
	position:absolute;
	left:0;
	top:.6rem;
	width:.45rem;
	height:.45rem;
	border-radius:50%;
	background: var(--accent);
}
.svcws .accent-top{ border-top:3px solid var(--accent); }

/* 프로세스 */
.svcws .svcws-step{
	background:#fff;
	border:1px solid var(--line);
	border-radius:1rem;
	padding:1.1rem;
	height:100%;
}
.svcws .svcws-step .num{
	width:36px;
	height:36px;
	border-radius:.6rem;
	background:var(--accent);
	color:#fff;
	display:grid;
	place-items:center;
	font-weight:700;
	margin-bottom:.5rem;
}

/* 타이포 */
.svcws h1,
.svcws h2,
.svcws h3,
.svcws h4,
.svcws h5{ color:var(--ink); }

.svcws p,
.svcws small,
.svcws li{ color:var(--muted); }

/* 반응형 */
@media (max-width: 575.98px){
	.svcws .display-6{ font-size:1.8rem; }
	.svcws .svcws-card-body,
	.svcws .svcws-step{ padding:1rem; }
}

/* === Services FAQ === */
.svcws .svcws-faq-grid { align-items: stretch; }

.svcws .svcws-faq{
	background:#fff;
	border:1px solid var(--line);
	border-radius: .9rem;
	padding: .9rem 1rem;
	transition: box-shadow .2s ease, border-color .2s ease, background .2s ease;
}
.svcws .svcws-faq[open]{
	border-color: rgba(47,124,255,.35);
	box-shadow: 0 10px 24px rgba(0,0,0,.05);
	background: linear-gradient(180deg, rgba(47,124,255,.03), rgba(255,107,43,.03));
}
.svcws .svcws-faq > summary{
	list-style: none;
	cursor: pointer;
	position: relative;
	padding-right: 2rem;
	font-weight: 700;
	color: var(--ink);
	outline: none;
}
.svcws .svcws-faq > summary::-webkit-details-marker{ display:none; }

.svcws .svcws-faq > summary::after{
	content: "＋";
	position: absolute;
	right: .25rem;
	top: 0;
	font-weight: 800;
	color: var(--accent);
	transform: translateY(1px);
}
.svcws .svcws-faq[open] > summary::after{
	content: "–";
	color: var(--accent-2);
}
.svcws .svcws-faq .faq-a{
	margin-top: .6rem;
	color: var(--muted);
	font-size: .95rem;
}

/* ===================== Price (pricews) ===================== */
.pricews{
	--ink:#12151a;
	--muted:#6b7280;
	--line:rgba(18,21,26,.10);
	--soft:#f6f8fb;
	--accent:#2f7cff;
	--accent-2:#ff6b2b;
	--grad: linear-gradient(135deg, rgba(47,124,255,.06), rgba(255,107,43,.06));
}

/* 섹션 여백/경계 */
.pricews .pricews-section{
	padding: clamp(2.2rem, 4vw, 4rem) 0;
	border-top: 1px solid var(--line);
}
.pricews .pricews-section:first-child{ border-top:0; }

/* HERO */
.pricews .pricews-hero.has-bg{
	background: var(--grad);
	border-radius: 1rem;
	padding: clamp(1.4rem, 3.6vw, 2rem);
}
.pricews .pricews-hero .pricews-hero-media{
	border:1px solid var(--line);
	background:#fff;
	border-radius:.9rem;
	padding:.6rem;
	box-shadow: 0 12px 30px rgba(0,0,0,.06);
}
.pricews .pricews-eyebrow{
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--muted);
	margin-bottom:.35rem;
}
.pricews .pricews-lead{ color:#3b4250; }

.pricews .pricews-btn-accent{
	background:var(--accent);
	color:#fff;
	border:1px solid var(--accent);
}
.pricews .pricews-btn-accent:hover{
	filter:brightness(.95);
	color:#fff;
}

/* 칩 네비 */
.pricews .pricews-chips{
	display:flex;
	flex-wrap:wrap;
	gap:.5rem;
	justify-content:center;
}
.pricews .chip{
	display:inline-block;
	padding:.4rem .7rem;
	font-size:.9rem;
	border-radius:999px;
	background:rgba(47,124,255,.10);
	border:1px solid rgba(47,124,255,.22);
	color:#214fa8;
	font-weight:600;
	text-decoration:none;
}

/* 안내박스 */
.pricews .pricews-note{
	background:#fff;
	border:1px solid var(--line);
	border-radius: .9rem;
	padding:1rem;
}
.pricews .pricews-list{
	list-style:none;
	padding-left:0;
	margin:0;
}
.pricews .pricews-list li{
	position:relative;
	padding-left:1.05rem;
	margin:.25rem 0;
	color:var(--muted);
}
.pricews .pricews-list li::before{
	content:"";
	position:absolute;
	left:0;
	top:.6rem;
	width:.45rem;
	height:.45rem;
	border-radius:50%;
	background:var(--accent);
}

/* PRICING BLOCK */
.pricews .pricews-block.has-bg{
	background: var(--grad);
	border-radius: 1rem;
	padding: clamp(1.2rem, 3vw, 1.8rem);
}
.pricews .pricews-kicker{
	display:inline-block;
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:#214fa8;
	background:rgba(47,124,255,.10);
	border:1px solid rgba(47,124,255,.22);
	padding:.25rem .5rem;
	border-radius:999px;
	margin-bottom:.3rem;
}

/* 카드 */
.pricews .pricews-card{
	background:#fff;
	border:1px solid var(--line);
	border-radius:1rem;
	padding:1.1rem;
	position:relative;
	overflow:hidden;
	transition: box-shadow .2s ease, transform .2s ease;
}
.pricews .pricews-card:hover{
	box-shadow:0 12px 30px rgba(0,0,0,.06);
	transform: translateY(-2px);
}
.pricews .pricews-card.is-popular{ border-top:3px solid var(--accent); }

.pricews .pricews-card .ribbon{
	position:absolute;
	top:12px;
	right:-32px;
	transform: rotate(35deg);
	background: linear-gradient(90deg, var(--accent), var(--accent-2));
	color:#fff;
	font-size:.72rem;
	font-weight:800;
	letter-spacing:.06em;
	padding:.35rem 2rem;
}

.pricews .pricews-card-head .title{
	font-weight:800;
	color:#0f172a;
}
.pricews .pricews-card-head .price{
	font-size:1.25rem;
	font-weight:800;
	color:#12151a;
}
.pricews .pricews-card-head .hint{
	color:var(--muted);
	font-size:.9rem;
}

.pricews .pricews-feats{
	list-style:none;
	padding-left:0;
	margin: .75rem 0 1rem;
}
.pricews .pricews-feats li{
	position:relative;
	padding-left:1.05rem;
	margin:.35rem 0;
	color:var(--muted);
}
.pricews .pricews-feats li::before{
	content:"";
	position:absolute;
	left:0;
	top:.6rem;
	width:.45rem;
	height:.45rem;
	border-radius:50%;
	background: var(--accent);
}

.pricews .pricews-cta .btn{ height: 44px; }

/* 타이포 */
.pricews h1,
.pricews h2,
	pricews h3,
.pricews h4,
.pricews h5{ color:var(--ink); }

.pricews p,
.pricews small,
.pricews li{ color:var(--muted); }

/* 반응형 */
@media (max-width: 575.98px){
	.pricews .display-6{ font-size:1.8rem; }
	.pricews .pricews-card{ padding:1rem; }
}

/* ===================== Contact (contactws) ===================== */
.contactws{
	--ink:#12151a;
	--muted:#6b7280;
	--line:rgba(18,21,26,.10);
	--soft:#f6f8fb;
	--accent:#2f7cff;
	--accent-2:#ff6b2b;
	--grad: linear-gradient(135deg, rgba(47,124,255,.06), rgba(255,107,43,.06));
}

/* 헤더/힌트 */
.contactws .contactws-hero{
	background: var(--grad);
	border:1px solid var(--line);
	border-radius:1rem;
	padding: clamp(1rem, 3vw, 1.5rem);
}
.contactws .contactws-eyebrow{
	font-size:.8rem;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:var(--muted);
}
.contactws .contactws-tip{
	background:#fff;
	border:1px solid var(--line);
	border-radius:.9rem;
	padding:.9rem;
}
.contactws .contactws-list{
	list-style:none;
	margin:0;
	padding-left:0;
}
.contactws .contactws-list li{
	position:relative;
	padding-left:1.05rem;
	margin:.25rem 0;
	color:var(--muted);
}
.contactws .contactws-list li::before{
	content:"";
	position:absolute;
	left:0;
	top:.6rem;
	width:.45rem;
	height:.45rem;
	border-radius:50%;
	background:var(--accent);
}

/* 섹션 타이틀 */
.contactws .contactws-section-title{
	display:flex;
	gap:.5rem;
	align-items:baseline;
	border-left:4px solid var(--accent);
	padding-left:.6rem;
	margin-bottom:.25rem;
}
.contactws .contactws-section-title .title{
	font-weight:800;
	color:#0f172a;
}
.contactws .contactws-section-title .sub{
	color:var(--muted);
	font-size:.95rem;
}

/* 라벨 표시 */
.contactws .form-label {
	font-weight: bold;
}
.contactws .form-label .req{
	display:inline-block;
	margin-left:.35rem;
	font-size:.75rem;
	padding:.1rem .4rem;
	background:#b00;
	color:#fff;
	border-radius:.4rem;
}
.contactws .form-label .opt{
	display:inline-block;
	margin-left:.35rem;
	font-size:.75rem;
	padding:.1rem .4rem;
	background:rgba(17,17,17,.06);
	color:#111;
	border-radius:.4rem;
}

/* 노트 */
.contactws .contactws-note{
	background:#fff;
	border:1px solid var(--line);
	border-radius:.9rem;
	padding:1rem;
	margin-top:.25rem;
}

/* 메시지 필드 */
.contactws .contactws-message{ min-height: 180px; }

/* 검증 시 시각 피드백 */
.contactws .form-control:invalid,
.contactws .form-select:invalid{
	border-color: rgba(255,107,43,.55);
}
.contactws .form-control:valid,
.contactws .form-select:valid{
	border-color: rgba(47,124,255,.55);
}

/* alert 튜닝 */
.contactws .alert{ border-radius: .9rem; }

/* 반응형 */
@media (max-width: 575.98px){
	.contactws .h1-md{ font-size:1.6rem; }
}

/* ===================== Footer (ftws) ===================== */
.ftws{
	--ink:#0f172a;
	--muted:#7a8191;
	--line:rgba(15,23,42,.14);
	--soft:#0b1020;
	--bg:#0b1222;
	--bg-grad:
		radial-gradient(80rem 50rem at 120% -10%, rgba(47,124,255,.12), transparent 60%),
		radial-gradient(70rem 40rem at -20% 120%, rgba(255,107,43,.10), transparent 60%),
		linear-gradient(180deg, #0b1222, #0b1020);
	--accent:#2f7cff;
	--accent-2:#ff6b2b;

	color:#cbd5e1;
	background: var(--bg-grad);
	border-top: 1px solid var(--line);

	/* 전체 기본 크기 ↓ */
	font-size: 0.9rem;
	margin-top:60px;
}
.ftws a{
	color:#dbeafe;
	text-decoration:none;
}
.ftws a:hover{
	color:#fff;
	text-decoration:underline;
}

/* Footer Brand */
.ftws .ftws-logo{
	font-weight:900;
	letter-spacing:.02em;
	font-size:1.35rem;
	color:#fff;
	margin-bottom:.35rem;
}
.ftws .ftws-tagline{
	color:#9aa3b2;
	margin:0 0 .6rem;
	max-width:28rem;
	font-size:0.85rem;
}
.ftws .ftws-social{
	display:flex;
	gap:.5rem;
	flex-wrap:wrap;
}
.ftws .ftws-sns{
	display:inline-block;
	padding:.3rem .6rem;
	font-weight:600;
	border:1px solid rgba(221,230,255,.25);
	border-radius:.6rem;
	background: rgba(255,255,255,.04);
}

/* Titles & Lists */
.ftws .ftws-title{
	color:#fff;
	font-weight:800;
	font-size:0.95rem;
	margin-bottom:.6rem;
	position:relative;
	padding-left:1rem;
}
.ftws .ftws-title::before{
	content:"";
	position:absolute;
	left:0;
	top:.15rem;
	bottom:.15rem;
	width:5px;
	background: linear-gradient(180deg, var(--accent), var(--accent-2));
	border-radius:3px;
}
.ftws .ftws-list{
	list-style:none;
	padding-left:0;
	margin:0;
}
.ftws .ftws-list li{ margin:.35rem 0; }
.ftws .ftws-list a{
	color:#cfe1ff;
	font-size:0.85rem;
}
.ftws .ftws-list a:hover{ color:#fff; }

/* Contact block */
.ftws .ftws-contact{
	list-style:none;
	padding-left:0;
	margin:0;
}
.ftws .ftws-contact li{
	margin:.4rem 0;
	color:#9aa3b2;
	font-size:0.85rem;
}
.ftws .ftws-contact li span{
	display:inline-block;
	min-width:3.2rem;
	color:#e5e7eb;
	font-weight:600;
}

/* Sub footer */
.ftws .ftws-sub{
	border-top:1px solid rgba(255,255,255,.08);
	padding:.9rem 0;
	background:#0a0f1d;
}
.ftws .ftws-copy{
	color:#9aa3b2;
	font-size:0.85rem;
}
.ftws .ftws-legal a{
	color:#cfe1ff;
	font-size:0.8rem;
}
.ftws .ftws-legal a:hover{ color:#fff; }

/* Footer Responsive */
@media (max-width:575.98px){
	.ftws .ftws-contact li span{
		min-width:0;
		display:block;
		margin-bottom:.15rem;
	}
}

/* ===================== Kakao Floating Button ===================== */
.kakao-fab{
	position:fixed;
	right: clamp(14px, 2vw, 22px);
	bottom: calc(16px + env(safe-area-inset-bottom));
	width:64px;
	height:64px;
	display:inline-grid;
	place-items:center;
	background:#fff;
	border:1px solid rgba(0,0,0,.06);
	border-radius:18px;
	box-shadow:0 12px 30px rgba(0,0,0,.18);
	z-index: 1040;
	transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.kakao-fab img{
	width:40px;
	height:40px;
	display:block;
}
.kakao-fab:hover{
	transform: translateY(-2px);
	box-shadow:0 16px 38px rgba(0,0,0,.22);
	filter: saturate(1.05);
}
@media (max-width:575.98px){
	.kakao-fab{
		width:56px;
		height:56px;
		border-radius:16px;
	}
	.kakao-fab img{
		width:34px;
		height:34px;
	}
}

/* ===================== Glow Button ===================== */
/* Animated Gradient Button */
.glow-btn{
	/* 크기 & 타이포 */
	--radius: 999px;
	--pad-x: 28px;
	--pad-y: 16px;
	--font: 600 16px/1.1 system-ui, -apple-system, "Pretendard", "Noto Sans KR", Arial, sans-serif;

	/* 그라데이션 컬러(기본: 핑크↔퍼플) */
	--c1:#ff6fb3;
	--c2:#b46cff;
	--c3:#ff8f8f;
	--text:#ffffff;

	/* 광택 / 테두리 / 그림자 */
	--shine: rgba(255,255,255,0.65);
	--ring:  rgba(255,255,255,0.45);
	--shadow: 0 3px 10px rgba(58, 32, 122, 0.25);

	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: var(--pad-y) var(--pad-x);
	border-radius: var(--radius);
	font: var(--font);
	color: var(--text);
	text-decoration: none;
	white-space: nowrap;
	isolation: isolate;
	cursor: pointer;

	/* 애니메이팅 배경 */
	background: linear-gradient(120deg, var(--c1), var(--c2), var(--c3), var(--c1));
	background-size: 300% 300%;
	animation: gradientMove 6s ease-in-out infinite;

	/* 유리감 테두리 + 안쪽 그림자 */
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,0.45),
		inset 0 -1px 8px rgba(0,0,0,0.15),
		var(--shadow);
	border: 1px solid rgba(255,255,255,0.25);
	transition:ease-in-out 0.3s;
}

/* 부드러운 호버/프레스 */
.glow-btn:hover{
	transform: translateY(-2px);
	color:#ffffff;
	transition:ease-in-out 0.2s;
}
.glow-btn:active{
	transform: translateY(0);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,0.4),
		inset 0 -1px 8px rgba(0,0,0,0.18),
		0 6px 16px rgba(58,32,122,0.25);
}

/* 내부 텍스트 얇은 외곽광 */
.glow-btn span{
	text-shadow: 0 1px 1px rgba(0,0,0,0.25);
}

/* 아이콘 컬러 상속 */
.glow-btn .arr{ flex: 0 0 auto; }

/* 움직이는 광택(사선 하이라이트) */
.glow-btn::before{
	content:"";
	position:absolute;
	inset:-1px;
	border-radius: inherit;
	background:
		linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0) 60%) padding-box,
		radial-gradient(120px 60px at -20% 50%, var(--shine), transparent 60%) border-box;
	mix-blend-mode: screen;
	pointer-events:none;
	z-index:1;
	mask:
		linear-gradient(#000, #000) padding-box,
		linear-gradient(#000, #000) border-box;
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	animation: sheen 2.8s ease-in-out infinite;
}

/* 외곽 소프트 그림자(버튼 뒤쪽) */
.glow-btn::after{
	content:"";
	position:absolute;
	inset:0px;
	border-radius: inherit;
	box-shadow: 0 18px 28px rgba(21, 16, 46, 0.18);
	z-index:-1;
}

/* 색상 테마만 변경 */
.theme-indigo{
	--c1:#6b8cff;
	--c2:#6a2bd9;
	--c3:#b36bff;
	--shadow: 0 10px 25px rgba(31, 45, 151, 0.32);
}
.theme-pop{
	--c1:#ff7ab8;
	--c2:#ff5151;
	--c3:#7b7b94;
	--shadow: 0 10px 25px rgba(206, 54, 95, 0.28);
}

/* 애니메이션 정의 */
@keyframes gradientMove{
	0%{ background-position: 0% 50%; }
	50%{ background-position: 100% 50%; }
	100%{ background-position: 0% 50%; }
}
@keyframes sheen{
	0%{
		transform: translateX(-40%) skewX(-18deg);
		opacity:.65;
	}
	45%{
		transform: translateX(130%) skewX(-18deg);
		opacity:.0;
	}
	100%{
		transform: translateX(130%) skewX(-18deg);
		opacity:0;
	}
}

/* 접근성: 애니메이션 최소화 환경 */
@media (prefers-reduced-motion: reduce){
	.glow-btn{
		animation: none;
		background-position: 50% 50%;
	}
	.glow-btn::before{ animation: none; }
	.glow-btn,
	.glow-btn:hover,
	.glow-btn:active{ transform: none; }
}

/* 다크 배경에서 경계 강화 */
@media (prefers-color-scheme: dark){
	.glow-btn{ border-color: rgba(255,255,255,0.35); }
}
