/* 풀빌라 상세 「이 풀빌라와 비슷한 숙소」 (2026-10-10 related_villas) — 후기 구역 바로 아래 가로 캐러셀(scroll-snap + 이전/다음 버튼).
   롤백: build.mjs 의 detail 줄에서 villa-related.css / villa-related.mjs / relatedSection 을 빼거나 이 PR revert. */
body[data-page="detail"] .rv-section{--rv-ink:#0b2a4a;--rv-sub:#3f5563;padding:8px 0 56px;min-width:0}
body[data-page="detail"] .rv-top{align-items:center;margin-bottom:6px}
body[data-page="detail"] .rv-top h2{margin:0}
body[data-page="detail"] .rv-sub{margin:6px 0 0;font-size:14px;line-height:1.6;color:var(--rv-sub)}
body[data-page="detail"] .rv-arrows{flex:none;display:flex;gap:8px}
body[data-page="detail"] .rv-arrow{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:#fff;color:var(--rv-ink);box-shadow:inset 0 0 0 1.5px #6f8cab}
body[data-page="detail"] .rv-arrow:disabled{opacity:1;cursor:default;background:#e4edf6;color:#4c6277;box-shadow:inset 0 0 0 1.5px #b7c8da}
body[data-page="detail"] .rv-arrow:not(:disabled):hover{background:#eaf2fc}
body[data-page="detail"] .rv-rail{display:flex;gap:16px;margin:0;padding:12px 2px 14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:2px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;scrollbar-width:thin}
body[data-page="detail"] .rv-rail:focus-visible{outline:3px solid #14829c;outline-offset:2px;border-radius:12px}
body[data-page="detail"] .rv-card{flex:0 0 min(250px,72%);scroll-snap-align:start;min-width:0}
body[data-page="detail"] .rv-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 10px #0b2a4a10}
body[data-page="detail"] .rv-photo{display:block;position:relative;overflow:hidden}
body[data-page="detail"] .rv-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:#e8eff4;color:transparent}
body[data-page="detail"] .rv-tag,body[data-page="detail"] .rv-video{position:absolute;left:10px;padding:3px 9px;border-radius:4px;font-size:12px;font-weight:700;line-height:1.5;background:#fffef5ee;color:#102a37}
body[data-page="detail"] .rv-tag{bottom:10px}
body[data-page="detail"] .rv-video{top:10px;background:#0b2a4a;color:#fff}
body[data-page="detail"] .rv-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
body[data-page="detail"] .rv-code{font-size:12px;color:var(--rv-sub)}
body[data-page="detail"] .rv-body h3{margin:0;font-size:16px;line-height:1.5;color:var(--rv-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:48px}
body[data-page="detail"] .rv-body h3 a{display:block}
body[data-page="detail"] .rv-body h3 a:hover{text-decoration:underline}
body[data-page="detail"] .rv-price{margin-top:auto;padding-top:10px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:1px;font-size:13px;color:var(--rv-sub)}
body[data-page="detail"] .rv-price small{font-size:12px;color:var(--rv-sub)}
body[data-page="detail"] .rv-price strong{margin-left:8px;font-size:16px;color:var(--rv-ink);white-space:nowrap}
body[data-page="detail"] .rv-hint{margin:2px 0 0;text-align:center;font-size:13px;color:var(--rv-sub)}
@media(max-width:700px){
 body[data-page="detail"] .rv-top{flex-direction:row;display:flex;align-items:flex-end;gap:12px}
 body[data-page="detail"] .rv-top h2{font-size:22px}
 body[data-page="detail"] .rv-sub{font-size:13px}
 body[data-page="detail"] .rv-section{padding-bottom:110px}
}
@media(min-width:701px){
 body[data-page="detail"] .rv-card{flex-basis:272px}
 body[data-page="detail"] .rv-hint{display:none}
}
@media(prefers-reduced-motion:reduce){body[data-page="detail"] .rv-rail{scroll-behavior:auto}}
