:root{
  --bg:#ffffff;
  --panel:#f5f5f5;
  --panel-soft:#fafafa;
  --border:#d4d4d4;
  --text:#222222;
  --muted:#555555;
  --brand:#800020;
  --brand-ghost:#f1e6ea;
  --radius:14px;
  --shadow:0 4px 16px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{
  margin:0; padding:0; background:var(--bg); color:var(--text);
  font-family:'Noto Sans KR',sans-serif; line-height:1.6;
}
a{text-decoration:none; color:inherit}

/* 공통 레이아웃 */
.wc-container{max-width:1020px; margin:0 auto; padding:40px 20px}
.wc-section{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:24px 20px;
  margin:28px auto;
  max-width:1020px;
  box-shadow:var(--shadow);
}
.wc-h2{margin:0 0 14px; font-size:22px; font-weight:800; color:var(--brand)}
.wc-desc{color:var(--muted); margin-bottom:18px}

/* ================= HERO ================= */
.wc-hero{
  background:var(--bg);
  border-bottom:1px solid var(--border);
  padding:0;
  text-align:center;
}

/* ✅ 상단 이미지 */
.wc-hero-img{
  max-width:1020px;
  margin:0 auto;
}
.wc-hero-img img{
  display:block;
  width:100%;
  max-height:250px;
  object-fit:contain;
  margin:0 auto;
}

/* 제목 & 설명 */
.wc-hero__title{
  font-size:clamp(28px,5vw,40px);
  font-weight:900;
  margin:20px 0 8px;        /* 이미지와 간격 확보 */
  color:var(--brand);
}
.wc-hero__desc{
  color:var(--muted);
  font-size:18px;
  margin:0 auto 16px;
  max-width:820px;
}

/* ✅ 요약 섹션만 흰색 */
#wc-summary.wc-section{
  background:var(--bg);
}

/* 리스트/배지 */
.wc-list{margin:0 0 18px 18px}
.wc-badges{display:grid; gap:10px}
@media(min-width:700px){.wc-badges{grid-template-columns:repeat(3,1fr)}}
.wc-badge{
  background:var(--panel);
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:10px;
  text-align:center;
  color:#333;
}

/* DETAILS 카드 */
.wc-block{
  background:var(--panel-soft);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
  margin-bottom:14px;
}

/* ✅ FAQ: 질문 흰색 / 답변 회색 */
#wc-faq.wc-section{
  background:var(--bg);
  border:1px solid var(--border);
}
.wc-qa{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:12px;
  margin:12px 0;
  overflow:hidden;
}
.wc-qa__q{
  list-style:none;
  display:flex; justify-content:space-between; align-items:center;
  padding:16px 18px;
  cursor:pointer; font-weight:700;
  background:var(--bg);
}
.wc-qa__q::-webkit-details-marker{display:none}
.wc-qa__q svg{
  width:20px; height:20px; stroke:var(--muted); stroke-width:2; fill:none;
  transition:transform .25s;
}
.wc-qa[open] .wc-qa__q svg{transform:rotate(180deg)}
.wc-qa__a{
  padding:0 18px 16px;
  color:var(--muted);
  border-top:1px dashed var(--border);
  background:var(--panel);     /* 답변 회색 */
}

/* 버튼 */
.wc-cta-row{display:flex; gap:10px; flex-wrap:wrap; margin-top:20px; justify-content:center}
.wc-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:0 18px; height:44px; border-radius:10px;
  border:1px solid transparent; font-weight:700; transition:.2s;
}
.wc-btn--primary{background:var(--brand); color:#fff}
.wc-btn--primary:hover{filter:brightness(1.05)}
.wc-btn--ghost{background:var(--brand-ghost); border-color:var(--brand); color:var(--brand)}
.wc-btn--ghost:hover{background:#e4d0d6}

/* 폼 */
.wc-form{
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  background:var(--panel-soft);
  border:1px solid var(--border); border-radius:12px; padding:16px;
}
@media(max-width:800px){.wc-form{grid-template-columns:1fr}}
.wc-field{display:flex; flex-direction:column; gap:6px}
.wc-label{font-size:13px; color:var(--muted)}
.wc-form input,.wc-form select{
  height:44px; border-radius:10px; border:1px solid var(--border);
  background:#fff; color:var(--text); padding:0 12px;
}
.wc-form input:focus,.wc-form select:focus{
  border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-ghost); outline:none;
}
.wc-form .wc-btn{grid-column:1 / -1; margin-top:4px}

/* 상단 이동 */
.wc-top{display:flex; justify-content:center; margin-top:14px}