/* ============================================================
 * JOYN Form — Template: Sanctuary (v1.9.41+)
 *
 * 따뜻한 오프화이트 + 테라코타·머스타드 + 둥근 카드
 * 교회 멤버십·후원·신앙 상담·공동체 가입에 어울림
 *
 * 스코프: .jf-wrap.jf-tpl-sanctuary 이하 전체
 * ============================================================ */

.jf-wrap.jf-tpl-sanctuary {
  --s-bg:               #FAF6EE;
  --s-bg-2:             #F2EBDB;
  --s-card:             #FFFFFF;
  --s-text:             #2A1F15;
  --s-text-2:           #5C4A38;
  --s-text-3:           #8C7C68;
  --s-line:             #E6DCC8;
  --s-line-soft:        #EFE7D5;
  --s-terracotta:       #C26F4D;
  --s-terracotta-deep:  #B85F3F;
  --s-terracotta-soft:  #FBE7DD;
  --s-mustard:          #D4A437;
  --s-mustard-soft:     #FAEFC5;
  --s-olive:            #6B7A4F;

  background: var(--s-bg);
  color: var(--s-text);
  position: relative;
  border-radius: clamp(16px, 2.4vw, 28px);
  padding: clamp(28px, 5vw, 64px) clamp(20px, 4vw, 48px);
  overflow: hidden;
}

/* 따뜻한 코너 글로우 */
.jf-wrap.jf-tpl-sanctuary::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(circle at 85% -10%, rgba(212,164,55,0.18), transparent 50%),
    radial-gradient(circle at -5% 100%, rgba(194,111,77,0.12), transparent 55%);
}
.jf-wrap.jf-tpl-sanctuary > * { position: relative; z-index: 1; }

/* 링크 */
.jf-wrap.jf-tpl-sanctuary a { color: var(--s-terracotta); }
.jf-wrap.jf-tpl-sanctuary a:hover { color: var(--s-terracotta-deep); }

/* ============ Event Side ============ */
.jf-wrap.jf-tpl-sanctuary .jf-block-hero {
  background: transparent;
  padding: 0;
  border-radius: 0;
  color: var(--s-text);
}
.jf-wrap.jf-tpl-sanctuary .jf-hero-deco,
.jf-wrap.jf-tpl-sanctuary .jf-hero-grid-pattern,
.jf-wrap.jf-tpl-sanctuary .jf-hero-orb { display: none; }

/* 라벨 — 부드러운 알약 형태 */
.jf-wrap.jf-tpl-sanctuary .jf-hero-label {
  background: var(--s-terracotta-soft);
  border: 1px solid rgba(194,111,77,0.30);
  color: var(--s-terracotta);
  letter-spacing: 0.04em;
  padding: 8px 16px;
  font-weight: 700;
  font-size: 12px;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  text-transform: none;
}
.jf-wrap.jf-tpl-sanctuary .jf-hero-label::before {
  background: var(--s-terracotta);
  box-shadow: 0 0 8px rgba(194,111,77,0.5);
}

/* 타이틀 — 그라데이션 */
.jf-wrap.jf-tpl-sanctuary .jf-hero-title {
  color: var(--s-text);
  text-shadow: none;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.15;
}
.jf-wrap.jf-tpl-sanctuary .jf-hero-title em {
  background: linear-gradient(120deg, var(--s-terracotta) 0%, var(--s-mustard) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--s-terracotta);
  font-style: normal;
}
.jf-wrap.jf-tpl-sanctuary .jf-hero-title em::after {
  background: linear-gradient(90deg, transparent, var(--s-mustard), transparent);
  opacity: 0.6;
}

.jf-wrap.jf-tpl-sanctuary .jf-hero-sub {
  color: var(--s-text-2);
  line-height: 1.8;
}

