/* 견적문의 접수 완료 팝업 — 텍스트 구조는 코덱스 시안(사진 → 제목 두 줄 → 안내 세 줄 → 버튼 → 닫기) 그대로. 휴대폰 사진 크기도 코덱스 판과 같다(폭 대비 높이 .66). 로고는 1 · 2안 사진 왼쪽 위, 3안 카드 가운데 */
.gzq,.gzq *{box-sizing:border-box}
.gzq{
  --ease:cubic-bezier(.32,.72,0,1);
  --brand:#1570EF;--brand-ink:#0B4DA2;--brand-soft:#EAF2FE;
  --title:#14283C;--ink:#334155;--ink-2:#5b6b7f;--line:#e6ecf3;--sky:#0360C4;
  position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:12px;
  font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;
  font-size:15px;line-height:1.55;letter-spacing:-.015em;color:var(--ink);
  word-break:keep-all;overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%;
}
.gzq-dim{position:absolute;inset:0;background:rgba(14,26,44,.52);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.gzq-card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;width:100%;max-width:392px;
  max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);background:#fff;border-radius:20px;outline:0;
  box-shadow:0 1px 2px rgba(16,24,40,.06),0 10px 26px rgba(16,24,40,.16),0 28px 64px rgba(16,24,40,.24);
}

/* 사진 — 12번 홀 전체. 아래 끝이 스마일처럼 살짝 내려온다 */
.gzq-wrap{position:relative;z-index:2;flex:0 1 auto;width:100%;aspect-ratio:1/.66;min-height:0}
.gzq-hero{position:absolute;inset:0;overflow:hidden;background:var(--sky);border-radius:0 0 50% 50%/0 0 20px 20px}
.gzq-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0 100%;display:block}

