@charset "utf-8";
/* =========================================================================
   ☀️ 라이트 모드 (White Mode) 전체 통합 — 최적화 리팩토링
   body에 .white-mode 클래스가 추가되면 동작합니다.
   - CSS 변수로 톤 통일
   - 셀렉터 그룹화로 중복 제거
   - 누락 보강: 히어로 타이틀/서브, 빅텍스트 그라데이션, 팬 카드 배경, 폼 배경 이미지 등
   ========================================================================= */

/* ---------- 변수: 라이트 톤 팔레트 ---------- */
body.white-mode {
    --lm-bg:        #f7f8fa;
    --lm-bg-soft:   #ffffff;
    --lm-text:      #111111;
    --lm-text-sub:  #555555;
    --lm-text-mute: #888888;
    --lm-line:      rgba(0, 0, 0, 0.08);
    --lm-line-soft: rgba(0, 0, 0, 0.04);
    --lm-card:      rgba(255, 255, 255, 0.85);
    --lm-accent:    #f94543;

    background-color: #fff !important;
    color: var(--lm-text);
}

/* =========================================================================
   [1] 헤더
   ========================================================================= */
body.white-mode #sj_header {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(24px) saturate(150%);
    -webkit-backdrop-filter: blur(24px) saturate(150%);
    border-bottom: 1px solid var(--lm-line) !important;  /* 흰 배경에 흰 라인 → 어두운 라인으로 보정 */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03), inset 0 -1px 0 rgba(0, 0, 0, 0.04) !important;
}
body.white-mode .sj_header_bottom { border-top: 1px solid var(--lm-line) !important; }
body.white-mode .sj_logo img      { filter: invert(1) brightness(0.1) !important; }

body.white-mode .sj_top_menu li a,
body.white-mode .sj_gnb li a                          { color: var(--lm-text-mute) !important; font-weight: 600 !important; opacity: 1 !important; }
body.white-mode .sj_top_menu li.sj_active a           { color: var(--lm-text) !important; font-weight: 800; }
body.white-mode .sj_top_menu li.sj_active::after      { background: var(--lm-text) !important; height: 3px !important; bottom: -6px !important; }
body.white-mode .sj_gnb li a:hover                    { color: var(--lm-text) !important; }

