/* ============================================================
   무료 상담 모달 (바텀시트) — 공개 페이지 공통
   <link rel="stylesheet" href="/components/consult.css">
   <script src="/components/consult.js" defer></script>
   두 줄이면 끝난다. 마크업은 consult.js 가 넣는다.

   스타일은 메인 페이지(index.html)의 상담 모달과 같은 값이다 —
   같은 폼을 여는 같은 시트인데 페이지마다 다르게 열리면 안 된다.
   ============================================================ */
.modal{position:fixed;inset:0;z-index:1000;display:none;}
.modal.is-open{display:block;}
.modal__backdrop{position:absolute;inset:0;background:rgba(6,12,22,.72);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s ease;}
.modal.is-open .modal__backdrop{opacity:1;animation:sheetFade .3s ease;}
/* 바텀시트 패널 — 아래에서 위로 슬라이드 */
.modal__panel{position:absolute;left:50%;bottom:0;transform:translateX(-50%) translateY(0);
  width:100%;max-width:var(--col,430px);height:70vh;height:70dvh;
  background:#fff;border-radius:22px 22px 0 0;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 -12px 50px -14px rgba(0,0,0,.5);transition:transform .42s cubic-bezier(.32,.72,0,1);}
.modal.is-open .modal__panel{animation:sheetUp .42s cubic-bezier(.32,.72,0,1);}
@keyframes sheetUp{from{transform:translateX(-50%) translateY(100%);}to{transform:translateX(-50%) translateY(0);}}
@keyframes sheetFade{from{opacity:0;}to{opacity:1;}}
#consultModal .modal__panel{height:85vh;height:85dvh;}
.modal__grip{flex:none;height:26px;position:relative;}
.modal__grip::before{content:"";position:absolute;top:9px;left:50%;transform:translateX(-50%);
  width:42px;height:4px;border-radius:3px;background:rgba(14,22,38,.2);}
.modal__close{position:absolute;top:12px;right:12px;width:34px;height:34px;border:0;border-radius:50%;
  background:rgba(14,22,38,.06);color:#0E1626;font-size:22px;line-height:1;cursor:pointer;z-index:2;
  display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;
  font-family:inherit;}
.modal__close:hover{background:rgba(14,22,38,.12);transform:scale(1.06);}
.modal__head{padding:8px 24px 4px;}
.modal__title{margin:0;font-size:18px;font-weight:800;color:#0E1626;letter-spacing:-.02em;}
.modal__note{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:#5a6573;letter-spacing:-.01em;}
.modal__body{flex:1;overflow-y:auto;padding:6px 18px 18px;-webkit-overflow-scrolling:touch;}
.modal__body iframe{display:block;width:100%;border:0;min-height:520px;}
body.modal-locked{overflow:hidden;}