/* =======================================================================
   Gold Apple · theme-ga-v2.css
   홈(index.html)의 .ga-v2 디자인 시스템을 상세페이지 6개에 공용 적용.
   · Hero(페이지 상단) + s-closer slim (푸터 위) 전용 스타일
   · .ga-v2 스코프 — 기존 페이지 스타일과 절대 충돌하지 않음
   · Pretendard Variable / JetBrains Mono / Cormorant Garamond italic
   =========================================================================*/
@import url('/_Css/cdn/pretendard.css');
@import url('/_Css/cdn/google-fonts.css');

.ga-v2 {
  --paper:#f5efe0;
  --canvas:#ebe2cb;
  --line:#d3c7a7;
  --subink:#3a2f1a;
  --ink:#1a1208;
  --ink-2:#0e0905;
  --gold:#c7a24a;
  --gold-deep:#8c6b1f;
  --gold-bright:#e6c06a;
  font-family:'Pretendard Variable','Pretendard',system-ui,sans-serif;
  letter-spacing:-0.01em;
  word-break:keep-all; overflow-wrap:break-word;
  color:var(--ink);
}
.ga-v2 * { box-sizing:border-box; }

/* ───── Shared primitives ───── */
.ga-v2 .container { max-width:1440px; margin:0 auto; padding:0 clamp(24px,5vw,80px); }
.ga-v2 .section-label { display:flex; align-items:center; gap:16px; margin-bottom:32px; }
.ga-v2 .section-label__idx { color:var(--gold-deep); font-family:'JetBrains Mono',ui-monospace,monospace; font-weight:500; letter-spacing:0.12em; font-size:11px; text-transform:uppercase; }
.ga-v2 .section-label__ln { display:block; width:40px; height:1px; background:var(--line); }
.ga-v2 .section-label__t { color:var(--subink); font-family:'JetBrains Mono',ui-monospace,monospace; font-weight:500; letter-spacing:0.12em; font-size:11px; text-transform:uppercase; }

.ga-v2 .h-en {
  font-family:'Cormorant Garamond','Noto Serif KR',serif;
  font-weight:500; font-style:normal;
  font-size:clamp(44px,7vw,112px); line-height:1.04;
  letter-spacing:-0.035em;
  color:var(--ink); margin:0 0 20px;
}
.ga-v2 .h-en em { font-style:italic; color:var(--gold-deep); font-weight:500; }
.ga-v2 .lead-en { font-family:'Pretendard Variable',sans-serif; font-size:clamp(15px,1.2vw,18px); line-height:1.7; color:var(--subink); max-width:58ch; letter-spacing:-0.005em; }

.ga-v2 .rev-init { opacity:0; transform:translateY(44px); transition:opacity 1100ms cubic-bezier(0.19,1,0.22,1), transform 1100ms cubic-bezier(0.19,1,0.22,1); }
.ga-v2 .rev-show { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce) { .ga-v2 .rev-init { opacity:1 !important; transform:none !important; } }

