/**
 * 구매 카운트다운 (inc/fireclass-countdown.php · assets/fc-countdown.js) — 2026-10-17 '비워지는 시계' 시안 3
 * ◔ LIVE 혜택 02:20:12 남음: 시계 테두리가 남은 시간만큼 줄고 시계가 흔들림, 초 숫자만 떨어짐. 뱃지·깜빡이는 점 없음.
 * 단계 이름 색: 무료·1단계 빨강 / 2·3단계 검정 / 10분 미만이면 빨강 + 시계가 두 배 빨리 흔들림 (깜빡이지 않음)
 */
.fc-cd {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 4px 8px;
	margin: 0 0 14px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.01em;
	color: #111111;
	font-variant-numeric: tabular-nums;
}
.fc-cd[hidden],
.fc-cd [hidden] { display: none !important; }
.fc-cd .fc-cd-bt { color: #D92D20; font-weight: 800; white-space: nowrap; transition: color 0.3s; }
.fc-cd.fc-cd-course .fc-cd-bt,
.fc-cd.fc-cd-run .fc-cd-bt { color: #111111; }
.fc-cd.is-urgent .fc-cd-bt { color: #D92D20; }
.fc-cd .fc-cd-t { color: #E5383B; font-weight: 800; white-space: nowrap; }
.fc-cd.is-urgent .fc-cd-t { color: #C81E1E; font-weight: 900; }
.fc-cd .fc-cd-left { white-space: nowrap; }
.fc-cd .fc-cd-s { display: inline-block; }
.fc-cd .fc-cd-s.is-roll { animation: fc-cd-roll 0.35s cubic-bezier(0.2, 0.8, 0.3, 1); }

/* 비워지는 시계: 흔들리는 시계 + 남은 비율만큼 남는 테두리 */
.fc-cd .fc-cd-clk { display: inline-flex; flex-shrink: 0; transform-origin: 50% 60%; animation: fc-cd-rock 1.1s ease-in-out infinite; }
.fc-cd .fc-cd-clk svg { display: block; width: 22px; height: 22px; color: #E5383B; }
.fc-cd .fc-cd-rbg { stroke: #F4D3D0; }
.fc-cd .fc-cd-ring { stroke: #E5383B; stroke-dasharray: 50.27; transition: stroke-dashoffset 1s linear; }
.fc-cd .fc-cd-hand { transform-origin: 12px 13px; animation: fc-cd-spin 1.1s linear infinite; }
.fc-cd.is-urgent .fc-cd-clk,
.fc-cd.is-urgent .fc-cd-hand { animation-duration: 0.55s; }

/* 상품 상세 하단 고정 바 (하단 바 시안 3): ◔ 3일 02:25:13 뒤 개강 · 하루 6,550원 — 버튼과 같은 줄 한 문장
 * 바 배치는 product.css .au-buybar-cd. 타이머가 보이는 동안 원래 하단 문구는 숨기고, 타이머가 끝나 숨으면 다시 보인다. */
.fc-cd.fc-cd-bar { justify-content: flex-start; flex: 0 1 auto; flex-wrap: nowrap; gap: 4px; min-width: 0; margin: 0; font-size: 15px; font-weight: 800; white-space: nowrap; }
.fc-cd.fc-cd-bar .fc-cd-clk svg { width: 17px; height: 17px; }
.fc-cd.fc-cd-bar .fc-cd-w { color: #111111; }
.fc-cd.fc-cd-bar .fc-cd-sep { margin: 0 2px; color: #BBBBBB; }
.fc-cd.fc-cd-bar .fc-cd-px b { color: #0A7D54; font-weight: 800; }
.au-buybar .fc-cd-bar:not([hidden]) ~ .au-bb-copy { display: none; }
@media (max-width: 760px) {
	.fc-cd.fc-cd-bar { font-size: 13px; }
}
@media (max-width: 380px) {
	.fc-cd.fc-cd-bar { font-size: 12.5px; }
}

/* 강의 목록 카드 (목록 카드 시안 8-5 '걸친 시계', 2026-10-17): 카드 본문 맨 위. 흰 동그라미 속 큰 시계가 썸네일 아래 끝에
 * 18px 걸치고, 옆에 LIVE 혜택 02:20:12. 단계가 없어 숨으면(hidden) 걸친 자리도 같이 사라진다 */
.fc-cd.fc-cd-card { position: relative; z-index: 3; justify-content: flex-start; flex-wrap: nowrap; align-items: flex-end; gap: 5px; margin: 0; font-size: 14px; white-space: nowrap; }
.fc-cd.fc-cd-card .fc-cd-plate { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 48px; height: 48px; margin-right: 3px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 4px 12px rgba(20, 32, 26, 0.2); }
.fc-cd.fc-cd-card .fc-cd-clk svg { width: 28px; height: 28px; }
.fc-cd.fc-cd-card .fc-cd-bt,
.fc-cd.fc-cd-card .fc-cd-t { padding-bottom: 1px; }
.au-ccard-info > .fc-cd-card { margin: -40px 0 10px; } /* 홈 카드: 본문 위 여백 22px */
.auc-body > .fc-cd-card { margin-top: -38px; }        /* 카테고리 카드: 본문 위 여백 20px, 제목과의 간격은 본문 gap */

@keyframes fc-cd-roll { from { transform: translateY(-70%); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fc-cd-rock { 0%, 100% { transform: rotate(-9deg); } 50% { transform: rotate(9deg); } }
@keyframes fc-cd-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
	.fc-cd,
	.fc-cd * { animation: none !important; transition: none !important; }
}