/* ============================================================
   와디즈 자료실 — 메인(reelconomy-y2k) 키치 톤 매칭 오버라이드
   공유: index / buy / buy-success / buy-fail
   크림 #fff8e4 + 잉크 #17130f + 민트 #5fd2c3 + 코랄 #f47f72.
   인라인 다크 스타일/Tailwind 변수 위에 마지막으로 로드 → !important 재스킨.
   로직·마크업 미접촉(색·보더·섀도우·폰트만).
   ============================================================ */

:root{
  /* Tailwind 토큰 리맵 (bg-bg/bg-card/text-fg/text-accent/border-border 자동 반영) */
  --tw-c-bg: 255 248 228;     /* cream  #fff8e4 */
  --tw-c-card: 255 253 242;   /* panel  #fffdf2 */
  --tw-c-border: 23 19 15;    /* ink    #17130f */
  --tw-c-fg: 23 19 15;        /* ink */
  --tw-c-muted: 116 109 98;   /* mute   #746d62 */
  --tw-c-accent: 95 210 195;  /* mint   #5fd2c3 */

  --k-ink:#17130f; --k-cream:#fff8e4; --k-paper:#fffaf0; --k-panel:#fffdf2;
  --k-mint:#5fd2c3; --k-mint-ink:#1f7d70; --k-coral:#f47f72; --k-mute:#746d62;
  --k-shadow:7px 7px 0 #17130f; --k-shadow-sm:4px 4px 0 #17130f;
}

/* ---- base: 크림 + 도트그리드 (메인과 동일) ---- */
html, body{
  background:
    radial-gradient(circle at 1px 1px, rgba(23,19,15,.06) 1px, transparent 0) 0 0/18px 18px,
    var(--k-cream) !important;
  color:var(--k-ink) !important;
  font-family:'Pretendard Variable',Pretendard,'Noto Sans KR',system-ui,sans-serif !important;
}

/* ---- 헤더 / 푸터 / 스티키 결제바 ---- */
header.border-b{ background:var(--k-paper) !important; border-bottom:3px solid var(--k-ink) !important; }
footer.border-t{ background:var(--k-paper) !important; border-top:3px solid var(--k-ink) !important; }
.sticky-bar{
  background:var(--k-paper) !important;
  border-top:3px solid var(--k-ink) !important;
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}

/* ---- 카드 → 패널 + 두꺼운 잉크 보더 + 하드 섀도우 ---- */
.card{
  background:var(--k-panel) !important;
  border:2px solid var(--k-ink) !important;
  border-radius:16px !important;
  box-shadow:var(--k-shadow-sm) !important;
  transition:transform .12s, box-shadow .12s !important;
}
.card:hover{
  border-color:var(--k-ink) !important;
  transform:translate(-2px,-2px) !important;
  box-shadow:var(--k-shadow) !important;
}
.glow, .glow-box{ box-shadow:var(--k-shadow-sm) !important; }

/* ---- 텍스트 액센트 / 키커 / 번호 → 가독 딥민트 ---- */
.text-accent{ color:var(--k-mint-ink) !important; }
.text-fg, .text-foreground{ color:var(--k-ink) !important; }

/* ---- 1차 CTA (bg-accent) → 코랄 청키 버튼 (메인 .btn-primary) ---- */
.bg-accent{ background:var(--k-coral) !important; color:#fffdf2 !important; }
button.bg-accent, a.bg-accent{
  border:2px solid var(--k-ink) !important;
  border-bottom-width:5px !important;
  border-radius:12px !important;
  font-weight:800 !important;
}
button.bg-accent:hover, a.bg-accent:hover{ transform:translate(-1px,-1px); box-shadow:var(--k-shadow-sm); }
button.bg-accent:active, a.bg-accent:active{ transform:translateY(2px); border-bottom-width:2px !important; }

/* ---- 2차/고스트 CTA (border-accent 계열) → 잉크 보더 ---- */
a[class*="border-accent"]{
  border:2px solid var(--k-ink) !important;
  border-radius:12px !important;
  font-weight:700 !important;
  color:var(--k-ink) !important;
  background:var(--k-panel) !important;
}
a[class*="border-accent"]:hover{ background:var(--k-cream) !important; }

/* ---- 입력창 → 잉크 보더, 포커스 민트 ---- */
input[type="text"], input:not([type]){
  background:var(--k-paper) !important;
  border:2px solid var(--k-ink) !important;
  color:var(--k-ink) !important;
  border-radius:10px !important;
}
input:focus{ border-color:var(--k-mint-ink) !important; box-shadow:3px 3px 0 var(--k-mint) !important; }

/* ---- 스피너 → 코랄 ---- */
.spinner{ border-color:rgba(23,19,15,.18) !important; border-top-color:var(--k-coral) !important; }

/* ---- 가격/강조 그라데이션 텍스트 → 코랄 단색 ---- */
.gradient-text{
  background-image:none !important;
  -webkit-text-fill-color:var(--k-coral) !important;
  color:var(--k-coral) !important;
}

/* ---- 결제완료 체크 원형 → 민트 틴트 + 잉크 보더 ---- */
.check-circle{ background:rgba(95,210,195,.20) !important; border:2px solid var(--k-ink) !important; }

/* ---- 남은 인라인 시안 정리 (style 속성 / SVG presentation attr) ---- */
[style*="background:rgba(38,198,218"]{ background:rgba(95,210,195,.16) !important; }
[style*="border-color:rgba(38,198,218"]{ border-color:var(--k-ink) !important; }
[style*="border:1px solid rgba(38,198,218"]{ border-color:var(--k-ink) !important; }
svg[stroke="#26C6DA"]{ stroke:var(--k-mint) !important; }
svg[stroke="#8B8FA3"]{ stroke:var(--k-mute) !important; }

/* ---- 메인식 다크 히어로 마스트헤드 (잉크 밴드 + 큰 타이틀 + 모노 에디션바) ---- */
.k-hero{
  position:relative;
  background:
    radial-gradient(circle at 1px 1px, rgba(244,236,221,.10) 1px, transparent 0) 0 0/16px 16px,
    var(--k-ink) !important;
  border:2px solid var(--k-ink); border-radius:18px;
  box-shadow:var(--k-shadow-sm);
  padding:32px 30px 34px; margin-bottom:26px; overflow:hidden;
}
.k-hero-bar{
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
  font-family:'JetBrains Mono',ui-monospace,monospace; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase; color:rgba(244,236,221,.55);
  border-top:1px solid rgba(244,236,221,.25); border-bottom:1px solid rgba(244,236,221,.25);
  padding:9px 0; margin-bottom:20px;
}
.k-hero-bar span:nth-child(2){ color:var(--k-mint); }
.k-hero-title{
  font-family:'Pretendard Variable',Pretendard,'Noto Sans KR',sans-serif;
  font-weight:800; font-size:clamp(28px,5.2vw,54px); line-height:1.06;
  letter-spacing:-.025em; color:#fffdf2; margin:0;
}
.k-hero-title em{ font-style:normal; color:var(--k-coral); }
.k-hero-sub{ color:rgba(244,236,221,.72); margin:14px 0 0; font-size:15px; line-height:1.6; }