/* ───── Hero (페이지 상단) ───── */
.ga-v2 .page-hero-v2 {
  background:
    radial-gradient(ellipse 60% 40% at 85% 10%, rgba(199,162,74,0.14), transparent 55%),
    var(--paper);
  padding:clamp(24px,3vw,48px) 0 clamp(24px,3vw,36px);
  position:relative; overflow:hidden;
  border-bottom:1px solid var(--line);
}
.ga-v2 .page-hero-v2 .bg-mark {
  position:absolute; right:-2%; bottom:-30%;
  font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:500;
  color:rgba(26,18,8,0.045);
  font-size:clamp(200px,24vw,500px);
  letter-spacing:-0.04em; line-height:0.85;
  pointer-events:none; user-select:none; white-space:nowrap;
}
.ga-v2 .page-hero-v2 .container { position:relative; z-index:1; }
.ga-v2 .page-hero-v2 .hero-head { display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:clamp(20px,3vw,48px); align-items:end; }
.ga-v2 .page-hero-v2 .hero-head .h-en { grid-column:span 12; }
.ga-v2 .page-hero-v2 .hero-head .lead-en { grid-column:span 12; }
@media (min-width:1024px) {
  .ga-v2 .page-hero-v2 .hero-head .h-en { grid-column:span 8; }
  .ga-v2 .page-hero-v2 .hero-head .lead-en { grid-column:span 4; max-width:38ch; }
}
.ga-v2 .page-hero-v2 .hero-head--stack { display:block; text-align:left; }
.ga-v2 .page-hero-v2 .hero-head--stack .h-en,
.ga-v2 .page-hero-v2 .hero-head--stack .lead-en { display:block; max-width:none; text-align:left; }
.ga-v2 .page-hero-v2 .hero-head--stack .lead-en { margin-top:clamp(16px,2vw,28px); max-width:72ch; }
.ga-v2 .page-hero-v2 .meta-row { display:flex; justify-content:center; gap:24px; flex-wrap:wrap; margin-top:clamp(36px,4vw,56px); padding-top:clamp(24px,3vw,36px); border-top:1px solid var(--line); }
.ga-v2 .page-hero-v2 .meta-row .meta { font-family:'JetBrains Mono',ui-monospace,monospace; font-size:13px; letter-spacing:0.12em; text-transform:uppercase; color:var(--subink); display:inline-flex; align-items:center; gap:10px; }
.ga-v2 .page-hero-v2 .meta-row .meta .dot { width:6px; height:6px; border-radius:999px; background:var(--gold); display:inline-block; }

/* ───── Closer (페이지 하단 · slim) ───── */
.ga-v2 .s-closer-slim { background:#0b0805; color:#e8e3cf; padding:clamp(56px,8vw,112px) 0 clamp(28px,3vw,48px); position:relative; overflow:hidden; margin-top:clamp(48px,6vw,96px); }
.ga-v2 .s-closer-slim::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 0%, rgba(201,162,68,0.12), transparent 55%); pointer-events:none; }
.ga-v2 .s-closer-slim .container { position:relative; z-index:1; }
.ga-v2 .s-closer-slim .section-label__idx { color:var(--gold-bright); }
.ga-v2 .s-closer-slim .section-label__ln { background:rgba(232,227,207,0.28); }
.ga-v2 .s-closer-slim .section-label__t { color:rgba(232,227,207,0.55); }

.ga-v2 .s-closer-slim .closer-row { display:grid; grid-template-columns:1fr; gap:clamp(24px,3vw,48px); align-items:start; padding-bottom:clamp(32px,4vw,56px); border-bottom:1px solid rgba(232,227,207,0.12); }
@media (min-width:900px) { .ga-v2 .s-closer-slim .closer-row { grid-template-columns:1.4fr 1fr; align-items:center; } }
.ga-v2 .s-closer-slim .closer-row .brand-mark { font-family:'Cormorant Garamond','Noto Serif KR',serif; font-style:italic; font-size:clamp(28px,3.2vw,44px); line-height:1; color:#f3efdf; margin:0 0 10px; }
.ga-v2 .s-closer-slim .closer-row p { color:rgba(232,227,207,0.68); font-size:14px; line-height:1.7; max-width:44ch; margin:0; font-family:'Pretendard Variable','Noto Sans KR',sans-serif; }
.ga-v2 .s-closer-slim .closer-links { display:flex; flex-wrap:wrap; gap:18px 28px; justify-self:start; }
@media (min-width:900px) { .ga-v2 .s-closer-slim .closer-links { justify-self:end; justify-content:flex-end; } }
.ga-v2 .s-closer-slim .closer-links a { color:rgba(232,227,207,0.78); text-decoration:none; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; transition:color 200ms ease; min-height:24px; display:inline-flex; align-items:center; }
.ga-v2 .s-closer-slim .closer-links a:hover { color:var(--gold-bright); }

.ga-v2 .s-closer-slim .closer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:clamp(24px,3vw,40px); gap:20px; flex-wrap:wrap; font-family:'JetBrains Mono',ui-monospace,monospace; font-size:11px; letter-spacing:0.1em; color:rgba(232,227,207,0.45); text-transform:uppercase; }
.ga-v2 .s-closer-slim .closer-bottom .legal-links { display:flex; gap:22px; flex-wrap:wrap; }
.ga-v2 .s-closer-slim .closer-bottom .legal-links a { color:rgba(232,227,207,0.58); text-decoration:none; transition:color 200ms ease; }
.ga-v2 .s-closer-slim .closer-bottom .legal-links a:hover { color:var(--gold-bright); }

