/* =====================================================================
   VELA GOLD — Refined Editorial 리디자인 (staging)
   vela-theme.css 다음 로드 → 전역 오버라이드. 방향: 오프화이트 + 세리프 디스플레이 + 절제된 골드 + 넉넉한 여백.
   2026-06-29  (impeccable/refined 가이드 적용)
   ===================================================================== */

:root{
  /* ── 색 (committed: 오프화이트 캔버스 + 골드 1포인트) ── */
  --bg:#FAF9F6;          /* near-white, 크림 아님(저채도) */
  --surface:#FFFFFF;
  --ink:#1A1A1A;         /* 헤드라인/강조 */
  --ink-soft:#52514C;    /* 본문 보조 (오프화이트 위 ≥7:1) */
  --muted:#7C7A73;       /* 메타 (large/meta 전용) */
  --line:#E7E4DC;        /* 헤어라인 */
  --line-strong:#D9D5CA;
  --gold:#9A7B3F;        /* 프라이머리 액센트(딥 골드) */
  --gold-deep:#7C6230;
  --gold-soft:#B79A5E;
  --gold-tint:#F4EFE4;   /* 골드 틴트 surface */
  --danger:#B23B36;
  --up:#C0392B; --down:#2F6FD6;
  /* ── 타이포 ── */
  --serif:'Space Grotesk','Pretendard','Apple SD Gothic Neo',sans-serif; /* 디스플레이=그로테스크(금거래 톤) */
  --display:'Space Grotesk','Pretendard',sans-serif;
  --num:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --sans:'Pretendard','Apple SD Gothic Neo','Noto Sans KR',-apple-system,sans-serif;
  /* 다크 보드(전광판) */
  --board:#15130D; --board-2:#1F1B12; --board-ink:#F4EEDF; --board-mut:#A99B79;
  --board-line:rgba(201,162,74,.18);
  /* ── 간격 ── */
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-6:24px;--sp-8:32px;--sp-12:48px;--sp-16:64px;--sp-24:96px;
  --r-sm:4px;--r-md:8px;--r-lg:14px;
  --maxw:1180px;
  --ease:cubic-bezier(.22,1,.36,1);
}

