/* ==========================================================================
   SL LifeLab — 삼성생명 인생설계연구소
   디자인 원칙: "블루는 신호, 나머지는 침묵" (마일로그 결의 절제된 매거진 톤)
   브랜드 컬러·서체는 관리자 설정에서 CSS 변수로 주입됨 (inc/enqueue.php)
   ========================================================================== */

:root {
	/* Brand — 기본값. 관리자 설정 저장 시 inline style로 덮어씀 */
	--sl-blue:        #003CDC;  /* SFN Blue · Pantone 293C — 공동브랜드가이드 V3 */
	--sl-blue-deep:   #002A9A;
	--sl-blue-soft:   #F2F8FF;  /* 밝은 하늘색 — 배지·밴드·틴트 카드 공통 */

	/* Neutral */
	--sl-ink:         #17181C;
	--sl-text:        #3A3D46;
	--sl-text-sub:    #7A7E8A;
	--sl-border:      #E5E7EC;
	--sl-bg:          #FFFFFF;
	--sl-bg-soft:     #F7F8FA;

	/* On dark */
	--sl-on-dark:     #FFFFFF;
	--sl-on-dark-sub: rgba(255, 255, 255, 0.64);

	/* Type */
	--sl-font: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, sans-serif;

	/* Layout — 토스/KB 결: 라운드 카드 + 다층 소프트 섀도 + 미세 호버 리프트 */
	--sl-radius: 22px;
	--sl-radius-sm: 12px;
	--sl-card-border: #EFF0F4;
	/* 다층 그림자 — 은은하게 겹쳐 입체감 */
	--sl-card-shadow: 0 1px 2px rgba(20, 22, 30, 0.04), 0 4px 16px rgba(20, 22, 30, 0.05);
	--sl-card-shadow-hover: 0 2px 6px rgba(20, 22, 30, 0.06), 0 12px 32px rgba(20, 22, 30, 0.10);
	--sl-chip-shadow: 0 1px 2px rgba(20, 22, 30, 0.05);
	--sl-container: 1180px;
	--sl-narrow: 860px;
	--sl-section-y: 88px;
	--sl-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Reset ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
body {
	margin: 0;
	font: 400 16px/1.75 var(--sl-font);
	color: var(--sl-text);
	background: #F7F8FA;
	-webkit-font-smoothing: antialiased;
	word-break: keep-all;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--sl-blue); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--sl-ink); margin: 0 0 0.5em; line-height: 1.35; }
ul, ol { padding-left: 1.2em; }
:focus-visible { outline: 2px solid var(--sl-blue); outline-offset: 2px; }

.sl-skip {
	position: absolute; left: -9999px; top: 0;
	background: var(--sl-blue); color: #fff; padding: 10px 16px; z-index: 100;
}
.sl-skip:focus { left: 0; }

.sl-container { max-width: var(--sl-container); margin: 0 auto; padding: 0 24px; }
.sl-container--narrow { max-width: var(--sl-narrow); }