/* 글 */
.gzq-panel{flex:none;padding:20px 22px 4px;text-align:center}
.gzq h2{margin:0;color:var(--brand);font-size:26px;line-height:1.28;font-weight:800;letter-spacing:-.04em;white-space:nowrap}
.gzq h2 span{display:block}
.gzq p{margin:9px 0 17px;color:var(--ink-2);font-size:15px;line-height:1.6;letter-spacing:-.02em}
.gzq p span{display:block}
/* 가운데 줄 강조 — 장식 없이 글자로만. 조금 크고 굵고, 왼쪽부터 회색에서 진한 색으로 번진다. 끝나면 글자만 남는다 */
.gzq b{color:var(--title);font-size:1.1em;font-weight:700}
@supports (-webkit-background-clip:text) or (background-clip:text){
  .gzq b{color:transparent;-webkit-text-fill-color:transparent;background:linear-gradient(90deg,var(--title) 46%,#667085 54%) 100% 0/220% 100% no-repeat;-webkit-background-clip:text;background-clip:text;animation:gzqInk .8s cubic-bezier(.45,.05,.35,1) both;animation-delay:calc(var(--d,0)*1s)}
}
.gzq-logo{display:block;line-height:0}
.gzq-logo svg{display:block;width:100%;height:auto;overflow:visible}
/* 사진 위 로고 — 사이트에서 쓰는 판과 같다. 글자는 흰색, 잎과 ez 는 브랜드 색. 상자를 깔지 않는다 */
.gzq-logo--sky{position:absolute;z-index:2;left:12px;top:11px;width:88px}
.gzq-logo--sky path[fill="#653901"],.gzq-logo--sky path[fill="#5C5B5A"]{fill:#fff}

.gzq-kakao{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:54px;padding:0 16px;border:0;border-radius:12px;
  background:#FEE500;color:#191919;font:inherit;font-size:16px;font-weight:700;letter-spacing:-.02em;text-decoration:none;cursor:pointer;
  box-shadow:0 1px 2px rgba(16,24,40,.08),0 6px 14px rgba(120,100,0,.16);
  transition:transform .2s var(--ease),background-color .2s var(--ease),box-shadow .2s var(--ease);
}
.gzq-kakao img{display:block;width:28px;height:26px;flex:none;object-fit:contain}
.gzq-kakao:active{transform:translateY(1px)}
/* 안내를 다 읽을 즈음 버튼 전체가 살짝 들렸다 내려온다. 한 번만, 튕기지 않는다. 끝 값을 남기지 않아 hover 가 그대로 듣는다 */
.gzq .gzq-kakao{animation:gzqNudge .86s ease-in-out calc(var(--w,1.4)*1s)}
.gzq-close{display:block;width:100%;min-height:44px;margin:0;padding:0;border:0;background:none;color:var(--ink-2);font:inherit;font-size:15px;font-weight:500;cursor:pointer}
.gzq-x{position:absolute;right:6px;top:6px;z-index:6;width:44px;height:44px;padding:0;border:0;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--title)}
.gzq-x i{
  display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);
  box-shadow:0 1px 2px rgba(16,24,40,.12);
}
.gzq-x svg{width:13px;height:13px}
.gzq :focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.gzq .gzq-card:focus,.gzq .gzq-card:focus-visible{outline:0}
.gzq-qr{display:none}
@media (hover:hover){
  .gzq-kakao:hover{background:#F4DC00;transform:translateY(-2px);box-shadow:0 2px 4px rgba(16,24,40,.10),0 10px 20px rgba(120,100,0,.2)}
  .gzq-close:hover{color:var(--title)}
}

/* 등장 — 내려앉으며 97.5 → 100%. 튕기지 않는다 */
@keyframes gzqDim{from{opacity:0}to{opacity:1}}
@keyframes gzqIn{from{opacity:0;transform:translateY(-7px) scale(.975)}to{opacity:1;transform:none}}
@keyframes gzqRise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes gzqLift{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes gzqPush{from{transform:scale(1.05)}to{transform:scale(1)}}
@keyframes gzqCheckIn{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
@keyframes gzqDraw{to{stroke-dashoffset:0}}
@keyframes gzqInk{to{background-position:0 0}}
@keyframes gzqNudge{0%,100%{transform:translateY(0);box-shadow:0 1px 2px rgba(16,24,40,.08),0 6px 14px rgba(120,100,0,.16)}42%{transform:translateY(-4px);box-shadow:0 2px 4px rgba(16,24,40,.10),0 12px 22px rgba(120,100,0,.24)}}
.gzq-dim{animation:gzqDim .3s linear both}
.gzq-card{animation:gzqIn .6s var(--ease) both}
.gzq-hero>img{animation:gzqPush 2.4s var(--ease) both;transform-origin:18% 86%}
.gzq [data-rise]{animation:gzqRise .55s var(--ease) both;animation-delay:calc(var(--d,0)*1s)}
.gzq.is-leaving{opacity:0;transition:opacity .2s linear}

/* ─────────── 2안 · 사진과 글 사이에 체크 ─────────── */
.gzq--v2{--w:1.46}
.gzq--v2 .gzq-panel{padding-top:38px}
.gzq-check{
  position:absolute;left:50%;top:100%;z-index:3;width:50px;height:50px;margin:-25px 0 0 -25px;border-radius:50%;background:var(--brand);border:3px solid #fff;color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:0 1px 2px rgba(6,28,60,.22),0 8px 18px rgba(6,28,60,.24);
}
.gzq-check svg{width:24px;height:24px}
.gzq-check{animation:gzqCheckIn .5s var(--ease) .24s both}
.gzq-check path{stroke-dasharray:12 14;stroke-dashoffset:13;animation:gzqDraw .42s var(--ease) .48s both}

/* ─────────── 3안 · 접수 카드 — 절취선이 있는 카드가 사진 위로 올라온다 ─────────── */
.gzq--v3{--w:1.5}
.gzq--v3 .gzq-card{background:#EDF2F7}
.gzq--v3 .gzq-hero{border-radius:0}
.gzq-lift{position:relative;z-index:3;flex:none;margin:-10px 10px 10px;filter:drop-shadow(0 1px 1px rgba(16,24,40,.05)) drop-shadow(0 8px 18px rgba(16,24,40,.12));animation:gzqLift .7s var(--ease) .12s both}
.gzq-ticket{
  --n:9px;--cut:220px;background:#fff;border-radius:16px;
  -webkit-mask:radial-gradient(circle var(--n) at 0 var(--cut),#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--n) at 100% var(--cut),#0000 97%,#000) right/51% 100% no-repeat;
          mask:radial-gradient(circle var(--n) at 0 var(--cut),#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--n) at 100% var(--cut),#0000 97%,#000) right/51% 100% no-repeat;
}
.gzq-main{padding:18px 18px 14px;text-align:center}
.gzq--v3 .gzq-logo{width:120px;margin:0 auto 12px}
.gzq--v3 p{margin-bottom:0}
.gzq-stub{padding:13px 18px 3px;border-top:1.5px dashed #c9d4e0}

/* 닫은 뒤 접수 화면에 남는 안내 */
.gzq-after{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:50;width:min(340px,calc(100vw - 32px));padding:20px 18px 8px;text-align:center;border-radius:18px;
  font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-size:15px;line-height:1.6;letter-spacing:-.015em;color:#334155;word-break:keep-all;
  background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);border:.5px solid rgba(16,24,40,.07);
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 26px rgba(16,24,40,.10),0 28px 64px rgba(16,24,40,.13);
}
.gzq-after,.gzq-after *{box-sizing:border-box}
.gzq-after strong{display:block;color:#1570EF;font-size:18px;font-weight:800;letter-spacing:-.03em}
.gzq-after span{display:block;margin:2px 0 12px;font-size:14px;color:#5b6b7f}
.gzq-after .gzq-kakao{--ease:cubic-bezier(.32,.72,0,1);font-size:15px;min-height:50px}

/* ─────────── PC — 같은 순서를 사진 옆에 놓는다 ─────────── */
@media (min-width:760px) and (min-height:520px){
  .gzq{padding:20px;font-size:16px}
  .gzq-card{flex-direction:row;max-width:1040px;height:calc(100vh - 40px);height:calc(100dvh - 40px);max-height:560px}
  .gzq-wrap{flex:1 1 auto;width:auto;height:100%;aspect-ratio:auto;min-width:0}
  .gzq-hero{border-radius:0 26px 26px 0/0 50% 50% 0}
  .gzq-panel{width:380px;display:flex;flex-direction:column;justify-content:center;padding:30px 30px 14px}
  .gzq h2{font-size:27px}
  .gzq p{margin:10px 0 20px;font-size:16px}
  .gzq-x i{background:#F1F5F9;box-shadow:none}
  .gzq-qr{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:14px;text-align:left}
  .gzq-qr img{display:block;width:66px;height:66px;flex:none}
  .gzq-qr span{font-size:13.5px;line-height:1.45;color:var(--ink);letter-spacing:-.025em;white-space:nowrap}
  .gzq-close{min-height:40px;margin-top:4px}

  .gzq-logo--sky{left:20px;top:16px;width:104px}
  .gzq--v2 .gzq-panel{padding-left:44px;padding-right:26px}
  .gzq-check{left:100%;top:50%}

  .gzq--v3 .gzq-hero{border-radius:0}
  .gzq-lift{flex:none;align-self:center;width:400px;margin:0 16px 0 -38px}
  .gzq--v3 .gzq-x i{background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.12)}
  .gzq-main{padding:20px 22px 16px}
  .gzq--v3 .gzq-logo{width:132px;margin-bottom:14px}
  .gzq-stub{padding:15px 22px 4px}
}

/* 세로가 아주 낮은 화면(가로로 눕힌 휴대폰) — 사진을 빼고 글과 버튼만 남긴다 */
@media (max-height:519px){
  .gzq{padding:8px}
  .gzq-card{flex-direction:column;height:auto;max-height:calc(100vh - 16px);overflow:auto;max-width:440px}
  .gzq-wrap{display:none}
  .gzq-panel,.gzq--v2 .gzq-panel{padding:16px 20px 2px}
  .gzq-lift{margin:10px;width:auto}
  .gzq-x i{background:#F1F5F9}
}

/* 휴대폰 브라우저 — 주소창이 있어 실제로 보이는 높이가 화면보다 낮다. 사진이 먼저 줄어든다 */
@media (max-width:759px) and (max-height:620px){
  .gzq-panel{padding-top:12px}
  .gzq-logo--sky{left:12px;top:9px;width:80px}
  .gzq--v2 .gzq-panel{padding-top:32px}
  .gzq p{margin:6px 0 12px}
  .gzq--v3 p{margin-bottom:0}
  .gzq-kakao{min-height:50px}
  .gzq-close{min-height:40px}
  .gzq-main{padding:12px 16px 11px}
  .gzq--v3 .gzq-logo{width:92px;margin-bottom:9px}
  .gzq-stub{padding:10px 16px 1px}
}
@media (max-width:359px){
  .gzq-panel{padding-left:14px;padding-right:14px}
  .gzq h2{font-size:23px}
  .gzq p{font-size:14px}
  .gzq--v3 p{font-size:13.5px}
  .gzq-kakao{font-size:15px}
  .gzq-main,.gzq-stub{padding-left:13px;padding-right:13px}
}

/* aspect-ratio 를 모르는 옛 브라우저 */
@supports not (aspect-ratio:1/1){.gzq-wrap{height:58vw;max-height:242px}}

/* 움직임을 줄인 기기 */
@media (prefers-reduced-motion:reduce){
  .gzq *,.gzq{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Refinement: approved photograph, copy, order and motion remain recognizable. */
.gzq{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
.gzq-dim{background:rgba(14,26,44,.44);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.gzq-card{overflow-y:hidden;overscroll-behavior:contain;scrollbar-width:thin;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));box-shadow:0 24px 70px #14283c2b,0 4px 16px #14283c14}
.gzq.is-ready .gzq-card{overflow-y:auto}
.gzq h2{white-space:normal;text-wrap:balance}
.gzq p{margin-top:14px;margin-bottom:20px;line-height:1.65}
.gzq p span:last-child{margin-top:5px}
.gzq b{font-weight:750}
.gzq-hero>img{animation:none;transform:none}
.gzq-kakao{min-height:56px;box-shadow:0 2px 5px #78640014}
.gzq-close{min-height:44px}
.gzq :focus-visible{outline:3px solid #0b4da2;outline-offset:-3px}
.gzq-x i{background:rgba(255,255,255,.94);box-shadow:none}
@keyframes gzqNudge{0%,100%{transform:translateY(0);box-shadow:0 2px 5px #78640014}42%{transform:translateY(-4px);box-shadow:0 8px 16px #78640022}}
@media(hover:hover){.gzq-kakao:hover{box-shadow:0 5px 12px #78640022}}
@media(min-width:760px) and (min-height:520px){
 .gzq-card{max-height:560px}
 .gzq-qr{gap:14px;margin-top:18px;padding-top:16px;border-top:1px solid #e6ecf3}
 .gzq-qr img{width:88px;height:88px}
 .gzq-qr span{white-space:normal;max-width:164px;font-size:13.5px;line-height:1.6}
 .gzq--v2 .gzq-panel{padding-left:40px;padding-right:28px}
}
@media(max-width:759px) and (max-height:620px){
 .gzq p{margin-top:8px;margin-bottom:12px}
 .gzq p span:last-child{margin-top:3px}
 .gzq-kakao{min-height:50px}
 .gzq-close{min-height:44px}
}
@media(prefers-reduced-motion:reduce){.gzq b{-webkit-text-fill-color:var(--title);color:var(--title);background:none}.gzq-hero>img{transform:none}}

/* Official photograph; desktop follows the mobile card rather than a full-width panel. */
.gzq-qr-toggle{display:none}
@media(min-width:760px) and (min-height:520px){
 .gzq-card{flex-direction:column;width:420px;max-width:420px;height:auto;max-height:calc(100dvh - 32px);border-radius:20px}
 .gzq-wrap{flex:0 1 auto;width:100%;height:220px;min-height:120px;aspect-ratio:auto}
 .gzq-hero{border-radius:0 0 50% 50%/0 0 16px 16px}
 .gzq-hero>img{object-position:0 100%}
 .gzq-logo--sky{width:88px;left:14px;top:12px}
 .gzq-panel{width:100%;padding:20px 26px 4px;display:block}
 .gzq h2{font-size:24px;line-height:1.3}
 .gzq p{font-size:14px;margin:10px 0 17px;line-height:1.65}
 .gzq b{font-size:15.5px}
 .gzq-kakao{font-size:15px;min-height:52px}
 .gzq-close{min-height:40px;margin-top:0}
 .gzq-check{left:50%;top:100%;width:44px;height:44px;margin:-22px 0 0 -22px}
 .gzq--v2 .gzq-panel{padding:32px 26px 4px}
 .gzq-check svg{width:22px;height:22px}
 .gzq-x i{background:rgba(255,255,255,.94)}
 .gzq-qr-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;width:100%;border:0;background:none;color:#526579;font:inherit;font-size:13px;cursor:pointer;margin-top:4px}
 .gzq-qr-toggle[aria-expanded=true] span[aria-hidden=true]{transform:rotate(180deg)}
 .gzq-qr{display:none;padding:12px 0;margin:0;border-top:1px solid #e6ecf3}
 .gzq.qr-open .gzq-qr{display:flex}
 .gzq-qr img{width:88px;height:88px}
 .gzq-lift{width:auto;align-self:stretch;flex:none;margin:-10px 10px 10px}
 .gzq-main{padding:16px 18px 12px}
 .gzq--v3 .gzq-logo{width:94px;margin:0 auto 10px}
 .gzq--v3 .gzq-hero{border-radius:0}
 .gzq--v3 p{margin-bottom:0}
 .gzq-stub{padding:12px 18px 3px}
}

/* Loaded marker for the success fallback; scoped reset against legacy form styles. */
:root{--gzq-assets-ready:1}
.gzq button,.gzq a{font-family:inherit;letter-spacing:inherit}
.gzq .gzq-qr-toggle,.gzq .gzq-close{min-height:44px}
