/* ───────── 라파엔투자자문 홈페이지 공통 스타일 ───────── */
:root {
  /* 알파노트 대시보드(docs/)와 동일한 팔레트 — iframe 콘텐츠와 이질감이 없도록 값을 맞춘다 */
  --navy:#0f1216; --navy-2:#141a24; --navy-3:#1a2230;
  --bg:#0f1216; --panel:#171b21; --panel-2:#1e242c;
  --ink:#e8eaed; --muted:#9aa2ad; --line:#252b33;
  --accent:#748ffc; --accent-2:#a78bfa; --up:#ff6b6b; --down:#5c9bff;
  --hero:#141a24; --glow:rgba(116,143,252,.16);
  --radius:16px; --header-h:64px; --max:1180px;
}
:root[data-theme="light"] {
  --bg:#f6f7f9; --panel:#ffffff; --panel-2:#eef0f4;
  --ink:#1a1d21; --muted:#6b7280; --line:#e6e8eb;
  --accent:#3b5bdb; --accent-2:#7c3aed; --up:#e03131; --down:#1c7ed6;
  --hero:#ffffff; --glow:rgba(59,91,219,.10);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink);
  font-family:"Pretendard Variable",Pretendard,-apple-system,"Segoe UI","Malgun Gothic","Apple SD Gothic Neo",sans-serif;
  line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; }
.wrap { max-width:var(--max); margin:0 auto; padding:0 24px; }

