/* v2: 990px PC/mobile separation. Background extension + protected original layer. */
@font-face{font-family:Pretendard;src:url('../assets/fonts/PretendardVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
.hm-site{font-family:Pretendard,'Malgun Gothic',sans-serif}
.hm-site .site-header{background:#11213d;border-bottom:1px solid #c6b28a55;color:#fff}
.site-header .hm-header-inner{max-width:1800px;height:104px;padding:0 48px;gap:40px}
.site-header .header-logo{width:180px}
.site-header .header-nav{margin-left:auto;gap:clamp(24px,2.5vw,48px)}
.site-header .header-nav a{font-size:17px;font-weight:500;padding:36px 0;letter-spacing:-.025em}
.site-header .header-nav a:hover,.site-header .header-nav a[aria-current=page]{color:#e2c99c;border-bottom-color:#d5b881}
.hm-site .header-contact{display:inline-flex;align-items:center;justify-content:center;gap:9px;flex-shrink:0;padding:12px 18px;border:1px solid #f2dcad;background:linear-gradient(115deg,#f3dfb6,#dcb67b);color:#13233e;border-radius:9px;box-shadow:0 5px 18px #0003;transition:transform .2s,box-shadow .2s,background .2s;line-height:1.2}
.header-contact svg{width:21px;height:21px}.header-contact span{font-size:18px;font-weight:750;letter-spacing:-.025em}.header-contact .cta-arrow{font-size:21px;margin-left:7px;font-weight:400}
.header-contact:hover{transform:translateY(-2px);background:#f5e4c0;box-shadow:0 8px 24px #0004}.header-contact:active{transform:translateY(0)}
.main-hero{position:relative;isolation:isolate;height:calc(100svh - 104px);min-height:max(640px,calc(100vw * .344375 + 240px));overflow:hidden;background:#a3afcb}
.hero-visual{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:max(100%,calc((100svh - 104px)*1.967213115));min-width:1259.02px;aspect-ratio:1920/976;z-index:0}
.hm-site .hero-extended{position:absolute;width:100%;height:100%;max-width:none;inset:0}
.hm-site .hero-original{position:absolute;left:18.75%;top:23.1557377%;width:62.5%;height:76.8442623%;max-width:none}
.hero-text-block{position:relative;z-index:2;text-align:center;padding:28px 24px 0;color:#102340}
.hm-site .hero-eyebrow{font-size:clamp(22px,1.67vw,32px);font-weight:500;letter-spacing:-.035em;line-height:1.4}
.hero-eyebrow strong{font-weight:800}
.hm-site #hero-title,.hm-site #mobile-hero-title{font-size:clamp(40px,2.92vw,56px);font-weight:650;line-height:1.18;letter-spacing:-.055em;margin:10px 0 12px;white-space:nowrap}
#hero-title strong,#mobile-hero-title strong{font-weight:800;color:#98712e}
.hm-site .hero-subline{font-size:clamp(25px,1.67vw,32px);letter-spacing:-.04em;line-height:1.4;font-weight:500}
.hero-subline strong{font-weight:780;text-decoration:underline;text-decoration-color:#d7b474;text-decoration-thickness:4px;text-underline-offset:8px}
.hero-bottom{position:absolute;left:40px;right:40px;bottom:18px;z-index:3;display:flex;justify-content:space-between;gap:20px;align-items:end;color:#fff}
.hero-signature{font-size:11px;letter-spacing:.3em;color:#f0d8a9;text-shadow:0 1px 4px #000}
.hm-site .hero-notice{font-size:11px;line-height:1.5;text-align:right;text-shadow:0 1px 4px #000}
.mobile-landing{display:none}
.hm-site .hm-footer{align-items:center;padding-top:35px;padding-bottom:35px}.footer-contact{margin-left:auto;white-space:nowrap;font-size:13px;color:#d9c398!important}.footer-contact strong{display:block;font-size:25px;line-height:1.5}
.reservation-phone p{font-size:17px;margin-bottom:22px!important}.reservation-phone a{display:inline-flex;flex-direction:column;padding:16px 40px;background:#11213d;color:#fff;line-height:1.6}.reservation-phone strong{font-size:28px;color:#e2c99c}
@media(min-width:990px) and (max-height:850px){.hero-text-block{padding-top:24px}.hm-site #hero-title{font-size:clamp(40px,2.92vw,54px);margin:10px 0 12px}.hm-site .hero-eyebrow{font-size:clamp(22px,1.67vw,30px)}.hm-site .hero-subline{font-size:clamp(25px,1.67vw,30px)}}
@media(min-width:990px) and (max-width:1200px){.site-header .hm-header-inner{padding:0 26px;gap:22px}.site-header .header-logo{width:142px}.site-header .header-nav{gap:23px}.site-header .header-nav a{font-size:15px}.hm-site .header-contact{padding:11px 15px;gap:8px}.header-contact span{font-size:17px}.header-contact .cta-arrow{display:none}}
@media(max-width:989px){
 .pc-main{display:none}.mobile-landing{display:block;background:#a3afcb}
 .site-header .hm-header-inner{height:80px;padding:0 22px;gap:18px}.site-header .header-logo{width:144px}.hm-site .header-contact{margin-left:auto;padding:11px 14px;gap:7px;border-radius:7px}.header-contact span{font-size:16px}.header-contact svg{width:20px;height:20px}.header-contact .cta-arrow{display:none}
 .site-header .hm-menu-toggle{display:flex;background:transparent;width:32px;padding:0;flex-shrink:0}.site-header .hm-menu-toggle span{background:#e7d3af}
 .site-header .header-nav{top:80px;margin:0;background:#11213d;padding:12px 24px 24px;border-color:#c6b28a55}.site-header .header-nav a{padding:13px 5px;font-size:17px;border-color:#ffffff20}
 .hero-text-block{padding:32px 14px 20px}.hm-site .hero-eyebrow{font-size:clamp(17px,2.7vw,27px);line-height:1.6}.hm-site #mobile-hero-title{font-size:clamp(30px,5.8vw,55px);margin:10px 0 14px}.hm-site .hero-subline{font-size:clamp(23px,3.7vw,35px)}.hero-subline strong{text-decoration-thickness:3px;text-underline-offset:6px}
 .hm-site .mobile-original{width:100%;height:auto}.mobile-landing>.hero-notice{padding:14px 18px;background:#142039;color:#d4dce8;font-size:10px;text-align:center}
 .hm-site .hm-footer{gap:22px;padding:30px 24px}.footer-contact{margin-left:0}.hm-site .hm-footer>img{width:130px}
}
@media(max-width:480px){.site-header .hm-header-inner{padding:0 16px;gap:13px}.site-header .header-logo{width:122px}.hm-site .hm-footer{flex-direction:column;align-items:flex-start}.hm-site #mobile-hero-title{font-size:clamp(30px,8vw,38px)}}
@media(prefers-reduced-motion:reduce){.header-contact{transition:none}}
/* 原본 보호: 건물이 없는 외곽의 하늘·주변부만 알파 연결. blur/filter 사용 없음. */
.hm-site .hero-original{mask-image:linear-gradient(to right,transparent,#000 10%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000);mask-composite:intersect}


/* =========================================================
   MOBILE ASSEMBLY / 공통 모바일 헤더 · 랜딩 · 하단 고정바
   - 배치: 좌 햄버거 / 중앙 로고 / 우 전화상담
   - 모바일 랜딩 01~07은 개별 section으로 유지하여 교체와 fade-in을 쉽게 합니다.
========================================================= */
.hm-bottom-bar { display: none; }

@media (max-width: 989px) {
  /* 빌리브 명지형 배치만 차용: 디자인 톤은 해링턴 마레 그대로 유지 */
  .hm-site .site-header .hm-header-inner {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80px;
    padding: 0 16px;
  }
  .hm-site .site-header .hm-menu-toggle {
    display: flex;
    order: 1;
    width: 40px;
    height: 44px;
    margin: 0;
    padding: 0;
    z-index: 2;
  }
  .hm-site .site-header .hm-brand {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 122px;
    margin: 0;
    z-index: 1;
  }
  .hm-site .site-header .header-contact {
    order: 3;
    margin-left: auto;
    min-height: 44px;
    padding: 9px 12px;
    gap: 7px;
    z-index: 2;
  }
  .hm-site .site-header .header-contact span { font-size: 14px; }
  .hm-site .site-header .header-contact svg { width: 18px; height: 18px; }
  .hm-site .site-header .header-nav { top: 80px; }

  /* 모바일 랜딩 */
  .mobile-landing { display: block; width: 100%; background: #11213d; overflow: hidden; }
  .hm-mobile-section { width: 100%; margin: 0; padding: 0; line-height: 0; background: #11213d; }
  .hm-mobile-section img { display: block; width: 100%; height: auto; max-width: none; margin: 0; }
  .hm-mobile-first { opacity: 1; transform: none; }

  /* 섹션 단위 fade-up: JS가 대상에 is-prepared를 붙인 이후에만 숨깁니다. */
  .hm-reveal.is-prepared {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .9s ease, transform .9s cubic-bezier(.22,.61,.36,1);
    will-change: opacity, transform;
  }
  .hm-reveal.is-prepared.is-visible { opacity: 1; transform: translateY(0); }

  /* 모바일 하단 고정바 */
  .hm-site { padding-bottom: 64px; }
  .hm-bottom-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: 1fr 1fr;
    height: 64px;
    color: #fff;
    box-shadow: 0 -4px 18px rgba(0,0,0,.16);
  }
  .hm-bottom-bar a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    font-size: 16px;
    font-weight: 750;
    letter-spacing: -.02em;
    color: #fff;
  }
  .hm-bottom-register { background: #102b4d; }
  .hm-bottom-phone { background: #080808; gap: 8px; }
}

@media (max-width: 390px) {
  .hm-site .site-header .hm-brand { width: 108px; }
  .hm-site .site-header .header-contact { padding: 9px 10px; }
  .hm-site .site-header .header-contact span { font-size: 13px; }
  .hm-bottom-bar a { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .hm-reveal.is-prepared { opacity: 1 !important; transform: none !important; transition: none !important; }
}


/* =========================================================
   MOBILE CTA REFINEMENT v1
   해링턴 마레 톤: 딥 네이비 + 샴페인 골드
   - 상단: 좌 햄버거 / 중앙 로고 / 우 전화상담
   - 하단: 관심고객등록 / 전화상담 동일한 SVG 아이콘 체계
========================================================= */
@media (max-width: 989px) {
  .hm-site .site-header .hm-header-inner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    padding: 0 16px;
  }

  .hm-site .site-header .hm-menu-toggle {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 44px;
    margin: 0;
    padding: 0;
    z-index: 3;
  }

  .hm-site .site-header .hm-brand,
  .hm-site .site-header .header-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 122px;
    margin: 0;
    z-index: 2;
  }

  .hm-site .site-header .header-contact {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 44px;
    margin: 0;
    padding: 10px 13px;
    border: 1px solid rgba(220, 184, 117, .88);
    border-radius: 10px;
    color: #10233e;
    background: linear-gradient(180deg, #f6e6c0 0%, #dfbc7a 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 5px 16px rgba(5,14,28,.17);
    z-index: 3;
  }

  .hm-site .site-header .header-contact svg {
    width: 18px;
    height: 18px;
  }

  .hm-site .site-header .header-contact span {
    font-size: 14px;
    font-weight: 760;
    letter-spacing: -.03em;
    white-space: nowrap;
  }

  .hm-site .site-header .header-contact:active {
    transform: translateY(-50%) scale(.985);
  }

  .hm-site {
    padding-bottom: calc(68px + env(safe-area-inset-bottom));
  }

  .hm-bottom-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    display: grid;
    grid-template-columns: 1fr 1fr;
    height: auto;
    min-height: 68px;
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid rgba(222, 190, 128, .58);
    background: #0d2038;
    box-shadow: 0 -8px 26px rgba(5, 13, 24, .16);
  }

  .hm-bottom-bar a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 0;
    min-height: 68px;
    padding: 0 12px;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
    font-weight: 760;
    letter-spacing: -.03em;
    -webkit-tap-highlight-color: transparent;
    transition: filter .18s ease, background-color .18s ease;
  }

  .hm-bottom-register {
    background: #0d3555;
  }

  .hm-bottom-phone {
    background: #090d14;
  }

  .hm-bottom-register::after {
    content: "";
    position: absolute;
    top: 15px;
    right: 0;
    bottom: 15px;
    width: 1px;
    background: rgba(225, 196, 139, .28);
  }

  .hm-quick-icon {
    width: 25px;
    height: 25px;
    flex: 0 0 auto;
    color: #e3c58e;
  }

  .hm-bottom-bar a:active {
    filter: brightness(1.12);
  }
}

@media (max-width: 390px) {
  .hm-site .site-header .hm-brand,
  .hm-site .site-header .header-logo { width: 108px; }

  .hm-site .site-header .header-contact {
    right: 10px;
    padding: 9px 10px;
    gap: 5px;
  }

  .hm-site .site-header .header-contact span { font-size: 13px; }
  .hm-site .site-header .header-contact svg { width: 16px; height: 16px; }

  .hm-bottom-bar a {
    gap: 7px;
    font-size: 15px;
    padding: 0 8px;
  }

  .hm-quick-icon { width: 23px; height: 23px; }
}


/* =========================================================
   FOOTER INFO / 빌리브 명지형 정보 배치
   현장 운영정보가 확정된 뒤 이 블록의 텍스트만 수정
========================================================= */
.hm-site .hm-footer.hm-footer-info {
  display: block;
  padding: 34px max(40px, calc((100% - 1160px) / 2)) 38px;
  background: #10283f;
  color: #fff;
}
.hm-footer-info .hm-footer-copy {
  width: 100%;
  max-width: 1160px;
}
.hm-footer-info .hm-footer-copy > p {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.55;
  color: #fff;
}
.hm-footer-info .hm-footer-copy strong {
  font-weight: 700;
  color: #fff;
}
.hm-footer-info .hm-footer-copy a {
  color: #fff;
  text-decoration: none;
}
.hm-footer-info .hm-footer-copy a:hover {
  text-decoration: underline;
}
.hm-footer-info .hm-footer-divider {
  margin: 0 8px;
  color: rgba(255,255,255,.48);
}
.hm-footer-info .hm-footer-notices {
  margin-top: 22px;
}
.hm-footer-info .hm-footer-notices p {
  margin: 5px 0 0;
  font-size: 11px;
  line-height: 1.65;
  color: rgba(255,255,255,.58);
}

@media (max-width: 989px) {
  .hm-site .hm-footer.hm-footer-info {
    padding: 30px 22px calc(94px + env(safe-area-inset-bottom));
  }
  .hm-footer-info .hm-footer-copy > p {
    margin-bottom: 7px;
    font-size: 11.5px;
    line-height: 1.55;
  }
  .hm-footer-info .hm-footer-divider {
    margin: 0 5px;
  }
  .hm-footer-info .hm-footer-notices {
    margin-top: 18px;
  }
  .hm-footer-info .hm-footer-notices p {
    font-size: 10px;
    line-height: 1.6;
  }
}

/* =========================================================
   MOBILE DBCART SECTION REFINEMENT v2
   - DBCart를 랜딩에 바로 이어붙인 느낌이 아니라 하나의 상담 섹션 안에 배치
   - 모바일 iframe의 과도한 고정 높이를 줄여 폼 하단의 흰 여백 최소화
   - PC에는 영향 없음
========================================================= */
@media (max-width: 989px) {
  .mobile-landing #registration.hm-mobile-section {
    box-sizing: border-box;
    padding: 18px 12px 22px;
    line-height: normal;
    background: #f0eee6;
  }

  .mobile-landing #registration [data-dbcart-frame] {
    display: block;
    width: 100%;
    height: 900px !important;
    margin: 0;
    border: 0;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(17, 33, 61, .08);
  }

  .hm-reservation [data-dbcart-frame] {
    height: 650px !important;
  }
}