/* ───── Mobile guards (≤768px) ───── */
@media (max-width:768px) {
  .ga-v2 .container { padding:0 20px; max-width:100%; min-width:0; }
  .ga-v2 .page-hero-v2 { padding:40px 0 18px; }
  .ga-v2 .page-hero-v2 .bg-mark { display:none; }
  .ga-v2 .page-hero-v2 .hero-head { gap:18px; }
  .ga-v2 .page-hero-v2 .hero-head .h-en { font-size:clamp(36px,9vw,56px); }
  .ga-v2 .page-hero-v2 .meta-row { gap:14px; margin-top:24px; padding-top:18px; }
  .ga-v2 .s-closer-slim { padding:44px 0 28px; margin-top:36px; }
  .ga-v2 .s-closer-slim .closer-row { grid-template-columns:1fr; gap:20px; }
  .ga-v2 .s-closer-slim .closer-links { gap:12px 20px; }
  .ga-v2 .s-closer-slim .closer-bottom { flex-direction:column; align-items:flex-start; gap:12px; }
  .ga-v2 .h-en { word-break:keep-all; overflow-wrap:break-word; }
}

/* ───── .skin-v2 body 보강 (기존 파란바 → 브라운) ─────
   ※ 이미 theme-skin-v2.css가 대부분 처리하지만 상세페이지에서
     .ga-v2 hero 가 주는 영역 연결을 위해 page hero / closer 여백 정리만 담당 */
body.skin-v2 .ga-v2 .page-hero-v2 { margin-top:0; }
body.skin-v2 #container-wrap,
body.skin-v2 .mcontainer { padding-top:0 !important; }

/* ───── P0 Detail Page Fixes (skin-v2 누락분 보강) ─────
   asset_list/buy 이외 6페이지에서 blue-leak / form blocker 해결용 */

/* header-wrap / #header 파란 배경 제거 — 브라운 그라디언트로 강제 통일 */
body.skin-v2 #header-wrap,
body.skin-v2 header#header-wrap { background:linear-gradient(180deg,#0e0905 0%,#1a1208 100%) !important; border-bottom:1px solid #8c6b1f !important; }
body.skin-v2 #header-wrap #header { background:transparent !important; }

