/* bw-hero-slider.css — 홈 메인 슬라이드 배너 + 검색 카드 (2026-09-27)
   마크업: includes/_hero_slides.php bwh_render() · 동작: bw-hero-slider.js
   높이는 고정(레이아웃 밀림 없음). 헤더가 투명 오버레이(position:fixed)일 때 글자는 --bw-hdr-h 만큼 아래에서 시작한다.
   오른쪽 아래 고정 버튼(SOS·챗봇·문의 위젯)과 겹치지 않게 컨트롤 막대 오른쪽 끝을 96px 이상 띄운다. */

.bwh{
  --bwh-gut: max(var(--bw-gutter, 24px), calc((100% - var(--bw-container, 1240px)) / 2 + var(--bw-gutter, 24px)));
  --bwh-gut-r: max(var(--bwh-gut), 96px);
  --bwh-ovl: 40px;                       /* 아래 검색 카드가 히어로에 겹치는 높이 */
  --bwh-bar-b: calc(var(--bwh-ovl) + 26px);
  --bwh-hdr: var(--bw-hdr-h, 72px);
  --bwh-accent: #FFB38A;
  position: relative; isolation: isolate; overflow: hidden;
  height: clamp(560px, 88vh, 880px); height: clamp(560px, 88svh, 880px);
  background: #0B0E14; color: #fff;
  font-family: var(--bw-font-sans, "Pretendard Variable", Pretendard, system-ui, sans-serif);
}
.bwh *, .bwh *::before, .bwh *::after { box-sizing: border-box; }
@media (max-width: 1023px) { .bwh { height: max(520px, 70vh); height: max(520px, 70svh); } }
@media (max-width: 767px)  { .bwh { height: max(520px, 78vh); height: max(520px, 78svh); --bwh-ovl: 24px; --bwh-bar-b: calc(var(--bwh-ovl) + 18px); --bwh-hdr: var(--bw-hdr-h, 56px); } }

.bwh-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ── 슬라이드 ── */
.bwh__slides { position: absolute; inset: 0; touch-action: pan-y; -webkit-user-select: none; user-select: none; }
.bwh-slide { position: absolute; inset: 0; z-index: 0; opacity: 0; visibility: hidden; transition: opacity .75s ease, visibility 0s linear .75s; }
.bwh-slide.is-active { z-index: 1; opacity: 1; visibility: visible; transition: opacity .75s ease, visibility 0s; }
.bwh-slide__media { position: absolute; inset: 0; overflow: hidden; background: #0B0E14; }
.bwh-slide__media picture { display: contents; }
.bwh-slide__img, .bwh-slide__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--focus, 50% 50%); transform-origin: 50% 50%; }
.bwh-slide__video { z-index: 1; opacity: 0; transition: opacity .6s; }
.bwh-slide__video.is-on { opacity: 1; }
.bwh-slide.is-kb .bwh-slide__img { animation: bwh-kb 12s ease-out both; }
@keyframes bwh-kb { from { transform: scale(1.001); } to { transform: scale(1.085); } }