/* Buttons ---------------------------------------------------------------- */
.sl-btn {
	display: inline-block;
	font: 600 15px/1 var(--sl-font);
	padding: 14px 24px;
	border-radius: 8px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
	text-decoration: none !important;
}
.sl-btn--primary { background: var(--sl-blue); color: #fff; }
.sl-btn--primary:hover { background: var(--sl-blue-deep); color: #fff; }
.sl-btn--ghost { background: transparent; color: var(--sl-blue); border-color: var(--sl-blue); }
.sl-btn--ghost:hover { background: var(--sl-blue-soft); }
.sl-btn--inverse { background: #fff; color: var(--sl-blue); }
.sl-btn--inverse:hover { background: var(--sl-blue-soft); }
.sl-btn--ghost-inverse { background: transparent; color: #fff; border-color: rgba(255,255,255,.5); }
.sl-btn--ghost-inverse:hover { border-color: #fff; }

.sl-textlink { font: 600 15px/1.4 var(--sl-font); color: var(--sl-blue); white-space: nowrap; }

/* Labels ----------------------------------------------------------------- */
.sl-eyebrow {
	font: 600 13px/1 var(--sl-font);
	letter-spacing: 0.04em;
	color: var(--sl-blue);
	text-transform: uppercase;
	margin: 0 0 12px;
}
.sl-cat-label {
	display: inline-block;
	font: 600 12.5px/1 var(--sl-font);
	color: var(--sl-blue);
	background: var(--sl-blue-soft);
	padding: 7px 12px;
	border-radius: 999px;
	margin-bottom: 14px;
	transition: background-color .15s ease, color .15s ease;
}
a.sl-cat-label:hover { text-decoration: none; background: var(--sl-blue); color: #fff; }

/* Notice bar ------------------------------------------------------------- */
.sl-notice {
	background: var(--sl-blue-deep);
	color: var(--sl-on-dark);
	font: 500 13px/1.4 var(--sl-font);
	padding: 9px 0;
	text-align: center;
}
.sl-notice a { color: var(--sl-on-dark); }

/* Header ----------------------------------------------------------------- */
.sl-header {
	background: var(--sl-bg);
	border-bottom: 1px solid var(--sl-border);
	position: sticky; top: 0; z-index: 50;
}
.sl-header__inner {
	display: flex; align-items: center; gap: 32px;
	height: 72px;
}
.sl-logo { display: inline-flex; align-items: center; gap: 7px; }
.sl-logo__img { height: 21px; width: auto; display: block; }
.sl-logo__sub { font: 800 22px/1.2 var(--sl-font); color: var(--sl-ink); white-space: nowrap; letter-spacing: -0.02em; }
.sl-logo img { max-height: 36px; width: auto; }
.sl-logo__mark { font: 700 19px/1.2 var(--sl-font); color: var(--sl-ink); white-space: nowrap; }
.sl-logo:hover { text-decoration: none; }

.sl-gnb { flex: 1; }
.sl-gnb__list {
	display: flex; gap: 4px;
	justify-content: flex-end;
	list-style: none; margin: 0; padding: 0;
}
.sl-gnb__list a {
	display: block;
	position: relative;
	font: 600 17.5px/1 var(--sl-font);
	color: var(--sl-ink);
	padding: 26px 13px;
	white-space: nowrap;
}
.sl-gnb__list a::after {
	content: "";
	position: absolute; left: 14px; right: 14px; bottom: 0;
	height: 3px; border-radius: 3px 3px 0 0;
	background: var(--sl-blue);
	transform: scaleX(0);
	transition: transform .18s ease;
}
.sl-gnb__list a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-gnb__list a:hover::after,
.sl-gnb__list .current-menu-item a::after,
.sl-gnb__list .current-cat a::after { transform: scaleX(1); }

.sl-header__actions { display: flex; align-items: center; gap: 8px; }
.sl-iconbtn {
	background: none; border: 0; cursor: pointer;
	color: var(--sl-ink); padding: 9px; border-radius: 8px;
	display: grid; place-items: center; line-height: 0;
}
.sl-iconbtn { transition: background-color .15s ease, transform .2s var(--sl-ease); }
.sl-iconbtn:active { transform: scale(0.94); }
.sl-iconbtn:hover { background: var(--sl-bg-soft); color: var(--sl-blue); text-decoration: none; }
.sl-header__cta { padding: 11px 18px; }

.sl-mobile-toggle { display: none; }
.sl-mobile-toggle svg path { transition: transform .2s ease, opacity .2s ease; transform-origin: 12px 12px; }
.sl-mobile-toggle[aria-expanded="true"] .sl-burger-1 { transform: translateY(5.5px) rotate(45deg); }
.sl-mobile-toggle[aria-expanded="true"] .sl-burger-2 { opacity: 0; }
.sl-mobile-toggle[aria-expanded="true"] .sl-burger-3 { transform: translateY(-5.5px) rotate(-45deg); }

.sl-searchbar { border-top: 1px solid var(--sl-border); padding: 16px 0; background: var(--sl-bg); }
.sl-searchform { display: flex; gap: 8px; }
.sl-searchform input[type="search"] {
	flex: 1;
	font: 400 16px/1.4 var(--sl-font);
	padding: 12px 16px;
	border: 1px solid var(--sl-border);
	border-radius: 8px;
}
.sl-searchform input[type="search"]:focus { border-color: var(--sl-blue); outline: none; }

/* Sections --------------------------------------------------------------- */
.sl-section { padding: var(--sl-section-y) 0; }
.sl-section--soft { background: var(--sl-bg-soft); }
.sl-section__title { font: 700 clamp(22px, 3vw, 28px)/1.35 var(--sl-font); margin-bottom: 6px; }
.sl-section__sub { font: 400 15px/1.6 var(--sl-font); color: var(--sl-text-sub); margin: 0 0 40px; }
.sl-section__head {
	display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
}
.sl-section__head .sl-section__sub { margin-bottom: 40px; }

/* Home — KB Think 스타일 매거진 카드 피드 --------------------------------- */
.sl-home { padding: 32px 0 0; }
.sl-mag {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
	margin-top: 24px;
}
.sl-mag__col { display: flex; flex-direction: column; gap: 24px; min-width: 0; }

.sl-magcard {
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-card-shadow);
	padding: 32px;
}
.sl-magcard--wide { margin-top: 24px; }
.sl-magcard__title {
	font: 700 22px/1.4 var(--sl-font);
	letter-spacing: -0.01em;
	padding-bottom: 14px;
	margin-bottom: 0;
	border-bottom: 1px solid var(--sl-border);
}
.sl-magcard__sub {
	font: 400 14px/1.6 var(--sl-font);
	color: var(--sl-text-sub);
	margin: 14px 0 0;
}
.sl-magcard__title + *:not(.sl-magcard__sub) { margin-top: 24px; }
.sl-magcard__sub + * { margin-top: 20px; }
.sl-magcard__more { margin: 24px 0 0; text-align: right; }

/* 카테고리 마크 — 도트 + 컬러 텍스트 (KB 카테고리 라벨 결) */
.sl-catmark {
	display: inline-flex; align-items: center;
	font: 600 12.5px/1 var(--sl-font);
	color: var(--sl-blue);
	background: var(--sl-blue-soft);
	border-radius: 999px;
	padding: 7px 12px;
	transition: background-color .15s ease, color .15s ease;
}
.sl-catmark:hover { text-decoration: none; background: var(--sl-blue); color: #fff; }
.sl-catmark__dot { display: none; }

/* GNB 드롭다운 (하위 카테고리) */
.sl-gnb__item { position: relative; }
.sl-gnb__list a.is-current { color: var(--sl-blue); }
.sl-gnb__list a.is-current::after { transform: scaleX(1); }
.sl-gnb__panel, .sl-gnb__list .sub-menu {
	position: absolute; top: 100%; left: 50%;
	transform: translateX(-50%) translateY(6px);
	min-width: 178px;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: 14px;
	box-shadow: var(--sl-card-shadow-hover);
	padding: 7px;
	opacity: 0; visibility: hidden;
	transition: opacity .18s ease, transform .18s var(--sl-ease), visibility .18s;
	z-index: 60;
}
.sl-gnb__item:hover .sl-gnb__panel,
.sl-gnb__item:focus-within .sl-gnb__panel,
.sl-gnb__list li:hover > .sub-menu,
.sl-gnb__list li:focus-within > .sub-menu {
	opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.sl-gnb__sub, .sl-gnb__list .sub-menu { list-style: none; margin: 0; padding: 0; }
.sl-gnb__sub > li + li { margin-top: 2px; }
.sl-gnb__sublink,
.sl-gnb__grand a,
.sl-gnb__list .sub-menu a {
	display: block;
	font: 600 13.5px/1.4 var(--sl-font);
	color: var(--sl-ink);
	padding: 8px 10px;
	border-radius: 9px;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}
.sl-gnb__sublink:hover, .sl-gnb__grand a:hover, .sl-gnb__list .sub-menu a:hover {
	background: var(--sl-blue-soft); color: var(--sl-blue); text-decoration: none;
}
.sl-gnb__sublink.is-current, .sl-gnb__grand a.is-current { color: var(--sl-blue); background: var(--sl-blue-soft); }
.sl-gnb__subdesc {
	display: block;
	font: 400 11.5px/1.4 var(--sl-font);
	color: var(--sl-text-sub);
	margin-top: 2px;
}
.sl-gnb__sublink:hover .sl-gnb__subdesc, .sl-gnb__sublink.is-current .sl-gnb__subdesc { color: var(--sl-blue); opacity: .8; }
.sl-gnb__grand { list-style: none; margin: 1px 0 4px; padding: 0 0 0 8px; border-left: 1px solid var(--sl-border); }
.sl-gnb__grand a { font-weight: 500; font-size: 12.5px; color: var(--sl-text-sub); padding: 6px 10px; }
.sl-gnb__list .sub-menu a::after { display: none; }

/* Hero — 이 주의 콘텐츠 + 대표 콘텐츠 1·2·3 (KB 히어로 패턴) --------------- */
.sl-hero {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 48px;
	align-items: center;
	padding: 48px;
}
.sl-hero__title { font: 800 clamp(26px, 3.2vw, 36px)/1.3 var(--sl-font); letter-spacing: -0.02em; margin: 14px 0 12px; }
.sl-hero__title a { color: var(--sl-ink); }
.sl-hero__title a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-hero__excerpt {
	font-size: 15px;
	color: var(--sl-text-sub);
	margin: 0 0 26px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-hero__list { list-style: none; margin: 0; padding: 0; }
.sl-hero__list li {
	display: flex; align-items: baseline; gap: 14px;
	padding: 13px 12px;
	margin: 0 -12px;
	border-radius: 12px;
	border-top: 1px solid var(--sl-border);
	transition: background-color .18s ease;
}
.sl-hero__list li:hover { background: rgba(255,255,255,0.6); }
.sl-hero__list a { transition: transform .2s var(--sl-ease); }
.sl-hero__list li:hover a { transform: translateX(2px); }
.sl-hero__num {
	font: 700 16.5px/1 var(--sl-font);
	font-variant-numeric: tabular-nums;
	color: var(--sl-blue);
	min-width: 16px;
}
.sl-hero__list a {
	font: 500 15px/1.5 var(--sl-font);
	color: var(--sl-ink);
	display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-hero__list a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-hero__media { display: block; }
.sl-hero__media img, .sl-hero__media .sl-thumb-fallback {
	border-radius: 18px;
	aspect-ratio: 16 / 11;
	object-fit: cover;
	width: 100%;
}

.sl-thumb-fallback { background: var(--sl-blue-soft); width: 100%; aspect-ratio: 16 / 10; border-radius: 16px; }

/* GEO 블록 — 사이트 정의 산문 · 생애 이벤트 · 질문 칩 · 클러스터 ----------- */
.sl-hero__intro {
	grid-column: 1 / -1;
	margin: 8px 0 0;
	padding-top: 24px;
	border-top: 1px solid var(--sl-border);
	font: 400 15px/1.8 var(--sl-font);
	color: var(--sl-text);
}

.sl-lifeblock { margin-top: 24px; }
.sl-lifeevents {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 12px;
	margin-top: 24px;
}
.sl-lifeevents__item {
	display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: 18px;
	box-shadow: var(--sl-card-shadow);
	padding: 24px 12px 20px;
	text-align: center;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease), border-color .15s ease;
}
.sl-lifeevents__item:hover {
	text-decoration: none;
	transform: translateY(-4px);
	box-shadow: var(--sl-card-shadow-hover);
	border-color: transparent;
}
.sl-lifeevents__icon {
	display: grid; place-items: center;
	width: 52px; height: 52px;
	border-radius: 50%;
	background: var(--sl-blue-soft);
	color: var(--sl-blue);
	margin-bottom: 14px;
	transition: background-color .2s ease, color .2s ease;
}
.sl-lifeevents__item:hover .sl-lifeevents__icon { background: var(--sl-blue); color: #fff; }
.sl-lifeevents__name {
	display: block;
	font: 700 14.5px/1.3 var(--sl-font);
	color: var(--sl-ink);
	margin-bottom: 6px;
	white-space: nowrap;
}
.sl-lifeevents__item:hover .sl-lifeevents__name { color: var(--sl-blue); }
.sl-lifeevents__sub {
	display: block;
	font: 400 12.5px/1.4 var(--sl-font);
	color: var(--sl-text-sub);
}

.sl-qbank__chips { display: flex; flex-wrap: wrap; gap: 10px; }
.sl-qbank__chip {
	display: inline-flex; align-items: center; gap: 7px;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	box-shadow: var(--sl-chip-shadow);
	border-radius: 999px;
	font: 500 14px/1.4 var(--sl-font);
	color: var(--sl-ink);
	padding: 10px 16px;
	transition: background-color .15s ease, color .15s ease;
}
.sl-qbank__chip { transition: transform .2s var(--sl-ease), box-shadow .2s var(--sl-ease), background-color .15s ease, color .15s ease; }
.sl-qbank__chip:hover { background: var(--sl-blue-soft); color: var(--sl-blue); text-decoration: none; transform: translateY(-2px); box-shadow: var(--sl-card-shadow); border-color: transparent; }
.sl-qbank__q { font: 700 12px/1 var(--sl-font); color: var(--sl-blue); }

.sl-cluster { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.sl-cluster__chip {
	display: inline-block;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-line, var(--sl-card-border));
	box-shadow: var(--sl-chip-shadow);
	border-radius: 999px;
	font: 600 13.5px/1 var(--sl-font);
	color: var(--sl-ink);
	padding: 10px 16px;
	transition: transform .2s var(--sl-ease), box-shadow .2s var(--sl-ease), background-color .15s ease, color .15s ease, border-color .15s ease;
}
.sl-cluster__chip:hover { background: var(--sl-blue-soft); color: var(--sl-blue); text-decoration: none; transform: translateY(-2px); box-shadow: var(--sl-card-shadow); border-color: transparent; }
.sl-cluster__chip.is-on { background: var(--sl-blue); border-color: var(--sl-blue); color: #fff; }
.sl-cluster__chip.is-on:hover { background: var(--sl-blue-deep); color: #fff; }

/* 카테고리 현재 위치 경로 */
.sl-crumb--archive { margin-bottom: 18px; font: 500 14px/1.5 var(--sl-font); color: var(--sl-text-sub); }
.sl-crumb--archive a { color: var(--sl-text-sub); }
.sl-crumb--archive a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-crumb__cur { color: var(--sl-blue); font-weight: 700; }

/* 2단 탭 (금융 Library 등 3단 구조) */
.sl-tabs {
	display: flex; flex-wrap: wrap; gap: 2px;
	margin-top: 26px;
	border-bottom: 1px solid var(--sl-border);
}
.sl-tabs__tab {
	position: relative;
	font: 600 18px/1 var(--sl-font);
	color: var(--sl-text-sub);
	padding: 15px 16px;
	transition: color .15s ease;
}
.sl-tabs__tab::after {
	content: "";
	position: absolute; left: 16px; right: 16px; bottom: -1px;
	height: 3px; border-radius: 3px 3px 0 0;
	background: var(--sl-blue);
	transform: scaleX(0);
	transition: transform .2s var(--sl-ease);
}
.sl-tabs__tab:first-child { padding-left: 0; }
.sl-tabs__tab:first-child::after { left: 0; }
.sl-tabs__tab:hover { color: var(--sl-blue); text-decoration: none; }
.sl-tabs__tab.is-on { color: var(--sl-blue); font-weight: 700; }
.sl-tabs__tab.is-on::after, .sl-tabs__tab:hover::after { transform: scaleX(1); }
.sl-tabs + .sl-cluster { margin-top: 22px; margin-left: -16px; }

.sl-archive__prose {
	max-width: var(--sl-narrow);
	font: 400 15.5px/1.85 var(--sl-font);
	color: var(--sl-text);
	margin: 16px 0 0;
}
.sl-archive__prose p { margin: 0 0 0.8em; }
.sl-archive__prose p:last-child { margin-bottom: 0; }
.sl-searchform--glossary { max-width: 560px; margin-top: 24px; }

/* 금융용어 홈 섹션 ---------------------------------------------------------- */
.sl-glossary .sl-magcard__title { border-bottom: 0; padding-bottom: 0; padding-left: 8px; }
.sl-glossary .sl-magcard__title + * { margin-top: 20px; }
.sl-glossary .sl-searchform--glossary { max-width: none; margin-top: 20px; }
.sl-glossary__grid { margin-top: 26px; }
.sl-glossary__grid .sl-dict-list__item { background: var(--sl-bg-soft); border-color: transparent; }
.sl-glossary__grid .sl-dict-list__item:hover { background: var(--sl-blue-soft); }
.sl-glossary__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.sl-glossary__chip {
	display: inline-block;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	box-shadow: var(--sl-chip-shadow);
	border-radius: 999px;
	font: 600 13.5px/1 var(--sl-font);
	color: var(--sl-ink);
	padding: 10px 16px;
	transition: background-color .15s ease, color .15s ease;
}
.sl-glossary__chip { transition: transform .2s var(--sl-ease), box-shadow .2s var(--sl-ease), background-color .15s ease, color .15s ease; }
.sl-glossary__chip:hover { background: var(--sl-blue-soft); color: var(--sl-blue); text-decoration: none; transform: translateY(-2px); box-shadow: var(--sl-card-shadow); border-color: transparent; }

/* 라이브러리 미니 카드 그리드 --------------------------------------------- */
.sl-libgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sl-libgrid__card {
	display: block;
	background: var(--sl-bg-soft);
	border-radius: 16px;
	padding: 20px 18px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-libgrid__card:hover {
	text-decoration: none;
	transform: translateY(-4px);
	box-shadow: var(--sl-card-shadow-hover);
}
.sl-libgrid__tag { font: 700 11px/1 var(--sl-font); letter-spacing: .06em; color: var(--sl-blue); margin: 0 0 10px; }
.sl-libgrid__card h3 { font: 600 16px/1.4 var(--sl-font); margin-bottom: 6px; }
.sl-libgrid__card:hover h3 { color: var(--sl-blue); }
.sl-libgrid__desc { font: 400 13px/1.6 var(--sl-font); color: var(--sl-text-sub); margin: 0; }
.sl-libgrid__card--dict { background: var(--sl-blue-soft); }

/* Card grid -------------------------------------------------------------- */
.sl-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
.sl-card {
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-card-shadow);
	overflow: hidden;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-card:hover { transform: translateY(-4px); box-shadow: var(--sl-card-shadow-hover); }
.sl-card__link { display: block; color: inherit; }
.sl-card__link:hover { text-decoration: none; }
.sl-card__media img, .sl-card__media .sl-thumb-fallback {
	aspect-ratio: 16 / 10; object-fit: cover; width: 100%; border-radius: 0;
}
.sl-card__body { padding: 22px; }
.sl-card__title {
	font: 600 18px/1.45 var(--sl-font);
	margin-bottom: 8px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-card:hover .sl-card__title { color: var(--sl-blue); }
.sl-card__excerpt {
	font: 400 14px/1.65 var(--sl-font);
	color: var(--sl-text-sub);
	margin: 0 0 14px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-card__meta { font: 500 13px/1.4 var(--sl-font); color: var(--sl-text-sub); margin: 0; }

/* 랭킹 리스트 — 숫자 + 카테고리 마크 + 제목 + 소형 썸네일 ----------------- */
.sl-ranklist { list-style: none; margin: 0; padding: 0; }
.sl-ranklist__item {
	display: flex; align-items: center; gap: 18px;
	padding: 18px 16px;
	margin: 0 -16px;
	border-radius: 16px;
	border-bottom: 1px solid var(--sl-border);
	transition: background-color .18s ease;
}
.sl-ranklist__item:hover { background: var(--sl-bg-soft); border-bottom-color: transparent; }
.sl-ranklist__item:hover .sl-ranklist__thumb img { transform: scale(1.04); }
.sl-ranklist__thumb img { transition: transform .3s var(--sl-ease); }
.sl-ranklist__item:last-child { border-bottom: 0; padding-bottom: 0; }
.sl-ranklist__num {
	font: 700 24px/1 var(--sl-font);
	font-variant-numeric: tabular-nums;
	color: #C6C9D2;
	min-width: 26px;
	text-align: center;
	flex-shrink: 0;
}
.sl-ranklist__item:nth-child(-n+3) .sl-ranklist__num { color: var(--sl-blue); }
.sl-ranklist__body { flex: 1; min-width: 0; }
.sl-ranklist__body .sl-catmark { margin-bottom: 10px; }
.sl-ranklist__body a {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	font: 600 15.5px/1.5 var(--sl-font);
	color: var(--sl-ink);
}
.sl-ranklist__body a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-ranklist__thumb { flex-shrink: 0; }
.sl-ranklist__thumb img {
	width: 60px; height: 60px;
	object-fit: cover;
	border-radius: 14px;
}

/* LifeCare 라이브러리 — 썸네일 + 아이콘 카드 (히어로 하단 와이드) ----------- */
.sl-libblock { margin-top: 24px; }
.sl-libblock .sl-libgrid { grid-template-columns: repeat(5, 1fr); gap: 16px; }

.sl-libblock .sl-libgrid__card {
	display: flex;
	flex-direction: column;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: 18px;
	box-shadow: var(--sl-card-shadow);
	padding: 0;
	overflow: hidden;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-libblock .sl-libgrid__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--sl-card-shadow-hover);
	background: var(--sl-bg);
}

/* 썸네일 — 카드별 컬러 + 아이콘 */
.sl-libgrid__thumb {
	display: grid;
	place-items: center;
	height: 96px;
	font-size: 38px;
	line-height: 1;
	background: linear-gradient(150deg, #DCE6FB, #EAF0FE);
	transition: transform .3s var(--sl-ease);
}
.sl-libblock .sl-libgrid__card:hover .sl-libgrid__thumb { transform: scale(1.04); }
.sl-libgrid__card--samsung .sl-libgrid__thumb { background: linear-gradient(150deg, #D9E4FB, #EDF2FE); }
.sl-libgrid__card--finance .sl-libgrid__thumb { background: linear-gradient(150deg, #D6EFE2, #EAF8F1); }
.sl-libgrid__card--life    .sl-libgrid__thumb { background: linear-gradient(150deg, #FBE0EC, #FDEFF5); }
.sl-libgrid__card--press   .sl-libgrid__thumb { background: linear-gradient(150deg, #FCE7D6, #FDF3EA); }
.sl-libgrid__card--dict    .sl-libgrid__thumb { background: linear-gradient(150deg, #E4E0F8, #F1EFFC); }

.sl-libgrid__body { display: block; padding: 18px 18px 22px; }
.sl-libblock .sl-libgrid__tag {
	display: block;
	font: 700 10.5px/1 var(--sl-font);
	letter-spacing: .08em;
	color: var(--sl-blue);
	margin-bottom: 9px;
}
.sl-libblock .sl-libgrid__card h3 { font: 700 16px/1.4 var(--sl-font); margin: 0 0 7px; }
.sl-libblock .sl-libgrid__card:hover h3 { color: var(--sl-blue); }
.sl-libblock .sl-libgrid__desc { display: block; font: 400 13px/1.6 var(--sl-font); color: var(--sl-text-sub); }

@media (max-width: 1200px) {
	.sl-libblock .sl-libgrid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
	.sl-libblock .sl-libgrid { grid-template-columns: 1fr 1fr; gap: 12px; }
	.sl-libgrid__thumb { height: 78px; font-size: 32px; }
}

/* 꼭 알아야 할 정보 — 틴트 피처 카드 --------------------------------------- */
.sl-mustread {
	display: block;
	background: var(--sl-blue-soft);
	border-radius: 16px;
	padding: 28px 28px 0;
	overflow: hidden;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-mustread:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--sl-card-shadow-hover); }
.sl-mustread__cat {
	display: inline-flex; align-items: center; gap: 6px;
	font: 600 14px/1 var(--sl-font);
	color: var(--sl-blue);
	margin-bottom: 14px;
}
.sl-mustread__title {
	font: 700 18px/1.45 var(--sl-font);
	color: var(--sl-ink);
	margin: 0 0 22px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-mustread:hover .sl-mustread__title { color: var(--sl-blue); }
.sl-mustread__media { display: block; margin: 0 -0px; }
.sl-mustread__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 14px 14px 0 0;
	display: block;
}

/* 삼성생명 소개 + 보도자료 카드 -------------------------------------------- */
.sl-about__text { font: 400 14.5px/1.8 var(--sl-font); color: var(--sl-text); margin: 0; }
.sl-about__press { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--sl-border); }
/* 소개 문구가 없어 press 블록이 타이틀 바로 아래 올 때 이중선 방지 */
.sl-magcard__title + .sl-about__press { margin-top: 24px; padding-top: 0; border-top: 0; }
.sl-about__press-label { font: 600 13.5px/1 var(--sl-font); color: var(--sl-blue); margin: 0 0 14px; }
.sl-about__press ul { list-style: none; margin: 0; padding: 0; }
.sl-about__press li {
	display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
	padding: 11px 14px;
	margin: 0 -14px;
	border-radius: 12px;
	border-bottom: 1px solid var(--sl-border);
	transition: background-color .18s ease;
}
.sl-about__press li:hover { background: var(--sl-bg-soft); border-bottom-color: transparent; }
.sl-about__press li:last-child { border-bottom: 0; }
.sl-about__press a {
	font: 500 14.5px/1.5 var(--sl-font); color: var(--sl-ink);
	display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-about__press a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-about__date { font: 500 13px/1.4 var(--sl-font); font-variant-numeric: tabular-nums; color: var(--sl-text-sub); white-space: nowrap; }

/* 최신 리스트 — KB "지금, 새롭게 올라온" 패턴 ------------------------------ */
.sl-newlist__item {
	display: flex; align-items: flex-start; gap: 20px;
	padding: 20px 16px;
	margin: 0 -16px;
	border-radius: 16px;
	border-bottom: 1px solid var(--sl-border);
	transition: background-color .18s ease;
}
.sl-newlist__item:hover { background: var(--sl-bg-soft); border-bottom-color: transparent; }
.sl-newlist__item:hover .sl-newlist__thumb img { transform: scale(1.04); }
.sl-newlist__thumb img { transition: transform .3s var(--sl-ease); }
.sl-newlist__body { flex: 1; min-width: 0; }
.sl-newlist__thumb { flex-shrink: 0; display: block; }
.sl-newlist__thumb img {
	width: 88px; height: 88px;
	object-fit: cover;
	border-radius: 16px;
}
.sl-newlist__item:last-child { border-bottom: 0; padding-bottom: 0; }
.sl-newlist__item .sl-catmark { margin-bottom: 14px; }
.sl-newlist__item h3 { font: 600 17px/1.5 var(--sl-font); margin: 0 0 8px; }
.sl-newlist__item h3 a { color: var(--sl-ink); }
.sl-newlist__item h3 a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-newlist__excerpt {
	font: 400 14px/1.65 var(--sl-font);
	color: var(--sl-text-sub);
	margin: 0;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* AI 추천 배너 — 컬러 틴트 정보 카드 (KB '꼭 알아야 할 정보' 결) ----------- */
.sl-aibanner {
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
	background: var(--sl-blue-soft);
	border-radius: 16px;
	padding: 30px 34px;
	margin-top: 28px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-aibanner:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--sl-card-shadow-hover); }
.sl-aibanner h3 { font: 700 20px/1.4 var(--sl-font); margin: 0 0 6px; }
.sl-aibanner:hover h3 { color: var(--sl-blue); }
.sl-aibanner p { font: 400 14px/1.6 var(--sl-font); color: var(--sl-text); margin: 0; }
.sl-aibanner__label { font: 600 12.5px/1 var(--sl-font); color: var(--sl-blue); margin: 0 0 10px !important; }
.sl-aibanner .sl-btn { flex-shrink: 0; }

/* FAQ -------------------------------------------------------------------- */
.sl-faq { }
.sl-faq__item { border-bottom: 1px solid var(--sl-border); }
.sl-faq__item summary {
	font: 600 16px/1.5 var(--sl-font);
	color: var(--sl-ink);
	padding: 20px 32px 20px 0;
	cursor: pointer;
	list-style: none;
	position: relative;
}
.sl-faq__item summary::-webkit-details-marker { display: none; }
.sl-faq__item summary::after {
	content: "";
	position: absolute; right: 4px; top: 50%;
	width: 8px; height: 8px;
	border-right: 2px solid var(--sl-text-sub);
	border-bottom: 2px solid var(--sl-text-sub);
	transform: translateY(-70%) rotate(45deg);
	transition: transform .15s ease;
}
.sl-faq__item[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.sl-faq__item[open] summary { color: var(--sl-blue); }
.sl-faq__answer { padding: 0 0 22px; font-size: 15px; color: var(--sl-text); }
.sl-faq__answer p { margin: 0; }
/* Dark CTA --------------------------------------------------------------- */
.sl-darkcta { background: var(--sl-blue-deep); padding: 88px 0; margin-top: 64px; }
.sl-darkcta__inner { text-align: center; }
.sl-darkcta h2 { color: var(--sl-on-dark); font: 700 clamp(24px, 3.2vw, 32px)/1.35 var(--sl-font); }
.sl-darkcta p { color: var(--sl-on-dark-sub); margin: 12px 0 32px; }
.sl-darkcta__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Single ----------------------------------------------------------------- */
.sl-single { background: var(--sl-bg); }

/* 스크롤 진행바 */
.sl-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 90; background: transparent; }
.sl-progress span { display: block; height: 100%; width: 0; background: var(--sl-blue); transition: width .1s linear; }

/* 글 헤더 — 틴트 밴드 (KB 결) */
.sl-single__band {
	background: var(--sl-blue-soft);
	padding: 64px 0 60px;
}
.sl-crumb { font: 500 14px/1.4 var(--sl-font); color: var(--sl-text-sub); margin-bottom: 26px; }
.sl-crumb a { color: var(--sl-text-sub); }
.sl-crumb a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-crumb__sep { margin: 0 8px; }
.sl-single__subtitle { font: 500 16.5px/1.7 var(--sl-font); color: var(--sl-text); margin: 26px 0 0; }
.sl-single__readtime { margin-left: 12px; }

/* 목차 — 스티키 아코디언 */
.sl-toc {
	position: sticky; top: 72px; z-index: 45;
	background: var(--sl-bg);
	border-bottom: 1px solid var(--sl-border);
}
.sl-toc__toggle {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	width: 100%;
	background: none; border: 0; cursor: pointer;
	font: 600 15.5px/1.4 var(--sl-font);
	color: var(--sl-ink);
	padding: 15px 0;
	text-align: left;
}
.sl-toc__toggle svg { color: var(--sl-text-sub); transition: transform .15s ease; flex-shrink: 0; }
.sl-toc__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sl-toc__current { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.sl-toc__current .num { color: var(--sl-blue); font-variant-numeric: tabular-nums; }
.sl-toc__list { list-style: none; margin: 0; padding: 4px 0 16px; }
.sl-toc__list a {
	display: flex; gap: 12px; align-items: baseline;
	font: 500 15px/1.5 var(--sl-font);
	color: var(--sl-text);
	padding: 8px 0;
}
.sl-toc__list a .num { color: var(--sl-blue); font-weight: 700; font-variant-numeric: tabular-nums; }
.sl-toc__list a { transition: transform .2s var(--sl-ease), color .15s ease; }
.sl-toc__list a:hover { color: var(--sl-blue); text-decoration: none; transform: translateX(3px); }
.sl-toc__list a.is-active { color: var(--sl-blue); font-weight: 700; }

.sl-single__header { padding: 64px 0 32px; }
.sl-single__title { font: 800 clamp(27px, 3.4vw, 38px)/1.28 var(--sl-font); letter-spacing: -0.02em; margin: 8px 0 16px; }
.sl-single__meta { font: 500 14px/1.4 var(--sl-font); color: var(--sl-text-sub); margin: 24px 0 0; }
.sl-single__updated { color: var(--sl-blue); }
.sl-single__thumb img { border-radius: var(--sl-radius); margin: 40px 0; }

.sl-single__content {
	margin-top: 48px;
	font-size: 17.5px;
	line-height: 1.9;
	font-weight: 450;
	letter-spacing: -0.011em;
	color: #26272C;
}
.sl-single__content strong { font-weight: 700; }
.sl-single__content h2 {
	font: 800 25px/1.4 var(--sl-font);
	letter-spacing: -0.01em;
	margin: 2.2em 0 0.7em;
	padding-left: 18px;
	border-left: 5px solid var(--sl-ink);
	scroll-margin-top: 140px;
}
.sl-single__content h3 { font: 700 20px/1.45 var(--sl-font); margin: 1.6em 0 0.6em; }
.sl-single__content p { margin: 0 0 1.2em; }
.sl-single__content img { border-radius: var(--sl-radius); margin: 1.5em 0; }
.sl-single__content blockquote {
	margin: 1.8em 0; padding: 18px 24px;
	background: var(--sl-bg-soft);
	border-radius: 0 14px 14px 0;
	border-left: 3px solid var(--sl-blue);
	color: var(--sl-ink); font-weight: 500;
}
.sl-single__content table {
	width: 100%; border-collapse: collapse; margin: 1.5em 0;
	font-size: 16px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}
.sl-single__content th, .sl-single__content td {
	border: 1px solid var(--sl-border); padding: 12px 14px; text-align: left;
}
.sl-single__content th { background: var(--sl-bg-soft); font-weight: 600; }

/* 검증 기준 · 하단 CTA · 관련 글 */
.sl-trust {
	background: var(--sl-bg-soft);
	border-radius: var(--sl-radius);
	padding: 20px 24px;
	font-size: 13.5px; line-height: 1.7;
	color: var(--sl-text-sub);
	margin: 48px 0 0;
}
.sl-trust p { margin: 0; }
.sl-trust strong { color: var(--sl-ink); }

.sl-post-cta {
	background: var(--sl-blue-soft);
	border-radius: var(--sl-radius);
	padding: 36px 32px;
	margin: 24px 0 0;
	text-align: center;
}
.sl-post-cta h3 { font: 700 21px/1.4 var(--sl-font); }
.sl-post-cta p { color: var(--sl-text); margin: 8px 0 24px; }
.sl-post-cta__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

.sl-related { margin: 88px 0 0; padding-bottom: 128px; }

/* 글 컴포넌트 — 3줄 요약 · CTA 배너 · 키커 · 형광펜 · 각주 (KB 결, 블루 톤) */
.sl-summary {
	background: var(--sl-blue-soft);
	border-radius: 18px;
	padding: 28px 30px;
	margin: 0 0 2em;
}
.sl-summary__title {
	display: flex; align-items: center; gap: 10px;
	font: 800 20px/1.3 var(--sl-font);
	color: var(--sl-ink);
	margin: 0 0 16px !important;
}
.sl-summary__title::before {
	content: "";
	width: 26px; height: 26px; border-radius: 8px;
	background: var(--sl-blue);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='11' viewBox='0 0 14 11'%3E%3Cpath d='M1.5 5.5l4 4 7-8' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: center;
	flex-shrink: 0;
}
.sl-summary ul { list-style: none; margin: 0; padding: 0; }
.sl-summary li {
	position: relative;
	font: 500 16.5px/1.7 var(--sl-font);
	color: var(--sl-text);
	padding: 6px 0 6px 26px;
}
.sl-summary li::before {
	content: "";
	position: absolute; left: 0; top: 15px;
	width: 13px; height: 10px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10'%3E%3Cpath d='M1 5l3.5 3.5L12 1' fill='none' stroke='%23003CDC' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
}

.sl-cta-banner {
	display: flex; align-items: center; justify-content: space-between; gap: 20px;
	background: linear-gradient(100deg, var(--sl-blue-soft), #E4EFFF);
	border-radius: 18px;
	padding: 24px 30px;
	margin: 2em 0;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-cta-banner:hover { text-decoration: none; transform: translateY(-3px); box-shadow: var(--sl-card-shadow-hover); }
.sl-cta-banner__label { display: block; font: 500 14.5px/1.4 var(--sl-font); color: var(--sl-text); margin-bottom: 4px; }
.sl-cta-banner strong { font: 700 19px/1.4 var(--sl-font); color: var(--sl-blue); }
.sl-cta-banner::after {
	content: "";
	width: 22px; height: 22px; flex-shrink: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24'%3E%3Cpath d='M7 17L17 7M9 7h8v8' fill='none' stroke='%23003CDC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: center;
}

.sl-kicker-wrap h2 { margin-top: 0.2em !important; }
.sl-kicker {
	font: 600 14.5px/1.3 var(--sl-font);
	color: var(--sl-text-sub);
	margin: 2.4em 0 0 !important;
	padding-left: 23px;
}

.sl-single__content mark {
	background: linear-gradient(transparent 45%, #CDDCFC 45%);
	color: inherit;
	padding: 0 2px;
}

.sl-footnote {
	font: 400 13.5px/1.7 var(--sl-font) !important;
	color: var(--sl-text-sub) !important;
	margin-top: -0.6em !important;
}

/* 읽기 도구 플로팅 바 */
.sl-readtools {
	position: fixed;
	left: 50%; bottom: 28px;
	transform: translateX(-50%);
	display: flex; gap: 4px;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	border-radius: 999px;
	box-shadow: 0 6px 24px rgba(23,24,28,.12);
	padding: 6px;
	z-index: 60;
}
.sl-readtools__btn {
	display: grid; place-items: center;
	width: 46px; height: 46px;
	background: none; border: 0; border-radius: 50%;
	cursor: pointer;
	font: 700 17px/1 var(--sl-font);
	color: var(--sl-ink);
}
.sl-readtools__btn sup { font-size: 11px; }
.sl-readtools__btn:hover { background: var(--sl-bg-soft); color: var(--sl-blue); }
.sl-single__content.is-large { font-size: 19.5px; }

/* GEO 2단계 — 용어 예시/관련 · 보도자료 필터 · 지표 카드 ------------------- */
.sl-term-example {
	background: var(--sl-bg-soft);
	border-radius: 18px;
	padding: 26px 28px;
	margin: 2em 0;
}
.sl-term-example__label { font: 700 13px/1 var(--sl-font); color: var(--sl-blue); margin: 0 0 12px; letter-spacing: .02em; }
.sl-term-example__body { font: 400 15.5px/1.8 var(--sl-font); color: var(--sl-text); }
.sl-term-example__body p { margin: 0 0 0.6em; }

.sl-term-block { margin: 2.4em 0 0; }
.sl-term-block__title { font: 700 19px/1.4 var(--sl-font); margin: 0 0 18px; letter-spacing: -0.01em; }
.sl-term-related { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sl-term-related__item {
	display: block;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	box-shadow: var(--sl-card-shadow);
	border-radius: 16px;
	padding: 18px 20px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.sl-term-related__item:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--sl-card-shadow-hover); }
.sl-term-related__name { display: block; font: 700 16px/1.4 var(--sl-font); color: var(--sl-ink); margin-bottom: 5px; }
.sl-term-related__item:hover .sl-term-related__name { color: var(--sl-blue); }
.sl-term-related__def { display: block; font: 400 13.5px/1.6 var(--sl-font); color: var(--sl-text-sub); }

.sl-press-filter { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }
.sl-press-filter__row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.sl-press-filter__label { font: 700 13px/1 var(--sl-font); color: var(--sl-text-sub); margin-right: 6px; min-width: 32px; }
.sl-chip {
	display: inline-block;
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	box-shadow: var(--sl-chip-shadow);
	border-radius: 999px;
	font: 600 13.5px/1 var(--sl-font);
	color: var(--sl-text);
	padding: 9px 15px;
	transition: transform .2s var(--sl-ease), background-color .15s ease, color .15s ease, border-color .15s ease;
}
.sl-chip:hover { color: var(--sl-blue); text-decoration: none; transform: translateY(-1px); }
.sl-chip.is-on { background: var(--sl-blue); border-color: var(--sl-blue); color: #fff; }

.sl-metrics {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
	margin-bottom: 40px;
}
.sl-metrics__item {
	background: var(--sl-bg);
	border: 1px solid var(--sl-card-border);
	box-shadow: var(--sl-card-shadow);
	border-radius: 18px;
	padding: 26px 22px;
	text-align: center;
}
.sl-metrics__value { font: 800 26px/1.2 var(--sl-font); color: var(--sl-blue); margin: 0 0 8px; letter-spacing: -0.02em; }
.sl-metrics__label { font: 500 13.5px/1.4 var(--sl-font); color: var(--sl-text-sub); margin: 0; }

/* 하단 유틸리티 섹션 — 공지 · 고객편의 · 안내 배너 (본사이트 결) ---------- */
.sl-utility {
	background: var(--sl-bg);
	border-top: 1px solid var(--sl-card-border);
	margin-top: 64px;
	padding: 56px 0 64px;
}
.sl-utility__inner {
	display: grid;
	grid-template-columns: 1.5fr 1.2fr 1fr;
	gap: 48px;
	align-items: start;
}
.sl-utility__title { font: 700 19px/1.3 var(--sl-font); margin: 0 0 22px; letter-spacing: -0.01em; }
.sl-utility__title a { color: var(--sl-ink); }
.sl-utility__title a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-utility__title span { color: var(--sl-text-sub); font-weight: 400; }

.sl-utility__notices { list-style: none; margin: 0; padding: 0; }
.sl-utility__notices li {
	display: flex; align-items: baseline; gap: 16px;
	padding: 9px 10px;
	margin: 0 -10px;
	border-radius: 10px;
	transition: background-color .18s ease;
}
.sl-utility__notices li:hover { background: var(--sl-bg-soft); }
.sl-utility__date {
	font: 500 13.5px/1.5 var(--sl-font);
	font-variant-numeric: tabular-nums;
	color: var(--sl-text-sub);
	white-space: nowrap;
	flex-shrink: 0;
}
.sl-utility__notices a {
	font: 500 14.5px/1.5 var(--sl-font);
	color: var(--sl-text);
	display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}
.sl-utility__notices a:hover { color: var(--sl-blue); text-decoration: none; }

.sl-utility__links { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sl-utility__linkbtn {
	display: flex; align-items: center; justify-content: center;
	background: var(--sl-bg);
	border: 1px solid var(--sl-border);
	border-radius: 12px;
	font: 500 14.5px/1.3 var(--sl-font);
	color: var(--sl-ink);
	padding: 15px 12px;
	text-align: center;
	transition: transform .2s var(--sl-ease), border-color .15s ease, color .15s ease, box-shadow .2s var(--sl-ease);
}
.sl-utility__linkbtn:hover {
	text-decoration: none;
	color: var(--sl-blue);
	border-color: var(--sl-blue);
	transform: translateY(-2px);
	box-shadow: var(--sl-card-shadow);
}

.sl-utility__banner {
	display: block;
	background: var(--sl-bg-soft);
	border-radius: 18px;
	padding: 26px 28px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
a.sl-utility__banner:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--sl-card-shadow-hover); }
.sl-utility__banner-title { font: 700 18px/1.4 var(--sl-font); color: var(--sl-ink); margin: 0 0 10px; }
a.sl-utility__banner:hover .sl-utility__banner-title { color: var(--sl-blue); }
.sl-utility__banner-text { font: 400 14.5px/1.7 var(--sl-font); color: var(--sl-text-sub); margin: 0; }

/* Dictionary ------------------------------------------------------------- */
.sl-dict-def {
	background: var(--sl-blue-soft);
	border-radius: var(--sl-radius);
	padding: 26px 30px;
	margin: 48px 0 40px;
}
.sl-dict-def__label { font: 600 13px/1 var(--sl-font); color: var(--sl-blue); margin: 0 0 10px; }
.sl-dict-def__text { font: 500 18.5px/1.7 var(--sl-font); color: var(--sl-ink); margin: 0; }
.sl-dict-back { margin: 48px 0; }

.sl-dict-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.sl-dict-list__item {
	display: block;
	border: 1px solid var(--sl-border);
	border-radius: var(--sl-radius);
	padding: 24px;
	transition: border-color .15s ease;
}
.sl-dict-list__item:hover { border-color: var(--sl-blue); text-decoration: none; }
.sl-dict-list__item h3 { font: 600 19.5px/1.4 var(--sl-font); margin-bottom: 6px; }
.sl-dict-list__item:hover h3 { color: var(--sl-blue); }
.sl-dict-list__item p {
	font: 400 14.5px/1.65 var(--sl-font); color: var(--sl-text-sub); margin: 0;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* Archive ---------------------------------------------------------------- */
.sl-archive { padding-bottom: var(--sl-section-y); }
.sl-archive__header {
	background: var(--sl-bg);
	border-bottom: 1px solid var(--sl-card-border);
	padding: 56px 0;
	margin-bottom: 48px;
}
.sl-archive__header .sl-eyebrow { margin-bottom: 12px; }
.sl-archive__header h1 { font: 700 clamp(26px, 3.6vw, 34px)/1.3 var(--sl-font); margin: 0; }
.sl-archive__desc { color: var(--sl-text-sub); margin: 12px 0 0; }

.sl-pagination { margin-top: 56px; text-align: center; }
.sl-pagination .nav-links { display: flex; gap: 6px; justify-content: center; }
.sl-pagination .page-numbers {
	display: inline-block;
	font: 600 15px/1 var(--sl-font);
	font-variant-numeric: tabular-nums;
	padding: 11px 15px;
	border: 1px solid var(--sl-border);
	border-radius: 8px;
	color: var(--sl-ink);
}
.sl-pagination .page-numbers.current { background: var(--sl-blue); border-color: var(--sl-blue); color: #fff; }
.sl-pagination a.page-numbers:hover { border-color: var(--sl-blue); color: var(--sl-blue); text-decoration: none; }

.sl-empty { color: var(--sl-text-sub); text-align: center; padding: 64px 0; }

/* Calculators ------------------------------------------------------------ */
.sl-calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.sl-calc {
	background: var(--sl-bg-soft);
	border-radius: 16px;
	padding: 34px 32px;
	scroll-margin-top: 96px;
}
.sl-calc__title { font: 700 24px/1.4 var(--sl-font); margin-bottom: 4px; }
.sl-calc__desc { color: var(--sl-text-sub); font-size: 14.5px; margin: 0 0 28px; }
.sl-calc__form { display: grid; gap: 16px; }
.sl-calc__field label {
	display: block;
	font: 600 13.5px/1 var(--sl-font);
	color: var(--sl-ink);
	margin-bottom: 8px;
}
.sl-calc__field input {
	width: 100%;
	font: 500 18px/1.4 var(--sl-font);
	font-variant-numeric: tabular-nums;
	padding: 12px 16px;
	border: 1px solid var(--sl-border);
	border-radius: 8px;
	background: var(--sl-bg);
}
.sl-calc__field input:focus { border-color: var(--sl-blue); outline: none; }
.sl-calc__result {
	margin-top: 28px;
	background: var(--sl-bg);
	border-radius: 14px;
	padding: 8px 24px;
}
.sl-calc__row {
	display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--sl-border);
	font-size: 14.5px;
	color: var(--sl-text-sub);
}
.sl-calc__row:last-child { border-bottom: 0; }
.sl-calc__row strong {
	font-variant-numeric: tabular-nums;
	color: var(--sl-ink);
	font-weight: 600;
}
.sl-calc__row--main strong { font-size: 24px; font-weight: 700; color: var(--sl-blue); }
.sl-calc__disclaimer { font-size: 13px; line-height: 1.7; color: var(--sl-text-sub); margin: 20px 0 0; }


/* Footer — 삼성생명 본사이트 구조 ------------------------------------------ */
.sl-footer { background: var(--sl-bg-soft); color: var(--sl-text-sub); }

/* ① 메가패널 + 메뉴 바 — 하나만 클릭해도 전체 그룹이 펼쳐짐 */
.sl-footer__menuwrap { display: flex; flex-direction: column; }
.sl-footer__megapanel {
	background: var(--sl-bg-soft);
	border-top: 1px solid var(--sl-border);
}
.sl-footer__megapanel-inner {
	display: flex; justify-content: center;
	padding-top: 40px; padding-bottom: 40px;
}
.sl-footer__megacol { flex: 0 1 228px; padding: 0 22px; }
.sl-footer__megacol ul { list-style: none; margin: 0; padding: 0; }
.sl-footer__megacol li { margin-bottom: 18px; }
.sl-footer__megacol a { font: 400 14px/1.5 var(--sl-font); color: var(--sl-text); }
.sl-footer__megacol a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-footer__megacol .is-text span { font: 400 14px/1.5 var(--sl-font); color: var(--sl-text-sub); }

.sl-footer__menubar { border-top: 1px solid var(--sl-border); border-bottom: 1px solid var(--sl-border); }
.sl-footer__menubar-inner { display: flex; justify-content: center; }
.sl-footer__menu-item { flex: 0 1 228px; border-left: 1px solid var(--sl-border); }
.sl-footer__menu-item:last-child { border-right: 1px solid var(--sl-border); }
.sl-footer__menu-btn {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	width: 100%;
	background: none; border: 0; cursor: pointer;
	font: 500 14px/1.4 var(--sl-font);
	color: var(--sl-ink);
	padding: 20px 22px;
	text-align: left;
}
.sl-footer__menu-btn svg { color: var(--sl-text-sub); transition: transform .15s ease; flex-shrink: 0; }
.sl-footer__menu-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.sl-footer__menu-btn:hover { color: var(--sl-blue); }

/* ② 인증마크 + SNS + 인라인 정책 링크 */
.sl-footer__mid {
	display: flex; align-items: center; flex-wrap: wrap; gap: 20px 28px;
	padding: 40px 0 8px;
}
.sl-footer__badges { display: flex; align-items: center; gap: 18px; }
.sl-footer__badges img {
	height: 34px; width: auto;
	filter: grayscale(1) opacity(.55);
}
.sl-footer__sns { display: flex; gap: 10px; }
.sl-footer__sns a {
	display: grid; place-items: center;
	width: 38px; height: 38px;
	background: #B9BCC4;
	border-radius: 50%;
	color: #fff;
	transition: background-color .15s ease;
}
.sl-footer__sns a:hover { background: var(--sl-blue); }
.sl-footer__policy ul { display: flex; flex-wrap: wrap; gap: 8px 26px; list-style: none; margin: 0; padding: 0; }
.sl-footer__policy a { font: 500 14px/1.4 var(--sl-font); color: var(--sl-text); }
.sl-footer__policy a:hover { color: var(--sl-blue); text-decoration: none; }
.sl-footer__policy a.is-em { font-weight: 700; color: var(--sl-ink); }

/* ③ 로고 + 사업자 정보 + 카피라이트 */
.sl-footer__base {
	display: flex; align-items: flex-start; gap: 40px;
	padding: 28px 0 52px;
}
.sl-footer__logo { height: 24px; width: auto; display: block; }
.sl-footer__logo-text { display: block; font: 700 17px/1.3 var(--sl-font); color: var(--sl-ink); white-space: nowrap; }
.sl-footer__biz { font: 400 13.5px/1.9 var(--sl-font); color: var(--sl-text-sub); margin: 0; }
.sl-footer__copy { font: 400 12.5px/1.6 var(--sl-font); color: var(--sl-text-sub); letter-spacing: .02em; margin: 6px 0 0; }

/* Responsive ------------------------------------------------------------- */
@media (max-width: 1200px) {
	.sl-gnb__list a { font-size: 16px; padding: 26px 10px; }
}

@media (max-width: 1024px) {
	.sl-mag { grid-template-columns: 1fr; }
	.sl-utility__inner { grid-template-columns: 1fr 1fr; gap: 36px; }
	.sl-lifeevents { grid-template-columns: repeat(4, 1fr); }
	.sl-grid-3 { grid-template-columns: repeat(2, 1fr); }
	.sl-hero { grid-template-columns: 1fr; gap: 28px; padding: 36px; }
	.sl-hero__media { order: -1; }
}

@media (max-width: 768px) {
	:root { --sl-section-y: 64px; }

	.sl-gnb {
		display: none;
		position: absolute; left: 0; right: 0; top: 100%;
		background: var(--sl-bg);
		border-bottom: 1px solid var(--sl-border);
		padding: 8px 24px 16px;
	}
	.sl-gnb.is-open { display: block; }
	.sl-gnb__list { flex-direction: column; gap: 0; }
	.sl-gnb__list a { padding: 13px 4px; }
	.sl-gnb__list a::after { display: none; }
	.sl-gnb__list li { border-bottom: 1px solid var(--sl-border); }
	.sl-mobile-toggle { display: grid; }
	.sl-header__cta { display: none; }

	.sl-home { padding-top: 20px; }
	.sl-mag { gap: 20px; margin-top: 20px; }
	.sl-mag__col { gap: 20px; }
	.sl-magcard { padding: 26px 22px; }
	.sl-magcard--wide { margin-top: 20px; }
	.sl-hero { padding: 26px 22px; gap: 20px; }
	.sl-magcard__title { font-size: 21px; }

	.sl-libgrid { grid-template-columns: 1fr 1fr; }
	.sl-lifeevents { grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 20px; }
	.sl-lifeevents__item { padding: 20px 10px 16px; }
	.sl-lifeevents__icon { width: 44px; height: 44px; margin-bottom: 10px; }
	.sl-utility__inner { grid-template-columns: 1fr; gap: 36px; }
	.sl-term-related { grid-template-columns: 1fr; }
	.sl-metrics { grid-template-columns: 1fr 1fr; }
	.sl-grid-3, .sl-dict-list, .sl-calc-grid { grid-template-columns: 1fr; }
	.sl-aibanner { flex-direction: column; align-items: flex-start; padding: 24px 22px; }
	.sl-ranklist__thumb img { width: 56px; height: 56px; }
	.sl-newlist__thumb img { width: 76px; height: 76px; }

	.sl-footer__menubar-inner { flex-direction: column; padding: 0; }
	.sl-footer__menu-item { flex: 1 1 auto; border-left: 0 !important; border-right: 0 !important; border-top: 1px solid var(--sl-border); }
	.sl-footer__menu-item:first-child { border-top: 0; }
	.sl-footer__megapanel-inner { flex-direction: column; gap: 24px; padding-top: 24px; padding-bottom: 24px; }
	.sl-footer__megacol { flex: 1 1 auto; padding: 0; }
	.sl-footer__megacol li { margin-bottom: 12px; }
	.sl-footer__mid { flex-direction: column; align-items: flex-start; }
	.sl-footer__base { flex-direction: column; gap: 18px; }
	.sl-section__head { flex-direction: column; align-items: flex-start; gap: 0; }
}

@media (max-width: 480px) {
	.sl-libgrid { grid-template-columns: 1fr; }
}

/* Motion ----------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}


/* ===== 가입 후기 블록 — 테마 톤 정렬 (플러그인 CSS 오버라이드) =====
   플러그인 파일은 원본 유지, 표현만 테마 쪽에서 덮어쓴다. */
.slife-reviews {
	background: transparent;
	padding: 0;
	border-radius: 0;
	margin: 56px 0 0;
}
.slife-reviews__head { margin-bottom: 24px; }
.slife-reviews__title {
	font: 700 22px/1.4 var(--sl-font);
	letter-spacing: -0.01em;
	color: var(--sl-ink);
}
.slife-reviews__source { font: 500 13.5px/1.5 var(--sl-font); color: var(--sl-text-sub); }
.slife-reviews__source a { color: var(--sl-text-sub); }
.slife-reviews__source a:hover { color: var(--sl-blue); text-decoration: none; }

/* 카드: 블로그 카드와 동일한 폭·라운드·그림자·호버 */
.slife-reviews__grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}
.slife-reviews__card {
	background: var(--sl-bg);
	border: 0;
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-card-shadow);
	padding: 26px 24px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.slife-reviews__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--sl-card-shadow-hover);
}
.slife-reviews__body { font: 400 15px/1.7 var(--sl-font); color: var(--sl-text); }
.slife-reviews__who strong { font: 700 15px/1.3 var(--sl-font); color: var(--sl-ink); }
.slife-reviews__who span { font: 400 13px/1.4 var(--sl-font); color: var(--sl-text-sub); }
.slife-reviews__tags li {
	font: 500 13px/1 var(--sl-font);
	background: var(--sl-bg-soft);
	color: var(--sl-text-sub);
	border-radius: 999px;
	padding: 8px 13px;
}
.slife-reviews__prd { border-radius: 999px; padding: 5px 11px; background: var(--sl-blue-soft); }

/* 홈 슬라이드는 가로 스크롤 유지 (그리드 오버라이드 제외) */
.slife-reviews--slide .slife-reviews__grid {
	display: flex;
	gap: 20px;
	overflow-x: auto;
	scroll-snap-type: none;          /* 자동 슬라이드와 충돌 방지 */
	scrollbar-width: none;           /* Firefox */
	-ms-overflow-style: none;
	padding-bottom: 4px;
}
.slife-reviews--slide .slife-reviews__grid::-webkit-scrollbar { display: none; }
.slife-reviews--slide .slife-reviews__card { flex: 0 0 300px; scroll-snap-align: none; }

/* 좌우 페이드로 잘린 카드가 자연스럽게 사라지도록 */
.slife-reviews--slide {
	position: relative;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, #000 32px, #000 calc(100% - 32px), transparent 100%);
}
@media (max-width: 768px) {
	.slife-reviews--slide { -webkit-mask-image: none; mask-image: none; }
	.slife-reviews--slide .slife-reviews__card { flex: 0 0 82%; }
}

/* 글 하단 간략 목록 */
.slife-reviews--compact { padding: 0; }
.slife-reviews--compact .slife-reviews__item {
	border: 0;
	box-shadow: var(--sl-card-shadow);
	border-radius: 16px;
	transition: transform .28s var(--sl-ease), box-shadow .28s var(--sl-ease);
}
.slife-reviews--compact .slife-reviews__item:hover {
	transform: translateY(-3px);
	box-shadow: var(--sl-card-shadow-hover);
}

@media (max-width: 1024px) {
	.slife-reviews__grid { grid-template-columns: 1fr 1fr; gap: 20px; }
}
@media (max-width: 768px) {
	.slife-reviews__grid { grid-template-columns: 1fr; }
	.slife-reviews__title { font-size: 19px; }
}


/* 섹션 앵커 — 고정 헤더 높이만큼 스크롤 보정 + 부드러운 이동 */
html { scroll-behavior: smooth; }
.sl-anchor { scroll-margin-top: 96px; }


/* 하위 카테고리 섹션 헤딩 (탭·배지 아래 현재 위치 표시) */
.sl-subhead { margin-top: 30px; }
.sl-subhead__title { font: 700 22px/1.4 var(--sl-font); letter-spacing: -0.015em; color: var(--sl-ink); margin: 0 0 4px; }
.sl-subhead__desc { font: 400 14.5px/1.6 var(--sl-font); color: var(--sl-text-sub); margin: 0; }


/* 가장 많이 묻는 질문 — 리스트형 */
.sl-faqlist { list-style: none; margin: 0; padding: 0; }
.sl-faqlist > li + li { border-top: 1px solid var(--sl-border); }
.sl-faqlist__item {
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 17px 4px;
	font: 500 16.5px/1.5 var(--sl-font);
	color: var(--sl-ink);
	transition: color .15s ease, background-color .15s ease;
}
.sl-faqlist__item:hover { color: var(--sl-blue); text-decoration: none; background: var(--sl-blue-soft); border-radius: 10px; }
.sl-faqlist__q { flex-shrink: 0; font: 800 15px/1 var(--sl-font); color: var(--sl-blue); }
.sl-faqlist__text { flex: 1; }
.sl-faqlist__arrow { flex-shrink: 0; color: var(--sl-text-sub); font-size: 15px; transition: transform .2s var(--sl-ease), color .15s ease; }
.sl-faqlist__item:hover .sl-faqlist__arrow { transform: translateX(3px); color: var(--sl-blue); }

/* 후기 컨테이너 — 플러그인 인라인의 배경·패딩 복원을 무효화 (FAQ 박스와 끝선 정렬) */
.slife-reviews {
	background: transparent !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: none !important;
	width: auto !important;
}

/* 후기 그리드 — 플러그인 인라인 CSS보다 우선 적용해 3열 고정 (FAQ 박스와 너비 정렬) */
.slife-reviews:not(.slife-reviews--slide) .slife-reviews__grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 28px !important;
}
@media (max-width: 1024px) {
	.slife-reviews:not(.slife-reviews--slide) .slife-reviews__grid { grid-template-columns: 1fr 1fr !important; gap: 20px !important; }
}
@media (max-width: 768px) {
	.slife-reviews:not(.slife-reviews--slide) .slife-reviews__grid { grid-template-columns: 1fr !important; }
}


/* ==========================================================================
   Samsung Life Insight - Static Home Hero
   2026-08-11
   ========================================================================== */

.sl-insight-hero {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	min-height: 320px;
	margin: 0 0 28px;
	padding: 58px 60px;
	border-radius: 24px;
	background:
		radial-gradient(
			circle at 92% 15%,
			rgba(255, 255, 255, 0.14) 0,
			rgba(255, 255, 255, 0) 38%
		),
		linear-gradient(
			118deg,
			#063b80 0%,
			#0754ad 48%,
			#1768c4 100%
		);
	box-shadow: 0 10px 30px rgba(17, 50, 91, 0.08);
	color: #fff;
}

.sl-insight-hero::after {
	content: "";
	position: absolute;
	width: 360px;
	height: 360px;
	right: -130px;
	bottom: -220px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.12);
}

.sl-insight-hero__content {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 760px;
}

.sl-insight-hero__title {
	margin: 0;
	color: #fff;
	font-family: var(--sl-font);
	font-size: clamp(36px, 4.4vw, 52px);
	font-weight: 800;
	line-height: 1.14;
	letter-spacing: -0.045em;
	word-break: keep-all;
}

.sl-insight-hero__description {
	max-width: 720px;
	margin: 24px 0 0;
	color: rgba(255, 255, 255, 0.9);
	font-family: var(--sl-font);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.85;
	letter-spacing: -0.018em;
	word-break: keep-all;
}

.sl-insight-hero__description strong {
	color: #fff;
	font-weight: 800;
}

@media (max-width: 768px) {
	.sl-insight-hero {
		min-height: 270px;
		margin-bottom: 22px;
		padding: 42px 30px;
		border-radius: 20px;
	}

	.sl-insight-hero__title {
		font-size: clamp(32px, 9vw, 40px);
		line-height: 1.18;
	}

	.sl-insight-hero__description {
		margin-top: 20px;
		font-size: 15px;
		line-height: 1.75;
	}
}

@media (max-width: 480px) {
	.sl-insight-hero {
		min-height: 250px;
		padding: 36px 24px;
	}

	.sl-insight-hero__title {
		font-size: 32px;
	}

	.sl-insight-hero__description {
		font-size: 14.5px;
	}
}


/* =========================================================
   Samsung Life Insight - Home Intro Hero
   ========================================================= */

.sl-insight-hero {
	position: relative;
	overflow: hidden;
	margin: 0 0 28px;
	padding: 46px 48px 44px;

	background: #fff;
	border: 1px solid #e8edf3;
	border-radius: 26px;

	box-shadow:
		0 2px 4px rgba(18, 42, 66, 0.02),
		0 12px 34px rgba(18, 42, 66, 0.045);
}

/* 위쪽의 아주 얇은 삼성 블루 포인트 */
.sl-insight-hero::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;

	background: linear-gradient(
		90deg,
		#0057d9 0%,
		#2878e7 58%,
		#75a9f3 100%
	);
}

/* 우측 하단 아주 약한 배경 장식 */
.sl-insight-hero::after {
	content: "";
	position: absolute;
	right: -110px;
	bottom: -145px;
	width: 300px;
	height: 300px;
	border-radius: 50%;

	background: radial-gradient(
		circle,
		rgba(0, 87, 217, 0.07) 0%,
		rgba(0, 87, 217, 0.025) 46%,
		rgba(0, 87, 217, 0) 72%
	);

	pointer-events: none;
}

.sl-insight-hero__content {
	position: relative;
	z-index: 1;
	max-width: 780px;
}

.sl-insight-hero__label {
	display: inline-flex;
	align-items: center;

	margin: 0 0 18px;
	padding: 7px 12px;

	background: #edf4ff;
	border-radius: 999px;

	color: #075ecf;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.01em;
}

.sl-insight-hero__title {
	margin: 0;

	color: var(--sl-ink);
	font-family: var(--sl-font);
	font-size: clamp(36px, 4.2vw, 50px);
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: -0.045em;

	word-break: keep-all;
}

.sl-insight-hero__description {
	max-width: 740px;
	margin: 22px 0 0;

	color: #52606f;
	font-family: var(--sl-font);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.78;
	letter-spacing: -0.018em;

	word-break: keep-all;
}

.sl-insight-hero__description strong {
	color: #202a35;
	font-weight: 800;
}


/* Tablet */
@media (max-width: 900px) {
	.sl-insight-hero {
		padding: 40px 36px;
	}
}


/* Mobile */
@media (max-width: 640px) {
	.sl-insight-hero {
		margin-bottom: 22px;
		padding: 32px 24px 30px;

		border-radius: 21px;
	}

	.sl-insight-hero__label {
		margin-bottom: 15px;
		font-size: 11.5px;
	}

	.sl-insight-hero__title {
		font-size: 33px;
		line-height: 1.18;
	}

	.sl-insight-hero__description {
		margin-top: 18px;
		font-size: 15px;
		line-height: 1.72;
	}
}


/* =========================================================
   Samsung Life Insight - Home Intro Hero (final)
   2026-08-11
   ========================================================= */

.sl-insight-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;

	margin: 0 0 28px;
	padding: 48px 52px 46px;
	min-height: 280px;

	background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
	border: 1px solid #e8edf3;
	border-radius: 28px;

	box-shadow:
		0 2px 4px rgba(18, 42, 66, 0.02),
		0 14px 36px rgba(18, 42, 66, 0.05);
}

/* 상단 블루 포인트 라인 */
.sl-insight-hero::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: linear-gradient(90deg, #0057d9 0%, #2b7dea 58%, #81b1f4 100%);
	z-index: 1;
}

.sl-insight-hero__content {
	position: relative;
	z-index: 3;
	max-width: 760px;
}

.sl-insight-hero__label {
	display: inline-flex;
	align-items: center;

	margin: 0 0 18px;
	padding: 8px 14px;

	background: #edf4ff;
	border-radius: 999px;

	color: #075ecf;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.01em;
}

.sl-insight-hero__title {
	margin: 0;

	color: var(--sl-ink);
	font-family: var(--sl-font);
	font-size: clamp(36px, 4.2vw, 50px);
	font-weight: 800;
	line-height: 1.16;
	letter-spacing: -0.045em;

	word-break: keep-all;
}

.sl-insight-hero__description {
	max-width: 740px;
	margin: 22px 0 0;

	color: #52606f;
	font-family: var(--sl-font);
	font-size: 17px;
	font-weight: 500;
	line-height: 1.82;
	letter-spacing: -0.018em;

	word-break: keep-all;
}

.sl-insight-hero__description strong {
	color: #202a35;
	font-weight: 800;
}

/* 둥둥 떠다니는 블루 오브 */
.sl-insight-hero__orb {
	position: absolute;
	border-radius: 999px;
	pointer-events: none;
	z-index: 1;
	filter: blur(2px);
	opacity: 0.95;
}

/* 큰 오브 */
.sl-insight-hero__orb--lg {
	right: -40px;
	bottom: -30px;
	width: 280px;
	height: 280px;

	background: radial-gradient(
		circle at 35% 35%,
		rgba(151, 195, 255, 0.9) 0%,
		rgba(70, 143, 242, 0.35) 42%,
		rgba(0, 87, 217, 0.08) 60%,
		rgba(0, 87, 217, 0) 76%
	);

	animation: slHeroFloatLg 10s ease-in-out infinite;
}

/* 작은 오브 */
.sl-insight-hero__orb--sm {
	right: 110px;
	top: 38px;
	width: 170px;
	height: 170px;

	background: radial-gradient(
		circle at 40% 40%,
		rgba(183, 214, 255, 0.85) 0%,
		rgba(86, 156, 248, 0.28) 44%,
		rgba(0, 87, 217, 0.06) 62%,
		rgba(0, 87, 217, 0) 78%
	);

	animation: slHeroFloatSm 12s ease-in-out infinite;
}

@keyframes slHeroFloatLg {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	25%  { transform: translate3d(-10px, -12px, 0) scale(1.03); }
	50%  { transform: translate3d(-20px, -4px, 0) scale(0.99); }
	75%  { transform: translate3d(-8px, 10px, 0) scale(1.02); }
	100% { transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes slHeroFloatSm {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	25%  { transform: translate3d(8px, -10px, 0) scale(1.02); }
	50%  { transform: translate3d(16px, 4px, 0) scale(0.98); }
	75%  { transform: translate3d(6px, 12px, 0) scale(1.03); }
	100% { transform: translate3d(0, 0, 0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
	.sl-insight-hero__orb--lg,
	.sl-insight-hero__orb--sm {
		animation: none;
	}
}

/* Tablet */
@media (max-width: 900px) {
	.sl-insight-hero {
		padding: 40px 36px;
		min-height: 250px;
	}

	.sl-insight-hero__orb--lg {
		width: 230px;
		height: 230px;
		right: -40px;
		bottom: -30px;
	}

	.sl-insight-hero__orb--sm {
		width: 140px;
		height: 140px;
		right: 80px;
		top: 34px;
	}
}

/* Mobile */
@media (max-width: 640px) {
	.sl-insight-hero {
		margin-bottom: 22px;
		padding: 32px 24px 30px;
		min-height: 220px;
		border-radius: 22px;
	}

	.sl-insight-hero__label {
		margin-bottom: 14px;
		font-size: 11.5px;
		padding: 7px 12px;
	}

	.sl-insight-hero__title {
		font-size: 33px;
		line-height: 1.18;
	}

	.sl-insight-hero__description {
		margin-top: 18px;
		font-size: 15px;
		line-height: 1.72;
	}

	.sl-insight-hero__orb--lg {
		width: 180px;
		height: 180px;
		right: -50px;
		bottom: -30px;
	}

	.sl-insight-hero__orb--sm {
		width: 110px;
		height: 110px;
		right: 30px;
		top: 20px;
	}
}