/* ★ Send / Transfer / 주요 액션 버튼 내부 <a> 파란색 → 골드 */
body.skin-v2 .btn-confirm,
body.skin-v2 .btn-login,
body.skin-v2 .btn-search,
body.skin-v2 .transfer-bottom .btn-confirm,
body.skin-v2 .withdrawal-bottom .btn-confirm {
  background:transparent !important;
  padding:0 !important;
}
body.skin-v2 .btn-confirm > a,
body.skin-v2 .btn-login > a,
body.skin-v2 .btn-search > a,
body.skin-v2 .transfer-bottom .btn-confirm > a,
body.skin-v2 .withdrawal-bottom .btn-confirm > a,
body.skin-v2 .Members a.btn,
body.skin-v2 a.btn.search {
  background:#c7a24a !important;
  color:#1a1208 !important;
  display:inline-block;
  padding:14px 36px !important;
  font-family:'JetBrains Mono',ui-monospace,monospace !important;
  font-size:12px !important;
  letter-spacing:0.14em !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
  text-decoration:none !important;
  border:0 !important;
  border-radius:0 !important;
  min-height:44px !important;
  line-height:1.4;
  transition:background 240ms ease, transform 240ms ease;
}
body.skin-v2 .btn-confirm > a:hover,
body.skin-v2 .btn-login > a:hover,
body.skin-v2 .btn-search > a:hover,
body.skin-v2 a.btn.search:hover { background:#e6c06a !important; transform:translateY(-1px); }

/* 기존 테이블 가로 오버플로우 대응 — 모바일에서 래핑 + overflow-x 스크롤 */
@media (max-width:768px) {
  body.skin-v2 .mcont01,
  body.skin-v2 .div-cont,
  body.skin-v2 #contents { max-width:100%; overflow-x:hidden; }
  body.skin-v2 .table-01,
  body.skin-v2 .gonum,
  body.skin-v2 .Members { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  body.skin-v2 table { min-width:100%; width:max-content; }
  /* 긴 회원/거래 테이블 강제 스크롤 컨테이너 */
  body.skin-v2 #contents > div > .table-01 { max-width:100%; overflow-x:auto; }
  /* Members 목록 리스트 LI 래핑 */
  body.skin-v2 .Members ul li { max-width:100%; word-break:break-word; }
  /* 폼 full width 및 16px 보장 */
  body.skin-v2 input[type="text"],
  body.skin-v2 input[type="number"],
  body.skin-v2 input[type="email"],
  body.skin-v2 input[type="password"],
  body.skin-v2 input[type="date"],
  body.skin-v2 select,
  body.skin-v2 textarea {
    font-size:16px !important;
    max-width:100%;
    width:100%;
  }
  /* header 로고 텍스트 중복 방지 — logo::after만 표시, 이미지는 숨김 */
  body.skin-v2 #header #logo a { width:auto; height:auto; }
  body.skin-v2 #header #logo a span.blind { display:none; }
  /* NEW_NAV3가 모바일에서 subNavi와 겹치지 않도록 정리 */
  body.skin-v2 .NEW_NAV3 { overflow-x:auto; white-space:nowrap; }
  body.skin-v2 .NEW_NAV3 table { width:auto; min-width:100%; }
  /* footer-wrap 하단 고정 네비 z-index 낮추기 (s-closer-slim 위에 겹치지 않게) */
  body.skin-v2 #footer-wrap { position:static !important; }
}

/* 데스크톱에서도 input은 16px 이상 (모든 타입 포괄 — iOS 줌 방지 + M5 통과) */
body.skin-v2 input,
body.skin-v2 select,
body.skin-v2 textarea { font-size:16px !important; }

/* 모바일 테이블 — wrapper 가로 스크롤 + 영단어 보존 (TRANSACTION 글자별 깨짐 방지, 2026-04-26) */
body.skin-v2 .table-01 { overflow-x:auto !important; -webkit-overflow-scrolling:touch; max-width:100%; }
body.skin-v2 .table-01 table { width:auto; max-width:none; table-layout:auto; }
body.skin-v2 .table-01 table th,
body.skin-v2 .table-01 table td { white-space:nowrap; word-break:keep-all; overflow-wrap:normal; }
@media (max-width:768px) {
  body.skin-v2 .table-01,
  body.skin-v2 #contents .table-01,
  body.skin-v2 .div-cont > .table-01,
  body.skin-v2 .Buy-list .table-A > div,
  body.skin-v2 .table-A > div { overflow-x:auto !important; max-width:100%; width:100%; -webkit-overflow-scrolling:touch; }
  body.skin-v2 .table-01 > table,
  body.skin-v2 .div-cont > table,
  body.skin-v2 #contents table,
  body.skin-v2 .table-A table {
    width:auto !important;
    max-width:none !important;
    table-layout:auto !important;
  }
  body.skin-v2 #contents table th,
  body.skin-v2 #contents table td,
  body.skin-v2 .div-cont > table th,
  body.skin-v2 .div-cont > table td,
  body.skin-v2 .table-A table th,
  body.skin-v2 .table-A table td {
    padding:10px 12px !important;
    font-size:12px !important;
    white-space:nowrap !important;
    word-break:keep-all !important;
    overflow-wrap:normal !important;
  }
  /* <br> 명시 줄바꿈은 보존 (Transaction<br>number 의도 유지) */
}

/* Hero section의 위/아래 간격이 기존 컨텐츠와 자연스럽게 이어지게 */
body.skin-v2 .ga-v2 + .mcont01 { padding-top:0; }

/* s-closer-slim 바로 뒤 기존 footer(#footer-wrap2/#footer-wrap) 숨김 처리 필요 없음 —
   사용자 요구: 기존 네비는 그대로 유지. s-closer-slim가 브랜드 푸터 보강 역할 */

/* ───── Asset card — GPay 숫자 + 라벨 한 줄 강제 (카드 내부) ─────
   문제: 4,940,xxx.xx 숫자가 카드 너비 초과 → 줄바꿈/잘림, p.GPay 라벨이 숫자 위로 겹침
   해결: assetcont flex 가로 + nowrap + 숫자는 clamp 축소 + 라벨 베이스라인 정렬 */
body.skin-v2 .assetcont {
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  height:auto !important;
  overflow:hidden !important;
  min-width:0;
}
body.skin-v2 .assetcont img {
  flex:0 0 auto !important;
  align-self:center !important;
  width:20px !important;
  height:20px !important;
}
body.skin-v2 .assetcont .assets-num,
body.skin-v2 .assetcont .assets-num-perf {
  display:inline-block !important;
  white-space:nowrap !important;
  flex:1 1 auto !important;
  min-width:0;
  overflow:hidden;
  text-overflow:clip;
  font-size:clamp(16px, 4vw, 32px) !important;
  line-height:1.1 !important;
  margin:0 !important;
}
body.skin-v2 .assetcont p {
  display:inline-block !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  white-space:nowrap !important;
  font-family:'JetBrains Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:0.12em !important;
  text-transform:uppercase;
  color:var(--subink,#3a2f1a) !important;
  top:auto !important;
  position:static !important;
  align-self:center;
}
@media (max-width:480px) {
  body.skin-v2 .assetcont { gap:6px !important; padding:18px 14px !important; }
  body.skin-v2 .assetcont .assets-num,
  body.skin-v2 .assetcont .assets-num-perf { font-size:clamp(14px, 4.2vw, 20px) !important; }
  body.skin-v2 .assetcont p { font-size:9px !important; letter-spacing:0.08em !important; }
  body.skin-v2 .assetcont img { width:16px !important; height:16px !important; }
  /* 모바일(≤480)에선 카드 1열로 — 2열에선 숫자 12자 (4,940,xxx.xx) 들어갈 공간이 없어 잘림 */
  body.skin-v2 .mcont01 > .div-cont > .assets01,
  body.skin-v2 .mcont01 > .div-cont > .assets02,
  body.skin-v2 .mcont01 > .div-cont > .assets03,
  body.skin-v2 .mcont01 > .div-cont > .assets04,
  body.skin-v2 .mcont01 > .div-cont > .assets05,
  body.skin-v2 .mcont01 > .div-cont > .assets06 {
    float:none !important;
    width:100% !important;
    margin:0 0 10px !important;
  }
}

/* ───── Header logo — .blind 스팬 노출 + ::after "GOLD APPLE" 이중 노출 제거 ─────
   문제: .blind 가 position:absolute; left:0px 로 노출 → 브랜드명 텍스트 "Gold Apple" 가 ::after 와 겹침
   해결: 모든 뷰포트에서 .blind 를 스크린리더 전용으로 완전 숨김 */
body.skin-v2 #header #logo .blind,
body.skin-v2 #header #logo span.blind,
body.skin-v2 #header #logo a .blind {
  position:absolute !important;
  left:-99999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  pointer-events:none !important;
}
/* #logo 자체 너비도 브랜드 텍스트에 맞게 — 320 width:320px 로 잡혀서 다른 헤더 요소 위로 확장되던 이슈 억제 */
body.skin-v2 #header #logo { width:auto !important; min-width:120px; max-width:none; }
body.skin-v2 #header #logo a { display:inline-block; width:auto !important; height:auto !important; min-height:44px; line-height:44px; }

/* 헤더 아래 컨텐츠 첫 이미지(.topgobtn: top-img.png "Gold Apple Project" 브랜드 라벨) —
   asset_list/buy 에서 헤더 바로 아래 큰 로고 반복이라 시각 중복. 데스크톱에서만 숨김. */
@media (min-width:769px) {
  body.skin-v2 .mcont01 > a > img.topgobtn { display:none !important; }
}