/* 가독성 그라데이션 — 슬라이드별 --ov(관리자 '어둡게' 값) */
.bwh-slide__scrim { position: absolute; inset: 0; pointer-events: none; }
.bwh-slide--left .bwh-slide__scrim {
  background:
    linear-gradient(90deg, rgba(6,9,16,calc(var(--ov, .4) + .38)) 0%, rgba(6,9,16,calc(var(--ov, .4) + .12)) 40%, rgba(6,9,16,calc(var(--ov, .4) * .35)) 72%, rgba(6,9,16,0) 100%),
    linear-gradient(180deg, rgba(6,9,16,.5) 0%, rgba(6,9,16,0) 24%),
    linear-gradient(0deg, rgba(6,9,16,.55) 0%, rgba(6,9,16,0) 34%);
}
.bwh-slide--center .bwh-slide__scrim {
  background:
    radial-gradient(ellipse 72% 62% at 50% 50%, rgba(6,9,16,calc(var(--ov, .4) + .2)) 0%, rgba(6,9,16,var(--ov, .4)) 60%, rgba(6,9,16,calc(var(--ov, .4) + .08)) 100%),
    linear-gradient(180deg, rgba(6,9,16,.5) 0%, rgba(6,9,16,0) 26%),
    linear-gradient(0deg, rgba(6,9,16,.6) 0%, rgba(6,9,16,0) 36%);
}
/* 밝은 사진 + 어두운 글자(관리자 글자색) */
.bwh-slide--ink .bwh-slide__scrim { background: linear-gradient(90deg, rgba(255,255,255,calc(var(--ov, .4) + .35)) 0%, rgba(255,255,255,calc(var(--ov, .4) * .5)) 60%, rgba(255,255,255,0) 100%), linear-gradient(180deg, rgba(6,9,16,.45) 0%, rgba(6,9,16,0) 22%); }
.bwh-slide--ink.bwh-slide--center .bwh-slide__scrim { background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(255,255,255,calc(var(--ov, .4) + .3)) 0%, rgba(255,255,255,calc(var(--ov, .4) * .4)) 70%), linear-gradient(180deg, rgba(6,9,16,.45) 0%, rgba(6,9,16,0) 22%); }
.bwh-slide--ink { --bwh-accent: #C2410C; }

/* 행사(포스터형) 슬라이드 배경 */
.bwh-slide--event .bwh-slide__media {
  background:
    radial-gradient(55% 75% at 76% 46%, rgba(255,90,31,.42) 0%, rgba(255,90,31,0) 62%),
    radial-gradient(45% 60% at 6% 100%, rgba(20,184,166,.30) 0%, rgba(20,184,166,0) 60%),
    radial-gradient(40% 50% at 42% 0%, rgba(107,79,230,.30) 0%, rgba(107,79,230,0) 60%),
    linear-gradient(135deg, #0A1024 0%, #121B3B 55%, #0B0E14 100%);
}
.bwh-slide--event .bwh-slide__scrim { background: linear-gradient(180deg, rgba(6,9,16,.35) 0%, rgba(6,9,16,0) 22%); }

/* ── 글자 ── */
.bwh-slide__inner { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; padding: calc(var(--bwh-hdr) + 28px) var(--bwh-gut) calc(var(--bwh-bar-b) + 80px); }
.bwh-slide--center .bwh-slide__inner { justify-content: center; text-align: center; }
.bwh-slide__text { max-width: 640px; color: var(--tc, #fff); text-shadow: 0 2px 22px rgba(0,0,0,.28); }
.bwh-slide--ink .bwh-slide__text { text-shadow: none; }
.bwh-slide--event .bwh-slide__text { max-width: min(600px, 52%); }
.bwh-slide--center .bwh-slide__text { width: 100%; max-width: 940px; margin: 0 auto; }   /* 블록 배치: 웹폰트 교체 때 글자 폭이 바뀌어도 상자 위치가 그대로(CLS 0) */
.bwh-slide__preview { display: inline-block; margin: 0 0 12px; padding: 4px 10px; border-radius: 6px; background: #FDE68A; color: #78350F; font-size: 12px; font-weight: 800; text-shadow: none; }
.bwh-slide__eyebrow { display: inline-flex; align-items: center; margin: 0; color: inherit; padding: 7px 14px; border-radius: 999px; font-size: 14px; font-weight: 700; letter-spacing: .01em; line-height: 1.2;
  background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 1px rgba(255,255,255,.26); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); text-shadow: none; }
.bwh-slide--ink .bwh-slide__eyebrow { background: rgba(255,255,255,.7); box-shadow: inset 0 0 0 1px rgba(11,14,20,.12); }
.bwh-slide__title { margin: 18px 0 0; font-family: inherit; font-size: clamp(32px, 3.9vw, 58px); line-height: 1.16; letter-spacing: -.035em; font-weight: 400; color: inherit; word-break: keep-all; overflow-wrap: anywhere; text-wrap: balance; }
.bwh-slide__title .l1, .bwh-slide__title .l2 { display: block; }
.bwh-slide__title .l2 { font-weight: 800; color: var(--bwh-accent); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bwh-slide--center .bwh-slide__title { font-size: clamp(38px, 5.6vw, 84px); font-weight: 800; line-height: 1.1; letter-spacing: -.04em; min-height: 2.2em; }
.bwh-slide--center .bwh-slide__cta .bwh-btn { flex: 0 0 auto; width: 288px; white-space: normal; text-align: center; line-height: 1.2; }   /* 고정 폭: 웹폰트가 늦게 와도 버튼 크기·위치 그대로(CLS) */
.bwh-slide--center .bwh-slide__eyebrow { min-width: 200px; justify-content: center; }
.bwh-slide__sub { color: inherit; margin: 18px 0 0; font-size: clamp(16px, 1.45vw, 20px); line-height: 1.55; font-weight: 500; opacity: .94; word-break: keep-all; }
.bwh-slide__tags { color: inherit; margin: 20px 0 0; font-size: clamp(16px, 1.5vw, 21px); line-height: 1.55; font-weight: 500; word-break: keep-all; }
.bwh-slide__tags span { display: block; opacity: .94; }
.bwh-slide__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 32px; }
.bwh-slide--center .bwh-slide__cta { justify-content: center; }

/* 버튼 — 기본: 가운데 정렬(토스형) 채움 + 연한 버튼 / 왼쪽 정렬(쿠쿠형) 외곽선 + 글자 링크 */
.bwh-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 0 28px; border-radius: 999px; font-size: 17px; font-weight: 700; line-height: 1; text-decoration: none; text-shadow: none; white-space: nowrap;
  transition: background-color .2s, color .2s, box-shadow .2s, transform .2s; }
.bwh-btn .bw-icon { width: 18px; height: 18px; flex: 0 0 auto; }
.bwh-btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.bwh-btn--primary { background: #C2410C; color: #fff; box-shadow: 0 12px 30px -10px rgba(194,65,12,.8); }
.bwh-btn--primary:hover { background: #A8390D; transform: translateY(-1px); }
.bwh-btn--soft { background: rgba(255,255,255,.92); color: #9A3412; }
.bwh-btn--soft:hover { background: #fff; transform: translateY(-1px); }
.bwh-btn--outline { min-height: 56px; padding: 0 34px; border-radius: 4px; color: var(--tc, #fff); background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.82); }
.bwh-btn--outline:hover { background: #fff; color: #0B0E14; }
.bwh-slide--ink .bwh-btn--outline { box-shadow: inset 0 0 0 1.5px rgba(11,14,20,.8); }
.bwh-slide--ink .bwh-btn--outline:hover { background: #0B0E14; color: #fff; }
.bwh-btn--text { min-height: 48px; padding: 0 6px; color: var(--tc, #fff); font-weight: 600; opacity: .92; }
.bwh-btn--text:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }
.bwh-btn--text .bw-icon { width: 16px; height: 16px; }

/* 슬라이드 전환 때 글자 순차 등장 */
.bwh-slide__text > * { transition: opacity .6s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.bwh-slide:not(.is-active) .bwh-slide__text > * { opacity: 0; transform: translateY(18px); transition-duration: .2s; }
.bwh-slide.is-active .bwh-slide__text > :nth-child(2) { transition-delay: .1s; }
.bwh-slide.is-active .bwh-slide__text > :nth-child(3) { transition-delay: .2s; }
.bwh-slide.is-active .bwh-slide__text > :nth-child(4) { transition-delay: .3s; }
.bwh-slide.is-active .bwh-slide__text > :nth-child(5) { transition-delay: .4s; }
.bwh-slide.is-active .bwh-slide__text > :nth-child(6) { transition-delay: .5s; }

/* 행사 포스터 카드 — 자르지 않고 원본 비율 그대로 */
.bwh-slide__poster { position: absolute; z-index: 2; margin: 0; top: calc(var(--bwh-hdr) + 24px); bottom: calc(var(--bwh-bar-b) + 70px); right: calc(var(--bwh-gut-r) + 2%); width: min(34%, 430px);
  display: flex; align-items: center; justify-content: center; pointer-events: none; }
.bwh-slide__poster img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; border-radius: 16px; background: rgba(255,255,255,.06);
  box-shadow: 0 36px 80px -24px rgba(0,0,0,.75), 0 0 0 1px rgba(255,255,255,.14); }
.bwh-slide.is-active .bwh-slide__poster { animation: bwh-rise .9s cubic-bezier(.2,.7,.2,1) both; }
@keyframes bwh-rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }

.bwh-slide__credit { position: absolute; z-index: 3; right: var(--bwh-gut-r); bottom: calc(var(--bwh-bar-b) + 58px); margin: 0; max-width: 50%; font-size: 11.5px; line-height: 1.3; text-align: right; color: rgba(255,255,255,.82); text-shadow: 0 1px 3px rgba(0,0,0,.7); }

/* ── 아래 막대: 진행 트랙 + 컨트롤 알약 ── */
.bwh__bar { position: absolute; z-index: 4; left: var(--bwh-gut); right: var(--bwh-gut-r); bottom: var(--bwh-bar-b); display: flex; align-items: center; gap: 22px; pointer-events: none; }
.bwh__bar > * { pointer-events: auto; }
.bwh__track { position: relative; flex: 1 1 auto; height: 2px; border-radius: 2px; background: rgba(255,255,255,.3); }
.bwh__seg { position: absolute; top: -1px; height: 4px; border-radius: 2px; overflow: hidden; background: rgba(255,255,255,.4); transition: left .55s cubic-bezier(.4,0,.2,1); }
.bwh__seg i { position: absolute; inset: 0; background: #fff; transform-origin: 0 50%; transform: scaleX(1); }
.bwh.is-js .bwh__seg i { transform: scaleX(0); }
.bwh.is-js .bwh__seg.is-run i { animation: bwh-fill var(--bwh-iv, 6500ms) linear forwards; }
.bwh.is-paused .bwh__seg.is-run i { animation-play-state: paused; }
.bwh.is-user-paused .bwh__seg i, .bwh.is-static .bwh__seg i { animation: none !important; transform: scaleX(1) !important; }
@keyframes bwh-fill { to { transform: scaleX(1); } }
.bwh__ctrl { flex: 0 0 auto; display: flex; align-items: center; padding: 4px; border-radius: 999px; background: rgba(11,14,20,.52); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.bwh__btn { -webkit-appearance: none; appearance: none; margin: 0; padding: 0; border: 0; width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; background: transparent; color: #fff; cursor: pointer; transition: background-color .2s; }
.bwh__btn .bw-icon { width: 18px; height: 18px; }
.bwh__btn:hover { background: rgba(255,255,255,.16); }
.bwh__btn:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }
.bwh__count { padding: 0 4px; min-width: 52px; text-align: center; font-size: 15px; font-weight: 500; color: rgba(255,255,255,.74); font-variant-numeric: tabular-nums; white-space: nowrap; }
.bwh__count b { color: #fff; font-weight: 800; }
.bwh__sep { margin: 0 4px; opacity: .7; }
.bwh-i-play { display: none; }
.bwh.is-user-paused .bwh-i-play { display: block; }
.bwh.is-user-paused .bwh-i-pause { display: none; }
.bwh--single .bwh__bar { display: none; }

/* 스크롤 안내(토스형) — 넓은 화면에서만 */
.bwh__scroll { position: absolute; z-index: 4; left: 50%; bottom: calc(var(--bwh-bar-b) + 64px); transform: translateX(-50%); display: none; align-items: center; gap: 8px;
  padding: 11px 16px 11px 22px; border-radius: 999px; background: rgba(255,255,255,.88); color: #1F2430; font-size: 15px; font-weight: 700; text-decoration: none;
  box-shadow: 0 10px 30px -10px rgba(0,0,0,.45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: opacity .35s, transform .35s; }
.bwh__scroll .bw-icon { width: 18px; height: 18px; animation: bwh-bob 1.8s ease-in-out infinite; }
.bwh__scroll:hover { background: #fff; }
.bwh__scroll:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.bwh.is-scrolled .bwh__scroll { opacity: 0; pointer-events: none; transform: translate(-50%, 10px); }
@keyframes bwh-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
@media (min-width: 1024px) and (min-height: 660px) { .bwh__scroll { display: inline-flex; } }

/* ── 검색 카드 (히어로 아래 가장자리에 겹침) ── */
.bwh-search { position: relative; z-index: 6; max-width: var(--bw-container, 1240px); margin: calc(-1 * 40px) auto 0; padding: 0 var(--bw-gutter, 24px); }
.bwh-search__card { background: #fff; border-radius: 24px; padding: 18px 20px 16px; box-shadow: 0 26px 60px -22px rgba(11,14,20,.32), 0 2px 10px rgba(11,14,20,.06);
  display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px 24px; align-items: center; }
.bwh-search__label { grid-column: 1 / -1; margin: 0 0 -4px; font-size: 15px; font-weight: 800; color: #0B0E14; letter-spacing: -.01em; }
.bwh-search__field { position: relative; min-width: 0; }
.bwh-search__form { display: flex; align-items: center; gap: 10px; height: 60px; margin: 0; padding: 0 6px 0 18px; border-radius: 16px; background: #F3F4F6; border: 1.5px solid transparent; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.bwh-search__form:focus-within { background: #fff; border-color: #FF5A1F; box-shadow: 0 0 0 4px rgba(255,90,31,.14); }
.bwh-search__icon { -webkit-appearance: none; appearance: none; flex: 0 0 auto; display: grid; place-items: center; width: 40px; height: 40px; margin: 0 -6px 0 -10px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: #C2410C; cursor: pointer; }
.bwh-search__icon .bw-icon { width: 22px; height: 22px; }
.bwh-search__icon:focus-visible { outline: 3px solid #C2410C; outline-offset: 1px; }
.bwh-search__form input { flex: 1 1 auto; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 17px; font-weight: 500; color: #0B0E14; }
.bwh-search__form input::placeholder { color: #6B7280; }
.bwh-search__go { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; height: 48px; padding: 0 20px; border: 0; border-radius: 12px; background: #C2410C; color: #fff; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; transition: background-color .2s; }
.bwh-search__go:hover { background: #A8390D; }
.bwh-search__go .bw-icon { width: 16px; height: 16px; }
.bwh-search__go:focus-visible { outline: 3px solid #C2410C; outline-offset: 2px; }
.bwh-search__field .home-search__suggest { top: calc(100% + 8px); z-index: 60; }
.bwh-search__stats { display: flex; justify-content: flex-end; gap: 22px; margin: 0; padding: 0 4px; list-style: none; }
.bwh-search__stats li { display: flex; flex-direction: column; gap: 2px; min-width: 0; max-width: 120px; }
.bwh-search__stats b { white-space: nowrap; font-size: 22px; font-weight: 800; letter-spacing: -.02em; color: #0B0E14; font-variant-numeric: tabular-nums; line-height: 1.1; }
.bwh-search__stats span { font-size: 12px; font-weight: 600; color: #5B6470; line-height: 1.3; }
.bwh-search__row { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px 14px; min-width: 0; }
.bwh-search__chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; flex: 1 1 auto; }
.bwh-search__chips .lbl { flex: 0 0 auto; white-space: nowrap; font-size: 13px; font-weight: 700; color: #5B6470; margin-right: 2px; }
.bwh-search__chips a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border-radius: 999px; background: #FFF4EE; color: #9A3412; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background-color .2s; }
.bwh-search__chips a:hover { background: #FFE4D6; }
.bwh-search__ai { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 16px; border-radius: 999px; background: #0B0E14; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.bwh-search__ai:hover { background: #262B36; }
.bwh-search__ai .bw-icon { width: 16px; height: 16px; color: #FFB38A; }
.bwh-search a:focus-visible { outline: 3px solid #C2410C; outline-offset: 2px; }

/* ── 전체 배너 대화상자 ── */
.bwh-all { position: fixed; inset: 0; z-index: 2147483100; display: flex; align-items: center; justify-content: center; padding: 24px; }
.bwh-all[hidden] { display: none; }
.bwh-all__backdrop { position: absolute; inset: 0; background: rgba(6,9,16,.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.bwh-all__panel { position: relative; width: min(1080px, 100%); max-height: min(86vh, 860px); overflow: auto; overscroll-behavior: contain; background: #fff; color: #0B0E14; border-radius: 24px; padding: 0 24px 28px; box-shadow: 0 40px 100px -30px rgba(0,0,0,.6); animation: bwh-pop .28s cubic-bezier(.2,.7,.2,1); }
@keyframes bwh-pop { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
.bwh-all__head { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 0 14px; background: #fff; }
.bwh-all__title { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.bwh-all__title span { margin-left: 4px; color: #C2410C; }
.bwh-all__close { -webkit-appearance: none; appearance: none; border: 0; width: 44px; height: 44px; border-radius: 999px; background: #F3F4F6; color: #0B0E14; display: grid; place-items: center; cursor: pointer; }
.bwh-all__close:hover { background: #E5E7EB; }
.bwh-all__close .bw-icon { width: 20px; height: 20px; }
.bwh-all__close:focus-visible { outline: 3px solid #C2410C; outline-offset: 2px; }
.bwh-all__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px 16px; }
.bwh-card { -webkit-appearance: none; appearance: none; width: 100%; margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 10px; border-radius: 16px; }
.bwh-card__img { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: linear-gradient(135deg, #0A1024, #1B2447); transition: box-shadow .2s; }
.bwh-card__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.bwh-card--poster .bwh-card__img img { object-fit: contain; }
.bwh-card:hover .bwh-card__img img { transform: scale(1.04); }
.bwh-card--poster:hover .bwh-card__img img { transform: none; }
.bwh-card__num { position: absolute; left: 10px; top: 10px; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 999px; background: rgba(11,14,20,.72); color: #fff; font-size: 13px; font-weight: 800; display: grid; place-items: center; }
.bwh-card__body { display: flex; flex-direction: column; gap: 3px; padding: 0 2px; }
.bwh-card__eyebrow { font-size: 12.5px; font-weight: 700; color: #C2410C; }
.bwh-card__title { font-size: 15px; font-weight: 700; line-height: 1.38; word-break: keep-all; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bwh-card__now { display: none; align-self: flex-start; margin-top: 4px; padding: 3px 8px; border-radius: 6px; background: #FFF4EE; color: #9A3412; font-size: 12px; font-weight: 700; }
.bwh-card[aria-current="true"] .bwh-card__img { box-shadow: 0 0 0 3px #FF5A1F; }
.bwh-card[aria-current="true"] .bwh-card__now { display: inline-block; }
.bwh-card:focus-visible { outline: 3px solid #C2410C; outline-offset: 4px; }
html.bwh-lock, html.bwh-lock body { overflow: hidden; }

/* ── 관리자 바로가기(관리자에게만) ── */
.bwh-admin { position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 950; display: flex; gap: 6px; }
.bwh-admin a { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 999px; background: #0B0E14; color: #fff; font-size: 13px; font-weight: 700; text-decoration: none; box-shadow: 0 8px 24px rgba(0,0,0,.28); }
.bwh-admin a:hover { background: #262B36; }
.bwh-admin .bw-icon { width: 15px; height: 15px; color: #FFB38A; }

/* ── 태블릿 ── */
@media (max-width: 1023px) {
  .bwh-slide__title { font-size: clamp(30px, 4.6vw, 46px); }
  .bwh-slide--center .bwh-slide__title { font-size: clamp(36px, 6.4vw, 60px); }
  .bwh-search__stats { display: none; }
  .bwh-search__card { grid-template-columns: minmax(0, 1fr); }
  .bwh-search__row { flex-direction: column; align-items: flex-start; }   /* 오른쪽 아래 챗봇 버튼과 겹치지 않게 AI 링크를 왼쪽 아래로 */
}

/* ── 모바일 ── */
@media (max-width: 767px) {
  .bwh-slide__inner { align-items: flex-end; padding: calc(var(--bwh-hdr) + 16px) 20px calc(var(--bwh-bar-b) + 66px); }
  .bwh-slide--center .bwh-slide__inner { align-items: center; padding-bottom: calc(var(--bwh-bar-b) + 70px); }
  .bwh-slide--left .bwh-slide__scrim {
    background:
      linear-gradient(0deg, rgba(6,9,16,calc(var(--ov, .4) + .5)) 0%, rgba(6,9,16,calc(var(--ov, .4) + .18)) 42%, rgba(6,9,16,calc(var(--ov, .4) * .3)) 68%, rgba(6,9,16,.45) 100%);
  }
  .bwh-slide--ink.bwh-slide--left .bwh-slide__scrim { background: linear-gradient(0deg, rgba(255,255,255,calc(var(--ov, .4) + .45)) 0%, rgba(255,255,255,calc(var(--ov, .4) * .4)) 55%, rgba(6,9,16,.35) 100%); }
  .bwh-slide__text, .bwh-slide--event .bwh-slide__text { max-width: 100%; }
  .bwh-slide__eyebrow { font-size: 13px; padding: 6px 12px; }
  .bwh-slide__title { margin-top: 12px; font-size: clamp(26px, 7.6vw, 34px); line-height: 1.2; }
  .bwh-slide__title .l2 { -webkit-line-clamp: 3; }
  .bwh-slide--center .bwh-slide__title { font-size: clamp(32px, 9.6vw, 44px); line-height: 1.15; }
  .bwh-slide__sub { margin-top: 12px; font-size: 15px; }
  .bwh-slide__tags { margin-top: 12px; font-size: 15px; }
  .bwh-slide__cta { margin-top: 20px; gap: 8px; }
  .bwh-btn { min-height: 48px; padding: 0 20px; font-size: 15px; }
  .bwh-slide--center .bwh-slide__cta .bwh-btn { min-width: 150px; }
  .bwh-btn--outline { min-height: 48px; padding: 0 22px; }
  .bwh-slide__poster { top: calc(var(--bwh-hdr) + 14px); bottom: auto; left: 0; right: 0; width: auto; height: 33%; }
  .bwh-slide__credit { top: calc(var(--bwh-hdr) + 10px); bottom: auto; right: 12px; max-width: 70%; font-size: 10.5px; }
  .bwh-slide--event .bwh-slide__credit { top: auto; bottom: calc(var(--bwh-bar-b) + 54px); }
  .bwh__bar { left: 16px; right: 60px; gap: 14px; }   /* 오른쪽 가장자리 FAB 손잡이(주황 탭) 비켜 가기 */
  .bwh__ctrl { order: -1; }
  .bwh__btn { width: 44px; height: 44px; }
  .bwh__count { min-width: 46px; font-size: 14px; }
  .bwh, .bwh-search { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }   /* main 좌우 여백(≤360px) 무시하고 화면 폭 가득 */
  .bwh-search { margin-top: -24px; padding: 0 16px; }
  .bwh-search__card { padding: 14px 14px 12px; border-radius: 20px; gap: 12px; }
  .bwh-search__label { font-size: 14px; }
  .bwh-search__form { height: 54px; padding-left: 14px; border-radius: 14px; }
  .bwh-search__form input { font-size: 16px; }
  .bwh-search__go { display: none; }   /* 오른쪽 끝은 첫 화면에서 SOS·문의 버튼에 가려짐 → 왼쪽 돋보기 버튼·키보드 '검색'으로 제출 */
  .bwh-search__form { padding-right: 14px; }
  .bwh-search__row { flex-direction: column; align-items: stretch; }
  .bwh-search__chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -14px; padding: 0 14px 2px; }
  .bwh-search__chips::-webkit-scrollbar { display: none; }
  .bwh-search__ai { justify-content: center; }
  .bwh-all { padding: 0; align-items: flex-end; }
  .bwh-all__panel { width: 100%; max-height: 88vh; max-height: 88dvh; border-radius: 22px 22px 0 0; padding: 0 16px calc(20px + env(safe-area-inset-bottom, 0px)); }
  .bwh-all__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  .bwh-card__title { font-size: 14px; }
  .bwh-admin { bottom: calc(var(--bw-tabbar-h, 56px) + 12px + env(safe-area-inset-bottom, 0px)); }
}
/* 사이트 공통 모바일 규칙(responsive.css: h1·h2 글자 크기 !important, body·p 14px !important)을 히어로 안에서만 되돌림 */
@media (max-width: 767px) {
  html body .bwh .bwh-slide__title { font-size: clamp(26px, 7.6vw, 34px) !important; line-height: 1.2 !important; }
  html body .bwh .bwh-slide--center .bwh-slide__title { font-size: clamp(30px, 8.4vw, 40px) !important; line-height: 1.15 !important; }
  /* 가운데 배너 버튼: 두 칸 같은 폭(글꼴이 늦게 와도 크기·위치가 그대로) */
  .bwh-slide--center .bwh-slide__cta { flex-wrap: nowrap; }
  .bwh-slide--center .bwh-slide__cta .bwh-btn { flex: 1 1 0; width: auto; min-width: 0; max-width: 220px; padding: 0 10px; font-size: 14px; white-space: normal; text-align: center; line-height: 1.2; }
  .bwh-slide--center .bwh-slide__eyebrow { min-width: 160px; }
  .bwh-slide--center .bwh-slide__cta .bwh-btn .bw-icon { display: none; }
  html body .bwh .bwh-slide__eyebrow { font-size: 13px !important; line-height: 1.2 !important; }
  html body .bwh .bwh-slide__sub, html body .bwh .bwh-slide__tags { font-size: 15px !important; line-height: 1.5 !important; }
  html body .bwh .bwh-slide__credit { font-size: 10.5px !important; line-height: 1.3 !important; }
  html body .bwh .bwh-slide__preview { font-size: 12px !important; }
  html body .bwh-search .bwh-search__label { font-size: 14px !important; }
  html body .bwh-all .bwh-all__title { font-size: 18px !important; }
}
@media (max-width: 380px) {
  .bwh-slide__cta .bwh-btn--text { display: none; }
}

/* 움직임 줄이기 */
@media (prefers-reduced-motion: reduce) {
  .bwh-slide, .bwh-slide.is-active { transition: none; }
  .bwh-slide.is-kb .bwh-slide__img { animation: none; }
  .bwh-slide__text > *, .bwh-slide:not(.is-active) .bwh-slide__text > * { transition: none; transform: none; }
  .bwh-slide.is-active .bwh-slide__poster { animation: none; }
  .bwh__seg { transition: none; }
  .bwh__scroll .bw-icon { animation: none; }
  .bwh-all__panel { animation: none; }
}

/* ── QA 시각 점검 보정 (2026-09-27) ──────────────────────────────────────────
   1) 왼쪽 정렬(쿠쿠형) 배너에서는 가운데 '스크롤 안내' 알약을 숨김 — 영·스·베·힌디처럼 버튼 줄이 긴 언어에서 버튼과 한 줄로 겹쳐 보였다 */
.bwh:has(.bwh-slide--left.is-active) .bwh__scroll { opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, 10px); transition: opacity .35s, transform .35s, visibility 0s linear .35s; }
/* 2) 1024~1531px: 검색 카드 오른쪽 끝(통계 숫자)이 SOS·문의 고정 버튼 밑에 깔렸다(1280·1366 노트북) → 그 폭만큼 카드 안쪽 오른쪽 여백 */
@media (min-width: 1024px) and (max-width: 1531.98px) {
  .bwh-search__card { padding-right: calc(20px + clamp(0px, 146px - (100vw - 1240px) / 2, 146px)); }
}
/* 3) 태블릿·PC: 행사 배너 글자 폭을 오른쪽 포스터 앞에서 끊음(768px 에서 영어 제목이 포스터를 침범) */
@media (min-width: 768px) {
  .bwh-slide--event .bwh-slide__text { max-width: min(600px, 52%, calc(100vw - max(96px, (100vw - 1240px) / 2 + 24px) - 2vw - min(34vw, 430px) - max(24px, (100vw - 1240px) / 2 + 24px) - 28px)); }
}
/* 4) 휴대폰: 글자(버튼)와 아래 컨트롤 막대 사이 14px → 28px. 행사 포스터는 위쪽 정렬, 글자와 겹치면 숨김(bw-hero-slider.js fitPoster) */
@media (max-width: 767px) {
  .bwh-slide__inner { padding-bottom: calc(var(--bwh-bar-b) + 80px); }
  .bwh-slide--event .bwh-slide__poster { align-items: flex-start; }
}
.bwh-slide.is-noposter .bwh-slide__poster { display: none; }
/* 5) 가운데 정렬(토스형) 배너 + 스크롤 안내 알약이 보이는 화면(≥1024px·높이 ≥660px): 글자 영역 아래쪽을 알약 높이만큼 더 비움
      — 1280x720 에서 버튼과 알약이 맞닿고, 1366x768 에서 10px 로 붙어 보였다 */
@media (min-width: 1024px) and (min-height: 660px) {
  .bwh-slide--center .bwh-slide__inner { padding-bottom: calc(var(--bwh-bar-b) + 133px); }
}