
#hubbuyer-contact-simple{
  --primary:#0c4a6e;
  --primary-light:#e0f2fe;
  --text:#1f2937;
  --muted:#64748b;
  --border:#e2e8f0;
  --bg:#f8fafc;
  font-family:"Noto Sans KR","Noto Sans SC","Microsoft YaHei","PingFang SC",Arial,sans-serif;
  color:var(--text);
  line-height:1.6;
  background:var(--bg);
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}


#hubbuyer-contact-simple *{box-sizing:border-box}


#hubbuyer-contact-simple .contact-wrap{
  width:100%;
  max-width:920px;
  margin:0 auto;
  padding:80px 20px;
}


#hubbuyer-contact-simple .contact-box{
  background:#fff;
  border:1px solid var(--border);
  border-radius:22px;
  padding:48px 42px;
  text-align:center;
  box-shadow:0 14px 34px rgba(15,23,42,.07);
}


#hubbuyer-contact-simple .contact-label{
  display:inline-block;
  margin-bottom:14px;
  padding:7px 13px;
  border-radius:999px;
  background:var(--primary-light);
  color:var(--primary);
  font-size:14px;
  font-weight:800;
}


#hubbuyer-contact-simple h1{
  margin:0 0 14px;
  color:#111827;
  font-size:38px;
  line-height:1.25;
  letter-spacing:-.03em;
}


#hubbuyer-contact-simple .intro{
  max-width:680px;
  margin:0 auto 34px;
  color:var(--muted);
  font-size:17px;
}


#hubbuyer-contact-simple .contact-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:10px;
}


#hubbuyer-contact-simple .contact-item{
  display:block;
  padding:26px 20px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  text-decoration:none;
  transition:all .2s ease;
}


#hubbuyer-contact-simple .contact-item:hover{
  border-color:#bae6fd;
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(15,23,42,.06);
}


#hubbuyer-contact-simple .contact-item:focus-visible{
  outline:3px solid var(--primary);
  outline-offset:4px;
}


#hubbuyer-contact-simple .icon{
  display:block;
  margin-bottom:10px;
  font-size:28px;
}


#hubbuyer-contact-simple .title{
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:14px;
  font-weight:700;
}


#hubbuyer-contact-simple .value{
  display:block;
  color:var(--primary);
  font-size:20px;
  font-weight:850;
  word-break:break-word;
}


#hubbuyer-contact-simple .bottom-text{
  margin:30px 0 0;
  color:var(--muted);
  font-size:15px;
}


/* 新增：Kakao 咨询卡片 */
#hubbuyer-contact-simple .contact-item--kakao{
  background:#fee500;
  border-color:#fee500;
}


#hubbuyer-contact-simple .contact-item--kakao:hover{
  background:#f9df00;
  border-color:#f9df00;
  box-shadow:0 10px 22px rgba(56,28,30,.10);
}


#hubbuyer-contact-simple .contact-item--kakao .title,
#hubbuyer-contact-simple .contact-item--kakao .value{
  color:#381c1e;
}


/* 使用 CSS 气泡，无需外站图片或图标库 */
#hubbuyer-contact-simple .icon-kakao{
  display:flex;
  align-items:center;
  justify-content:center;
  height:45px;
}


#hubbuyer-contact-simple .kakao-bubble{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:36px;
  border-radius:50%;
  background:#381c1e;
  color:#fee500;
  font-family:Arial,sans-serif;
  font-size:14px;
  font-weight:900;
  line-height:1;
  letter-spacing:-.6px;
}


#hubbuyer-contact-simple .kakao-bubble::after{
  content:"";
  position:absolute;
  left:8px;
  bottom:-5px;
  width:0;
  height:0;
  border-top:10px solid #381c1e;
  border-right:10px solid transparent;
  transform:rotate(8deg);
}


@media (max-width:767px){
  #hubbuyer-contact-simple .contact-wrap{
    padding:50px 18px;
  }

  #hubbuyer-contact-simple .contact-box{
    padding:34px 20px;
  }

  #hubbuyer-contact-simple h1{
    font-size:30px;
  }

  #hubbuyer-contact-simple .intro{
    font-size:16px;
  }

  #hubbuyer-contact-simple .contact-list{
    grid-template-columns:1fr;
  }
}


@media (prefers-reduced-motion:reduce){
  #hubbuyer-contact-simple .contact-item{
    transition:none;
  }

  #hubbuyer-contact-simple .contact-item:hover{
    transform:none;
  }
}