/* AI 랜딩 v2 · 공통 바탕 (MSDS 룩). 원본 스타일시트 뒤, fonts.css 뒤에 로드한다.
   - 쉘: 흰 바탕 · 위쪽 타원 빛 하나 · Paperlogy → Pretendard · 제목 자간 -0.02em
   - 제품 시연 화면(표면)은 원본 그대로: 서체 Pretendard 유지, 그림 · 배치 손대지 않음
   - .v2-scene 안의 원래 감싸개(섹션 · 컨테이너)는 배경 · 여백 · 테두리를 없앤다 (회색 띠 금지)
   - 플레이어 UI(.v2-steps · .v2-step · .v2-progress) 기본값. 변형 페이지가 덮어써도 된다.
   - 핀 없이 필요한 값: 생성 필름 고정 높이(--v2-stage-height, svh 제거), 시간 재생 중 단계 전환 트랜지션 복구 */

:root {
  --v2-accent: #4c00ff;
  --v2-accent-press: #3700b8;
  --v2-accent-text: #6929ff;
  --v2-accent-tint: #f4f0ff;
  --v2-accent-line: #ece6ff;
  --v2-ink: #191f28;
  --v2-ink-2: #333d4b;
  --v2-ink-3: #6b7684;
  --v2-ink-4: #8b95a1;
  --v2-line: #f2f4f6;
  --v2-line-2: #e5e8eb;
  --v2-fill: #f2f4f6;
  --v2-card: #ffffff;
  --v2-card-radius: 24px;
  --v2-card-shadow: 0 10px 34px rgba(23, 92, 211, .07);
  --v2-glow: radial-gradient(ellipse at 50% 0%, rgba(49, 130, 246, .11), rgba(49, 130, 246, .04) 48%, transparent 72%);
  --v2-ease: cubic-bezier(.22, 1, .36, 1);
  --v2-rise: .26s;
  --v2-press: .97;
  --v2-font: "Paperlogy", Pretendard, "Apple SD Gothic Neo", system-ui, sans-serif;
  --v2-font-product: Pretendard, "Apple SD Gothic Neo", sans-serif;
  --v2-dock-clearance: var(--ai-dock-clearance, 78px);
}

