/* Match the 블랙페이 site's direct Kakao consultation actions. */
.kakao-icon{fill:currentColor;stroke:none}
.kakao-dots{stroke:#fee500;stroke-width:3;stroke-linecap:round}
.hero-actions .hero-contact-kakao{display:flex;align-items:center;justify-content:flex-start;flex:none;gap:16px;width:350px;max-width:100%;min-height:84px;padding:16px 20px;border:1px solid #fff06b;border-radius:20px;background:#fee500;color:#251d0c;box-shadow:0 12px 28px #08194025,inset 0 1px 0 #fff7;text-align:left;text-decoration:none;white-space:normal;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.hero-contact-mark{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:15px;background:#36250b0d}
.hero-contact-mark .kakao-icon{width:29px;height:29px}
.hero-contact-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.hero-contact-copy small{font-size:14px;line-height:1.45;font-weight:400;color:#514414;letter-spacing:-.02em}
.hero-contact-copy strong{font-size:21px;line-height:1.4;letter-spacing:-.035em}
.hero-contact-arrow{display:block;flex:none;width:32px;height:32px;padding:7px;border-radius:50%;background:#fff5}
.hero-actions .hero-contact-kakao:hover{background:#ffe92b;transform:translateY(-3px);box-shadow:0 17px 32px #08194035,inset 0 1px 0 #fff9}
.hero-actions .hero-contact-kakao:active{transform:translateY(0)}
.hero-actions .hero-contact-kakao:focus-visible,.floating-kakao:focus-visible{outline:3px solid #245cf6;outline-offset:5px}

.floating-cta{left:auto;right:24px;bottom:24px;width:248px;display:block;padding:0;border:0;border-radius:18px;background:none;backdrop-filter:none;box-shadow:none;animation:blackpay-contact-arrive .65s .3s cubic-bezier(.16,1,.3,1) backwards}
.floating-kakao{display:flex;align-items:center;gap:12px;width:100%;height:64px;padding:14px 18px;border:1px solid #e8cf00;border-radius:18px;background:#fee500;color:#251d0c;box-shadow:0 6px 24px #10295426;font-size:16px;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:translate .25s,box-shadow .25s,background .25s}
.floating-kakao>.kakao-icon{width:29px;height:29px;flex:none;transition:transform .3s}
.floating-contact-arrow{width:18px;height:18px;flex:none;margin-left:auto;transition:translate .25s}
.floating-kakao:hover{background:#ffe92b;translate:0 -3px;box-shadow:0 10px 28px #10295430}
.floating-kakao:hover>.kakao-icon{transform:rotate(-8deg) scale(1.08)}
.floating-kakao:hover .floating-contact-arrow{translate:3px 0}
.floating-kakao:active{translate:0 1px}
dialog .contact-link.button{min-height:64px;background:#fee500;color:#251d0c;border:1px solid #e8cf00;border-radius:14px}
dialog .contact-link.button:hover{background:#ffe92b}
@keyframes blackpay-contact-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.hero-actions .hero-contact-kakao{width:330px;min-height:78px;padding:14px 16px;gap:12px;border-radius:18px}.hero-contact-mark{width:42px;height:42px;border-radius:13px}.hero-contact-copy strong{font-size:19px}.hero-contact-arrow{width:28px;height:28px;padding:6px}.floating-cta{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto}.floating-kakao{height:58px;padding:0 22px;font-size:17px}}
@media(max-width:360px){.hero-actions .hero-contact-kakao{gap:10px;padding-inline:14px}.hero-contact-copy strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){.floating-cta{animation:none}.hero-actions .hero-contact-kakao,.floating-kakao{transition:none}.hero-actions .hero-contact-kakao:hover{transform:none}}

/* Mobile consultation remains available from the hero through the footer. */
@media(max-width:760px){
  html{scroll-padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .floating-cta,body.at-hero .floating-cta{opacity:1;transform:none;pointer-events:auto;animation:none;bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  .floating-kakao{position:relative;justify-content:center;height:60px;padding:0 52px;font-size:17px;border-radius:16px}
  .floating-kakao>.kakao-icon{position:absolute;left:20px;width:25px;height:25px}
  .floating-contact-arrow{position:absolute;right:20px;margin:0}
  .footer{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
}


/* BLACKPAY consultation details — phone + Kakao, desktop and mobile. */
.hero-phone-line{display:flex;align-items:center;gap:9px;margin:12px 0 0;color:#465674;font-size:14px;line-height:1.5}
.hero-phone-line svg{width:16px;height:16px;flex:none;color:#1c3865}
.hero-phone-line a{color:#102c57;font-size:16px;font-weight:750;text-decoration:none;border-bottom:1px solid #8797b0}
.hero-phone-line a:hover{color:#2559ae;border-color:currentColor}
.hero-phone-line a:focus-visible,.footer-contact a:focus-visible,.floating-phone:focus-visible,.contact-phone-link:focus-visible{outline:3px solid #245cf6;outline-offset:4px}
.footer-contact{margin-top:27px;padding:23px 27px;background:#ffffff0c;border:1px solid #8799b333;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.footer-contact-heading>strong{font-size:17px;line-height:1.35}
.footer-contact-heading>p{font-size:13px;line-height:1.6;opacity:.85;margin:7px 0 0}
.footer-contact-actions{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}
.footer-contact-actions a{display:flex;align-items:center;gap:12px;min-height:61px;padding:11px 17px;border-radius:12px;text-decoration:none;font-size:12px;line-height:1.4;transition:background .2s ease,border-color .2s ease,translate .2s ease}
.footer-contact-actions a:hover{translate:0 -2px}
.footer-contact-actions a>svg{width:21px;height:21px;flex:none}
.footer-contact-actions a>span:not(.footer-kakao-symbol){display:flex;flex-direction:column;gap:3px}
.footer-contact-actions a strong{font-size:16px;line-height:1.3}
.footer-contact-phone{background:#fff;color:#192c4a;border:1px solid #d7e0ef}
.footer-contact-kakao{background:#fee500;color:#251d0c;border:1px solid #f4d600}
.footer-kakao-symbol{font-size:9px;font-weight:900;padding:6px 4px;border-radius:8px;background:#382f1a;color:#fee500;letter-spacing:-.03em}
.floating-cta{display:flex;align-items:stretch;gap:8px;width:auto;max-width:calc(100vw - 24px)}
.floating-phone{display:flex;align-items:center;justify-content:center;gap:8px;min-width:132px;padding:12px 14px;border:1px solid #dae1ee;border-radius:18px;background:#fff;color:#14284a;box-shadow:0 6px 24px #1029541e;font-size:15px;font-weight:750;line-height:1.3;text-decoration:none;white-space:nowrap;transition:translate .25s,box-shadow .25s}
.floating-phone svg{width:19px;height:19px;flex:none}
.floating-phone:hover{translate:0 -3px;box-shadow:0 10px 28px #10295428}
.floating-kakao{width:248px;flex:none}
#contact-channel{display:grid;gap:10px}
dialog .contact-phone-link.button{min-height:57px;border-radius:14px;background:#fff;border:1px solid #cbd5e6;color:#193357;font-size:15px}
dialog .contact-phone-link.button:hover{background:#ecf2fa}
@media(max-width:850px){.footer-contact{align-items:flex-start;flex-direction:column}.footer-contact-actions{width:100%}.footer-contact-actions a{flex:1;min-width:170px}}
@media(max-width:760px){
 .hero-phone-line{font-size:13px;gap:7px}.hero-phone-line a{font-size:15px}
 .floating-cta{display:grid;grid-template-columns:minmax(96px,0.8fr) minmax(0,1.7fr);left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:auto;max-width:none;gap:8px}
 .floating-phone{min-width:0;height:60px;padding:0 10px;border-radius:16px;font-size:14px}
 .floating-phone svg{width:18px;height:18px}
 .floating-kakao{width:100%;height:60px;min-width:0;position:relative;justify-content:center;padding:0 8px;gap:7px;font-size:14px;border-radius:16px}
 .floating-kakao>.kakao-icon{position:static;width:25px;height:25px;flex:none}
 .floating-contact-arrow{display:none}
 .footer-contact{padding:20px 18px;gap:18px}
}
@media(max-width:385px){
 .floating-cta{grid-template-columns:minmax(90px,0.73fr) minmax(0,1.7fr);gap:6px}
 .floating-phone{gap:5px;font-size:12px;padding:0 4px}
 .floating-phone svg{width:15px;height:15px}
 .floating-kakao{font-size:13px;gap:5px}
 .floating-kakao>.kakao-icon{width:21px;height:21px}
 .footer-contact-actions{flex-direction:column}.footer-contact-actions a{min-width:0;width:100%}
}
@media(prefers-reduced-motion:reduce){.footer-contact-actions a,.floating-phone{transition:none}}