/* ── 헤더 ── */
.site-header { position:fixed; top:0; left:0; right:0; z-index:100; height:var(--header-h);
  background:color-mix(in srgb,var(--navy) 82%,transparent); backdrop-filter:blur(12px);
  border-bottom:1px solid color-mix(in srgb,#fff 8%,transparent); color:#fff; }
:root[data-theme="light"] .site-header { background:color-mix(in srgb,var(--panel) 90%,transparent);
  border-bottom-color:var(--line); color:var(--ink); }
.site-header .wrap { display:flex; align-items:center; height:100%; gap:24px; }
.brand { font-weight:800; font-size:19px; letter-spacing:-.01em; display:flex; align-items:center; gap:10px; }
.brand .mark { width:28px; height:28px; border-radius:8px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2)); display:inline-block; }
.brand small { font-weight:500; font-size:11px; color:var(--muted); letter-spacing:.08em; }
.nav { margin-left:auto; display:flex; align-items:center; gap:4px; padding:0; margin-top:0; margin-bottom:0; }
.nav > li { list-style:none; position:relative; }
.nav a.top { display:block; padding:10px 14px; font-size:14px; font-weight:600; opacity:.85; border-radius:8px; }
.nav a.top:hover, .nav li.active > a.top { opacity:1; background:color-mix(in srgb,#fff 8%,transparent); }
:root[data-theme="light"] .nav a.top:hover, :root[data-theme="light"] .nav li.active > a.top { background:var(--panel-2); }
.nav .sub { position:absolute; top:100%; left:0; min-width:210px; padding:8px; margin:6px 0 0;
  background:var(--panel); border:1px solid var(--line); border-radius:12px;
  box-shadow:0 12px 32px rgba(0,0,0,.35); display:none; list-style:none; }
.nav li:hover > .sub, .nav li:focus-within > .sub { display:block; }
.nav .sub a { display:block; padding:9px 12px; font-size:13.5px; border-radius:8px; color:var(--ink); }
.nav .sub a:hover { background:var(--panel-2); color:var(--accent); }
.nav .sub .sub-head { font-size:11px; color:var(--muted); padding:8px 12px 4px; letter-spacing:.06em; }
.hdr-tools { display:flex; align-items:center; gap:6px; }
.icon-btn { width:36px; height:36px; border-radius:10px; border:1px solid color-mix(in srgb,#fff 14%,transparent);
  background:transparent; color:inherit; cursor:pointer; font-size:15px; display:flex; align-items:center; justify-content:center; }
:root[data-theme="light"] .icon-btn { border-color:var(--line); }
.icon-btn:hover { border-color:var(--accent); }
#menu-btn { display:none; }
@media (max-width:900px) {
  #menu-btn { display:flex; }
  /* backdrop-filter 는 fixed 자손의 기준을 헤더로 바꿔 메뉴가 잘리므로 모바일에서는 끈다 */
  .site-header { backdrop-filter:none; background:var(--navy); }
  :root[data-theme="light"] .site-header { background:#fff; }
  .nav { display:none; position:fixed; top:var(--header-h); left:0; right:0; bottom:0; overflow:auto; z-index:100;
    flex-direction:column; align-items:stretch; gap:0; padding:12px 16px 40px;
    background:var(--bg); color:var(--ink); }
  .nav.open { display:flex; }
  .nav a.top { font-size:16px; padding:14px 10px; opacity:1; }
  .nav .sub { position:static; display:block; box-shadow:none; border:none; background:transparent; padding:0 0 8px 14px; margin:0; }
  .nav .sub a { font-size:14px; color:var(--muted); }
}

/* ── 히어로 ── */
.hero { position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center;
  text-align:center; color:#fff; overflow:hidden; background:
  radial-gradient(1200px 600px at 70% 30%, rgba(111,140,255,.18), transparent 60%),
  radial-gradient(900px 500px at 20% 80%, rgba(167,139,250,.14), transparent 60%), var(--navy); }
.hero canvas { position:absolute; inset:0; width:100%; height:100%; }
.hero .inner { position:relative; z-index:1; padding:120px 24px 80px; max-width:900px; }
.hero h1 { font-size:clamp(28px,5vw,52px); font-weight:800; letter-spacing:-.02em; line-height:1.25; margin:0 0 10px; }
.hero .en { font-size:clamp(22px,4vw,40px); font-weight:700; letter-spacing:.12em; color:#c7d2ff; margin:0 0 30px; }
.hero p.lead { color:#b8c1e6; font-size:clamp(14px,1.8vw,17px); max-width:640px; margin:0 auto 34px; }
.btn { display:inline-flex; align-items:center; gap:8px; padding:12px 26px; border-radius:999px; font-weight:700; font-size:14px;
  border:1px solid rgba(255,255,255,.35); color:#fff; transition:background .15s,border-color .15s; }
.btn:hover { background:rgba(255,255,255,.1); border-color:#fff; }
.btn.primary { background:linear-gradient(135deg,var(--accent),var(--accent-2)); border-color:transparent; }
.btn.primary:hover { filter:brightness(1.1); }
.btn-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.hero .scroll-hint { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); color:#8f9bd0; font-size:12px; letter-spacing:.2em; z-index:1; }

/* ── 페이지 히어로(서브페이지 상단) — 테마를 따라간다 ── */
.page-hero { padding:calc(var(--header-h) + 64px) 0 48px; color:var(--ink); border-bottom:1px solid var(--line); background:
  radial-gradient(900px 400px at 80% 20%, var(--glow), transparent 60%), var(--hero); }
.page-hero.compact { padding:calc(var(--header-h) + 28px) 0 24px; }
.page-hero .eyebrow { color:var(--accent); font-weight:700; letter-spacing:.14em; font-size:12px; }
.page-hero h1 { margin:8px 0 8px; font-size:clamp(26px,3.6vw,40px); letter-spacing:-.01em; }
.page-hero.compact h1 { font-size:clamp(20px,2.6vw,26px); margin:4px 0 4px; }
.page-hero p { margin:0; color:var(--muted); max-width:720px; font-size:15px; }

/* ── 섹션 공통 ── */
section.block { padding:84px 0; }
section.block.alt { background:var(--panel); }
:root[data-theme="light"] section.block.alt { background:#fff; }
.sec-head { text-align:center; margin-bottom:44px; }
.sec-head .eyebrow { color:var(--accent); font-weight:700; letter-spacing:.14em; font-size:12px; }
.sec-head h2 { margin:8px 0 10px; font-size:clamp(24px,3.2vw,34px); letter-spacing:-.01em; }
.sec-head p { margin:0 auto; color:var(--muted); max-width:640px; }
.grid { display:grid; gap:18px; }
.grid.c2 { grid-template-columns:repeat(2,1fr); }
.grid.c3 { grid-template-columns:repeat(3,1fr); }
.grid.c4 { grid-template-columns:repeat(4,1fr); }
.grid.c5 { grid-template-columns:repeat(5,1fr); }
@media (max-width:1000px) { .grid.c4,.grid.c5 { grid-template-columns:repeat(3,1fr);} }
@media (max-width:720px) { .grid.c2,.grid.c3,.grid.c4,.grid.c5 { grid-template-columns:1fr; } }
.card { background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:24px; transition:border-color .15s,transform .15s; }
.card:hover { border-color:var(--accent); }
a.card:hover { transform:translateY(-2px); }
.card .ic { font-size:26px; margin-bottom:12px; }
.card h3 { margin:0 0 8px; font-size:17px; }
.card p { margin:0; color:var(--muted); font-size:14px; }
.card .num { font-size:12px; font-weight:800; color:var(--accent); letter-spacing:.1em; margin-bottom:8px; }
.card .tag { display:inline-block; margin-top:12px; font-size:12px; color:var(--accent); font-weight:700; }
.philo { text-align:center; padding:30px 18px; }
.philo .ic { font-size:30px; }
.philo h3 { font-size:15.5px; }

/* ── 홈 라이브 카드(알파노트 요약) ── */
.live-head { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.live-head h2 { margin:0; font-size:24px; }
.live-head .date { color:var(--muted); font-size:14px; font-variant-numeric:tabular-nums; }
.live-head .more { margin-left:auto; color:var(--accent); font-weight:600; font-size:14px; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:1000px){ .cards{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .cards{ grid-template-columns:1fr;} }
.scard { display:block; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px 14px; color:var(--ink); transition:border-color .15s; }
.scard:hover { border-color:var(--accent); }
.sc-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.sc-icon { font-size:17px; }
.sc-title { font-weight:700; font-size:15px; flex:1 1 auto; }
.sc-date { color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.sc-body { min-height:40px; }
.clamp { margin:0; font-size:13.5px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.sc-lead { font-size:14px; font-weight:700; line-height:1.45; margin-bottom:10px; padding-bottom:9px; border-bottom:1px solid var(--line); }
.krow { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:5px 0; font-size:13.5px;
  border-bottom:1px dashed color-mix(in srgb,var(--line) 70%,transparent); }
.krow:last-child { border-bottom:none; }
.k-name { color:var(--muted); flex:0 0 auto; }
.k-val { font-weight:600; text-align:right; }
.k-val.up, .k-diff.up { color:var(--up); font-variant-numeric:tabular-nums; }
.k-val.down, .k-diff.down { color:var(--down); font-variant-numeric:tabular-nums; }
.k-diff { font-weight:600; font-size:12.5px; color:var(--muted); }
.xtopic { font-size:13px; line-height:1.5; padding:6px 0; display:flex; gap:7px; border-bottom:1px dashed color-mix(in srgb,var(--line) 70%,transparent); }
.xtopic:last-of-type { border-bottom:none; }
.xtopic::before { content:"·"; color:var(--accent); font-weight:700; }
.xmore, .sc-note { margin-top:6px; font-size:12px; color:var(--muted); }
.sc-more { margin-top:10px; color:var(--accent); font-size:13px; font-weight:600; }
.live-status { color:var(--muted); font-size:12.5px; margin-top:14px; }

/* ── 대시보드 뷰어(사이드바 + iframe) ── */
.viewer { display:grid; grid-template-columns:250px 1fr; gap:0; min-height:calc(100vh - var(--header-h)); }
.viewer .side { border-right:1px solid var(--line); padding:18px 12px; background:var(--panel); position:sticky; top:var(--header-h); height:calc(100vh - var(--header-h)); overflow:auto; }
.viewer .side .grp { font-size:11px; color:var(--muted); letter-spacing:.08em; font-weight:700; padding:14px 10px 6px; }
.viewer .side a { display:flex; align-items:center; gap:9px; padding:9px 10px; border-radius:10px; font-size:14px; color:var(--ink); }
.viewer .side a:hover { background:var(--panel-2); }
.viewer .side a.on { background:color-mix(in srgb,var(--accent) 16%,transparent); color:var(--accent); font-weight:700; }
.viewer .side a .i { width:20px; text-align:center; }
.viewer .main { display:flex; flex-direction:column; min-width:0; }
.viewer .bar { display:flex; align-items:center; gap:12px; padding:10px 18px; border-bottom:1px solid var(--line); background:var(--panel); font-size:14px; flex-wrap:wrap; }
.viewer .bar b { font-size:15px; }
.viewer .bar .desc { color:var(--muted); font-size:13px; }
.viewer .bar .ext { margin-left:auto; color:var(--accent); font-weight:600; font-size:13px; white-space:nowrap; }
.viewer iframe { flex:1 1 auto; width:100%; border:0; background:var(--bg); min-height:calc(100vh - var(--header-h) - 48px); }
@media (max-width:900px) {
  .viewer { grid-template-columns:1fr; }
  .viewer .side { position:static; height:auto; border-right:0; border-bottom:1px solid var(--line); display:flex; flex-wrap:wrap; gap:4px; padding:10px; }
  .viewer .side .grp { width:100%; padding:8px 6px 2px; }
  .viewer .side a { font-size:13px; padding:7px 10px; }
  .viewer iframe { min-height:80vh; }
}

/* ── 프로세스 타임라인 ── */
.steps { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; counter-reset:step; }
@media (max-width:1000px){ .steps{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .steps{ grid-template-columns:1fr;} }
.step { position:relative; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:26px 20px 22px; }
.step::before { counter-increment:step; content:"0" counter(step); position:absolute; top:-12px; left:18px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#fff; font-weight:800; font-size:12px; padding:3px 10px; border-radius:999px; }
.step h3 { margin:6px 0 8px; font-size:16px; }
.step p { margin:0; color:var(--muted); font-size:13.5px; }
.step ul { margin:10px 0 0; padding-left:16px; color:var(--muted); font-size:13px; }
.step ul a { color:var(--accent); }

/* ── 게시판(공지) ── */
.board { width:100%; border-collapse:collapse; font-size:14px; }
.board th, .board td { padding:14px 12px; border-bottom:1px solid var(--line); text-align:left; }
.board th { color:var(--muted); font-weight:600; font-size:12.5px; letter-spacing:.04em; }
.board td.no, .board td.date { color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.board td.title a:hover { color:var(--accent); }
.badge { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; margin-right:8px; vertical-align:middle;
  background:color-mix(in srgb,var(--accent) 18%,transparent); color:var(--accent); }
.badge.pin { background:color-mix(in srgb,var(--up) 18%,transparent); color:var(--up); }
.notice-body { background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:28px; margin-top:16px; }
.notice-body h2 { margin:0 0 6px; font-size:20px; }
.notice-body .meta { color:var(--muted); font-size:13px; margin-bottom:18px; }
.notice-body .back { display:inline-block; margin-top:18px; color:var(--accent); font-weight:600; font-size:13px; }

/* ── 문단·표 ── */
.prose { max-width:820px; margin:0 auto; font-size:15.5px; }
.prose h2 { font-size:22px; margin:36px 0 12px; }
.prose h3 { font-size:17px; margin:26px 0 8px; }
.prose p { color:var(--muted); margin:0 0 14px; }
.prose strong { color:var(--ink); }
.prose ul { color:var(--muted); }
.info-table { width:100%; border-collapse:collapse; font-size:14.5px; }
.info-table th { width:150px; text-align:left; color:var(--muted); font-weight:600; padding:12px; border-bottom:1px solid var(--line); vertical-align:top; }
.info-table td { padding:12px; border-bottom:1px solid var(--line); }
.timeline { list-style:none; padding:0; margin:0; border-left:2px solid var(--line); }
.timeline li { position:relative; padding:0 0 22px 26px; }
.timeline li::before { content:""; position:absolute; left:-7px; top:6px; width:12px; height:12px; border-radius:50%; background:var(--accent); }
.timeline .when { color:var(--accent); font-weight:700; font-size:13px; }
.timeline .what { font-size:15px; }
.cta { text-align:center; padding:70px 24px; background:radial-gradient(700px 300px at 50% 0%, var(--glow), transparent 70%), var(--panel); color:var(--ink); border-top:1px solid var(--line); }
.cta h2 { margin:0 0 10px; font-size:clamp(22px,3vw,30px); }
.cta p { color:var(--muted); margin:0 0 24px; }
.cta .btn:not(.primary) { border-color:var(--line); color:var(--ink); }

/* ── 푸터 ── */
.site-footer { background:var(--navy); color:#aab3d9; padding:44px 0 36px; border-top:1px solid color-mix(in srgb,#fff 8%,transparent); font-size:13px; }
:root[data-theme="light"] .site-footer { background:#1a1d21; }
.site-footer .cols { display:flex; gap:40px; flex-wrap:wrap; justify-content:space-between; }
.site-footer .brand { color:#fff; margin-bottom:12px; }
.site-footer p { margin:3px 0; }
.site-footer .links a { margin-right:16px; color:#dfe4ff; font-weight:600; }
.site-footer .copy { margin-top:22px; color:#7f8ab5; font-size:12px; }
.site-footer .disc { margin-top:14px; color:#7f8ab5; font-size:12px; max-width:760px; line-height:1.6; }
.mt-0{margin-top:0} .mt-24{margin-top:24px} .mt-40{margin-top:40px} .center{text-align:center}

/* ── 공지 본문(마크다운) ── */
.md p { margin:0 0 12px; line-height:1.75; }
.md h3, .md h4, .md h5 { margin:18px 0 8px; }
.md ul { margin:0 0 12px; padding-left:20px; }
.md a { color:var(--accent); text-decoration:underline; }

/* ── 관리자 페이지 ── */
.admin { max-width:900px; margin:0 auto; }
.admin .box { background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:22px; margin-bottom:18px; }
.admin .box h2 { margin:0 0 12px; font-size:18px; }
.admin label { display:block; font-size:12.5px; color:var(--muted); margin:12px 0 5px; font-weight:600; }
.admin input[type=text], .admin input[type=date], .admin input[type=password], .admin select, .admin textarea {
  width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; font-size:14px; }
.admin textarea { min-height:220px; resize:vertical; line-height:1.6; }
.admin .row { display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:12px; align-items:end; }
@media (max-width:720px){ .admin .row { grid-template-columns:1fr 1fr; } }
.admin .chk { display:flex; align-items:center; gap:8px; font-size:14px; padding-bottom:10px; }
.admin .actions { display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; align-items:center; }
.admin .btn { border-color:var(--line); color:var(--ink); padding:10px 20px; cursor:pointer; font:inherit; font-weight:700; background:transparent; }
.admin .btn.primary { border-color:transparent; color:#fff; }
.admin .btn.danger { border-color:color-mix(in srgb,var(--up) 50%,transparent); color:var(--up); }
.admin .btn[disabled] { opacity:.5; cursor:default; }
.admin .msg { font-size:13.5px; color:var(--muted); }
.admin .msg.ok { color:#2fb344; } .admin .msg.err { color:var(--up); }
.admin .list { width:100%; border-collapse:collapse; font-size:14px; }
.admin .list td { padding:10px 8px; border-bottom:1px solid var(--line); vertical-align:middle; }
.admin .list td.t { width:100%; }
.admin .list td.d { white-space:nowrap; color:var(--muted); font-variant-numeric:tabular-nums; }
.admin .list button { font:inherit; font-size:12.5px; padding:5px 10px; border-radius:8px; border:1px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; margin-left:4px; white-space:nowrap; }
.admin .list button:hover { border-color:var(--accent); color:var(--accent); }
.admin .preview { border:1px dashed var(--line); border-radius:10px; padding:14px 16px; min-height:60px; margin-top:6px; }
.admin details { margin-top:8px; font-size:13px; color:var(--muted); }
.admin details ol { padding-left:18px; }
.admin code { background:var(--panel-2); padding:1px 5px; border-radius:5px; font-size:12.5px; }

/* ── 교육 ── */
.mt-64 { margin-top:64px; }
.btn-row.left { justify-content:flex-start; }
.btn.ghost { border-color:var(--line); color:var(--ink); }
.btn.ghost:hover { border-color:var(--accent); background:transparent; color:var(--accent); }
.btn.wide { width:100%; justify-content:center; margin-top:18px; cursor:pointer; font:inherit; font-weight:700; font-size:15px; padding:14px; }
.badge.mute { background:var(--panel-2); color:var(--muted); }

.edu-hero { padding-bottom:64px; }
.edu-hero h1 { font-size:clamp(28px,4.4vw,48px); line-height:1.3; margin:12px 0 16px; }
.edu-hero h1 em { font-style:normal; background:linear-gradient(135deg,var(--accent),var(--accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.edu-hero p { font-size:16.5px; max-width:680px; margin-bottom:28px; }
.hero-facts { display:flex; gap:36px; flex-wrap:wrap; margin-top:40px; padding-top:26px; border-top:1px solid var(--line); }
.hero-facts b { display:block; font-size:32px; line-height:1; color:var(--accent); font-variant-numeric:tabular-nums; }
.hero-facts span { font-size:13px; color:var(--muted); }

.feature { display:grid; grid-template-columns:1.5fr 1fr; gap:0; background:var(--panel); border:1px solid var(--line); border-radius:22px; overflow:hidden; color:var(--ink); transition:border-color .15s,transform .15s; }
.feature:hover { border-color:var(--accent); transform:translateY(-2px); }
.feature-body { padding:40px; }
.feature-body h2 { margin:14px 0 12px; font-size:clamp(24px,3vw,32px); }
.feature-body p { color:var(--muted); margin:0 0 18px; font-size:15.5px; }
.feature-points { margin:0 0 26px; padding-left:18px; color:var(--ink); font-size:14.5px; line-height:1.9; }
.feature-side { background:radial-gradient(500px 300px at 100% 0%, var(--glow), transparent 70%), var(--panel-2); padding:34px 30px; display:flex; flex-direction:column; justify-content:center; gap:4px; border-left:1px solid var(--line); }
.fs-row { display:flex; align-items:center; gap:14px; padding:9px 0; font-size:14.5px; font-weight:600; border-bottom:1px dashed var(--line); }
.fs-row:last-child { border-bottom:none; }
.fs-row span { font-size:12px; font-weight:800; color:var(--accent); letter-spacing:.06em; width:22px; }
@media (max-width:820px) { .feature { grid-template-columns:1fr; } .feature-side { border-left:0; border-top:1px solid var(--line); } .feature-body { padding:28px 24px; } }

.card.course { position:relative; display:block; color:var(--ink); }
.card.course .badge { position:absolute; top:22px; right:20px; margin:0; }
.card.course.soon { opacity:.62; }
.card.course.soon:hover { border-color:var(--line); }
.card.who h3 { font-size:16px; }

.compare { margin-top:56px; background:var(--panel); border:1px solid var(--line); border-radius:22px; padding:36px; }
.compare-head { text-align:center; margin-bottom:26px; }
.compare-head h3 { margin:0 0 8px; font-size:clamp(20px,2.6vw,26px); }
.compare-head p { margin:0 auto; color:var(--muted); max-width:620px; }
.compare-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:760px) { .compare-grid { grid-template-columns:1fr; } .compare { padding:24px 18px; } }
.compare-col { border:1px solid var(--line); border-radius:16px; padding:22px 22px 12px; background:var(--bg); }
.compare-col.after { border-color:color-mix(in srgb,var(--accent) 55%,transparent); background:color-mix(in srgb,var(--accent) 7%,var(--bg)); }
.cc-title { font-weight:800; font-size:15px; margin-bottom:10px; color:var(--muted); letter-spacing:.02em; }
.compare-col.after .cc-title { color:var(--accent); }
.compare-col ul { list-style:none; margin:0; padding:0; }
.compare-col li { display:grid; grid-template-columns:72px 1fr; gap:10px; padding:11px 0; font-size:14.5px; border-bottom:1px dashed var(--line); line-height:1.55; }
.compare-col li:last-child { border-bottom:none; }
.compare-col li b { font-size:12.5px; color:var(--muted); font-weight:700; padding-top:2px; }
.compare-col.before li { color:var(--muted); }
.compare-foot { margin-top:22px; padding:18px 20px; border-radius:14px; background:var(--panel-2); font-size:15px; line-height:1.75; color:var(--muted); }
.compare-foot strong { color:var(--ink); }

.curri { list-style:none; margin:0 auto; padding:0; max-width:920px; position:relative; }
.curri::before { content:""; position:absolute; left:27px; top:12px; bottom:12px; width:2px; background:var(--line); }
.curri li { position:relative; display:grid; grid-template-columns:56px 1fr; gap:20px; padding-bottom:18px; }
.cu-no { width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px; color:#fff; background:linear-gradient(135deg,var(--accent),var(--accent-2)); position:relative; z-index:1; box-shadow:0 0 0 6px var(--panel); }
:root[data-theme="light"] .cu-no { box-shadow:0 0 0 6px #fff; }
.cu-body { background:var(--bg); border:1px solid var(--line); border-radius:16px; padding:22px 24px; }
.cu-body h3 { margin:0 0 8px; font-size:17.5px; }
.cu-body p { margin:0 0 14px; color:var(--muted); font-size:14.5px; }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chips span { font-size:12.5px; padding:4px 10px; border-radius:999px; background:var(--panel-2); color:var(--ink); border:1px solid var(--line); }
.cu-out { margin-top:14px; padding:11px 14px; border-radius:10px; font-size:13.5px; line-height:1.6; color:var(--ink); background:color-mix(in srgb,var(--accent) 10%,transparent); border-left:3px solid var(--accent); }
@media (max-width:640px) { .curri::before { left:19px; } .curri li { grid-template-columns:40px 1fr; gap:12px; } .cu-no { width:40px; height:40px; font-size:13px; box-shadow:0 0 0 4px var(--panel); } .cu-body { padding:18px 16px; } }

.apply-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:24px; align-items:start; }
@media (max-width:900px) { .apply-grid { grid-template-columns:1fr; } }
.apply-info, .apply-form { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:30px; }
.apply-info h3 { margin:0 0 14px; font-size:18px; }
.apply-info .info-table th { width:88px; padding:11px 8px 11px 0; font-size:13.5px; }
.apply-info .info-table td { padding:11px 0; font-size:14.5px; }
.fine { margin:18px 0 0; font-size:12.5px; color:var(--muted); line-height:1.7; }
.apply-form label { display:block; font-size:12.5px; color:var(--muted); margin:14px 0 6px; font-weight:600; }
.apply-form .f-row > div > label:first-child, .apply-form > label:first-child { margin-top:0; }
.apply-form input[type=text], .apply-form input[type=tel], .apply-form input[type=email], .apply-form select, .apply-form textarea {
  width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; font-size:14.5px; }
.apply-form input:focus, .apply-form select:focus, .apply-form textarea:focus { outline:2px solid color-mix(in srgb,var(--accent) 60%,transparent); outline-offset:1px; border-color:var(--accent); }
.apply-form textarea { resize:vertical; line-height:1.6; }
.f-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.f-row:first-child { margin-top:0; }
.f-row label { margin-top:0; }
@media (max-width:520px) { .f-row { grid-template-columns:1fr; } }
.apply-form .agree { display:flex; gap:9px; align-items:flex-start; font-size:13px; font-weight:400; line-height:1.6; margin-top:18px; color:var(--muted); }
.apply-form .agree input { margin-top:3px; flex:0 0 auto; }
.apply-form .agree a { color:var(--accent); text-decoration:underline; }
.form-msg { margin-top:12px; font-size:13.5px; line-height:1.6; min-height:20px; color:var(--muted); }
.form-msg.ok { color:#2fb344; } .form-msg.err { color:var(--up); }

.faq details { background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:0 20px; margin-bottom:10px; }
.faq summary { cursor:pointer; padding:17px 0; font-weight:700; font-size:15.5px; list-style:none; display:flex; justify-content:space-between; gap:12px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; color:var(--accent); font-weight:800; font-size:18px; line-height:1; }
.faq details[open] summary::after { content:"–"; }
.faq details p { margin:0 0 18px; color:var(--muted); font-size:14.5px; line-height:1.75; }

/* ── 자문 상품 · 홈 개편 ── */
.hero-badge { display:inline-block; padding:8px 18px; border-radius:999px; font-size:13.5px; font-weight:700; letter-spacing:.01em;
  color:#dfe5ff; background:rgba(116,143,252,.16); border:1px solid rgba(140,160,255,.45); margin-bottom:26px; }
.prod-hero h1 { font-size:clamp(26px,4vw,44px); }
.prod-hero h1 span { display:block; font-size:.62em; color:var(--muted); font-weight:700; margin-bottom:6px; }

.statband-wrap { margin-top:-46px; position:relative; z-index:2; }
.statband-wrap.home { margin-top:-64px; }
.statband { display:grid; grid-template-columns:repeat(4,1fr); background:var(--panel); border:1px solid var(--line); border-radius:22px; overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.28); }
.stat { padding:30px 20px; text-align:center; border-right:1px solid var(--line); }
.stat:last-child { border-right:0; }
.stat b { display:block; font-size:clamp(28px,3.6vw,44px); line-height:1.1; font-weight:800; letter-spacing:-.02em;
  background:linear-gradient(135deg,var(--accent),var(--accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.stat span { display:block; margin-top:10px; font-weight:700; font-size:15px; }
.stat small { display:block; margin-top:3px; color:var(--muted); font-size:12.5px; }
@media (max-width:820px) { .statband { grid-template-columns:repeat(2,1fr); } .stat:nth-child(2) { border-right:0; } .stat:nth-child(-n+2) { border-bottom:1px solid var(--line); } .stat { padding:22px 12px; } }

.regime { max-width:900px; margin:0 auto; }
.rg-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; align-items:end; }
.rg-col { text-align:center; }
.rg-ic { font-size:clamp(28px,4.4vw,46px); line-height:1; }
.rg-name { margin:8px 0 12px; font-weight:700; font-size:clamp(12px,1.5vw,15px); }
.rg-bar { height:220px; border-radius:14px; overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--line); background:var(--panel-2); }
.rg-cash { background:var(--panel-2); }
.rg-stock { background:linear-gradient(180deg,var(--accent),var(--accent-2)); }
.rg-val { margin-top:10px; font-size:clamp(11px,1.4vw,13.5px); color:var(--muted); }
.rg-val b { display:block; color:var(--ink); font-size:clamp(13px,1.7vw,16px); }
.rg-legend { display:flex; justify-content:center; gap:22px; margin-top:22px; font-size:13px; color:var(--muted); }
.rg-legend i { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.lg-stock { background:linear-gradient(135deg,var(--accent),var(--accent-2)); } .lg-cash { background:var(--panel-2); border:1px solid var(--line); }
@media (max-width:560px) { .rg-grid { gap:6px; } .rg-bar { height:160px; border-radius:10px; } }

.flow4 { display:flex; align-items:stretch; justify-content:center; gap:10px; }
.f4 { flex:1 1 0; position:relative; background:var(--bg); border:1px solid var(--line); border-radius:20px; padding:30px 16px 24px; text-align:center; }
.block:not(.alt) .f4 { background:var(--panel); }
.f4-no { position:absolute; top:14px; left:16px; font-size:12px; font-weight:800; color:var(--accent); }
.f4-ic { font-size:44px; line-height:1; margin-bottom:14px; }
.f4-q { font-size:13.5px; color:var(--muted); font-weight:600; }
.f4-a { font-size:clamp(16px,1.9vw,20px); font-weight:800; margin:6px 0 8px; }
.f4-d { display:inline-block; font-size:12px; padding:3px 10px; border-radius:999px; background:var(--panel-2); color:var(--muted); }
.f4-arrow { display:flex; align-items:center; color:var(--accent); font-size:22px; font-weight:800; }
@media (max-width:860px) { .flow4 { display:grid; grid-template-columns:1fr 1fr; } .f4-arrow { display:none; } }

.vs { display:grid; grid-template-columns:1fr auto 1fr; gap:18px; align-items:stretch; max-width:940px; margin:0 auto; }
.vs-col { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:26px; }
.vs-col.on { border-color:color-mix(in srgb,var(--accent) 60%,transparent); background:color-mix(in srgb,var(--accent) 6%,var(--panel)); }
.vs-tag { font-weight:800; font-size:15px; color:var(--muted); margin-bottom:16px; }
.vs-col.on .vs-tag { color:var(--accent); }
.vs-mid { display:flex; align-items:center; font-weight:800; color:var(--muted); font-size:15px; }
.dots { display:grid; grid-template-columns:repeat(15,1fr); gap:5px; margin-bottom:20px; }
.dots i { aspect-ratio:1; border-radius:50%; background:var(--muted); opacity:.55; }
.dots i.dim { opacity:.13; }
.dots i.hit { opacity:1; background:linear-gradient(135deg,var(--accent),var(--accent-2)); transform:scale(1.55); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent); }
.vs-list { margin:0; padding-left:18px; font-size:15px; line-height:1.9; color:var(--muted); }
.vs-col.on .vs-list { color:var(--ink); }
@media (max-width:760px) { .vs { grid-template-columns:1fr; } .vs-mid { justify-content:center; } }

.card.shield { text-align:center; padding:34px 22px; }
.sh-ic { font-size:46px; line-height:1; margin-bottom:16px; }
.card.shield p { font-size:14.5px; line-height:1.7; }
.card.shield p b { color:var(--ink); }

.duo { display:grid; grid-template-columns:1fr auto 1fr; gap:18px; max-width:860px; margin:0 auto; align-items:center; }
.duo-col { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:34px 24px; text-align:center; }
.duo-ic { font-size:48px; line-height:1; margin-bottom:14px; }
.duo-col h3 { margin:0 0 8px; font-size:18px; } .duo-col p { margin:0; color:var(--muted); font-size:14.5px; }
.duo-x { font-size:34px; font-weight:800; color:var(--accent); }
@media (max-width:700px) { .duo { grid-template-columns:1fr; } .duo-x { text-align:center; } }

.steps4 { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:980px; margin:0 auto; }
.s4 { background:var(--bg); border:1px solid var(--line); border-radius:18px; padding:26px 14px; text-align:center; position:relative; }
.s4-ic { font-size:36px; line-height:1; margin-bottom:12px; }
.s4 b { display:block; font-size:15.5px; } .s4 span { display:block; margin-top:4px; font-size:12.5px; color:var(--muted); }
.s4:not(:last-child)::after { content:"→"; position:absolute; right:-13px; top:50%; transform:translateY(-50%); color:var(--accent); font-weight:800; z-index:1; }
@media (max-width:760px) { .steps4 { grid-template-columns:1fr 1fr; } .s4::after { display:none; } }

.banner { display:flex; align-items:center; gap:22px; background:var(--bg); border:1px solid var(--line); border-radius:22px; padding:28px 32px; color:var(--ink); transition:border-color .15s; }
.banner:hover { border-color:var(--accent); }
.banner-ic { font-size:44px; line-height:1; }
.banner-tx { flex:1 1 auto; } .banner-tx b { display:block; font-size:20px; } .banner-tx span { color:var(--muted); font-size:14.5px; }
@media (max-width:640px) { .banner { flex-direction:column; text-align:center; padding:26px 20px; } }

.disc-band { background:var(--bg); border-top:1px solid var(--line); padding:26px 0; }
.disc-band p { margin:0 auto; max-width:900px; font-size:12px; line-height:1.75; color:var(--muted); }

.sc-desc { font-size:12.5px; color:var(--muted); margin:-4px 0 10px; line-height:1.5; }
.clamp { -webkit-line-clamp:3; }
.viewer .about { padding:10px 18px; font-size:13.5px; line-height:1.6; color:var(--muted); background:color-mix(in srgb,var(--accent) 7%,var(--panel)); border-bottom:1px solid var(--line); }
.prod-hero { padding-bottom:96px; }

/* 드롭다운 묶음 제목 */
.nav .sub li.sub-head { font-size:11px; font-weight:700; color:var(--muted); padding:10px 12px 4px; letter-spacing:.06em; }
.nav .sub li.sub-head:first-child { padding-top:4px; }
.nav .sub { max-height:calc(100vh - 90px); overflow:auto; }

.hero p.lead-strong { margin:0 auto 12px; font-size:clamp(17px,2.4vw,24px); font-weight:700; color:#fff; letter-spacing:-.01em; }
.hero p.lead { font-size:clamp(14px,1.7vw,17px); max-width:660px; }

/* ── 공지 첨부파일 ── */
.attach { margin-top:22px; border-top:1px solid var(--line); padding-top:16px; }
.attach-head { font-size:12.5px; font-weight:700; color:var(--muted); margin-bottom:8px; letter-spacing:.03em; }
.attach ul { list-style:none; margin:0; padding:0; }
.attach li { display:flex; align-items:center; gap:8px; background:var(--bg); border:1px solid var(--line); border-radius:12px; padding:10px 14px; margin-bottom:8px; }
.attach li > a:first-child { flex:1 1 auto; display:flex; align-items:center; gap:10px; min-width:0; color:var(--accent); font-weight:600; font-size:14px; }
.attach li .fn { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.attach li .fs { color:var(--muted); font-size:12px; font-weight:500; flex:0 0 auto; }
.attach li .dl { flex:0 0 auto; color:var(--muted); font-size:16px; padding:2px 6px; border-radius:8px; }
.attach li .dl:hover { color:var(--accent); background:var(--panel-2); }
.board .clip { font-size:12px; color:var(--muted); margin-left:4px; }
.attach-box { border:1px dashed var(--line); border-radius:12px; padding:12px 14px; }
.attach-box input[type=file] { font-size:13px; color:var(--muted); }
.attach-list { list-style:none; margin:10px 0 0; padding:0; }
.attach-list li { display:flex; align-items:center; gap:10px; padding:7px 10px; border:1px solid var(--line); border-radius:10px; margin-bottom:6px; font-size:13.5px; background:var(--bg); }
.attach-list li.empty { color:var(--muted); border-style:dashed; }
.attach-list .fn { flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.attach-list .fs { color:var(--muted); font-size:12px; }
.attach-list button { font:inherit; font-size:12px; border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:8px; padding:3px 8px; cursor:pointer; }
.attach-list button:hover { color:var(--up); border-color:var(--up); }

/* 상단 띠 없이 뷰어가 첫 요소 */
.viewer { margin-top:var(--header-h); }
.viewer iframe { min-height:calc(100vh - var(--header-h) - 48px); }