/* AI 견적 버튼 */
body.white-mode .sj_btn_ai {
    background: #fff !important;
    border: 1px solid var(--lm-line) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important;
    color: var(--lm-text) !important;
}
body.white-mode .ai_icon_wrap                         { background: rgba(0, 0, 0, 0.85) !important; }
body.white-mode .ai_icon_wrap img                     { filter: brightness(2) !important; }
body.white-mode .ai_btn_txt                           { color: var(--lm-text) !important; text-shadow: none !important; font-weight: 700 !important; }
body.white-mode .sj_btn_ai:hover {
    border-color: var(--lm-accent) !important;
    box-shadow: 0 6px 20px rgba(249, 69, 67, 0.15) !important;
    color: var(--lm-accent) !important;
}
body.white-mode .sj_btn_ai.is-active                  { background: #000 !important; color: #fff !important; border: none !important; }
body.white-mode .sj_btn_ai.is-active .ai_btn_txt      { color: #fff !important; }

/* 다크모드 토글 */
body.white-mode .sj_dark_mode_wrapper {
    background: #f4f4f8 !important;
    border: 1px solid var(--lm-line-soft) !important;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.02) !important;
}
body.white-mode .sj_dark_txt                          { color: var(--lm-text) !important; font-weight: 700 !important; }
body.white-mode .sj_dark_ball                         { background: #fff !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important; }

/* 햄버거 */
body.white-mode .sj_hamburger .line                   { background: #333 !important; }

/* 헤더 배경 장식 제거 */
body.white-mode .header_svg_bg,
body.white-mode #sj_header::after                     { display: none !important; }

/* =========================================================================
   [2] 전체 섹션 배경 통일
   ========================================================================= */
body.white-mode #sj_main,
body.white-mode .sj_sticky_wrapper,
body.white-mode .sj_bigtext_sec,
body.white-mode .sj_proj_sec,
body.white-mode .sj_gallery_sec,
body.white-mode .sj_section_gap,
body.white-mode .sj_fan_section,
body.white-mode .sj_section_portfolio,
body.white-mode .sj_ai_sec,
body.white-mode .sj_process_sec,
body.white-mode .sj_benefits_sec,
body.white-mode .sj_contact_sec,
body.white-mode .sj_text_container,
body.white-mode .ms06Inner,
body.white-mode .j_footer,
body.white-mode .mkt_wrapper,
body.white-mode .mkt_page_wrapper,
body.white-mode .mkt_hero_wrap,
body.white-mode .mkt_compare,
body.white-mode .mkt_service,
body.white-mode .mkt_portfolio,
body.white-mode .mkt_process_sec,
body.white-mode .mkt_process,
body.white-mode .sj_expand_layer {
    background-color: #fff;
    color: var(--lm-text) !important;
}

/* CONTACT 섹션의 form_bg.png 배경 이미지 제거 (라이트모드에서 어둠 잔존 방지) */
body.white-mode .sj_contact_sec                       { background-image: none !important; }

/* 진행 바 / 전환 패널 */
body.white-mode .sj_pg_bar                            { background: rgba(0, 0, 0, 0.85) !important; }
body.white-mode .sj-trans-l,
body.white-mode .sj-trans-r                           { background: #ffffff !important; }

/* =========================================================================
   [3] 히어로 (영상 위 텍스트)
   영상 자체는 다크톤 유지하고 텍스트는 흰색 + 그림자로 가독성 확보
   ========================================================================= */
body.white-mode .sj_overlay,
body.white-mode .mkt_overlay                          { background: rgba(0, 0, 0, 0.5) !important; }

body.white-mode .sj_hero_ttl,
body.white-mode .sj_hero_sub,
body.white-mode .sj_hero_content .sj_main_title,
body.white-mode .sj_hero_content .sj_description,
body.white-mode .mkt_main_title,
body.white-mode .mkt_description {
    color: #fff !important;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}

/* 빅텍스트 채움 효과 — 라이트모드 그라데이션 재정의
   1st: 검정 채움(스크롤로 채워짐) / 2nd: 옅은 회색 fallback */
body.white-mode .sj-bt-inner {
    background-image:
        linear-gradient(to right, #111, #111),
        linear-gradient(to right, #bdbdbd, #bdbdbd) !important;
}

/* 가운데 파도 텍스트 (구버전 — 잔존 시) */
body.white-mode .sj_text_container,
body.white-mode .bg_black                             { background-color: #ffffff !important; }
body.white-mode .sj_text_container .center_txt        { color: var(--lm-text) !important; text-shadow: none !important; }
body.white-mode .sj_white_text_layer .white_txt       { color: #ffffff !important; }

/* =========================================================================
   [4] 공통 카드 (Glass UI)
   ========================================================================= */
body.white-mode .proc_card,
body.white-mode .b_card,
body.white-mode .pf_card,
body.white-mode .sj_pf_card,
body.white-mode .sj_ai_card,
body.white-mode .mkt_svc_card,
body.white-mode .mkt_proc_card,
body.white-mode .glass_card {
    background: var(--lm-card) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .proc_card:hover,
body.white-mode .b_card:hover,
body.white-mode .pf_card:hover,
body.white-mode .sj_pf_card:hover,
body.white-mode .sj_ai_card:hover,
body.white-mode .mkt_svc_card:hover,
body.white-mode .mkt_proc_card:hover {
    border-color: rgba(249, 69, 67, 0.3) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06) !important;
}
/* AI 카드 글로우 */
body.white-mode .ai-card-glow                         { background: radial-gradient(circle, rgba(0, 0, 0, 0.05) 0%, transparent 65%) !important; }

/* =========================================================================
   [5] 텍스트 색상 통일
   ========================================================================= */
/* 메인 타이틀 + 카드 헤딩 (블랙) */
body.white-mode .sj_pf_title,
body.white-mode .proc_header h2,
body.white-mode .proc_bot h3,
body.white-mode .proc_top .step,
body.white-mode .b_title,
body.white-mode .stat_box strong,
body.white-mode .c_txt h3,
body.white-mode .c_left h2,
body.white-mode .sj_ai_header h2,
body.white-mode .sj_ai_card h3,
body.white-mode .mkt_sec_header h2,
body.white-mode .mkt_proc_title,
body.white-mode .mkt_proc_card h4,
body.white-mode .mkt_svc_card h4,
body.white-mode .pin_left h2,
body.white-mode .pf_title,
body.white-mode .pf_stat_val,
body.white-mode .sj_fan_ttl,
body.white-mode .sj_mosaic_lead,
body.white-mode .svc_txt p {
    color: var(--lm-text) !important;
    text-shadow: none !important;
}

/* 서브 설명 (다크 그레이) */
body.white-mode .proc_header p,
body.white-mode .b_desc,
body.white-mode .stat_box span,
body.white-mode .c_txt p,
body.white-mode .sj_ai_header p,
body.white-mode .sj_ai_card p,
body.white-mode .mkt_sec_header p,
body.white-mode .mkt_proc_desc,
body.white-mode .mkt_svc_card p,
body.white-mode .mkt_proc_card p,
body.white-mode .pin_left p,
body.white-mode .proc_txt p,
body.white-mode .pf_stat_label,
body.white-mode .sj_fan_cat {
    color: var(--lm-text-sub) !important;
}

/* SVG/아이콘 반전 — 흰색 stroke/fill 을 어둡게 */
body.white-mode .sj_ai_icon svg,
body.white-mode .sj_ai_icon img,
body.white-mode .b_card .c_icon svg,
body.white-mode .b_card .c_icon img,
body.white-mode .sj_fan_top svg,
body.white-mode .front_icon_svg {
    filter: invert(1) brightness(0.2) !important;
}
body.white-mode .proc_card .icon svg,
body.white-mode .proc_card .icon img {
    filter: invert(1) brightness(0.2) opacity(0.5) !important;
}

/* =========================================================================
   [6] 포트폴리오 / 갤러리 / 프로젝트 패럴랙스
   ========================================================================= */
body.white-mode .sj_exp_item {
    filter: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
    border-radius: 20px !important;
    border: 1px solid rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .sj_exp_item.item_main                { box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08) !important; }

body.white-mode .sj_pf_info p                         { color: var(--lm-text) !important; }
body.white-mode .sj_pf_info span                      { color: #0066ff !important; }

body.white-mode .sj_pf_btn {
    background-color: #fff !important;
    border-color: var(--lm-line) !important;
    color: var(--lm-text-mute) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .sj_pf_btn:hover                      { border-color: rgba(0, 0, 0, 0.3) !important; color: var(--lm-text) !important; }
body.white-mode .sj_pf_btn.sj_active                  { background-color: var(--lm-accent) !important; border-color: var(--lm-accent) !important; color: #fff !important; }

body.white-mode .sj_pf_search input {
    background: #fff !important;
    border-color: var(--lm-line) !important;
    color: var(--lm-text) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .sj_pf_search input:focus             { border-color: var(--lm-accent) !important; }
body.white-mode .sj_pf_search input::placeholder      { color: #aaa !important; }
body.white-mode .search_icon                          { filter: invert(1); opacity: 0.6; }

body.white-mode .btn_more {
    background: #fff !important;
    color: var(--lm-text) !important;
    border-color: var(--lm-line) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}
body.white-mode .btn_more:hover                       { border-color: var(--lm-accent) !important; color: var(--lm-accent) !important; }

/* OUR WORKS 패럴랙스 썸네일 — 다크 오버레이 약화 */
body.white-mode .sj_proj_thumb::after                 { background: rgba(0, 0, 0, 0.10) !important; }
body.white-mode .sj_proj_thumb img                    { filter: brightness(1) saturate(1) !important; }
body.white-mode .sj_proj_thumb:hover::after           { background: rgba(0, 0, 0, 0) !important; }

/* 배경 거대 타이포 (OUR WORKS, OUR SHOWCASE) — 라이트모드 가시성 강화 */
/* 배경 거대 타이포 (OUR WORKS, OUR SHOWCASE) — 흰색+투명도 → 어두운 영역 위에서 옅은 회색처럼 */
body.white-mode .sj_proj_big_text {
    color: #ffffffad !important;
    z-index: 30 !important;
    font-weight: 800 !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}
body.white-mode .sj_fan_bigtext {
    color: rgb(0 0 0 / 33%) !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}
/* OUR WORKS 썸네일 — 어두운 오버레이로 OUR WORKS 텍스트 배경 역할 */
body.white-mode .sj_proj_thumb::after { background: rgba(0, 0, 0, 0.32) !important; }
body.white-mode .sj_proj_thumb:hover::after { background: rgba(0, 0, 0, 0.12) !important; }
body.white-mode .sj_proj_thumb img { filter: brightness(0.92) saturate(0.95) !important; }

/* SHOWCASE FAN 카드 — 다크 배경 → 라이트 톤 */
body.white-mode .sj_fan_card                          { box-shadow: 0 20px 60px rgba(0, 0, 0, 0.10) !important; }
body.white-mode .sj_fan_top                           { background: #f0f0f3 !important; }

/* =========================================================================
   [7] 디지털 마케팅 (index2.php)
   ========================================================================= */
body.white-mode .flip_front {
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .flip_front h3                        { color: var(--lm-text) !important; }
body.white-mode .flip_front p                         { color: var(--lm-text-sub) !important; border-color: rgba(0, 0, 0, 0.1) !important; background: rgba(0, 0, 0, 0.02) !important; }

body.white-mode .flip_back {
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1px solid rgba(249, 69, 67, 0.4) !important;
    box-shadow: 0 15px 40px rgba(249, 69, 67, 0.1) !important;
}
body.white-mode .flip_back h3                         { color: #d32f2f !important; border-bottom-color: rgba(249, 69, 67, 0.2) !important; }
body.white-mode .flip_back li                         { color: #333 !important; font-weight: 500; }

body.white-mode .proc_line_bg                         { background: rgba(0, 0, 0, 0.08) !important; }
body.white-mode .proc_line_fill                       { box-shadow: none !important; }
body.white-mode .proc_node {
    background: #fff !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
    color: rgba(0, 0, 0, 0.3) !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .proc_item.active .proc_node {
    border-color: var(--lm-accent) !important;
    color: var(--lm-accent) !important;
    box-shadow: 0 15px 30px rgba(249, 69, 67, 0.15) !important;
}

body.white-mode .ind_item                             { color: rgba(0, 0, 0, 0.3) !important; }
body.white-mode .ind_item.active                      { color: var(--lm-text) !important; }
body.white-mode .ind_dot                              { background: rgba(0, 0, 0, 0.1) !important; }
body.white-mode .ind_item.active .ind_dot             { background: var(--lm-accent) !important; box-shadow: 0 0 15px rgba(249, 69, 67, 0.3) !important; }

body.white-mode .svc_panel                            { background: #fafafa !important; border: 1px solid rgba(0, 0, 0, 0.03) !important; }
body.white-mode .svc_panel.is-active.cyber_glow {
    background: rgba(249, 69, 67, 0.03) !important;
    border-color: rgba(249, 69, 67, 0.2) !important;
    box-shadow: 0 15px 30px rgba(249, 69, 67, 0.05) !important;
}
body.white-mode .svc_icon_box                         { background: rgba(0, 0, 0, 0.02) !important; border-color: rgba(0, 0, 0, 0.05) !important; }
body.white-mode .svc_panel.is-active .svc_icon_box {
    background: rgba(249, 69, 67, 0.05) !important;
    border-color: rgba(249, 69, 67, 0.3) !important;
    box-shadow: none !important;
}
body.white-mode .svc_svg                              { stroke: rgba(0, 0, 0, 0.4) !important; }
body.white-mode .svc_panel.is-active .svc_svg         { stroke: var(--lm-accent) !important; filter: none !important; }

/* =========================================================================
   [8] CONTACT 폼
   ========================================================================= */
body.white-mode .f_type_label,
body.white-mode .radio_txt,
body.white-mode .check_txt,
body.white-mode .c_btn span                           { color: var(--lm-text) !important; }

body.white-mode .form_glass {
    background: #fff !important;
    border: 1px solid var(--lm-line) !important;
    backdrop-filter: none !important;            /* 다크 backdrop-filter 무효화 */
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05) !important;
}

body.white-mode .f_group label                        { color: var(--lm-text-sub) !important; font-weight: 600 !important; }
body.white-mode .f_group input,
body.white-mode .f_group textarea {
    background: #fafafa !important;
    border: 1px solid var(--lm-line) !important;
    color: var(--lm-text) !important;
}
body.white-mode .f_group input:focus,
body.white-mode .f_group textarea:focus               { border-color: var(--lm-accent) !important; background: #fff !important; }
body.white-mode .f_group input::placeholder,
body.white-mode .f_group textarea::placeholder        { color: #aaa !important; }

body.white-mode .f_tel_prefix,
body.white-mode .f_file {
    background: #fafafa !important;
    border: 1px solid var(--lm-line) !important;
    color: var(--lm-text) !important;
}
body.white-mode .f_tel_prefix svg                     { stroke: var(--lm-text) !important; }
body.white-mode .btn_file                             { background: var(--lm-text) !important; color: #fff !important; }
body.white-mode .f_file span                          { color: var(--lm-text-mute) !important; }

body.white-mode .radio_mark                                       { border-color: rgba(0, 0, 0, 0.3) !important; }
body.white-mode .custom_radio input:checked ~ .radio_mark         { border-color: var(--lm-accent) !important; }
body.white-mode .custom_radio input:checked ~ .radio_mark::after  { background: var(--lm-accent) !important; }

body.white-mode .check_mark                                       { border-color: rgba(0, 0, 0, 0.3) !important; }
body.white-mode .custom_check input:checked ~ .check_mark         { background: var(--lm-accent) !important; border-color: var(--lm-accent) !important; }

body.white-mode .c_btn {
    background: #fff !important;
    border-color: var(--lm-line) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .c_btn:hover                          { border-color: rgba(0, 0, 0, 0.3) !important; }

body.white-mode .f_notice,
body.white-mode .f_agree_wrap a                       { color: var(--lm-text-mute) !important; }

body.white-mode .b_stats                              { border-top: 1px solid rgba(0, 0, 0, 0.1) !important; }
body.white-mode .pf_stats                             { border-top: 1px solid rgba(0, 0, 0, 0.08) !important; }

/* =========================================================================
   [9] 푸터
   ========================================================================= */
body.white-mode .j_footer                             { border-top: 1px solid rgba(0, 0, 0, 0.08) !important; }
body.white-mode .ft_info p,
body.white-mode .ft_rt ul li p                        { color: var(--lm-text-sub) !important; }
body.white-mode .ft_rt ul li h2,
body.white-mode .ft_link a                            { color: #333 !important; }
body.white-mode .ft_lt a img                          { filter: invert(1) brightness(0.1) !important; }
body.white-mode .add_inter                            { color: var(--lm-text) !important; text-shadow: none !important; animation: none !important; }
body.white-mode .add_inter:hover                      { color: var(--lm-accent) !important; }

/* =========================================================================
   [10] 추가 가시성 보강 — 라이트모드에서 흰색 그대로 두면 안 보이는 텍스트들
   ========================================================================= */
/* AI 섹션 타이핑 텍스트 / 헤더 span */
body.white-mode .sj_ai_header h2 span,
body.white-mode .ai-typed,
body.white-mode .ai-before                            {color: var(--lm-text) !important;}
body.white-mode .sj-type-cursor                       {background: rgba(0, 0, 0, 0.85) !important;}

/* 카드 fan 카테고리/타이틀 */
body.white-mode .sj_fan_cat                           { color: var(--lm-text-mute) !important; }
body.white-mode .sj_fan_ttl                           { color: var(--lm-text) !important; }

/* AI 견적 버튼 (CTA) — 그대로 빨강 유지하되 그림자 줄임 */
body.white-mode .sj_ai_btn                            { box-shadow: 0 8px 24px rgba(249, 69, 67, 0.25) !important; }

/* 프로세스 라인 (다크 그라데이션 → 라이트) */
body.white-mode .proc_bot .line {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.06), transparent) !important;
}

/* 베네핏 stats shimmer 애니메이션 (라이트모드에서 흰색이라 안 보임) */
body.white-mode .stat-glowing strong                  { animation: none !important; color: var(--lm-text) !important; }

/* 통계 카운팅 strong */
body.white-mode .stat_box strong                      { color: var(--lm-text) !important; text-shadow: none !important; }

/* 진행 프로그레스 바 */
body.white-mode .sj_pg_bar                            { background: rgba(0, 0, 0, 0.7) !important; }

/* 스크롤바 라이트 톤 */
body.white-mode::-webkit-scrollbar-track              { background: #eee !important; }
body.white-mode::-webkit-scrollbar-thumb              { background: rgba(0, 0, 0, 0.3) !important; }

/* 갤러리 sublead 텍스트 */
body.white-mode .sj_mosaic_sublead                    { color: var(--lm-text-sub) !important; }
body.white-mode .sj_gal_cta                           { color: var(--lm-text) !important; }

/* 영문 텍스트 라인 (wenn-line 등) */
body.white-mode .wenn-line                            { color: var(--lm-text) !important; }
body.white-mode .wenn-line i                          { color: var(--lm-text-mute) !important; }

/* 푸터 로고 */
body.white-mode .add_inter                            { -webkit-text-stroke: 0 !important; }

/* =========================================================================
   [11] 톤 다양화 — 너무 흰색 일색이 안 되도록 포인트 추가
   섹션별로 살짝 다른 톤 + 카드 보더 강화 + 액센트 컬러 활용
   ========================================================================= */
/* 섹션 배경 교차 — 시각적 리듬 부여 */
body.white-mode .sj_bigtext_sec        { background-color: #ffffff !important; }
body.white-mode .sj_proj_sec           {background-color: #fff;}   /* 살짝 어두운 톤 */
body.white-mode .sj_fan_section        { background-color: #ffffff !important; }
body.white-mode .sj_section_portfolio  {}
body.white-mode .sj_ai_sec             { background-color: #ffffff !important; }
body.white-mode .sj_process_sec        { background-color: #f3f4f7 !important; }
body.white-mode .sj_benefits_sec       { background-color: #ffffff !important; }
body.white-mode .sj_contact_sec        { background-color: #f7f8fa !important; }
body.white-mode .sj_section_gap        { background-color: #ffffff !important; }
body.white-mode .ms06Inner             { background-color: #f7f8fa !important; }
body.white-mode .j_footer              { background-color: #ececf0 !important; }   /* 푸터는 더 어둡게 */

/* 카드 보더 + 그림자 강화 — 흰 배경 위 카드가 묻히지 않게 */
body.white-mode .proc_card,
body.white-mode .b_card,
body.white-mode .pf_card,
body.white-mode .sj_pf_card,
body.white-mode .sj_ai_card,
body.white-mode .mkt_svc_card,
body.white-mode .mkt_proc_card,
body.white-mode .glass_card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.10) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06), 0 2px 6px rgba(0, 0, 0, 0.03) !important;
}
body.white-mode .proc_card:hover,
body.white-mode .b_card:hover,
body.white-mode .pf_card:hover,
body.white-mode .sj_pf_card:hover,
body.white-mode .sj_ai_card:hover,
body.white-mode .mkt_svc_card:hover,
body.white-mode .mkt_proc_card:hover {
    border-color: var(--lm-accent) !important;
    box-shadow: 0 14px 36px rgba(249, 69, 67, 0.18), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
    transform: translateY(-3px);
}

/* 메인 타이틀에 빨강 액센트 — 일부 키워드 강조 */
body.white-mode .sj_ai_header h2 span,
body.white-mode .ai-typed                             { color: #111; }

/* 헤더 그림자 강화 — 흰 배경에서 헤더가 떠 있는 느낌 */
body.white-mode #sj_header {
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), inset 0 -1px 0 rgba(0, 0, 0, 0.05) !important;
}

/* 폼 영역에 보더 강화 */
body.white-mode .form_glass {
    border: 1px solid rgba(0, 0, 0, 0.10) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.06) !important;
}

/* AI 견적 버튼 더 강한 액센트 */
body.white-mode .sj_btn_ai {
    border: 1.5px solid var(--lm-accent) !important;
    color: var(--lm-accent) !important;
    box-shadow: 0 4px 16px rgba(249, 69, 67, 0.12) !important;
}
body.white-mode .sj_btn_ai .ai_btn_txt                { color: var(--lm-accent) !important; }
body.white-mode .sj_btn_ai .ai_icon_wrap              { background: var(--lm-accent) !important; }
body.white-mode .sj_btn_ai:hover {
    background: var(--lm-accent) !important;
    color: #fff !important;
    box-shadow: 0 6px 24px rgba(249, 69, 67, 0.4) !important;
}
body.white-mode .sj_btn_ai:hover .ai_btn_txt          { color: #fff !important; }

/* 베네핏 통계 — 액센트 컬러 */
body.white-mode .stat_box strong                      { color: var(--lm-accent) !important; }

/* 빅텍스트 그라데이션 — 옅은 회색 → 진한 회색 (너무 흰 배경에 검정만 떠있는 느낌 회피) */
body.white-mode .sj-bt-inner {
    background-image:
        linear-gradient(to right, #1a1a1a, #1a1a1a),
        linear-gradient(to right, #d0d0d4, #d0d0d4) !important;
}

/* SHOWCASE 카드 보더 강화 */
body.white-mode .sj_fan_card {
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.12) !important;
}

/* 히어로 sticky 영역 — 자식 영상이 보여야 하므로 배경은 transparent
   (위·아래 #sj_main 흰색이 깔려 있으므로 시각적으로 흰색 효과는 유지됨) */
body.white-mode .sj_sticky_wrapper { background-color: transparent !important; }
body.white-mode .sj_video_container { background-color: #000 !important; }

/* 문의폼 안내문 메일 주소 — 라이트모드에서 흰색 인라인 스타일 오버라이드 */
body.white-mode .ms06Inner b,
body.white-mode .c_right b,
body.white-mode .ms06Inner p b { color: #e74c3c !important; }