/* ───────── 베이스 ───────── */
html{ -webkit-text-size-adjust:100%; }
body{
  background:var(--bg)!important;
  color:var(--ink-soft);
  font-family:var(--sans)!important;
  letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
body, #wrap, #container{ background:var(--bg)!important; }
a{ color:inherit; transition:color .18s var(--ease); }
img{ image-rendering:auto; }
::selection{ background:var(--gold); color:#fff; }

h1,h2,h3,.vg-serif{ font-family:var(--serif); color:var(--ink); letter-spacing:-.02em; text-wrap:balance; }

/* 컨테이너 폭 통일(넉넉한 여백) */
.in_Layer{ max-width:var(--maxw)!important; margin:0 auto!important; padding-left:24px; padding-right:24px; box-sizing:border-box; }

/* ───────── 헤더 ───────── */
#header{ background:var(--bg)!important; border-bottom:1px solid var(--line); box-shadow:none!important; }
#header .bg{ display:none!important; }

/* 상단 유틸바 */
#header .top{ background:#fff!important; border-bottom:1px solid var(--line); }
#header .top .in_Layer{ display:flex; align-items:center; justify-content:flex-end; gap:0; min-height:38px; }
#header .top .bookmark{ display:none!important; }
.utill_menu{ display:flex!important; align-items:center; gap:2px; margin:0!important; }
.utill_menu li{ float:none!important; list-style:none; }
.utill_menu li a{
  display:inline-block; padding:6px 12px; font-size:11.5px; font-weight:600;
  letter-spacing:.08em; color:var(--muted)!important; text-transform:uppercase;
}
.utill_menu li a:hover{ color:var(--gold)!important; }
.utill_menu li.mypage-li a{ color:var(--ink)!important; font-weight:700; }

/* 중앙 로고 영역 */
#header .mid{ background:transparent!important; }
#header .mid .in_Layer{ display:flex!important; align-items:center; justify-content:space-between; min-height:96px; position:relative; }
#header .mid .call{ flex:0 0 auto; }
#header .mid .call p{ font-size:12px; color:var(--muted); letter-spacing:.02em; margin:0; }
#header .mid .call span{ color:var(--ink); font-weight:700; }
#header .mid .call img{ opacity:.5; }

/* 세리프 워드마크 (bg이미지 로고 대체) */
.vg-home-logo{
  position:static!important; transform:none!important; width:auto!important; height:auto!important;
  background:none!important; left:auto!important; top:auto!important;
  font-family:var(--serif); font-weight:700; font-size:30px; letter-spacing:.14em;
  color:var(--ink)!important; text-indent:0!important;
  position:absolute!important; left:50%!important; top:50%!important; transform:translate(-50%,-50%)!important;
  white-space:nowrap;
}
.vg-home-logo::after{ content:'VELA GOLD'; }

/* 검색 */
#header .right_search{ flex:0 0 auto; }
#header .right_search .cont{ display:flex; align-items:center; gap:8px; }
#header .right_search .search_box{ border:1px solid var(--line-strong); border-radius:999px; background:#fff; padding:0 6px 0 16px; display:flex; align-items:center; transition:border-color .18s var(--ease); }
#header .right_search .search_box:focus-within{ border-color:var(--gold); }
#header .right_search input.input_box{ border:0!important; background:transparent!important; height:38px; font-size:13px; width:160px; font-family:var(--sans); color:var(--ink); }
#header .right_search button.search{ background:none!important; border:0; cursor:pointer; opacity:.6; }
#header .right_search button.search:hover{ opacity:1; }

/* 카테고리 내비 */
#header .bot{ background:transparent!important; border-top:1px solid var(--line); }
#header .bot .category_area{ display:flex; justify-content:center; }
.category{ display:flex!important; justify-content:center; gap:6px; flex-wrap:wrap; }
.category > li{ float:none!important; position:relative; }
.category > li > a{
  display:block; padding:15px 18px; font-size:14px; font-weight:600; letter-spacing:.03em;
  color:var(--ink)!important; position:relative;
}
.category > li > a::after{ content:''; position:absolute; left:18px; right:18px; bottom:10px; height:1.5px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .25s var(--ease); }
.category > li:hover > a::after{ transform:scaleX(1); }
.category .depth{ background:#fff; border:1px solid var(--line); box-shadow:0 14px 36px rgba(40,32,12,.10); border-radius:var(--r-md); padding:6px; min-width:160px; }
.category .depth li a{ display:block; padding:9px 14px; font-size:13px; color:var(--ink-soft)!important; border-radius:var(--r-sm); }
.category .depth li a:hover{ background:var(--gold-tint); color:var(--gold-deep)!important; }

/* ───────── 금 시세판 (홈) — 오프화이트로 정제 ───────── */
.gm-rate-wrap{ background:var(--bg)!important; border-bottom:1px solid var(--line)!important; padding:var(--sp-12) 0!important; }
.gm-rate{ font-family:var(--sans)!important; }
.gm-table{ background:#fff!important; border:1px solid var(--line)!important; border-radius:var(--r-lg)!important; box-shadow:0 1px 0 var(--line)!important; }
.gm-thead{ border-bottom:1px solid var(--line)!important; box-shadow:none!important; }
.gm-ttl{ font-family:var(--serif); font-weight:700; color:var(--ink)!important; }
.gm-badge{ background:#F0F4F1!important; color:#3C7D55!important; border-radius:999px!important; letter-spacing:.12em!important; }
.gm-colhd{ background:#FBFAF7!important; }
.gm-trow .c1 b{ color:var(--gold-deep)!important; }
.gm-px{ font-family:var(--sans)!important; color:var(--ink)!important; }
.gm-vatx{ background:var(--gold-tint)!important; color:var(--gold-deep)!important; }
.gm-buy{ background:var(--ink)!important; color:#fff!important; box-shadow:none!important; border-radius:var(--r-md)!important; letter-spacing:.06em!important; }
.gm-buy:hover{ background:var(--gold-deep)!important; filter:none!important; }
.gm-sell{ background:#fff!important; color:var(--ink)!important; border:1px solid var(--line-strong)!important; border-radius:var(--r-md)!important; }
.gm-sell:hover{ background:var(--gold-tint)!important; border-color:var(--gold)!important; }
.gm-chart-btn{ border:1px solid var(--line-strong)!important; color:var(--ink-soft)!important; border-radius:999px!important; }
.gm-chart-btn:hover{ background:var(--ink)!important; color:#fff!important; border-color:var(--ink)!important; }
.gm-wallet{ color:var(--gold-deep)!important; }

/* ───────── 섹션 제목 (에디토리얼: 좌측정렬 세리프 + 골드 룰) ───────── */
#contents .sec01{ padding:var(--sp-16) 0; }
/* vela-theme의 #contents p.sec_tit (ID 우선순위) 를 이기도록 동일 specificity로 오버라이드 */
#contents p.sec_tit{
  font-family:var(--serif)!important; font-size:clamp(26px,3.4vw,38px)!important; font-weight:700!important;
  color:var(--ink)!important; text-align:left!important; letter-spacing:-.02em!important;
  margin:0 0 var(--sp-6)!important; padding:0 0 var(--sp-3)!important; position:relative; line-height:1.1;
}
#contents p.sec_tit::before{ display:none!important; }   /* 기존 가운데 골드룰 제거 */
#contents p.sec_tit::after{ content:''!important; position:absolute; left:0; right:auto; bottom:0; width:48px; height:2px; margin:0!important; background:var(--gold); }

/* ───────── 상품 카드 (실제 구조: li>a>.img_wrap+.txt_wrap) ───────── */
.product_list{ display:grid!important; grid-template-columns:repeat(4,1fr)!important; gap:36px 24px!important; list-style:none!important; margin:0!important; padding:0!important; }
.product_list li{ float:none!important; width:auto!important; margin:0!important; padding:0!important; background:transparent!important; border:0!important; box-shadow:none!important; list-style:none!important; }
.product_list li a{ display:block!important; color:inherit; text-decoration:none; }
.product_list .img_wrap{ position:relative; aspect-ratio:1/1; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:#fff; margin-bottom:14px; transition:border-color .25s var(--ease),box-shadow .25s var(--ease); }
.product_list li:hover .img_wrap{ border-color:var(--gold-soft); box-shadow:0 12px 30px rgba(120,90,30,.10); }
.product_list .img_wrap img{ width:100%!important; height:100%!important; object-fit:cover; display:block; transition:transform .55s var(--ease); }
.product_list li:hover .img_wrap img{ transform:scale(1.045); }
.product_list .ico_wrap{ position:absolute; top:10px; left:10px; z-index:2; display:flex; gap:5px; }
.product_list .ico_wrap span{ background:var(--ink); color:#fff; font-size:10px; font-weight:700; letter-spacing:.08em; padding:3px 8px; border-radius:3px; line-height:1.5; }
.product_list .txt_wrap{ padding:0 2px; }
.product_list .txt_wrap .name{ font-size:14px!important; color:var(--ink)!important; font-weight:600; line-height:1.4; letter-spacing:-.01em; margin:0 0 5px!important; }
.product_list .txt_wrap .weight{ font-size:12.5px!important; color:var(--muted)!important; margin:0 0 2px!important; font-variant-numeric:tabular-nums; }
.product_list .txt_wrap .wages{ font-size:13px!important; color:var(--gold-deep)!important; font-weight:700; margin:0!important; font-variant-numeric:tabular-nums; }

/* 더보기 버튼 */
.plus_btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  margin:var(--sp-8) auto 0!important; padding:13px 30px!important; width:auto!important;
  background:#fff!important; color:var(--ink)!important; border:1px solid var(--line-strong)!important;
  border-radius:999px!important; font-size:13px!important; font-weight:600; letter-spacing:.04em;
  font-family:var(--sans)!important; transition:all .2s var(--ease); text-align:center;
}
.plus_btn:hover{ background:var(--ink)!important; color:#fff!important; border-color:var(--ink)!important; }
.sec01 .in_Layer{ text-align:center; }
.sec01 .in_Layer .sec_tit{ text-align:left!important; }

/* ───────── 하단 배너 정제 (핑크 스톡배너 톤다운) ───────── */
.sec02{ max-width:var(--maxw); margin:var(--sp-8) auto; padding:0 24px; border-radius:var(--r-lg); overflow:hidden; }
.sec02 img{ border-radius:var(--r-lg); }
.sec03{ background:var(--gold-tint); padding:var(--sp-16) 0; margin-top:var(--sp-16); }
.sec03 .in_Layer{ max-width:var(--maxw); }
.sec03 .sec_tit{ display:none; }
.sec03 .banner_wrap{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-6); }
.sec03 .banner{ border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line); background:#fff; }
.sec03 .banner img{ width:100%; display:block; filter:saturate(.85); }

/* ───────── 영상 가이드 히어로 ───────── */
#visual{ max-width:var(--maxw); margin:var(--sp-12) auto 0; padding:0 24px; }
.gk-hero{ border-radius:var(--r-lg); overflow:hidden; }

/* ───────── 모션 (절제된 reveal) ───────── */
@media (prefers-reduced-motion:no-preference){
  .sec01,.gm-rate-wrap,.sec03{ }
}

/* ───────── 반응형 ───────── */
@media (max-width:900px){
  #header .mid .in_Layer{ min-height:70px; }
  .vg-home-logo{ font-size:24px; letter-spacing:.1em; }
  #header .mid .call{ display:none; }
  #header .right_search input.input_box{ width:120px; }
  .sec_tit{ font-size:clamp(22px,6vw,28px)!important; }
  #contents .sec01{ padding:var(--sp-12) 0; }
  .sec03 .banner_wrap{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .in_Layer{ padding-left:16px; padding-right:16px; }
  .product_list{ grid-template-columns:repeat(2,1fr); gap:var(--sp-6) var(--sp-4)!important; }
  .utill_menu li a{ padding:6px 8px; font-size:10.5px; letter-spacing:.04em; }
}

/* ============================================================
   재구성 구조 (Hero / Buttons / Consult) — 2026-06-29 v2
   ============================================================ */

/* ── 공용 버튼 ── */
.vg-btn{ display:inline-flex; align-items:center; gap:8px; padding:15px 30px; border-radius:999px;
  font-family:var(--sans); font-size:14px; font-weight:600; letter-spacing:.02em; text-decoration:none;
  cursor:pointer; transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease); white-space:nowrap; }
.vg-btn-dark{ background:var(--ink); color:#fff; border:1px solid var(--ink); }
.vg-btn-dark:hover{ background:var(--gold-deep); border-color:var(--gold-deep); color:#fff; }
.vg-btn-line{ background:transparent; color:var(--ink); border:1px solid var(--line-strong); }
.vg-btn-line:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }

/* ── HERO (좌 카피 · 우 시세판) ── */
.vg-hero{ background:var(--bg); border-bottom:1px solid var(--line); padding:clamp(44px,6vw,92px) 0; }
.vg-hero-inner{ max-width:var(--maxw); margin:0 auto; padding:0 24px; display:grid;
  grid-template-columns:1.05fr 1fr; gap:clamp(36px,5vw,76px); align-items:center; box-sizing:border-box; }
.vg-hero-eyebrow{ font-size:12px; letter-spacing:.22em; font-weight:700; color:var(--gold-deep);
  text-transform:uppercase; margin:0 0 18px; }
.vg-hero-title{ font-family:var(--serif); font-weight:600; font-size:clamp(42px,5.4vw,76px); line-height:1.03;
  letter-spacing:-.03em; color:var(--ink); margin:0 0 22px; text-wrap:balance; }
.vg-hero-title .ko{ display:inline-block; }
.vg-hero-sub{ font-size:16px; line-height:1.75; color:var(--ink-soft); margin:0 0 30px; max-width:44ch; }
.vg-hero-cta{ display:flex; gap:12px; flex-wrap:wrap; }
.vg-hero-phone{ margin-top:16px; }
.vg-hero-phone .vg-phone-wrap{ margin-top:0; }

/* 시세판을 히어로 우측 카드로 — 밴드/중앙정렬 해제 */
.gm-rate-wrap.vg-hero-rate{ background:transparent!important; padding:0!important; border:0!important; }
.vg-hero-rate .gm-rate{ max-width:none!important; margin:0!important; padding:0!important; }
.vg-hero-rate .gm-body{ flex-direction:column; gap:12px; }
.vg-hero-rate .gm-side{ flex-direction:row; width:100%; }
.vg-hero-rate .gm-side a,.vg-hero-rate .gm-side span{ min-height:58px; font-size:16px; }

/* ── 영상 가이드 밴드 ── */
#visual{ max-width:var(--maxw)!important; margin:clamp(48px,7vw,92px) auto 0!important; padding:0 24px!important; }
.gk-hero{ padding:0!important; }
.gk-guide{ max-width:none!important; }

/* ── 상담 CTA (핑크배너 대체) ── */
.sec03 .vg-consult{ max-width:var(--maxw); margin:0 auto; padding:clamp(40px,5vw,68px) 24px;
  display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(28px,4vw,56px); align-items:center; box-sizing:border-box; }
.vg-consult-eyebrow{ font-size:12px; letter-spacing:.22em; font-weight:700; color:var(--gold-deep); text-transform:uppercase; margin:0 0 14px; }
.vg-consult-title{ font-family:var(--serif); font-weight:600; font-size:clamp(26px,3.4vw,40px); line-height:1.14; letter-spacing:-.02em; color:var(--ink); margin:0 0 12px; }
.vg-consult-sub{ font-size:15px; line-height:1.65; color:var(--ink-soft); margin:0; }
.vg-consult-actions{ display:flex; flex-direction:column; gap:12px; }
.vg-consult-actions .vg-btn{ justify-content:center; }

/* ── 반응형: 히어로/상담 스택 ── */
@media (max-width:920px){
  .vg-hero-inner{ grid-template-columns:1fr; gap:34px; }
  .vg-hero-title{ font-size:clamp(36px,8vw,56px); }
  .vg-hero-sub br{ display:none; }
  .sec03 .vg-consult{ grid-template-columns:1fr; gap:24px; text-align:left; }
}
@media (max-width:600px){
  .vg-hero{ padding:32px 0; }
  .vg-hero-cta .vg-btn{ flex:1; justify-content:center; }
}

/* ============================================================
   금시세 전광판 HERO (다크 보드) — frontend-design v3 (시세=메인)
   ============================================================ */
.vg-board{ background:radial-gradient(130% 120% at 82% -15%, var(--board-2), var(--board) 62%); color:var(--board-ink); border-bottom:1px solid var(--board-line); }
.vg-board-inner{ max-width:var(--maxw); margin:0 auto; padding:clamp(26px,4vw,50px) 24px clamp(30px,4vw,54px); box-sizing:border-box; }
.vg-board-head{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding-bottom:clamp(18px,2.6vw,30px); border-bottom:1px solid var(--board-line); }
.vg-board-status{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:12.5px; color:var(--board-mut); }
.vg-live{ display:inline-flex; align-items:center; gap:6px; color:#46d784; font-weight:700; letter-spacing:.1em; font-size:11px; }
.vg-live i{ width:7px; height:7px; border-radius:50%; background:#46d784; box-shadow:0 0 0 0 rgba(70,215,132,.6); animation:gmpulse 1.7s infinite; }
.vg-upd{ font-family:var(--num); font-variant-numeric:tabular-nums; }
.vg-rf{ width:28px; height:28px; border-radius:8px; border:1px solid var(--board-line); background:transparent; color:var(--gold); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.vg-rf:hover{ background:rgba(201,162,74,.12); }
.vg-rf svg{ width:14px; height:14px; transition:transform .6s ease; }
.vg-mkt{ font-weight:700; font-size:11px; letter-spacing:.05em; padding:4px 11px; border-radius:999px; }
.vg-mkt.open{ color:#46d784; background:rgba(70,215,132,.12); }
.vg-mkt.closed{ color:#e7a14a; background:rgba(231,161,74,.13); }
.vg-chg{ font-size:14px; font-family:var(--num); color:var(--board-mut); font-variant-numeric:tabular-nums; }
.vg-chg .t{ font-size:12px; margin-right:6px; }
.vg-chg b.up{ color:#ff5b4d; } .vg-chg b.down{ color:#5b9bff; }
.vg-board-title{ font-family:var(--display); font-weight:600; font-size:clamp(19px,2.3vw,27px); letter-spacing:-.01em; color:var(--board-ink); margin:clamp(20px,3vw,32px) 0 clamp(16px,2.4vw,26px); display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.vg-board-title span{ font-family:var(--sans); font-size:13px; font-weight:400; color:var(--board-mut); letter-spacing:0; }
.vg-prices{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,4vw,60px); }
.vg-price-k{ font-size:14px; font-weight:600; color:var(--gold); letter-spacing:.02em; margin-bottom:8px; }
.vg-price-k em{ font-style:normal; font-size:12px; color:var(--board-mut); margin-left:6px; font-weight:500; }
.vg-price-v{ font-family:var(--num); font-weight:700; font-size:clamp(40px,6.6vw,86px); line-height:.95; letter-spacing:-.03em; color:var(--board-ink); font-variant-numeric:tabular-nums; display:flex; align-items:baseline; }
.vg-price-v .won{ font-size:.3em; font-weight:600; color:var(--board-mut); margin-left:5px; letter-spacing:0; }
.vg-price-v .don{ font-size:.3em; font-weight:500; color:var(--board-mut); }
.vg-price-x{ font-size:12.5px; color:var(--board-mut); margin-top:10px; font-family:var(--num); font-variant-numeric:tabular-nums; }
.vg-board-actions{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:clamp(24px,3.4vw,40px); }
.vg-act{ display:inline-flex; align-items:center; justify-content:center; min-width:148px; padding:16px 28px; border-radius:10px; font-family:var(--sans); font-size:16px; font-weight:700; letter-spacing:.02em; text-decoration:none; transition:filter .18s var(--ease),background .18s var(--ease); }
.vg-act.buy{ background:linear-gradient(135deg,#E9C766,#C9A24A); color:#231a08; box-shadow:0 12px 32px -10px rgba(201,162,74,.55); }
.vg-act.buy:hover{ filter:brightness(1.06); }
.vg-act.sell{ background:transparent; color:var(--gold); border:1px solid var(--gold); }
.vg-act.sell:hover{ background:rgba(201,162,74,.12); }
.vg-act.off{ background:rgba(255,255,255,.05)!important; color:var(--board-mut)!important; border:1px solid var(--board-line)!important; box-shadow:none!important; cursor:not-allowed; }
.vg-board-actions .vg-link{ color:var(--board-mut); font-size:13.5px; font-weight:600; text-decoration:none; padding:8px 4px; }
.vg-board-actions .vg-link:hover{ color:var(--gold); }
.vg-board-phone{ margin-top:18px; max-width:420px; }
.vg-board-phone .vg-phone-wrap{ margin-top:0; }
.vg-board-phone .vg-phone-btn{ background:transparent!important; border-color:var(--board-line)!important; color:var(--gold)!important; }
.vg-board-phone .vg-phone-btn small{ color:var(--board-mut)!important; }
@media (max-width:760px){
  .vg-prices{ grid-template-columns:1fr; gap:20px; }
  .vg-board-actions .vg-act{ flex:1; min-width:0; }
}

/* ============================================================
   헤더 컴팩트화 (3단 느낌 제거 — 슬림 유틸 + 브랜드 + 내비)
   ============================================================ */
#header .top .in_Layer{ min-height:34px!important; }
#header .mid .in_Layer{ min-height:60px!important; }
#header .mid .call{ display:none!important; }     /* 중복 전화 제거(상담 CTA로 일원화) */
.vg-home-logo{ font-size:26px!important; letter-spacing:.18em!important; }
#header .bot .category > li > a{ padding:12px 16px!important; font-size:13.5px!important; }
#header .top, #header .bot{ border-color:var(--line)!important; }

/* ============================================================
   로고 / 헤더 화이트 럭셔리 / 아이콘 (v4)
   ============================================================ */
/* 인라인 SVG 워드마크 (텍스트 겹침 해소) */
.vg-logo{ display:inline-flex!important; align-items:center; gap:10px; text-decoration:none; position:static!important; transform:none!important; width:auto!important; height:auto!important; background:none!important; }
.vg-logo-mark{ color:var(--gold); flex:0 0 auto; display:block; }
.vg-logo-txt{ font-family:var(--display); font-weight:600; font-size:21px; letter-spacing:.16em; color:var(--ink); line-height:1; }
.vg-logo-txt b{ font-weight:600; color:var(--gold-deep); margin-left:.18em; }
.vg-logo::after{ content:none!important; }   /* 옛 ::after 워드마크 제거 */
#header .mid .in_Layer{ justify-content:space-between!important; align-items:center; }

/* AI 사진찾기 — 정제 아웃라인 버튼(이모지 제거, SVG) */
.vg-aisearch{ display:inline-flex; align-items:center; gap:5px; margin-left:6px; vertical-align:middle;
  background:#fff; color:var(--gold-deep); border:1px solid var(--line-strong); border-radius:999px;
  padding:7px 13px; font-size:12px; font-weight:600; font-family:var(--sans); cursor:pointer; white-space:nowrap;
  transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease); }
.vg-aisearch:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.vg-aisearch svg{ flex:0 0 auto; }

/* 헤더 화이트 럭셔리 */
#header{ background:#fff!important; box-shadow:none!important; border-bottom:1px solid var(--line)!important; }
#header .top{ background:#fff!important; border-bottom:1px solid var(--line)!important; }
#header .top a.bookmark{ display:none!important; }
#header .mid{ border-bottom:1px solid var(--line); }
#header .bot{ border-top:0!important; }
/* ★ vela-theme의 중앙 가짜 워드마크(::after content:"VELA GOLD") 제거 — 좌측 SVG 로고로 일원화 */
#header .mid .in_Layer::after{ content:none!important; display:none!important; }
#header .mid .in_Layer{ position:relative; }

/* ── 전광판 미세 개선: 두 시세열 사이 구분선 + 상단 골드 헤어라인 ── */
.vg-board{ box-shadow:inset 0 1px 0 rgba(201,162,74,.25); }
@media (min-width:761px){
  .vg-price:first-child{ border-right:1px solid var(--board-line); padding-right:clamp(24px,4vw,56px); }
}

/* ============================================================
   화이트 럭셔리 전광판 (다크 → 라이트 오버라이드) v5
   ============================================================ */
.vg-board{ background:linear-gradient(180deg,#FFFFFF 0%, #FAF8F1 100%)!important; color:var(--ink)!important; border-top:2px solid var(--gold)!important; border-bottom:1px solid var(--line)!important; box-shadow:none!important; }
.vg-board-head{ border-bottom:1px solid var(--line)!important; }
.vg-board-status{ color:var(--muted)!important; }
.vg-live{ color:#1f9d57!important; } .vg-live i{ background:#1f9d57!important; box-shadow:0 0 0 0 rgba(31,157,87,.5)!important; }
.vg-rf{ border:1px solid var(--line-strong)!important; color:var(--gold-deep)!important; }
.vg-rf:hover{ background:var(--gold-tint)!important; }
.vg-mkt.open{ color:#1f9d57!important; background:rgba(31,157,87,.1)!important; }
.vg-mkt.closed{ color:#b07d28!important; background:rgba(176,125,40,.1)!important; }
.vg-chg{ color:var(--muted)!important; }
.vg-chg b.up{ color:#d3382f!important; } .vg-chg b.down{ color:#2f6fd6!important; }
.vg-board-title{ color:var(--ink)!important; } .vg-board-title span{ color:var(--muted)!important; }
.vg-price-k{ color:var(--gold-deep)!important; } .vg-price-k em{ color:var(--muted)!important; }
.vg-price-v{ color:var(--ink)!important; }
.vg-price-v .won,.vg-price-v .don{ color:var(--muted)!important; }
.vg-price-x{ color:var(--muted)!important; }
.vg-price:first-child{ border-right-color:var(--line)!important; }
.vg-act.buy{ background:linear-gradient(135deg,#D9B85C,#B5903A)!important; color:#2a1f08!important; box-shadow:0 14px 32px -14px rgba(181,144,58,.55)!important; }
.vg-act.sell{ background:#fff!important; color:var(--gold-deep)!important; border:1px solid var(--gold)!important; }
.vg-act.sell:hover{ background:var(--gold-tint)!important; }
.vg-act.off{ background:#f1efe9!important; color:var(--muted)!important; border:1px solid var(--line)!important; box-shadow:none!important; }
.vg-board-actions .vg-link{ color:var(--ink-soft)!important; }
.vg-board-actions .vg-link:hover{ color:var(--gold-deep)!important; }
.vg-board-phone .vg-phone-btn{ background:#fff!important; border:1px solid var(--line-strong)!important; color:var(--gold-deep)!important; }
.vg-board-phone .vg-phone-btn small{ color:var(--muted)!important; }

/* ============================================================
   단일 바 헤더 (3행 → 1행 flex order) v5
   ============================================================ */
#header{ display:flex!important; flex-wrap:nowrap; align-items:center; column-gap:clamp(14px,2.4vw,34px);
  max-width:var(--maxw); margin:0 auto!important; padding:0 24px!important; min-height:72px; border-bottom:1px solid var(--line)!important; background:#fff!important; }
#header .top,#header .mid,#header .bot{ background:transparent!important; border:0!important; box-shadow:none!important; }
#header .top .in_Layer,#header .mid .in_Layer,#header .bot .in_Layer{ max-width:none!important; min-height:0!important; height:auto!important; padding:0!important; margin:0!important; width:auto!important; display:flex; align-items:center; }
#header .mid{ order:1; flex:0 0 auto; }
#header .bot{ order:2; flex:1 1 auto; min-width:0; }
#header .top{ order:3; flex:0 0 auto; margin-left:auto; }
#header .bg{ display:none!important; }
/* 로고 (검색은 우측 유틸로 이동) */
#header .mid .in_Layer{ gap:0; }
#header .mid .right_search{ display:none!important; }   /* 단일바: 큰 검색창 숨김 → 카테고리 옆 콤팩트 검색 별도 노출 안함, 유틸의 검색 활용 */
/* 카테고리 내비 (좌측부터, 컴팩트) */
#header .bot .category_area{ width:100%; display:flex; justify-content:flex-start; overflow:visible; }
.category{ justify-content:flex-start!important; gap:2px!important; flex-wrap:nowrap!important; }
.category > li > a{ padding:10px 13px!important; font-size:13.5px!important; white-space:nowrap; }
/* 유틸 (우측) */
#header .top .utill_menu{ gap:0!important; }
#header .top .utill_menu li a{ padding:6px 10px!important; }

@media (max-width:1100px){
  #header{ flex-wrap:wrap; min-height:0; padding-top:8px!important; padding-bottom:8px!important; }
  #header .mid{ order:1; }
  #header .top{ order:2; margin-left:auto; }
  #header .bot{ order:3; flex:1 0 100%; overflow-x:auto; }
  .category{ flex-wrap:nowrap!important; }
}

/* ============================================================
   헤더 정정: 깨진 단일행(겹침) → 2행 클린 (브랜드+검색+유틸 / 카테고리) v6
   ============================================================ */
#header{ display:flex!important; flex-wrap:wrap!important; align-items:center; max-width:var(--maxw); margin:0 auto!important; padding:0 24px!important; background:#fff!important; border-bottom:1px solid var(--line)!important; column-gap:20px; }
#header .top,#header .mid,#header .bot{ background:transparent!important; border:0!important; box-shadow:none!important; }
#header .bg{ display:none!important; }
#header .top .in_Layer,#header .mid .in_Layer,#header .bot .in_Layer{ max-width:none!important; height:auto!important; margin:0!important; width:auto!important; }
/* 1행: 로고(좌) ··· 검색+유틸(우) */
#header .mid{ order:1!important; flex:1 1 auto!important; min-width:0; }
#header .mid .in_Layer{ display:flex!important; align-items:center; gap:16px; min-height:66px!important; padding:0!important; }
#header .mid .call{ display:none!important; }
#header .mid .vg-logo{ flex:0 0 auto; }
#header .mid .right_search{ display:block!important; margin-left:auto!important; flex:0 0 auto; }
#header .top{ order:2!important; flex:0 0 auto!important; margin-left:0!important; }
#header .top .in_Layer{ display:flex!important; align-items:center; min-height:66px!important; padding:0!important; justify-content:flex-end; }
/* 2행: 카테고리 풀폭 가운데 */
#header .bot{ order:3!important; flex:1 1 100%!important; border-top:1px solid var(--line)!important; }
#header .bot .category_area{ width:100%; display:flex; justify-content:center; overflow:visible; }
.category{ justify-content:center!important; flex-wrap:wrap!important; gap:2px!important; }
.category > li > a{ padding:13px 16px!important; font-size:14px!important; white-space:nowrap; }
@media (max-width:900px){
  #header{ padding:6px 16px!important; }
  #header .mid .right_search input.input_box{ width:110px; }
  #header .bot{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .category{ flex-wrap:nowrap!important; justify-content:flex-start!important; }
}

/* ============================================================
   헤더 폴리시 v7 — 세로중앙·로고·검색 UI·카테고리 간격 (스킬 원칙: 컴포넌트 상태/리듬)
   ============================================================ */
#header{ align-items:center!important; }
#header .mid, #header .top{ display:flex!important; align-items:center!important; }
#header .mid .in_Layer, #header .top .in_Layer{ height:80px!important; min-height:80px!important; align-items:center!important; }
/* 로고 */
.vg-logo{ align-self:center!important; gap:11px; }
.vg-logo-mark{ width:30px!important; height:30px!important; }
.vg-logo-txt{ font-size:23px!important; letter-spacing:.17em!important; }
/* 검색 필드 — pill + 라운드 돋보기 버튼 + AI */
#header .mid .right_search .cont{ display:flex!important; align-items:center; gap:10px; flex-wrap:nowrap; }
#header .mid .right_search .search_box{ display:flex!important; align-items:center; width:240px; height:44px; border:1px solid var(--line-strong)!important; border-radius:999px!important; background:#fff!important; padding:0 8px 0 18px!important; box-sizing:border-box; transition:border-color .18s var(--ease),box-shadow .18s var(--ease); }
#header .mid .right_search .search_box:focus-within{ border-color:var(--gold)!important; box-shadow:0 0 0 3px rgba(154,123,63,.12)!important; }
#header .mid .right_search input.input_box{ flex:1; width:auto!important; min-width:0; border:0!important; background:transparent!important; height:42px!important; font-size:14px; color:var(--ink); }
#header .mid .right_search input.input_box::placeholder{ color:var(--muted); opacity:1; }
#header .mid .right_search button.search{ width:34px!important; height:34px!important; min-width:34px; border-radius:50%!important; background:var(--ink)!important; color:#fff!important; border:0!important; display:flex!important; align-items:center; justify-content:center; cursor:pointer; opacity:1!important; flex:0 0 auto; transition:background .18s var(--ease); padding:0!important; }
#header .mid .right_search button.search:hover{ background:var(--gold-deep)!important; }
#header .mid .right_search button.search svg{ display:block; }
.vg-aisearch{ height:34px; }
/* 2행 카테고리 — 칼럼 간격 확대(여백 분배) */
#header .bot .in_Layer{ height:auto!important; min-height:0!important; }
#header .bot{ padding-bottom:2px; }
.category{ justify-content:center!important; gap:clamp(10px,2.6vw,40px)!important; flex-wrap:wrap!important; }
.category > li > a{ padding:15px 4px!important; font-size:15px!important; letter-spacing:.01em; }
@media (max-width:900px){
  #header .mid .in_Layer, #header .top .in_Layer{ height:60px!important; min-height:60px!important; }
  #header .mid .right_search .search_box{ width:150px; height:40px; }
  .category{ gap:14px!important; }
  .category > li > a{ font-size:14px!important; padding:12px 2px!important; }
}

/* AI 사진찾기 — 아이콘 버튼화(공간 절약·정리) */
.vg-aisearch{ font-size:0!important; gap:0!important; width:40px; height:40px; min-width:40px; padding:0!important; border-radius:50%!important; justify-content:center; }
.vg-aisearch svg{ width:17px; height:17px; }

/* ============================================================
   v9 — 로고 3안 전환 + 검색 아이콘→오버레이
   ============================================================ */
/* 로고 변형 */
.vg-logo-txt.vg-logo-serif{ font-family:'Cormorant Garamond','Playfair Display',serif!important; font-weight:700!important; font-size:29px!important; letter-spacing:.04em!important; }
.vg-logo-serif b{ color:var(--gold)!important; font-weight:700; margin-left:.04em; }
.vg-logo-typo{ display:inline-flex!important; align-items:center; gap:9px; }
.vg-logo-typo .lv{ font-family:var(--display); font-weight:700; font-size:23px; letter-spacing:.04em; color:var(--ink); }
.vg-logo-typo .ld{ width:5px; height:5px; border-radius:50%; background:var(--gold); display:inline-block; }
.vg-logo-typo .lg{ font-family:var(--display); font-weight:500; font-size:21px; letter-spacing:.22em; color:var(--gold-deep); }

/* 검색: 아이콘 토글 */
#header{ position:relative; overflow:visible!important; }
.vg-srch-li{ display:flex!important; align-items:center; }
.vg-srch-js{ display:none!important; }
.vg-srch-toggle{ width:38px; height:38px; border-radius:50%; border:1px solid var(--line-strong); background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease); padding:0; }
.vg-srch-toggle:hover{ background:var(--ink); color:#fff; border-color:var(--ink); }
.vg-srch-toggle svg{ display:block; }
/* 오버레이 패널 (v6/v7 인라인검색 규칙 무력화) */
#header .mid .right_search{ position:absolute!important; top:calc(100% + 8px)!important; right:16px!important; left:auto!important; margin:0!important; width:min(440px,92vw)!important; background:#fff!important; border:1px solid var(--line)!important; border-radius:16px!important; box-shadow:0 22px 50px rgba(40,32,12,.16)!important; padding:16px!important; display:none!important; z-index:60; }
body.vg-search-open #header .mid .right_search{ display:block!important; }
#header .mid .right_search form{ margin:0; }
#header .mid .right_search .cont{ display:flex!important; align-items:center; gap:10px; flex-wrap:nowrap; }
#header .mid .right_search .search_box{ flex:1 1 auto!important; width:auto!important; height:48px!important; }
#header .mid .right_search input.input_box{ height:46px!important; font-size:15px; }
#header .mid .right_search .vg-aisearch{ width:48px!important; height:48px!important; min-width:48px; }

/* ============================================================
   v10 — 로고 ① 고정·확대 + 검색 오버레이 우측 정렬 버그수정
   ============================================================ */
/* 오버레이가 좌측 .mid .in_Layer 기준으로 잡히던 것 → #header 기준(우측) */
#header .mid .in_Layer{ position:static!important; }
/* 로고 사이즈 업 */
.vg-logo-mark{ width:40px!important; height:40px!important; }
.vg-logo-txt{ font-size:26px!important; letter-spacing:.16em!important; }
.vg-logo{ gap:13px!important; }

/* ============================================================
   v11 — 전광판 액션바 풀폭 균형 + 오버레이 AI사진찾기 라벨 노출
   ============================================================ */
/* 액션: 매수/매도(좌) · 차트/지갑/유선(우) 풀폭 분배 */
.vg-board-actions{ display:flex!important; align-items:center; gap:16px 20px; flex-wrap:wrap; }
.vg-act-cta{ display:flex; gap:12px; flex-wrap:wrap; }
.vg-act-links{ margin-left:auto; display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.vg-act-links .vg-board-phone{ display:inline-flex; margin:0; max-width:none; }
.vg-act-links .vg-board-phone .vg-phone-wrap{ margin:0; }
.vg-act-links .vg-board-phone .vg-phone-btn{ width:auto!important; padding:11px 18px!important; }

/* 검색 오버레이: AI 사진찾기를 라벨+아이콘 풀폭 버튼으로 (돋보기 클릭 시 패널 안) */
#header .mid .right_search .cont{ flex-wrap:wrap!important; }
#header .mid .right_search .vg-aisearch{ font-size:13px!important; font-weight:600; width:100%!important; min-width:0; height:auto!important; border-radius:10px!important; padding:12px!important; justify-content:center; gap:7px!important; margin:6px 0 0!important; border:1px solid var(--line-strong)!important; background:#fff!important; color:var(--gold-deep)!important; }
#header .mid .right_search .vg-aisearch:hover{ background:var(--ink)!important; color:#fff!important; border-color:var(--ink)!important; }
#header .mid .right_search .vg-aisearch svg{ width:16px!important; height:16px!important; }
