@charset "utf-8";
/* =========================================================
   WEBIS FINANCE (theme/30) - 보조 CSS
   본문은 Tailwind utility 중심. 여기는 예외 보조만:
   grid minmax 보정 / 아이콘 정렬 고정 / swiper 보정 /
   컴포넌트 반복 클래스 / AOS·스크롤 보조
   ========================================================= */

:root{
  --brand:#FFCD2E; --brand2:#FFE15D; --cream:#FCEBC1; --cream2:#FDF4D8;
  --ink:#2B2B2B; --coral:#F18C97; --deep:#2D2D36;
}

html{ scroll-behavior:smooth; }
body{ overflow-x:hidden; }
*{ -webkit-tap-highlight-color:transparent; }

/* ---- 아이콘 정렬 고정 (밀림 방지: Lucide/SVG는 size+정렬 강제) ---- */
[data-lucide]{ display:inline-block; vertical-align:middle; stroke-width:2; flex:none; }
.lc{ width:1.05rem; height:1.05rem; }
.lc-lg{ width:1.5rem; height:1.5rem; }
.lc-xl{ width:1.85rem; height:1.85rem; }
i.fa-solid,i.fa-regular,i.fa-brands{ display:inline-block; text-align:center; line-height:1; }

/* ---- grid 안전장치 (Tailwind4 CDN arbitrary grid 폭발 회피) ---- */
.min-w-0,[class*="grid-cols-"] > *{ min-width:0; }

/* ========== 퀵 아이콘 카드 ========== */
.quick-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.55rem; background:#fff; border:1px solid #f0f0f0; border-radius:16px;
  padding:1.1rem .4rem; min-height:86px; text-align:center;
  box-shadow:0 8px 24px -20px rgba(0,0,0,.45); transition:.22s ease;
}
.quick-card span{ font-size:.84rem; font-weight:700; color:var(--ink); }
.quick-card:hover{ transform:translateY(-3px); border-color:var(--coral); box-shadow:0 14px 30px -18px rgba(241,140,151,.7); }
.quick-card:active{ transform:translateY(-1px) scale(.98); }

/* ========== BEST PRODUCT 카드 ========== */
.prod-card{
  position:relative; overflow:hidden; height:100%;
  background:var(--cream2); border-radius:16px; padding:1.5rem 1.4rem 1.4rem;
  min-height:230px; display:flex; flex-direction:column;
  transition:.25s ease;
}
.prod-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(180,140,40,.8); }
.prod-badge{
  align-self:flex-start; font-size:.72rem; font-weight:800; color:#fff;
  background:#E7B53C; border-radius:6px; padding:.18rem .55rem; margin-bottom:.85rem;
}
.prod-title{ font-size:1.18rem; font-weight:800; color:var(--ink); margin-bottom:.7rem; }
.prod-desc{ font-size:.82rem; line-height:1.6; color:rgba(43,43,43,.6); }
.prod-rate{ margin-top:auto; padding-top:1rem; font-size:1.45rem; font-weight:800; color:var(--ink); }
.prod-rate span{ font-size:1.05rem; }
.prod-img{ position:absolute; right:1rem; bottom:1rem; width:62px; height:62px; object-fit:contain; }

/* ========== 게시판 / 인포 카드 ========== */
.board-card{
  background:#fff; border:1px solid #f0f0f0; border-radius:16px; padding:1.2rem;
  box-shadow:0 8px 24px -22px rgba(0,0,0,.4);
}
.info-card{
  display:flex; gap:.8rem; justify-content:space-between; align-items:flex-start;
  background:#fff; border:1px solid #f0f0f0; border-radius:16px; padding:1.4rem;
  box-shadow:0 8px 24px -22px rgba(0,0,0,.4); transition:.22s ease;
}
.info-card.group:hover{ border-color:var(--coral); transform:translateY(-2px); }

/* ========== 상담현황 리스트 row ========== */
.consult-row{
  display:flex; align-items:center; gap:.6rem; justify-content:space-between;
  border:1px solid #f0f0f0; border-radius:12px; padding:.6rem .75rem;
}
.consult-row .tag{
  font-size:.7rem; font-weight:700; color:#fff; background:#cfcfcf;
  border-radius:5px; padding:.15rem .45rem; flex:none;
}
.consult-row .tag.t1{ background:var(--coral); }
.consult-row .tag.t2{ background:#E7B53C; }

/* ========== Swiper 보정 ========== */
.heroSwiper,.prodSwiper,.popupSwiper{ width:100%; }
.heroSwiper .swiper-slide,.popupSwiper .swiper-slide{ height:auto; display:block; }
.prodSwiper .swiper-slide{ height:auto; }
/* 히어로 페이지네이션 (bullet 직접 스타일) */
.heroPager .swiper-pagination-bullet{
  width:22px; height:5px; border-radius:99px; background:rgba(43,43,43,.18);
  opacity:1; margin:0 3px; transition:.25s;
}
.heroPager .swiper-pagination-bullet-active{ width:34px; background:var(--coral); }

/* ========== 팝업 바텀시트 모션(모바일) ========== */
@media (max-width:767px){
  #promoPopup > div:last-child{ transition:transform .3s ease; }
}

/* ========== AOS 미발동 대비 ========== */
[data-aos]{ will-change:opacity,transform; }
.no-aos [data-aos]{ opacity:1 !important; transform:none !important; }

/* 작은 화면 폰트/여백 보정 */
@media (max-width:319px){
  .quick-card{ min-height:78px; padding:.85rem .3rem; }
  .prod-title{ font-size:1.05rem; }
}