@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
* {font-family: 'Pretendard', sans-serif;}
body {background-color: #f9fafb !important;}
:root {
  --color-primary: #1f7a3a;
  --color-accent: #ffc857;
  --color-dark: #222;
  --color-light: #f8f9fa;
}

/* 크롬, 사파리, 엣지 등 Webkit 기반 브라우저 */
::-webkit-scrollbar {width: 4px;   /* 세로 스크롤바 너비 */height: 4px;  /* 가로 스크롤바 높이 */}
::-webkit-scrollbar-thumb {background-color: #555;   /* 스크롤바 색상 */border-radius: 3px;       /* 둥글게 */}
::-webkit-scrollbar-thumb:hover {background-color: #333;   /* hover 시 색상 */}
::-webkit-scrollbar-track {background: #f1f1f1;      /* 트랙 색상 */}
/* ============================================================
   기본 설정
============================================================ */
html, body {overflow-x: hidden;margin: 0;}
body {display: flex;flex-direction: column;min-height: 100vh;background: var(--color-bg) !important;color: var(--color-text);}

a { text-decoration: none; }
ul, li { list-style: none; margin: 0; padding: 0; }

/* ============================================================
   Scroll Reveal Animation (repeat)
   requires: .reveal + .is-inview
============================================================ */

/* 공통 기본값 */
.reveal{
	opacity: 0;
	filter: blur(2px);

	transition:
		opacity .8s cubic-bezier(.2,.75,.2,1),
		transform .8s cubic-bezier(.2,.75,.2,1),
		filter .8s cubic-bezier(.2,.75,.2,1);

	will-change: opacity, transform, filter;
}

/* ===== 아래 → 위 ===== */
.reveal-up{
	transform: translateY(32px);
}
.reveal-up.is-inview{
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
}

/* ===== 위 → 아래 ===== */
.reveal-down{
	transform: translateY(-32px);
}
.reveal-down.is-inview{
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
}

/* ===== 왼쪽 → 오른쪽 ===== */
.reveal-left{
	transform: translateX(-36px);
}
.reveal-left.is-inview{
	opacity: 1;
	transform: translateX(0);
	filter: blur(0);
}

/* ===== 오른쪽 → 왼쪽 ===== */
.reveal-right{
	transform: translateX(36px);
}
.reveal-right.is-inview{
	opacity: 1;
	transform: translateX(0);
	filter: blur(0);
}

/* ===== 확대 ===== */
.reveal-zoom{
	transform: scale(.96);
}
.reveal-zoom.is-inview{
	opacity: 1;
	transform: scale(1);
	filter: blur(0);
}

/* ===== 딜레이 ===== */
.delay-1{ transition-delay: .10s; }
.delay-2{ transition-delay: .20s; }
.delay-3{ transition-delay: .30s; }
.delay-4{ transition-delay: .40s; }

/* ===== 접근성 ===== */
@media (prefers-reduced-motion: reduce){
	.reveal{
		opacity: 1;
		transform: none;
		filter: none;
		transition: none;
	}
}
