/* ===== P40 문의 ===== */
.contact{padding:168px 0 160px}

.contact__grid{--cols:3;margin-top:66px;
               display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:24px}

.contact-card{display:block;height:100%;box-sizing:border-box;min-height:208px;padding:32px 40px;
              background:#F5F5F5;border-radius:12px;
              transition:background var(--dur-fast) var(--ease-out),
                         transform  var(--dur-fast) var(--ease-out)}
              /* height:100% 필수 — li는 grid align-items:stretch로 셋 다 높이가 같아지지만,
                 안의 a(.contact-card)는 그걸 안 물려받아 내용 줄 수가 적은 카드(전화)만 더 짧아 보였다 */
.contact-card:hover{background:#EFEFEF;transform:translateY(-2px)}
.contact-card:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
@media (hover:none){ .contact-card:hover{background:#F5F5F5;transform:none} }

.contact-card__ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%}
.contact-card__ico--tel{background:var(--accent-dark);color:#fff}
.contact-card__ico--kakao{background:#FEE500;color:#3C1E1E;font:700 18px/1 var(--font-sans)}
.contact-card__ico--mail{background:var(--ink);color:#fff}

.contact-card strong{display:block;margin-top:24px;font:700 var(--fs-lead)/1.4 var(--font-sans);color:var(--ink)}
.contact-card p{margin-top:14px;font-size:15px;line-height:1.75;color:var(--muted)}

@media (max-width:1023px){
  .contact{padding:100px 0}
  .contact__grid{--cols:1 !important}
}
@media (max-width:767px){
  .contact{padding:80px 0}
  .contact-card{min-height:0;padding:28px}
}

/* ===== P41 FAQ 빈 상태 ===== */
.faq-page{padding:100px 0}
.faq-page .faq{margin-top:44px}
.faq-page .empty{min-height:400px}
.faq-page .empty__icon{color:#A9C4D6}