/* One clear contact channel, shared by the hero, sticky action, and dialog. */
:root body .hero .hero-actions {display:flex;justify-content:flex-start}
:root body .hero .hero-contact-kakao {
  width:350px;max-width:100%;min-height:84px;padding:16px 20px;
  justify-content:flex-start;gap:16px;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;white-space:normal;text-decoration:none;
  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}
:root body .hero-contact-kakao .hero-contact-icon {width:29px;height:29px;flex:none}
.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}
:root body .hero-contact-kakao .hero-contact-arrow {display:block;flex:none;width:32px;height:32px;padding:7px;margin:0;border-radius:50%;background:#fff5}
:root body .hero .hero-contact-kakao:hover {background:#ffe92b;transform:translateY(-3px);box-shadow:0 17px 32px #08194035,inset 0 1px 0 #fff9}
:root body .hero .hero-contact-kakao:active {transform:translateY(0)}
:root body .hero .hero-contact-kakao:focus-visible {outline:3px solid #fff;outline-offset:5px}

:root body .floating-contact {grid-template-columns:1fr;gap:0}
:root body .floating-contact-link {flex-direction:row;gap:12px;border-radius:18px;box-shadow:0 6px 24px #10295426}
:root body .floating-contact-link>span {width:auto;white-space:nowrap}
:root body .floating-contact-link:after {display:none}
:root body .floating-contact-link:hover {translate:0 -3px;box-shadow:0 10px 28px #10295430}
:root body .floating-contact-arrow {display:block;width:18px;height:18px}
:root body .contact-channel[data-channel="kakao"] {background:#fee500;color:#251d0c;border-color:#e8cf00;border-radius:14px;padding:20px;min-height:64px}

@media (min-width:761px) {
  :root body .floating-contact {left:auto;right:24px;bottom:24px;width:224px;transform:none}
  :root body .floating-contact-link {height:64px;padding:14px 18px;font-size:16px}
}
@media (max-width:760px) {
  :root body .hero .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}
  :root body .hero-contact-kakao .hero-contact-arrow {width:28px;height:28px;padding:6px}
  :root body .floating-contact {width:min(440px,calc(100% - 24px));bottom:calc(10px + env(safe-area-inset-bottom))}
  :root body .floating-contact-link {height:58px;padding:0 22px;font-size:17px}
  :root body .floating-contact-arrow {margin-left:8px}
}
@media (max-width:360px) {
  :root body .hero .hero-contact-kakao {gap:10px;padding-inline:14px}
  .hero-contact-copy strong {font-size:18px}
}
@media (prefers-reduced-motion:reduce) {
  :root body .hero .hero-contact-kakao {transition:none}
  :root body .hero .hero-contact-kakao:hover {transform:none}
}