/* 돌담 풀빌라 — 사이트 CSS. 색·글꼴은 hm-tokens.css 변수, 팔레트는 analysis.json(검정 · #1D292C · 흰색 · 회색).
   업종 규칙: 글자 최저 18px · 최대 50px(첫 화면 큰 제목만 최대 150px) · 한글 고운돋움 + 영문 Lato. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:var(--header-h,0px)}
body{margin:0;background:var(--hm-color-bg);color:var(--hm-color-text);font-family:var(--hm-font-body);font-size:18px;line-height:1.6;overflow-wrap:break-word;word-break:keep-all;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none;transition:color .2s ease,background-color .2s ease,border-color .2s ease,opacity .2s ease}
button,input,select{font:inherit;color:inherit}
h1,h2,h3,p,ul,dl,dd,figure{margin:0;padding:0}
ul{list-style:none}
:focus-visible{outline:2px solid #000;outline-offset:3px}

/* ── 머리글 ── 로고는 가로 가운데, 위 40px (원본 실측) */
:root{--header-h:88px}
.page-home{--header-h:106px}
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--header-h);display:flex;justify-content:center;align-items:flex-start;padding:31px 16px 0;background:transparent}
.page-reservation .site-header{background:#fff;border-bottom:1px solid var(--hm-color-border);align-items:center;padding-top:0}
.logo{text-shadow:0 1px 12px rgba(0,0,0,.7);display:block;font-size:24px;line-height:27px;letter-spacing:.3em;padding:9px 0 9px .3em;color:#fff;white-space:nowrap}
.logo:hover{color:var(--hm-color-accent)}
.site-header__actions{position:absolute;right:clamp(16px,3vw,40px);top:28px;display:flex;gap:8px}

/* ── 바닥글 ── */
.site-footer{border-top:1px solid var(--hm-color-border);padding:48px 0 64px;background:#fff;color:var(--hm-color-muted)}
.site-footer__info,.site-footer__legal{max-width:var(--hm-maxw);margin:0 auto;padding:0 clamp(16px,4vw,48px)}
.site-footer__info{display:grid;gap:6px}
.site-footer__name{color:#000;font-size:20px}
.site-footer address{font-style:normal}
.site-footer a{display:inline-block;padding:10px 2px;color:#000}
.site-footer a:hover{color:var(--hm-color-accent)}
.site-footer__legal{margin-top:12px}
.site-footer__legal a{color:var(--hm-color-muted);font-size:18px}
.page-home .site-footer{padding:0;border:0;background:transparent}
.page-home .site-footer__info{display:none}
.page-home .site-footer__legal{padding:0;position:fixed;left:max(12px,env(safe-area-inset-left));bottom:max(4px,env(safe-area-inset-bottom));z-index:1100;margin:0}

/* ── 첫 화면 (STRUCTURE 페이지1 #1) ── */
.page-home,.page-home main{background:#fff}
.hero{position:relative;height:100vh;height:100dvh;min-height:620px;overflow:hidden;background:#fff;color:#fff;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:0}
.hero__media>*{position:absolute;inset:0;width:100%;height:100%}
.hero__video{object-fit:cover;z-index:1}
.hero__room{object-fit:cover;opacity:0;z-index:2}
.hero__dim{display:none}
/* 레터박스 첫 상태: 흐린 길 사진 + 붉은·청록 색번짐 */
.hero__road{opacity:0;z-index:1;overflow:hidden;background:#111}
.hero__road-img{position:absolute;inset:-4%;width:108%;height:108%;max-width:none;object-fit:cover;filter:blur(16px)}
.hero__road-r,.hero__road-c{position:absolute;inset:0;background:url(/assets/images/scene-road.webp) center/cover;background-color:#f33;background-blend-mode:multiply;mix-blend-mode:screen;opacity:.3;filter:blur(16px) grayscale(1)}
.hero__road-r{transform:translateX(8px)}
.hero__road-c{background-color:#2cf;transform:translateX(-8px)}
.hero__band{display:none;position:absolute;left:0;right:0;height:19.4%;background:#fff;z-index:4}
.js .hero__band{display:block}
.hero__band--top{top:0}
.hero__band--bottom{bottom:0}
.hero > .hero__lead,.hero > .hero__title,.hero > .hero__tagline,.hero > .cta,.hero > .hero__phone{z-index:6}
.hero__lead{display:none;position:absolute;left:50%;top:50%;width:min(94vw,1200px);transform:translate(-50%,-50%);text-align:center;font-size:clamp(22px,3vw,42px);line-height:1.25;letter-spacing:.005em;color:#fff;font-weight:400}
.js .hero__lead{display:block}
.hero__lead-thin{font-weight:400}
.hero__lead strong{font-weight:700}
.hero__title{position:absolute;left:50%;top:calc(50% - 72px);width:100%;transform:translate(-50%,-50%);text-align:center;font-family:"Do Hyeon",var(--hm-font-body);font-weight:400;font-size:clamp(25px,5.7vw,85px);line-height:.96;letter-spacing:0;color:#fff;white-space:nowrap;text-shadow:0 2px 24px rgba(0,0,0,.6),0 0 3px rgba(0,0,0,.35)}
.hero__line{display:block}
.hero__tagline{position:absolute;left:50%;top:calc(50% + 66px);width:min(1424px,92vw);transform:translate(-50%,-50%);text-align:center;font-family:"Do Hyeon",var(--hm-font-body);font-size:clamp(20px,2.3vw,32px);line-height:1.5;letter-spacing:.04em;color:#fff;font-weight:400;text-wrap:balance;text-shadow:0 0 6px rgba(0,0,0,.85),0 1px 16px rgba(0,0,0,.8)}
@media (max-width:760px){.hero__tagline{top:calc(50% + 52px);max-width:340px}}

.cta{position:absolute;left:50%;top:calc(50% + 147px);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;min-width:222px;height:55px;padding:0 28px;background:rgba(255,255,255,.18);-webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);border:1px solid rgba(255,255,255,.5);box-shadow:0 8px 32px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.45);color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.45);font-size:18px;letter-spacing:.12em;font-weight:500;text-transform:uppercase;white-space:nowrap;transition:padding .3s ease,height .3s ease,background-color .2s ease}
.cta:hover{padding:0 40px;background:rgba(255,255,255,.3)}
.cta i{position:absolute;width:4px;height:4px;background:#fff;transition:transform .35s ease}
.cta i:nth-of-type(1){left:-7px;top:-7px}
.cta i:nth-of-type(2){right:-7px;top:-7px}
.cta i:nth-of-type(3){left:-7px;bottom:-7px}
.cta i:nth-of-type(4){right:-7px;bottom:-7px}
.cta:hover i:nth-of-type(1){transform:translate(-4px,-4px)}
.cta:hover i:nth-of-type(2){transform:translate(4px,-4px)}
.cta:hover i:nth-of-type(3){transform:translate(-4px,4px)}
.cta:hover i:nth-of-type(4){transform:translate(4px,4px)}
.hero.is-scene .cta{height:45px}
.cta__label{display:block;min-width:7.2em;text-align:center}
.cta.is-blink .cta__label{animation:ctaBlink 1.2s linear forwards}
@keyframes ctaBlink{0%{opacity:1}14%{opacity:0}28%{opacity:1}42%{opacity:0}56%{opacity:1}72%{opacity:0}100%{opacity:0}}
@keyframes ctaLabelBlink{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}100%{opacity:1}}

.hero__phone{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 16px;color:#fff;font-size:18px;line-height:24px;letter-spacing:.08em;white-space:nowrap;text-shadow:0 0 6px rgba(0,0,0,.85),0 1px 16px rgba(0,0,0,.8)}
.hero__phone svg{width:40px;height:40px;color:#fff}
.hero__phone:hover{color:#fff}

/* 로딩 화면 (JS 가 켜져 있을 때만) */
.loader{display:none}
.js .loader{display:block;position:fixed;inset:0;z-index:2000;background:#fff}
.loader__logo{--p:0;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(36px,12vw,68px);line-height:1.15;letter-spacing:.22em;padding-left:.22em;color:#000;white-space:nowrap;-webkit-mask-image:linear-gradient(90deg,#000 calc(var(--p) * 1% - 20%),transparent calc(var(--p) * 1%));mask-image:linear-gradient(90deg,#000 calc(var(--p) * 1% - 20%),transparent calc(var(--p) * 1%))}
.loader__count{position:absolute;left:50%;top:calc(50% + 65px);transform:translateX(-50%);font-family:var(--hm-font-body);font-size:18px;letter-spacing:.1em;color:#555;font-variant-numeric:tabular-nums}
@media (max-width:760px){.loader__count{top:calc(50% + 52px)}}

/* ── 예약 페이지 ── */
.page-reservation main{padding-top:var(--header-h)}
.rs{width:100%;max-width:var(--hm-maxw);margin:0 auto;padding:0 clamp(16px,4vw,48px)}
.rs-intro{padding:clamp(40px,6vw,88px) 0 32px}
.rs-intro h1{font-size:clamp(34px,4vw,50px);line-height:1.2;font-weight:400;letter-spacing:.005em}
.rs-intro p{margin-top:16px;max-width:46em;color:var(--hm-color-accent)}
.rs-search{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:end;padding:24px;background:var(--hm-color-surface);border:1px solid var(--hm-color-border)}
.rs-field{display:grid;gap:8px;min-width:0}
.rs-field label,.rs-field span.lbl{font-size:18px;color:var(--hm-color-accent)}
.rs-field input,.rs-field select{width:100%;height:52px;padding:0 14px;background:#fff;border:1px solid var(--hm-color-border);border-radius:0;color:#000;font-size:18px;color-scheme:light;transition:border-color .2s ease}
.rs-field input:hover,.rs-field select:hover{border-color:#000}
.rs-summary{align-self:end;min-height:52px;display:flex;align-items:center;font-size:18px;color:#000}
.rs-error{grid-column:1/-1;color:var(--hm-color-danger);min-height:0}
.rs-error:empty{display:none}
.rs-grid{margin-top:32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:24px;align-items:start}
.rs-card{background:var(--hm-color-surface);border:1px solid var(--hm-color-border);display:grid;grid-template-rows:auto 1fr;height:100%}
.rs-gallery{display:grid;gap:2px;background:#fff}
.rs-gallery__main{position:relative;aspect-ratio:3/2;overflow:hidden;background:#eee}
.rs-gallery__main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .25s ease}
.rs-gallery__main img.is-fading{opacity:0}
.rs-gallery__count{position:absolute;right:0;bottom:0;padding:4px 12px;background:rgba(0,0,0,.7);font-size:18px}
.rs-gallery__thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
.rs-thumb{position:relative;aspect-ratio:3/2;min-height:48px;padding:0;border:0;background:#eee;cursor:pointer;overflow:hidden}
.rs-thumb img{width:100%;height:100%;object-fit:cover;opacity:.55;transition:opacity .2s ease}
.rs-thumb:hover img,.rs-thumb[aria-current="true"] img{opacity:1}
.rs-thumb[aria-current="true"]{outline:2px solid #000;outline-offset:-2px}
.rs-body{padding:24px;display:grid;gap:16px;align-content:start}
.rs-body h2{font-size:clamp(26px,2.4vw,32px);line-height:1.25;font-weight:400}
.rs-body h2 small{display:block;margin-top:4px;font-size:18px;color:var(--hm-color-muted);font-weight:400}
.rs-spec{display:grid;grid-template-columns:auto 1fr;gap:6px 16px}
.rs-spec dt{color:var(--hm-color-muted)}
.rs-spec dd{color:#000}
.rs-feat{display:grid;gap:4px}
.rs-feat li{padding-left:18px;position:relative}
.rs-feat li::before{content:"";position:absolute;left:0;top:.8em;width:6px;height:6px;background:#000}
.rs-actions{display:grid;gap:10px;margin-top:8px}
.btn{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;border:1px solid #000;background:#000;color:#fff;font-size:18px;font-weight:500;letter-spacing:.04em;cursor:pointer;text-align:center;transition:background-color .25s ease,color .25s ease,border-color .25s ease}
.btn:hover{background:transparent;color:#000}
.btn--ghost{background:transparent;color:#000}
.btn--ghost:hover{background:#000;color:#fff}
.rs-info{padding:clamp(48px,6vw,96px) 0 clamp(48px,6vw,96px)}
.rs-info h2{font-size:clamp(28px,3vw,40px);font-weight:400;line-height:1.25;margin-bottom:24px}
.rs-info ul{display:grid;gap:12px;max-width:52em}
.rs-info li{padding:14px 0;border-top:1px solid var(--hm-color-border)}
.rs-info li strong{display:inline-block;min-width:7em;color:var(--hm-color-accent);font-weight:400}
.rs-info [data-hm-slot="map"]{margin-top:32px}
@media (max-width:1023px){.rs-search{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.rs-search{grid-template-columns:minmax(0,1fr);padding:16px}.rs-body{padding:18px}.rs-info li strong{display:block}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* 흰 바탕 쪽 머리글 로고는 검정 (홈 첫 화면은 영상 위라 흰색 유지) */
.page-reservation .logo{color:#000;text-shadow:none}

/* 홈 로고: 로딩 중(흰 화면)에는 검정, 첫 화면이 열리면 흰색 */
.page-home .logo{color:#000;text-shadow:none;transition:color .6s ease}
.page-home.is-hero .logo{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.7)}

/* 전화 안내: 로딩 중에는 검정, 첫 화면이 열리면 흰색 */
.page-home .hero__phone{color:#000;text-shadow:none;transition:color .6s ease}
.page-home .hero__phone svg{color:inherit}
.page-home.is-hero .hero__phone{color:#fff;text-shadow:0 0 6px rgba(0,0,0,.85),0 1px 16px rgba(0,0,0,.8)}

/* 로고 그림자 제거 */
.logo,.page-home .logo,.page-home.is-hero .logo,.page-home.is-light .logo,.page-reservation .logo{text-shadow:none!important}

.hero__lead,.hero__lead *{color:#fff!important}

/* Do Hyeon 은 굵기가 한 가지뿐이라, 굵게(bold) 지정되면 브라우저가 억지로 덧칠해 글자가 뭉개진다 → 전부 보통 굵기로 고정 */
html,body,h1,h2,h3,h4,h5,h6,strong,b,th,label,button,input,select,a,span,p,li,small,address{font-weight:400!important;font-synthesis:none}

/* 네이버 지도(오시는 길) — 모바일 우선: 한 줄 버튼, 넓은 화면에서 두 칸 */
.nm__map{width:100%;height:320px;border-radius:12px;overflow:hidden;background:var(--hm-color-surface);border:1px solid var(--hm-color-border)}
.nm__map.is-fallback{display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:var(--hm-color-muted);font-size:16px}
.nm__actions{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:16px}
@media (min-width:768px){.nm__map{height:420px}.nm__actions{grid-template-columns:repeat(2,minmax(0,1fr));max-width:640px}}

/* ── 문의 게시판 · 개인정보 처리방침 (흰 바탕 쪽) + 머리글 메뉴 ── */
.site-nav{position:absolute;left:clamp(16px,3vw,40px);top:28px}
.site-nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:#fff;white-space:nowrap}
.site-nav a:hover{color:var(--hm-color-accent)}
.page-reservation .site-nav a,.page-qna .site-nav a,.page-legal .site-nav a,.page-home .site-nav a,.page-home.is-light .site-nav a{color:#000}
.page-home.is-hero .site-nav a{color:#fff}
.page-home.is-hero .site-nav a:hover{color:rgba(255,255,255,.7)}
.page-qna .site-header,.page-legal .site-header{background:#fff;border-bottom:1px solid var(--hm-color-border);align-items:center;padding-top:0}
.page-qna .logo,.page-legal .logo{color:#000;text-shadow:none}
.page-qna main,.page-legal main{padding-top:var(--header-h)}
.hm-module-page,.legal{width:100%;max-width:var(--hm-maxw);margin:0 auto;padding:clamp(32px,5vw,72px) clamp(16px,4vw,48px) 64px}
.hm-module-page>h1,.legal>h1{font-size:clamp(34px,4vw,50px);line-height:1.2;font-weight:400;margin-bottom:24px}
.hm-module-page .hm-qna__heading{display:none}
.legal h2{font-size:22px;line-height:1.4;font-weight:400;margin:32px 0 8px}
.legal p,.legal li{max-width:46em}
.legal ul{padding-left:1.2em;list-style:disc}
.page-home .site-nav,.page-home .site-nav a{pointer-events:auto}
.hm-admin-link{display:inline-block;padding:10px 2px}
@media (max-width:859px){
  .site-nav{left:0;right:0;top:62px;text-align:center}
  .page-reservation,.page-qna,.page-legal{--header-h:108px}
  .page-reservation .site-header,.page-qna .site-header,.page-legal .site-header{align-items:flex-start;padding-top:31px}
}
/* 문의 게시판 글자: 업종 규칙(최저 18px)에 맞춤 */
.hm-qna,.hm-qna .hm-qna__no,.hm-qna .hm-qna__date,.hm-qna .hm-qna__author,.hm-qna .hm-qna__status,.hm-qna .hm-qna__meta,.hm-qna .hm-qna__note,.hm-qna .hm-qna__noreply,.hm-qna .hm-qna__rdate,.hm-qna .hm-qna__write label,.hm-qna .hm-qna__consent,.hm-qna .hm-qna__consent label,.hm-qna input,.hm-qna textarea,.hm-qna select,.hm-qna button{font-size:18px}
.hm-qna{max-width:var(--hm-maxw)}
.hm-qna .hm-qna__write{max-width:720px}