/* Chips → 따뜻한 카드 */
.jf-wrap.jf-tpl-sanctuary .jf-chip {
  background: var(--s-card);
  border: 1px solid var(--s-line);
  color: var(--s-text);
  box-shadow: 0 2px 8px rgba(42,31,21,0.04);
  border-radius: 999px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.jf-wrap.jf-tpl-sanctuary .jf-chip:hover {
  background: var(--s-terracotta-soft);
  border-color: var(--s-terracotta);
  transform: translateY(-2px);
}
.jf-wrap.jf-tpl-sanctuary .jf-chip i {
  color: var(--s-terracotta);
  filter: none;
}

/* Stats — 따뜻한 카드 */
.jf-wrap.jf-tpl-sanctuary .jf-stats-grid { background: transparent; border: none; gap: 12px; border-radius: 0; }
.jf-wrap.jf-tpl-sanctuary .jf-stat-item {
  background: var(--s-card);
  border: 1px solid var(--s-line);
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(42,31,21,0.04);
  padding: 22px 20px;
  text-align: left;
  color: var(--s-text);
}
.jf-wrap.jf-tpl-sanctuary .jf-stat-item::before { display: none; }
.jf-wrap.jf-tpl-sanctuary .jf-stat-value {
  color: var(--s-text);
  background: none;
  -webkit-background-clip: initial;
  -webkit-text-fill-color: var(--s-text);
  font-weight: 800;
}
.jf-wrap.jf-tpl-sanctuary .jf-stat-value small { color: var(--s-terracotta); }
.jf-wrap.jf-tpl-sanctuary .jf-stat-label { color: var(--s-text-3); }

/* Benefits — 따뜻한 카드 */
.jf-wrap.jf-tpl-sanctuary .jf-benefit-card {
  background: var(--s-card);
  border: 1px solid var(--s-line);
  border-radius: 18px;
  color: var(--s-text);
  box-shadow: 0 2px 8px rgba(42,31,21,0.04);
}
.jf-wrap.jf-tpl-sanctuary .jf-benefit-card:hover {
  border-color: var(--s-terracotta);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(42,31,21,0.08);
}

/* Block 헤딩 */
.jf-wrap.jf-tpl-sanctuary .jf-block-eyebrow {
  color: var(--s-terracotta);
  background: var(--s-terracotta-soft);
  border-radius: 999px;
  padding: 5px 14px;
  letter-spacing: 0.06em;
}
.jf-wrap.jf-tpl-sanctuary .jf-block-eyebrow::before { background: var(--s-terracotta); }
.jf-wrap.jf-tpl-sanctuary .jf-block-title { color: var(--s-text); }
.jf-wrap.jf-tpl-sanctuary .jf-block-sub { color: var(--s-text-2); }

/* ============ Form Card ============ */
.jf-wrap.jf-tpl-sanctuary .jf-form-card {
  background: var(--s-card);
  border: 1px solid var(--s-line);
  border-radius: 24px;
  box-shadow: 0 1px 2px rgba(42,31,21,0.04), 0 20px 40px -20px rgba(42,31,21,0.16);
  padding: clamp(28px, 4vw, 40px);
}

.jf-wrap.jf-tpl-sanctuary .jf-form-eyebrow {
  background: var(--s-terracotta-soft);
  color: var(--s-terracotta);
  letter-spacing: 0.08em;
  font-weight: 700;
  border-radius: 999px;
  padding: 5px 14px;
}
.jf-wrap.jf-tpl-sanctuary .jf-form-eyebrow::before { background: var(--s-terracotta); }
.jf-wrap.jf-tpl-sanctuary .jf-form-title { color: var(--s-text); font-weight: 800; }
.jf-wrap.jf-tpl-sanctuary .jf-form-desc {
  color: var(--s-text-3);
  border-bottom-color: var(--s-line);
}

/* 섹션 헤딩 */
.jf-wrap.jf-tpl-sanctuary .jf-field-heading {
  border-top: 2px solid var(--s-line-soft);
}
.jf-wrap.jf-tpl-sanctuary .jf-field-heading h3 { color: var(--s-text); }
.jf-wrap.jf-tpl-sanctuary .jf-field-heading h3::before {
  background: linear-gradient(180deg, var(--s-terracotta) 0%, var(--s-mustard) 100%);
}

/* 라벨 */
.jf-wrap.jf-tpl-sanctuary .jf-field-label { color: var(--s-text); }
.jf-wrap.jf-tpl-sanctuary .jf-field-required,
.jf-wrap.jf-tpl-sanctuary .jf-asterisk { color: var(--s-terracotta); }

/* 입력 — 둥글고 부드러운 */
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="text"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="email"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="tel"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="phone"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="url"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="number"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="date"],
.jf-wrap.jf-tpl-sanctuary .jf-field input[type="time"],
.jf-wrap.jf-tpl-sanctuary .jf-field textarea,
.jf-wrap.jf-tpl-sanctuary .jf-field select {
  background: var(--s-bg);
  border: 1.5px solid var(--s-line);
  border-radius: 14px;
  color: var(--s-text);
}
.jf-wrap.jf-tpl-sanctuary .jf-field input::placeholder,
.jf-wrap.jf-tpl-sanctuary .jf-field textarea::placeholder {
  color: var(--s-text-3);
  opacity: 0.7;
}
.jf-wrap.jf-tpl-sanctuary .jf-field input:focus,
.jf-wrap.jf-tpl-sanctuary .jf-field textarea:focus,
.jf-wrap.jf-tpl-sanctuary .jf-field select:focus {
  border-color: var(--s-terracotta);
  background: #fff;
  box-shadow: 0 0 0 4px var(--s-terracotta-soft);
}
.jf-wrap.jf-tpl-sanctuary .jf-field input:hover:not(:disabled),
.jf-wrap.jf-tpl-sanctuary .jf-field textarea:hover,
.jf-wrap.jf-tpl-sanctuary .jf-field select:hover {
  border-color: var(--s-terracotta);
}
.jf-wrap.jf-tpl-sanctuary .jf-field select {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23C26F4D' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
}

