/* templates/modules/hero_v1/view.css — 히어로 모듈(2026-10-11): 다크 네이비 그라디언트 + 큰 제목 + 금빛 구분선.
   맞춤 디자인 레이아웃(custom_xxx.css)이 첫 모듈일 때 화면 폭 가득 펼치고 워터마크를 얹음. */
.sc-hero{position:relative;overflow:hidden;border-radius:24px;margin-bottom:24px;color:#fff;
  background:radial-gradient(120% 140% at 85% -10%,#1f4f93 0%,rgba(31,79,147,0) 55%),linear-gradient(160deg,#0a1a36 0%,#0f2b55 55%,#0b2144 100%)}
.sc-hero::after{content:"";position:absolute;right:-3%;top:50%;width:min(46%,420px);aspect-ratio:3/4;transform:translateY(-50%);
  background:var(--hero-mark,none) center/contain no-repeat;opacity:.13;pointer-events:none}
.sc-hero-inner{position:relative;z-index:2;max-width:1080px;margin:0 auto;padding:64px 44px 60px}
.sc-hero .eyebrow{font-size:13px;font-weight:700;letter-spacing:.32em;color:#7fb2ff;text-transform:uppercase}
.sc-hero-text{container-type:inline-size;min-width:0}
/* 제목: 글자 영역 폭(cqw) 기준 크기(--hero-fs는 view.php가 글자 수로 정함) + 단어 단위 줄바꿈 + 두 줄일 때 균형 있게 */
.sc-hero h2{margin:18px 0 0;font-size:clamp(26px,var(--hero-fs,8.6cqw),56px);line-height:1.22;font-weight:800;letter-spacing:-.8px;max-width:760px;white-space:pre-line;word-break:keep-all;overflow-wrap:break-word;text-wrap:balance}
.sc-hero .bar{display:block;width:60px;height:3px;border-radius:2px;background:#d9b57b;margin:26px 0}
.sc-hero .verse{margin:0;max-width:600px;font-size:16px;line-height:1.95;color:rgba(255,255,255,.78);white-space:pre-line}
.sc-hero .ref{margin-top:14px;font-size:14px;font-weight:800;color:#fff;letter-spacing:.02em}
.sc-hero .actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.sc-hero .actions a{display:inline-block;padding:13px 28px;border-radius:999px;font-weight:800;font-size:15px;text-decoration:none;transition:transform .15s,box-shadow .15s}
.sc-hero .btn-main{background:linear-gradient(135deg,#3b7be6,#5aa4ff);color:#fff;box-shadow:0 8px 22px rgba(59,123,230,.4)}
.sc-hero .btn-sub{background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.28)}
.sc-hero .actions a:hover{transform:translateY(-2px)}
@media(max-width:640px){
  .sc-hero{border-radius:18px}
  .sc-hero-inner{padding:44px 24px 42px}
  .sc-hero .verse{font-size:15px}
  .sc-hero::after{width:70%;right:-12%;opacity:.1}
}

/* ── 앱 히어로 이미지 슬라이드(2026-10-11): PC는 글자 오른쪽, 모바일은 글자 아래 ── */
.sc-hero-slides{position:relative;margin-top:30px}
.sc-hero-slides .track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.1)}
.sc-hero-slides .track::-webkit-scrollbar{display:none}
.sc-hero-slides .slide{flex:0 0 100%;scroll-snap-align:start;aspect-ratio:1.55/1;display:block;background:#0b2144}
.sc-hero-slides .slide img{width:100%;height:100%;object-fit:cover;display:block}
.sc-hero-slides .dots{display:flex;justify-content:center;gap:7px;margin-top:14px}
.sc-hero-slides .dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);transition:.2s}
.sc-hero-slides .dots i.on{width:22px;border-radius:4px;background:#d9b57b}
@media(min-width:900px){
  .sc-hero.has-slides .sc-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:52px;align-items:center}
  .sc-hero-slides{margin-top:0}
}
/* 편집 모드 도구줄 */
.sc-hero-tools{position:relative;z-index:6;display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 16px;background:rgba(0,0,0,.35);font-size:12.5px;color:#fff}
.sc-hero-tools select,.sc-hero-tools button{font-size:12.5px;padding:3px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.12);color:#fff}
.sc-hero-tools select option{color:#111}
.sc-hero-tools .hint{opacity:.8}

/* ── 서브페이지 상단(compact, 2026-10-11): 홈 히어로를 줄여서 — 표어 글자만, 말씀 본문/버튼/슬라이드 없음 ── */
.sc-hero.compact{margin-bottom:0;border-radius:0 0 28px 28px}
.sc-hero.compact .sc-hero-inner{padding:34px 40px 30px}
.sc-hero.compact h2{margin-top:10px;font-size:clamp(24px,var(--hero-fs,8cqw),38px)}
.sc-hero.compact .bar{margin:16px 0 0}
.sc-hero.compact .verse,.sc-hero.compact .ref,.sc-hero.compact .actions{display:none}
@media(max-width:640px){.sc-hero.compact .sc-hero-inner{padding:26px 22px 24px}}

/* ── 배경 이미지(2026-10-16): 올리면 기본 배경 대신 --hero-bg(view.php가 넘김). 글자가 읽히게 위아래를 어둡게 덮음 ── */
.sc-hero.has-bg{background:linear-gradient(180deg,rgba(2,8,18,.35) 0%,rgba(2,8,18,.18) 35%,rgba(2,8,18,.7) 100%),var(--hero-bg) center/cover no-repeat}
.hero-bgtool{display:flex;flex-wrap:wrap;align-items:center;gap:10px;width:100%;padding-top:6px;border-top:1px dashed rgba(255,255,255,.25);margin-top:4px}
.hero-bgtool .bg-thumb{position:relative;width:128px;height:72px;border-radius:8px;background-size:cover;background-position:center;border:1px solid rgba(255,255,255,.45);overflow:hidden;flex:none}
.hero-bgtool .bg-thumb .bg-def{position:absolute;left:6px;top:5px;font-size:11px;opacity:.85}
.hero-bgtool .bg-thumb .img-btn{left:6px !important;bottom:6px !important;padding:5px 10px !important;font-size:11px !important}
.hero-bgtool .hint{flex:1 1 280px;line-height:1.55}