/* ---------- 쉘 ---------- */
html { scroll-padding-bottom: calc(var(--ai-dock-clearance, 78px) + 12px); }
body.risk-motion-page { background: #fff; font-family: var(--v2-font); font-synthesis: none; }
/* 제품 시연 표면은 원본 서체 그대로 */
.risk-motion-page :is([data-ps-surface], .rg-film-stage, .ax-emergency-stage, .rl-assessment-canvas, .rf-hero-product, .risk-client-strip, .sl-header, #solution-mobile-menu) { font-family: var(--v2-font-product); }
/* 머리 메뉴는 다른 페이지와 같은 모양 (Pretendard) 으로 둔다. */

/* 히어로: 파스텔 사선 판 대신 MSDS 위쪽 타원 빛 하나. 리본 캔버스는 그대로. 제목은 한 색. */
.risk-motion-page .rl-hero:before {
  inset: 0 0 auto 0; height: 46vh; min-height: 360px; clip-path: none; opacity: 1;
  background: var(--v2-glow);
}
.risk-motion-page #rm-title { font-family: var(--v2-font); font-weight: 700; letter-spacing: -.02em; color: var(--v2-ink); }
.risk-motion-page #rm-title span { color: inherit; font-weight: inherit; }

/* ---------- 장면 뿌리 ---------- */
.v2-scene { position: relative; min-width: 0; }
:is(.v2-scene, .v2-details, .v2-cta) :is(.ra-suite, .ra-section, .rg-build, .rf-hardware, .rf-overview-section, .rl-tbm-section, .rl-detection-section,
  .ra-detection-grid, .ra-detection-card, .ra-overview-row, .rv-climate, .ax-assignment, .ax-fire-feature, .ax-emergency, .ab-brand, .af-brand,
  .rf-report-section, .rf-photo-section) {
  background: transparent !important; border: 0 !important; box-shadow: none !important; padding-block: 0 !important; margin-block: 0 !important;
}
:is(.v2-scene, .v2-details, .v2-cta) .sl-container { max-width: none; margin-inline: 0; padding: 0; }
.v2-scene .ps-story { margin-bottom: 0; }
.v2-scene .ps-pin { padding-bottom: 0; }
.v2-scene #ra-feature-video .ps-pin, .v2-scene .rg-scroll-pin { background: transparent; }
/* 감싸개 여백을 없애면 원래 여백 안에 있던 넘침이 다음 장면을 덮는다: 생성 입력 카드 47px(600px 이상), 공장 캡션 5~8px */
@media (min-width: 600px) { .v2-scene .rg-build[data-rg-mode="scroll"] .rg-scroll-pin { padding-bottom: 48px; } }
.v2-scene .ps-story[data-ps-story="factory"] > .ps-pin { padding-bottom: 12px; }

/* ---------- 헤드라인 (장면마다 하나) ---------- */
:root .risk-motion-page .v2-headline.v2-headline.v2-headline {
  font-family: var(--v2-font) !important; font-weight: 700 !important;
  font-size: clamp(24px, 2.4vw, 34px) !important; line-height: 1.32 !important; letter-spacing: -.02em !important;
  color: var(--v2-ink) !important; margin: 0 !important; word-break: keep-all; text-wrap: balance; white-space: normal;
}
:root .risk-motion-page .v2-headline :is(strong, b, span, .ra-key) { color: inherit !important; font-weight: inherit !important; }
@media (max-width: 599px) {
  :root .risk-motion-page .v2-headline.v2-headline.v2-headline { font-size: 22px !important; line-height: 1.34 !important; }
}

/* ---------- 플레이어 UI ---------- */
.v2-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-family: var(--v2-font); }
.v2-step {
  appearance: none; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px;
  border: 0; border-radius: 14px; background: var(--v2-fill); color: var(--v2-ink-3);
  font: 500 14px/1.2 var(--v2-font); letter-spacing: 0; white-space: nowrap; cursor: pointer;
  transition: background-color .2s var(--v2-ease), color .2s var(--v2-ease), transform .14s var(--v2-ease);
  -webkit-tap-highlight-color: transparent;
}
.v2-step[data-v2-state="done"] { color: var(--v2-ink-2); }
.v2-step[aria-pressed="true"] { background: var(--v2-accent-tint); color: var(--v2-accent); }
.v2-step:active { transform: scale(var(--v2-press)); }
.v2-step:focus-visible { outline: 2px solid var(--v2-accent-text); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .v2-step:hover { color: var(--v2-accent-text); } }
.v2-progress { height: 3px; margin-top: 12px; border-radius: 3px; background: var(--v2-fill); overflow: hidden; }
.v2-progress > i { display: block; height: 100%; background: var(--v2-accent); transform-origin: left center; transform: scaleX(0); }
.v2-steps, .v2-progress { scroll-margin-bottom: calc(var(--ai-dock-clearance, 78px) + 12px); }

/* ---------- 생성 필름: 핀 없이 고정 높이 (100svh 의존 제거) ---------- */
.risk-motion-page .rg-build[data-rg-mode="scroll"][data-v2-ready="true"] .rg-film-stage { height: var(--v2-stage-height, 420px); }
/* risk-process-scroll.css:60 이 .rg-build 안 트랜지션을 모두 끈다. 시간 재생에서는 단계 전환(사진 확대 · 표시선 · 보내기 · 이동선 · 요약 문구)만 되살린다.
   매 프레임 인라인으로 그리는 단어 · 행 · 앱 · 패널은 인라인 transition:none 그대로. */
.rg-build[data-rg-mode="scroll"][data-v2-ready="true"] .rg-input-photo > img { transition: transform 2200ms cubic-bezier(.23, 1, .32, 1) !important; } /* 설명 모션 */
.rg-build[data-rg-mode="scroll"][data-v2-ready="true"] .rg-photo-mark { transition: opacity 350ms ease, transform 650ms cubic-bezier(.23, 1, .32, 1) !important; }
.rg-build[data-rg-mode="scroll"][data-v2-ready="true"] .rg-send { transition: transform 200ms cubic-bezier(.23, 1, .32, 1), background-color 200ms ease !important; }
.rg-build[data-rg-mode="scroll"][data-v2-ready="true"] .rg-transfer-line i { transition: transform 750ms cubic-bezier(.77, 0, .175, 1) !important; } /* 설명 모션 */
.rg-build[data-rg-mode="scroll"][data-v2-ready="true"] :is(.rg-generating-label, .rg-generated-label) { transition: opacity 250ms ease, transform 350ms cubic-bezier(.23, 1, .32, 1) !important; }
/* 재생 중에만 입력 커서 · 생성 중 점 (risk-process-scroll.css:61, risk-live-motion.css:105 가 끈 것) */
.rg-build[data-v2-ready="true"][data-rg-playing="true"][data-rg-phase="0"] .rg-caret { opacity: 1; animation: rg-caret 900ms step-end infinite !important; }
.rg-build[data-v2-ready="true"][data-rg-playing="true"][data-rg-phase="1"] .rg-processing-mark i { animation: rg-think 900ms cubic-bezier(.45, 0, .55, 1) infinite !important; }
.rg-build[data-v2-ready="true"][data-rg-playing="true"][data-rg-phase="1"] .rg-processing-mark i:nth-child(2) { animation-delay: 150ms !important; }
.rg-build[data-v2-ready="true"][data-rg-playing="true"][data-rg-phase="1"] .rg-processing-mark i:nth-child(3) { animation-delay: 300ms !important; }

/* ---------- 화재 도면: 초록 제거 (완료 · 선택은 보라) ---------- */
.ax-emergency[data-v2-ready="true"] .ax-step[aria-pressed="true"],
.v2-scene .ax-step[aria-pressed="true"] { background: var(--v2-accent-tint); border-color: transparent; color: var(--v2-accent); }
.ax-emergency[data-v2-ready="true"] .ax-step[aria-pressed="true"] > span,
.v2-scene .ax-step[aria-pressed="true"] > span { color: var(--v2-accent-text); }
@media (hover: hover) and (pointer: fine) { .ax-emergency[data-v2-ready="true"] .ax-step:hover { color: var(--v2-accent-text); background: var(--v2-accent-tint); } }
.ax-emergency[data-v2-ready="true"] .ax-save-status { color: var(--v2-accent-text); }
.ax-emergency[data-v2-ready="true"] .ax-save-status i { background: var(--v2-accent-tint); }
.ax-emergency[data-v2-ready="true"] .ax-save-panel footer { background: var(--v2-accent-tint); border-color: var(--v2-accent-line); color: var(--v2-accent); }
.ax-emergency[data-v2-ready="true"] .ax-save-panel footer small { color: var(--v2-ink-3); }
/* 대피 경로 선 · 범례 (원본 #258369 초록) */
.ax-emergency[data-v2-ready="true"] .ax-map-routes { stroke: var(--v2-accent-text); }
.ax-emergency[data-v2-ready="true"] .ax-map-legend .ax-legend-route { background: var(--v2-accent-text); }

/* ---------- 영상 감지: 저장 완료 표시 초록 제거 (risk-video-detail.css:29-30 #4b725f · #44755a) ---------- */
.v2-scene #ra-feature-video .sv-video-detail[data-sv-saved="true"] .sv-save-state { color: var(--v2-ink); }
.v2-scene #ra-feature-video .sv-video-detail[data-sv-saved="true"] .sv-save-check { border-color: var(--v2-accent-line); background: var(--v2-accent-tint); color: var(--v2-accent); }

/* ---------- 자주 묻는 질문 · 하단 상담 줄: 회색 띠 · 초록 회색 제거 (risk-brand-editorial.css:18-21) ---------- */
.risk-motion-page .ax-faq { background: #fff; color: var(--v2-ink-3); }
.risk-motion-page .ax-faq .rm-questions, .risk-motion-page .ax-faq .rm-questions details { border-color: var(--v2-line-2); }
.risk-motion-page .ax-faq .rm-questions summary { color: var(--v2-ink-2); }
.risk-motion-page .ax-faq .rm-questions p { color: var(--v2-ink-3); }
.v2-cta .ab-contact-row { border-top-color: var(--v2-line-2); }
.v2-cta .ab-contact-row > span { color: var(--v2-ink-3); }
.v2-cta .ab-contact-row > a { color: var(--v2-ink); border-bottom-color: var(--v2-ink-4); }
.v2-cta .ab-contact-row > a:focus-visible { outline-color: var(--v2-accent-text); }
@media (hover: hover) and (pointer: fine) { .v2-cta .ab-contact-row > a:hover { color: var(--v2-accent-text); } }

@media (prefers-reduced-motion: reduce) {
  .v2-step, .v2-progress > i { transition: none; }
  .v2-step:active { transform: none; }
  .rg-build[data-v2-ready="true"] .rg-caret, .rg-build[data-v2-ready="true"] .rg-processing-mark i { animation: none !important; }
}