/* 상담 전환 개선 (2026-09-20) — 에코델타시티 금강펜테리움 에코리버 — 첫 화면 CTA · 안내 띠 · 빠른 상담 폼 · 고정 상담 바
   기존 index-*.css / rivercity.css / upgrade.css 위에 덮는 추가 레이어. 인라인 style 없음 (CSP 유지). */

/* ── 첫 화면 CTA ── */
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;max-width:560px}
.hero-cta a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 22px;
  font-weight:800;font-size:1rem;border-radius:4px;letter-spacing:-.02em;flex:1 1 220px;transition:transform .08s,filter .15s}
.hero-cta a:active{transform:scale(.985)}
.hero-cta svg{width:19px;height:19px;flex:none}
.hero-cta .cta-call{background:linear-gradient(135deg,#caa969,#e6cf95);color:#14263f;box-shadow:0 10px 26px rgba(202,169,105,.3)}
.hero-cta .cta-form{background:rgba(12,24,45,.45);color:#fff;border:1px solid rgba(255,255,255,.62);backdrop-filter:blur(4px)}
.hero-cta .cta-call:hover{filter:brightness(1.05)}
.hero-cta .cta-form:hover{background:rgba(255,255,255,.14)}
.hero-cta a:focus-visible{outline:3px solid #fff;outline-offset:3px}
/* 금강은 (1) 헤더가 불투명 고정 67px 이고 (2) .hero-copy 가 relative + padding-bottom 구조다.
   히어로가 100svh 라 헤더 높이만큼 화면 밖으로 밀려 버튼·고지문구가 하단바 뒤에 깔렸다.
   → 히어로 높이에서 헤더와 하단바를 빼고, 리버시티와 같은 간격(버튼 아래 76px, 고지 14px)으로 맞춘다. */
@media (max-width:640px){
  .hero{min-height:calc(100svh - 67px - 64px - env(safe-area-inset-bottom))}
  .hero-copy{padding-bottom:76px}
  .image-note{bottom:14px}
  .hero-cta{margin-top:18px;gap:8px}
  .hero-cta a{min-height:50px;font-size:.95rem}
}
@media (min-width:641px) and (max-width:980px){
  .hero{min-height:calc(100svh - 67px)}
  .hero-copy{padding-bottom:84px}
  .image-note{bottom:18px}
}

/* ── 안내 띠 (팝업 대체) ── */
.notice-bar{background:#0f1f38;color:#fff;border-top:1px solid rgba(202,169,105,.45);border-bottom:1px solid rgba(255,255,255,.08)}
.notice-bar .inner{width:min(1180px,100% - 40px);margin:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;padding:13px 0;font-size:.86rem}
.notice-bar .tag{color:#caa969;font-weight:800;letter-spacing:.08em;font-size:.72rem}
.notice-bar span b{color:#fff;font-weight:800}
.notice-bar span{color:rgba(255,255,255,.82)}
.notice-bar .sep{color:rgba(255,255,255,.2)}
.notice-bar .muted{font-size:.74rem;color:rgba(255,255,255,.5)}
.notice-bar .event-btn{margin-left:auto;background:none;border:1px solid rgba(202,169,105,.6);color:#e6cf95;border-radius:999px;
  padding:7px 14px;font:700 .8rem 'Noto Sans KR',sans-serif;cursor:pointer;white-space:nowrap}
.notice-bar .event-btn:hover{background:rgba(202,169,105,.14)}
@media (max-width:640px){
  .notice-bar .inner{width:calc(100% - 30px);gap:6px 12px;padding:11px 0;font-size:.8rem}
  .notice-bar .sep{display:none}
  .notice-bar .muted{flex-basis:100%}
  .notice-bar .event-btn{margin-left:0}
}

/* ── 빠른 상담 폼 ── */
.quick{background:#f5f2ec;padding:56px max(24px,50vw - 590px)}
.quick-card{background:#fff;max-width:600px;margin:auto;padding:30px 28px 24px;box-shadow:0 22px 60px rgba(7,22,47,.12);border-top:3px solid #14263f}
.quick-card .kicker{margin-bottom:8px}
.quick-card h2{margin:0 0 8px;font-size:clamp(1.5rem,3vw,1.9rem);letter-spacing:-.05em}
.quick-card .lead{margin:0 0 20px;color:#6b7482;font-size:.95rem;line-height:1.7}
.quick-card .lead b{color:#173e72}
.quick-field{margin-bottom:14px}
.quick-field>label{display:block;font-size:.85rem;font-weight:700;margin-bottom:7px;color:#152033}
.quick-field>label small{color:#6b7482;font-weight:500;margin-left:4px}
.quick-field input[type=text],.quick-field input[type=tel]{width:100%;border:1px solid #cfd5dc;padding:15px 14px;font-size:1rem;background:#fff;color:#152033;border-radius:0}
.quick-field input:focus{outline:0;border-color:#173e72;box-shadow:0 0 0 3px rgba(23,62,114,.14)}
.quick-field input::placeholder{color:#9aa3b1}
.quick-field.invalid input{border-color:#c93a3a}
.quick-field .err{display:none;color:#c93a3a;font-size:.78rem;margin-top:6px}
.quick-field.invalid .err{display:block}
.chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.chips label{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid #cfd5dc;padding:11px 6px;
  font-size:.92rem;font-weight:700;color:#3a4250;cursor:pointer;text-align:center;line-height:1.3;background:#fff;user-select:none}
.chips label small{font-size:.7rem;font-weight:500;color:#6b7482}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips label:has(input:checked){background:#14263f;border-color:#14263f;color:#fff}
.chips label:has(input:checked) small{color:rgba(255,255,255,.7)}
.chips label:has(input:focus-visible){outline:3px solid #caa969;outline-offset:2px}
.quick-agree{display:flex;align-items:flex-start;gap:9px;font-size:.82rem;color:#3a4250;margin:16px 0 14px;cursor:pointer;line-height:1.5}
.quick-agree input{width:18px;height:18px;margin-top:1px;flex:none;accent-color:#14263f}
.quick-agree a{color:#173e72;text-decoration:underline;text-underline-offset:3px}
.quick-field.invalid .quick-agree{color:#c93a3a}
.quick-submit{width:100%;min-height:56px;background:#14263f;color:#fff;border:0;font-weight:900;font-size:1.05rem;cursor:pointer;font-family:inherit;letter-spacing:-.02em}
.quick-submit:hover{background:#0d2850}
.quick-submit:disabled{opacity:.6;cursor:wait}
.quick-note{text-align:center;color:#6b7482;font-size:.76rem;line-height:1.6;margin:12px 0 0}
.quick-note.error{color:#c93a3a}
.quick-done{display:none;text-align:center;padding:16px 4px 8px}
.quick-done.show{display:block}
.quick-done .ok{width:58px;height:58px;border-radius:50%;background:#e9f5ec;border:1px solid #58b87a;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.quick-done .ok svg{width:26px;height:26px;stroke:#2e9c57;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.quick-done h3{margin:0 0 8px;font-size:1.35rem;letter-spacing:-.04em}
.quick-done p{margin:0;color:#6b7482;font-size:.92rem;line-height:1.7}
.quick-done p b{color:#152033}
.quick-done .call-now{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;min-height:52px;padding:0 24px;
  background:linear-gradient(135deg,#caa969,#e6cf95);color:#14263f;font-weight:900;width:100%}
.quick-done .call-now svg{width:18px;height:18px}
.quick-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
@media (max-width:640px){.quick{padding:40px 16px}.quick-card{padding:24px 18px 18px}.chips label{font-size:.86rem;padding:10px 4px}}

/* ── 고정 상담 바 ── */
.cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:72;display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:8px;
  padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(7,22,47,.97);backdrop-filter:blur(10px);border-top:1px solid rgba(202,169,105,.45)}
.cta-bar a{display:flex;align-items:center;justify-content:center;gap:6px;height:48px;font-weight:800;font-size:.9rem;letter-spacing:-.02em;border-radius:3px}
.cta-bar svg{width:18px;height:18px;flex:none}
.cta-bar .b-call{background:linear-gradient(135deg,#caa969,#e6cf95);color:#14263f}
.cta-bar .b-kakao{background:#fee500;color:#191919}
.cta-bar .b-form{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.28)}
.cta-bar a:focus-visible{outline:3px solid #fff;outline-offset:-3px}
/* 바가 있으니 기존 카카오 플로팅 버튼과 겹치지 않게 (모바일) */
@media (max-width:640px){
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .kakao-fab{display:none!important}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom))}
}
@media (min-width:641px){
  .cta-bar{left:auto;right:24px;bottom:24px;width:auto;border-radius:12px;border:1px solid rgba(202,169,105,.5);padding:10px;
    grid-template-columns:auto auto auto;box-shadow:0 12px 40px rgba(0,0,0,.4)}
  .cta-bar a{padding:0 18px}
  .kakao-fab{display:none!important}
}

/* ── 타입 카드 상담 버튼: 골드 강조 ── */
#plan-consult{background:#14263f;color:#fff;border-color:#14263f}
#plan-consult:hover{background:#0d2850}