.smenth-motion,.smenth-motion *{box-sizing:border-box;word-break:keep-all;overflow-wrap:break-word;}
/* 테마(WPBakery) 기본 여백 제거 — 블록 사이 흰 여백 없애기 */
.wpb_row:has(.smenth-motion),.wpb_text_column:has(.smenth-motion){margin-bottom:0!important;}
/* 테마가 body{overflow:hidden}을 걸어 sticky가 깨짐 → 수직 스크롤은 살리고 가로만 클립 */
html:has(.smenth-motion){overflow-y:visible!important;overflow-x:clip!important;}
body:has(.smenth-motion){overflow-y:visible!important;overflow-x:clip!important;}
.smenth-motion{position:relative;width:100vw;max-width:100vw;height:260vh;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);left:0;right:0;}
/* 섹션 높이는 인라인 style 로 덮어쓰임 (패널 수에 비례) */
.smenth-motion__sticky{position:sticky;top:0;height:100vh;overflow:hidden;}

.smenth-motion__bg{
	position:absolute;
	top:50%;
	left:50%;
	width:var(--sm-reveal-w,38.4vmin);
	height:var(--sm-reveal-h,38.4vmin);
	transform:translate(-50%,-50%);
	background:var(--sm-img-bg,#000);
	border-radius:var(--sm-reveal-r,50%);
	clip-path:var(--sm-reveal-clip,none);
	overflow:hidden;
	will-change:width,height,border-radius,clip-path;
}
.smenth-motion__bg::after{
	content:"";
	position:absolute;
	inset:0;
	background-image:var(--sm-bg-img);
	background-size:cover;
	background-position:center;
	opacity:var(--sm-img-opacity,.9);
}

/* Width 스타일일 때 border-radius 무효 */
.smenth-motion[data-motion="width"] .smenth-motion__bg{border-radius:0;clip-path:none;}

/* None 모션: 정적 풀스크린 배경 */
.smenth-motion[data-motion="none"] .smenth-motion__bg{width:100vw!important;height:100vh!important;border-radius:0!important;clip-path:none!important;}

/* YouTube 배경 iframe — cover 핏 */
.smenth-motion__yt{position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:100%;min-height:100%;transform:translate(-50%,-50%);border:0;pointer-events:none;z-index:0;aspect-ratio:16/9;}
.smenth-motion__bg:has(.smenth-motion__yt)::after{background-image:none;opacity:0;}

/* 모션 스크롤 — 배경은 항상 풀스크린, clip-path 마스크로 모션 처리 */
.smenth-motion__bg{
	width:100vw!important;
	height:100vh!important;
	border-radius:0!important;
}
/* Circle (기본): 완벽한 원형 마스크 유지하며 확장 → 풀스크린 */
.smenth-motion[data-motion="circle"] .smenth-motion__bg,
.smenth-motion:not([data-motion]) .smenth-motion__bg{
	clip-path:circle(
		calc(max(var(--sm-reveal-w, 38.4vmin), var(--sm-reveal-h, 38.4vmin)) / 2 * 1.5)
		at 50% 50%
	)!important;
}
/* Width: 좌우 inset 마스크 */
.smenth-motion[data-motion="width"] .smenth-motion__bg{
	clip-path:inset(0 calc((100vw - var(--sm-reveal-w, 100vw)) / 2))!important;
}
/* Star/Diamond/Cinema: JS가 --sm-reveal-clip 설정 */
.smenth-motion[data-motion="star"] .smenth-motion__bg,
.smenth-motion[data-motion="diamond"] .smenth-motion__bg,
.smenth-motion[data-motion="cinema"] .smenth-motion__bg{
	clip-path:var(--sm-reveal-clip, none)!important;
}

.smenth-motion__content{
	position:absolute;
	inset:0;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	z-index:100;
	pointer-events:none;
	gap:0;
	padding:0 24px;
}
.smenth-motion__content::before{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:clamp(720px,108vmin,1520px);
	height:clamp(720px,108vmin,1520px);
	transform:translate(-50%,-50%);
	background:radial-gradient(circle,rgba(0,0,0,.18) 0%,rgba(0,0,0,.08) 45%,rgba(0,0,0,0) 75%);
	filter:blur(80px);
	pointer-events:none;
	z-index:0;
}

.smenth-motion__title{
	position:relative;
	z-index:1;
	margin:0;
	padding:0;
	font-size:var(--sm-title-size,72px);
	font-weight:300;
	color:#fff;
	letter-spacing:.005em;
	line-height:var(--sm-title-lh, 1.2);
	text-align:center;
	text-shadow:0 2px 24px rgba(0,0,0,.15);
	font-family:var(--sm-title-font,'Cormorant Garamond'),'Noto Sans KR','Apple SD Gothic Neo',serif;
	font-weight:var(--sm-title-weight,300)!important;
	opacity:var(--sm-reveal-title-o,1);
	transform:translateY(var(--sm-reveal-title-y,0));
	will-change:opacity,transform;
}
.smenth-motion__desc{
	position:relative;
	z-index:1;
	margin:0;
	padding:0;
	font-size:var(--sm-desc-size,16px);
	font-weight:var(--sm-desc-weight,400)!important;
	color:rgba(255,255,255,.95);
	letter-spacing:.02em;
	line-height:var(--sm-desc-lh, 1.6);
	text-align:center;
	opacity:var(--sm-reveal-desc-o,0);
	transform:translateY(var(--sm-reveal-desc-y,10px));
	max-width:none;
	white-space:nowrap;
	font-family:var(--sm-desc-font,'Noto Sans KR'),'Noto Sans KR','Apple SD Gothic Neo',sans-serif !important;
	text-shadow:0 1px 16px rgba(0,0,0,.25);
	will-change:opacity,transform;
}
.smenth-motion__title--mo,.smenth-motion__desc--mo{display:none;}

/* 스택 배경 이미지 (풀스크린 이후) — 텍스트는 메인에 고정 유지 */
.smenth-motion__panel{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	will-change:clip-path,mask-image;
	pointer-events:none;
	background:var(--sm-img-bg,#000);
	/* 기본 = edge 마스크 (경계 딱딱) */
	clip-path:inset(calc((1 - var(--sm-panel-pos, 0)) * 100%) 0 0 0);
}
/* 그라데이션 마스크 — 부드러운 페이드 */
.smenth-motion[data-scroll-mask="gradient"] .smenth-motion__panel{
	clip-path:none;
	-webkit-mask-image:linear-gradient(to top, #000 calc(var(--sm-panel-pos, 0) * 120% - 20%), transparent calc(var(--sm-panel-pos, 0) * 120%));
	        mask-image:linear-gradient(to top, #000 calc(var(--sm-panel-pos, 0) * 120% - 20%), transparent calc(var(--sm-panel-pos, 0) * 120%));
}
/* 사선 마스크 — 대각선으로 올라옴 */
.smenth-motion[data-scroll-mask="diagonal"] .smenth-motion__panel{
	clip-path:polygon(
		0 calc((1 - var(--sm-panel-pos, 0)) * 120% + 10%),
		100% calc((1 - var(--sm-panel-pos, 0)) * 120% - 10%),
		100% 100%,
		0 100%
	);
}
.smenth-motion__panel-bg{
	position:absolute;
	inset:0;
	background-image:var(--sm-panel-img);
	background-size:cover;
	background-position:center;
	opacity:var(--sm-img-opacity,.9);
}

@media(max-width:768px){
	.smenth-motion{height:220vh;}
	.smenth-motion__sticky{height:100vh;}
	/* 이미지 영역: 상단 10vh, 본체 60vh (10 ~ 70vh) */
	.smenth-motion__bg{top:10vh!important;height:60vh!important;transform:translateX(-50%)!important;}
	.smenth-motion[data-motion="none"] .smenth-motion__bg{height:60vh!important;top:10vh!important;}
	.smenth-motion__panel{height:60vh;top:10vh;}
	/* width 모션의 inset clip-path도 70vh 기준으로 재계산 */
	.smenth-motion[data-motion="circle"] .smenth-motion__bg,
	.smenth-motion:not([data-motion]) .smenth-motion__bg{
		clip-path:circle(
			calc(max(var(--sm-reveal-w, 38.4vmin), var(--sm-reveal-h, 38.4vmin)) / 2 * 1.5)
			at 50% 50%
		)!important;
	}
	/* 텍스트 영역: 이미지 바로 아래 (70vh ~ 95vh, 하단 5vh 여백) */
	.smenth-motion__content{
		inset:70vh 0 auto 0;
		height:25vh;
		justify-content:flex-start;
		padding:24px 20px 0;
		gap:6px;
	}
	.smenth-motion__content::before{display:none;}
	.smenth-motion__title,
	.smenth-motion__title--mo{
		color:#000!important;
		text-shadow:none!important;
	}
	.smenth-motion__desc,
	.smenth-motion__desc--mo{
		color:#000!important;
		text-shadow:none!important;
	}
	.smenth-motion__title--pc,.smenth-motion__desc--pc{display:none;}
	.smenth-motion__title--mo{display:block;font-size:var(--sm-title-size-mo,28px);}
	.smenth-motion__desc--mo{display:block;font-size:var(--sm-desc-size-mo,13px);max-width:320px;padding:0 20px;white-space:normal;}
}
