/* main_contact_donation.css
   메인페이지 오른쪽 문의안내 / 후원안내 전용 CSS
   다른 카드와 충돌하지 않도록 sh-main-contact-card, sh-main-donation-card 에만 적용
*/

.main-bottom-section .sh-main-contact-card{
  position:relative !important;
  overflow:hidden !important;
  min-height:205px !important;
  padding:28px 28px 24px !important;
  border-radius:24px !important;
  border:0 !important;
  background:
    radial-gradient(circle at 86% 26%, rgba(255,255,255,.08) 0 28%, transparent 29%),
    linear-gradient(135deg, #31211c 0%, #50372f 58%, #2d1e19 100%) !important;
  box-shadow:0 14px 32px rgba(45,30,25,.18) !important;
  color:#fff !important;
}

.main-bottom-section .sh-main-contact-card::after{
  content:"";
  position:absolute !important;
  right:26px !important;
  top:23px !important;
  width:86px !important;
  height:86px !important;
  border:7px solid rgba(255,255,255,.14) !important;
  border-radius:50% !important;
  box-sizing:border-box !important;
  pointer-events:none !important;
}

.main-bottom-section .sh-main-contact-card::before{
  content:"•••";
  position:absolute !important;
  right:48px !important;
  top:52px !important;
  color:rgba(255,255,255,.18) !important;
  font-size:28px !important;
  letter-spacing:4px !important;
  pointer-events:none !important;
}

.main-bottom-section .sh-main-contact-card h3{
  position:relative !important;
  z-index:1 !important;
  margin:0 0 10px !important;
  color:#fff !important;
  font-size:19px !important;
  font-weight:900 !important;
}

.main-bottom-section .sh-main-contact-phone{
  position:relative !important;
  z-index:1 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 12px !important;
  color:#fff1e7 !important;
  font-size:28px !important;
  font-weight:900 !important;
  letter-spacing:.02em !important;
  text-shadow:0 2px 0 rgba(0,0,0,.12) !important;
}

.main-bottom-section .sh-phone-icon{
  color:#fff !important;
  font-size:25px !important;
  line-height:1 !important;
}

.main-bottom-section .sh-main-contact-card p:not(.phone){
  position:relative !important;
  z-index:1 !important;
  margin:0 !important;
  color:#fff !important;
  font-size:15px !important;
  font-weight:700 !important;
}

.main-bottom-section .sh-main-contact-card .main-side-buttons{
  position:relative !important;
  z-index:1 !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
  margin-top:18px !important;
}

.main-bottom-section .sh-contact-action{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:100% !important;
  min-height:42px !important;
  padding:0 12px !important;
  border-radius:8px !important;
  box-sizing:border-box !important;
  font-size:15px !important;
  font-weight:900 !important;
  text-align:center !important;
  text-decoration:none !important;
}

.main-bottom-section .sh-contact-action-primary{
  background:#fff !important;
  border:1px solid #fff !important;
  color:#2f211d !important;
}

.main-bottom-section .sh-contact-action-line{
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.55) !important;
  color:#fff !important;
}

.main-bottom-section .sh-main-donation-card{
  position:relative !important;
  overflow:hidden !important;
  min-height:176px !important;
  padding:24px 26px !important;
  border-radius:24px !important;
  border:0 !important;
  background:
    radial-gradient(circle at 82% 42%, rgba(255,92,92,.16) 0 0, transparent 34%),
    linear-gradient(135deg, #ffffff 0%, #fff5ec 48%, #f4e4d4 100%) !important;
  box-shadow:0 14px 32px rgba(0,0,0,.055) !important;
}

.main-bottom-section .sh-main-donation-card::after{
  content:"❤" !important;
  position:absolute !important;
  right:44px !important;
  top:38px !important;
  font-size:62px !important;
  color:#ff5f65 !important;
  text-shadow:
    -28px -4px 0 rgba(255,95,101,.28),
    -18px 22px 0 rgba(255,95,101,.20),
    24px 18px 0 rgba(255,95,101,.22) !important;
  pointer-events:none !important;
}

.main-bottom-section .sh-main-donation-card::before{
  content:"" !important;
  position:absolute !important;
  right:24px !important;
  bottom:16px !important;
  width:126px !important;
  height:58px !important;
  border-radius:60% 40% 50% 50% !important;
  background:rgba(189,119,83,.34) !important;
  transform:rotate(-10deg) !important;
  pointer-events:none !important;
}

.main-bottom-section .sh-main-donation-card strong,
.main-bottom-section .sh-main-donation-card p,
.main-bottom-section .sh-donation-action{
  position:relative !important;
  z-index:1 !important;
}

.main-bottom-section .sh-main-donation-card strong{
  display:block !important;
  margin:0 0 10px !important;
  color:#222 !important;
  font-size:22px !important;
  font-weight:900 !important;
}

.main-bottom-section .sh-main-donation-card p{
  max-width:210px !important;
  margin:0 0 16px !important;
  color:#444 !important;
  font-size:15px !important;
  line-height:1.65 !important;
  font-weight:600 !important;
  word-break:keep-all !important;
}

.main-bottom-section .sh-donation-action{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:190px !important;
  height:42px !important;
  padding:0 18px !important;
  border-radius:8px !important;
  background:#34231d !important;
  color:#fff !important;
  font-size:15px !important;
  font-weight:900 !important;
  text-decoration:none !important;
}

@media (max-width:760px){
  .main-bottom-section .sh-main-contact-card,
  .main-bottom-section .sh-main-donation-card{
    min-height:auto !important;
  }

  .main-bottom-section .sh-main-contact-card .main-side-buttons{
    grid-template-columns:1fr !important;
  }

  .main-bottom-section .sh-main-donation-card p{
    max-width:100% !important;
    padding-right:90px !important;
  }
}