/* 라디오 / 체크박스 */
.jf-wrap.jf-tpl-sanctuary .jf-radio,
.jf-wrap.jf-tpl-sanctuary .jf-checkbox {
  background: var(--s-bg);
  border: 1.5px solid var(--s-line);
  color: var(--s-text);
  border-radius: 14px;
}
.jf-wrap.jf-tpl-sanctuary .jf-radio:hover,
.jf-wrap.jf-tpl-sanctuary .jf-checkbox:hover {
  background: var(--s-terracotta-soft);
  border-color: var(--s-terracotta);
}
.jf-wrap.jf-tpl-sanctuary .jf-radio:has(input:checked),
.jf-wrap.jf-tpl-sanctuary .jf-checkbox:has(input:checked) {
  background: var(--s-terracotta-soft);
  border-color: var(--s-terracotta);
  color: var(--s-terracotta-deep);
}
.jf-wrap.jf-tpl-sanctuary .jf-radio input,
.jf-wrap.jf-tpl-sanctuary .jf-checkbox input {
  accent-color: var(--s-terracotta);
}

/* Consent */
.jf-wrap.jf-tpl-sanctuary .jf-consent {
  background: var(--s-bg);
  border: 1px solid var(--s-line);
  color: var(--s-text-2);
  border-radius: 14px;
}
.jf-wrap.jf-tpl-sanctuary .jf-consent:has(input:checked) {
  background: var(--s-terracotta-soft);
  border-color: var(--s-terracotta);
}
.jf-wrap.jf-tpl-sanctuary .jf-consent span { color: var(--s-text-2); }
.jf-wrap.jf-tpl-sanctuary .jf-consent input { accent-color: var(--s-terracotta); }

/* 도움말 */
.jf-wrap.jf-tpl-sanctuary .jf-field-help { color: var(--s-text-3); }

/* 제출 — 그라데이션 */
.jf-wrap.jf-tpl-sanctuary .jf-submit-btn {
  background: linear-gradient(135deg, var(--s-terracotta) 0%, var(--s-terracotta-deep) 100%) !important;
  color: #fff !important;
  border: none;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(194,111,77,0.32);
  font-weight: 800;
}
.jf-wrap.jf-tpl-sanctuary .jf-submit-btn::before { display: none; }
.jf-wrap.jf-tpl-sanctuary .jf-submit-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, var(--s-terracotta-deep) 0%, var(--s-terracotta) 100%) !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(194,111,77,0.40);
}

/* 메시지 */
.jf-wrap.jf-tpl-sanctuary .jf-form-msg.success {
  background: rgba(107,122,79,0.10);
  color: var(--s-olive);
  border: 1px solid rgba(107,122,79,0.30);
  border-radius: 12px;
}
.jf-wrap.jf-tpl-sanctuary .jf-form-msg.error {
  background: rgba(194,111,77,0.10);
  color: var(--s-terracotta-deep);
  border: 1px solid rgba(194,111,77,0.30);
  border-radius: 12px;
}

/* 테이블 행 */
.jf-wrap.jf-tpl-sanctuary .jf-table-rows {
  background: var(--s-bg);
  border: 1.5px solid var(--s-line);
  border-radius: 14px;
}
.jf-wrap.jf-tpl-sanctuary .jf-table-head {
  background: var(--s-bg-2);
  color: var(--s-text-2);
}
.jf-wrap.jf-tpl-sanctuary .jf-table-row { border-color: var(--s-line); }
.jf-wrap.jf-tpl-sanctuary .jf-table-add {
  background: var(--s-terracotta-soft);
  color: var(--s-terracotta);
  border: 1px dashed var(--s-terracotta);
  border-radius: 12px;
}
.jf-wrap.jf-tpl-sanctuary .jf-table-add:hover {
  background: var(--s-terracotta);
  color: #fff;
  border-style: solid;
}

/* 멀티스텝 */
.jf-wrap.jf-tpl-sanctuary .jf-step-dot {
  background: var(--s-card);
  border-color: var(--s-line);
  color: var(--s-text-3);
  border-radius: 12px;
}
.jf-wrap.jf-tpl-sanctuary .jf-step-dot span { background: var(--s-bg-2); color: var(--s-text-2); }
.jf-wrap.jf-tpl-sanctuary .jf-step-dot.is-active {
  background: var(--s-terracotta-soft);
  border-color: var(--s-terracotta);
  color: var(--s-terracotta-deep);
}
.jf-wrap.jf-tpl-sanctuary .jf-step-dot.is-active span,
.jf-wrap.jf-tpl-sanctuary .jf-step-dot.is-done span {
  background: var(--s-terracotta); color: #fff;
}
.jf-wrap.jf-tpl-sanctuary .jf-step-btn {
  background: var(--s-card); border: 1px solid var(--s-line); color: var(--s-text); border-radius: 12px;
}
.jf-wrap.jf-tpl-sanctuary .jf-step-next {
  background: var(--s-terracotta); color: #fff; border-color: var(--s-terracotta);
}

/* poster / notice */
.jf-wrap.jf-tpl-sanctuary .jf-block-poster .jf-poster-caption { color: var(--s-text-3); }
.jf-wrap.jf-tpl-sanctuary .jf-block-notice {
  background: var(--s-card); border: 1px solid var(--s-line); color: var(--s-text); border-radius: 16px;
  box-shadow: 0 2px 8px rgba(42,31,21,0.04);
}