/* 표지의 세 핵심 문구 — 한 번에 하나씩 천천히 떠올라 바뀐다(webmovie rotate). 문구마다 색(1 브랜드 · 2 위험 · 3 성공), 짚어 줄 구절(strong)은 진하게 + 형광펜. JS 없음은 세 줄 목록. */
.guide-cover-says { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; inline-size: 100%; }
.guide-cover-says > li { --say-loud: var(--wa-color-brand-fill-loud); --say-on: var(--wa-color-brand-on-loud); --say-ink: var(--wa-color-brand-on-quiet); --say-mark: var(--wa-color-brand-fill-normal); display: flex; align-items: flex-start; gap: 0.8rem; margin: 0; padding-inline-start: 1rem; border-inline-start: 4px solid var(--say-loud); color: var(--sonub-muted); font-size: calc(clamp(1.2rem, 2.1vw, 1.55rem) * var(--wa-font-size-scale, 1)); font-weight: 500; line-height: 1.6; letter-spacing: -0.02em; text-wrap: balance; }
.guide-cover-says > li:nth-of-type(2) { --say-loud: var(--wa-color-danger-fill-loud); --say-on: var(--wa-color-danger-on-loud); --say-ink: var(--wa-color-danger-on-quiet); --say-mark: var(--wa-color-danger-fill-normal); }
.guide-cover-says > li:nth-of-type(3) { --say-loud: var(--wa-color-success-fill-loud); --say-on: var(--wa-color-success-on-loud); --say-ink: var(--wa-color-success-on-quiet); --say-mark: var(--wa-color-success-fill-normal); }
.guide-cover-says strong { color: var(--say-ink); font-weight: 850; background: linear-gradient(var(--say-mark), var(--say-mark)) no-repeat 0 92% / 100% 0.42em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.guide-cover-says strong:dir(rtl) { background-position-x: 100%; }
.guide-cover-say-n { flex: 0 0 auto; display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; margin-block-start: 0.2em; border-radius: 50%; background: var(--say-loud); color: var(--say-on); font-size: var(--wa-font-size-s); font-weight: 800; }
.guide-cover-says.webmovie-rotating { display: grid; }
.guide-cover-says.webmovie-rotating > li { justify-self: stretch; }
@media (prefers-reduced-motion: no-preference) {
	.guide-cover-says.webmovie-rotating > .webmovie-on { animation: guide-cover-say-in 1300ms cubic-bezier(0.22, 0.8, 0.3, 1.08) both; }
	.guide-cover-says.webmovie-rotating > .webmovie-on > .guide-cover-say-n { animation: guide-cover-say-pop 1000ms 300ms cubic-bezier(0.3, 1.5, 0.5, 1) both; }
	.guide-cover-says.webmovie-rotating > .webmovie-on strong { animation: guide-cover-say-mark 1100ms 1200ms ease-out both; }
	.guide-cover-says.webmovie-rotating > .webmovie-on strong + strong { animation-delay: 2000ms; }
	.guide-cover-says.webmovie-rotating > .webmovie-off { visibility: visible; animation: guide-cover-say-out 800ms ease-in both; pointer-events: none; }
}
@keyframes guide-cover-say-in { from { opacity: 0; translate: 0 1.4rem; filter: blur(6px); } to { opacity: 1; translate: 0 0; filter: none; } }
@keyframes guide-cover-say-out { from { opacity: 1; translate: 0 0; } to { opacity: 0; translate: 0 -1rem; filter: blur(4px); visibility: hidden; } }
@keyframes guide-cover-say-pop { from { scale: 0; rotate: -30deg; } to { scale: 1; rotate: 0deg; } }
@keyframes guide-cover-say-mark { from { background-size: 0% 0.42em; } to { background-size: 100% 0.42em; } }
