@font-face {
	font-family: "Noto Sans KR";
	src: url("../fonts/noto-sans-kr.ttf") format("truetype");
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: "Nanum Gothic";
	src: url("../fonts/nanum-gothic-regular.ttf") format("truetype");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Nanum Gothic";
	src: url("../fonts/nanum-gothic-bold.ttf") format("truetype");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/dm-sans.ttf") format("truetype");
	font-style: normal;
	font-weight: 100 1000;
	font-display: swap;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	overflow-x: clip;
}

body {
	margin: 0;
	overflow-x: clip;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--text);
	font-family: var(--wp--preset--font-family--noto-sans-kr);
	font-size: var(--wp--preset--font-size--body);
	line-height: var(--wp--custom--line-height--base);
	word-break: keep-all;
	overflow-wrap: anywhere;
}

body.tc-menu-open {
	overflow: hidden;
}

img,
video,
iframe {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease), background-color var(--wp--custom--motion--fast) var(--wp--custom--motion--ease), opacity var(--wp--custom--motion--fast) var(--wp--custom--motion--ease);
}

a:focus-visible,
button:focus-visible,
summary:focus-visible {
	outline: var(--wp--custom--border-width--focus) solid var(--wp--preset--color--accent);
	outline-offset: var(--wp--preset--spacing--2xs);
}

button,
summary {
	font: inherit;
}

h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd,
ul {
	margin: 0;
}

ul {
	padding: 0;
	list-style: none;
}

.screen-reader-text {
	position: absolute;
	width: var(--wp--custom--border-width--hairline);
	height: var(--wp--custom--border-width--hairline);
	padding: 0;
	margin: calc(var(--wp--custom--border-width--hairline) * -1);
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.tc-main,
.tc-main > * {
	margin-block: 0;
}

.tc-container {
	/* TODO: Figma에 없음 — 임의값: 모바일 최소 좌우 여백 20px. */
	width: min(calc(100% - (var(--wp--custom--layout--page-gutter) * 2)), var(--wp--custom--layout--content-wide));
	margin-inline: auto;
}

.tc-section {
	/* TODO: Figma에 없음 — 임의값: 모바일 섹션 최소 상하 여백 80px. */
	padding-block: var(--wp--custom--layout--section-padding);
}

.tc-eyebrow {
	color: var(--wp--preset--color--primary-content);
	font-size: var(--wp--preset--font-size--meta);
	font-weight: var(--wp--custom--font-weight--bold);
	line-height: var(--wp--custom--line-height--loose);
}

.tc-section h2 {
	font-size: var(--wp--preset--font-size--section-heading);
	font-weight: var(--wp--custom--font-weight--black);
	line-height: var(--wp--custom--line-height--loose);
}

.tc-section-intro {
	display: grid;
	gap: var(--wp--preset--spacing--2xl);
	margin-top: var(--wp--preset--spacing--2xl);
}

.tc-section-intro > p,
.tc-section-intro > div > p {
	color: var(--wp--preset--color--text-soft);
	font-size: var(--wp--preset--font-size--body-large);
	line-height: var(--wp--custom--line-height--loose);
	letter-spacing: var(--wp--custom--letter-spacing--body-large);
}

.tc-text-link {
	display: inline-flex;
	align-items: center;
	min-height: var(--wp--custom--layout--touch-target);
	color: var(--wp--preset--color--primary-content);
	font-size: var(--wp--preset--font-size--link);
	font-weight: var(--wp--custom--font-weight--bold);
}

.tc-text-link:hover,
.tc-text-link:focus-visible {
	color: var(--wp--preset--color--primary-deep);
}

.tc-content-shell {
	width: min(calc(100% - (var(--wp--custom--layout--page-gutter) * 2)), var(--wp--custom--layout--content-wide));
	margin-inline: auto;
	padding-block: var(--wp--custom--layout--section-padding);
}

/* TODO: Figma에 없음 — 임의값: 태블릿 768px에서 두 열을 시작한다. */
@media (min-width: 768px) {
	.tc-section-intro--split,
	.tc-section-intro--link {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: end;
	}

	.tc-section-intro--link .tc-text-link {
		justify-self: end;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto;
		transition-duration: var(--wp--custom--motion--none);
		animation-duration: var(--wp--custom--motion--none);
		animation-iteration-count: 1;
	}
}