/* ============================================================
   DN 커뮤니티 — Design V2: Deep Charcoal + Gold
   프리미엄 트레이딩 룩. 남색/보라 → 준검정 차콜 + 골드 포인트.
   기존 CSS 위에 오버라이드로 적용 (원본 무수정).
   ============================================================ */

/* ── 팔레트 재정의 ── */
:root {
  --bg-primary: #0e0f13;
  --bg-secondary: #131419;
  --bg-card: #17191f;
  --bg-card-alt: #1e2128;
  --accent-blue: #4c8dff;
  --accent-purple: #9b7bff;
  --accent-cyan: #38c8e8;
  --accent-gold: #f0b545;
  --accent-green: #34c98e;
  --accent-red: #ef5350;
  --text-primary: #f4f5f7;
  --text-secondary: #ced2d9;
  --text-muted: #9ba1ab;
  --gradient-main: linear-gradient(135deg, #f0b545, #e0862e);
  --gradient-cyan: linear-gradient(135deg, #38c8e8, #4c8dff);
  --gradient-gold: linear-gradient(135deg, #f0b545, #ef6a44);
  --gradient-green: linear-gradient(135deg, #34c98e, #5adfa8);
  --v2-border: rgba(255, 255, 255, 0.07);
  --v2-border-gold: rgba(240, 181, 69, 0.35);
  --v2-glow-gold: rgba(240, 181, 69, 0.12);
}

/* ── 타이포그래피: Pretendard ── */
body {
  font-family: 'Pretendard Variable', Pretendard, 'Noto Sans KR', -apple-system, sans-serif !important;
  background: var(--bg-primary) !important;
  color: var(--text-secondary);
  letter-spacing: -0.01em;
}
h1, h2, h3, h4 { letter-spacing: -0.02em; }

::selection { background: rgba(240, 181, 69, 0.3); color: #fff; }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #0e0f13; }
::-webkit-scrollbar-thumb { background: #26282f; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #33363f; }

/* ── 배경: 파티클/블루 글로우 제거, 골드 은은한 광 ── */
.particles { display: none !important; }
.hero-bg {
  background:
    radial-gradient(ellipse 70% 50% at 50% -10%, rgba(240, 181, 69, 0.09), transparent 65%),
    radial-gradient(ellipse 50% 40% at 85% 15%, rgba(76, 141, 255, 0.05), transparent 60%),
    var(--bg-primary) !important;
}

/* ── 히어로 ── */
#hero { padding-top: 90px; }
.hero-label {
  font-size: 0.85rem !important;
  font-weight: 600;
  color: var(--accent-gold) !important;
  background: none !important;
  -webkit-text-fill-color: var(--accent-gold) !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.hero-title {
  font-weight: 900 !important;
  background: linear-gradient(180deg, #ffffff 30%, #d8c193 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}
.hero-tagline { color: var(--text-primary) !important; font-weight: 700; }
.hero-slogan { color: var(--accent-gold) !important; }
.hero-slogan-sub { color: var(--text-muted) !important; }
.hero-quokka { filter: drop-shadow(0 4px 16px rgba(240, 181, 69, 0.25)) !important; }

/* 아스날 그리드 → 미니멀 칩 */
.arsenal-item {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  transition: border-color 0.25s, transform 0.25s, background 0.25s !important;
}
.arsenal-item:hover {
  border-color: var(--v2-border-gold) !important;
  background: var(--bg-card-alt) !important;
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4), 0 0 0 1px var(--v2-glow-gold) !important;
}
.arsenal-title { color: var(--text-primary) !important; }
.arsenal-sub { color: var(--text-muted) !important; }
.arsenal-detail {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border-gold) !important;
  border-radius: 14px !important;
}

/* 핵심 숫자 스탯 */
.hero-weapons {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}
.weapon-num {
  background: var(--gradient-gold) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-weight: 900 !important;
}
.weapon-label { color: var(--text-muted) !important; }
.weapon-divider { background: var(--v2-border) !important; }

/* CTA: 골드 프라이머리 / 아웃라인 세컨더리 */
.hero-cta-big {
  background: var(--gradient-gold) !important;
  color: #17130a !important;
  font-weight: 800 !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 28px rgba(240, 181, 69, 0.28) !important;
  animation: none !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
}
.hero-cta-big:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(240, 181, 69, 0.4) !important;
}
.hero-cta-gold {
  background: transparent !important;
  color: var(--accent-gold) !important;
  border: 1.5px solid var(--v2-border-gold) !important;
  box-shadow: none !important;
}
.hero-cta-gold:hover {
  background: var(--v2-glow-gold) !important;
  box-shadow: 0 8px 24px rgba(240, 181, 69, 0.18) !important;
}
.hero-free-banner { color: var(--accent-green) !important; }

/* ── 네비게이션 ── */
nav, .navbar, header nav {
  background: rgba(14, 15, 19, 0.85) !important;
  backdrop-filter: blur(14px) !important;
  border-bottom: 1px solid var(--v2-border) !important;
}
nav a:hover { color: var(--accent-gold) !important; }

/* ── 섹션 공통: 박스 테두리 제거 → 여백과 얇은 구분선 ── */
.section-box {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
section { border: none !important; }
.section-divider-glow {
  background: linear-gradient(90deg, transparent, rgba(240, 181, 69, 0.25), transparent) !important;
  height: 1px !important;
  box-shadow: none !important;
  max-width: 640px;
  margin: 0 auto;
}
.section-title {
  font-weight: 900 !important;
  color: var(--text-primary) !important;
}
.section-title span,
.section-title [data-i18n] {
  background: none !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}
.section-subtitle { color: var(--text-muted) !important; }

/* ── 카드 공통 ── */
.plan-card, .mbenefit-item, .ict-card, .showcase-card,
.membership-banner, .indicator-tier-banner {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35) !important;
}
.plan-card { transition: border-color 0.25s, transform 0.25s !important; }
.plan-card:hover { border-color: rgba(255, 255, 255, 0.14) !important; transform: translateY(-4px); }

/* 멤버쉽 시즌3 카드: 골드 하이라이트 */
.plan-advanced {
  border: 1px solid var(--v2-border-gold) !important;
  background: linear-gradient(180deg, rgba(240, 181, 69, 0.05), var(--bg-card) 40%) !important;
  box-shadow: 0 4px 28px rgba(240, 181, 69, 0.1) !important;
}
.plan-advanced:hover { border-color: rgba(240, 181, 69, 0.6) !important; }

.plan-btn { border-radius: 12px !important; font-weight: 800 !important; }
.btn-gold {
  background: var(--gradient-gold) !important;
  color: #17130a !important;
  border: none !important;
}
.plan-badge { border-radius: 8px !important; font-weight: 800 !important; letter-spacing: 0.08em; }

/* ── 서비스/거래소/기타 카드 ── */
.service-card, .exchange-card, .review-card, .stat-card, .why-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}
.service-card:hover, .exchange-card:hover {
  border-color: var(--v2-border-gold) !important;
}

/* ── indicators.html 전용 ── */
.cat-tab {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
}
.cat-tab.active { background: var(--gradient-gold) !important; color: #17130a !important; }
.style-tab.active { background: var(--gradient-gold) !important; color: #17130a !important; }
.accordion-item {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 14px !important;
}
.accordion-item:hover { border-color: rgba(255, 255, 255, 0.14) !important; }
.accordion-item.open { border-color: var(--v2-border-gold) !important; }
.search-input {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  color: var(--text-primary) !important;
  border-radius: 12px !important;
}
.search-input:focus { border-color: var(--v2-border-gold) !important; }
.video-btn { border-radius: 8px !important; }
.purchase-btn { background: var(--gradient-gold) !important; color: #17130a !important; border-radius: 10px !important; }

/* ── 푸터 ── */
footer {
  background: var(--bg-secondary) !important;
  border-top: 1px solid var(--v2-border) !important;
}

/* ── V2 보강: 남은 블루 틴트 배너/쇼케이스 ── */
.membership-showcase {
  background: var(--bg-card) !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 16px !important;
}
.membership-showcase .showcase-title { filter: none !important; }
.value-banner, .value-banner-inner {
  background: linear-gradient(180deg, rgba(240,181,69,0.06), var(--bg-card) 60%) !important;
  border: 1px solid var(--v2-border-gold) !important;
  border-radius: 16px !important;
}
.value-total {
  background: var(--gradient-gold) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.value-cta { color: var(--accent-gold) !important; }
.hero-arsenal { background: none !important; border: none !important; }
/* 남은 블루 보더 틴트를 중성으로 */
.section-divider-line { background: var(--v2-border) !important; }

/* ── V2 효과: 타이틀 샤인 + CTA 스윕 + 스탯 글로우 ── */
.hero-title {
  background: linear-gradient(110deg, #ffffff 25%, #f9e7bb 38%, #f0b545 50%, #f9e7bb 62%, #ffffff 75%) !important;
  background-size: 250% 100% !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: v2TitleShine 4s ease-in-out infinite !important;
}
@keyframes v2TitleShine {
  0%, 100% { background-position: 100% 0; }
  50% { background-position: 0% 0; }
}
.hero-cta-big { position: relative; overflow: hidden; }
.hero-cta-big::after {
  content: '';
  position: absolute; top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,0.35), transparent);
  transform: skewX(-20deg);
  animation: v2CtaSweep 3.2s ease-in-out infinite;
}
@keyframes v2CtaSweep {
  0%, 55% { left: -80%; }
  85%, 100% { left: 130%; }
}
.hero-cta-gold::after { display: none; }
.weapon-num {
  animation: v2NumGlow 2.8s ease-in-out infinite !important;
}
@keyframes v2NumGlow {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(240,181,69,0.25)); }
  50% { filter: drop-shadow(0 0 16px rgba(240,181,69,0.55)); }
}
.hero-quokka { animation: quokkaFloat 3s ease-in-out infinite !important; }
.plan-advanced { position: relative; }
.plan-advanced::before {
  content: '';
  position: absolute; inset: -1px;
  border-radius: 16px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(240,181,69,0.6), rgba(240,181,69,0.08), rgba(240,181,69,0.5));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: v2GoldBorder 3.5s linear infinite;
  pointer-events: none;
}
@keyframes v2GoldBorder {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 1; }
}