/* ==== FAQ — 시작하기 전 궁금한 점 (왼쪽 상담 이미지 카드 + 번호 카드형 질문) ==== */

/* ---- PC ---- */
.faq-section{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:72px}
.faq-aside{display:flex;flex-direction:column}
.faq-section .eyebrow{margin-bottom:15px}
.faq-visual{position:relative;flex:1;min-height:250px;margin:32px 0 0;overflow:hidden;border-radius:16px;background:var(--forest)}
.faq-visual img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.faq-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#142923eb 100%)}
.faq-visual figcaption{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:26px;color:#fff}
.faq-visual small{display:block;margin-bottom:10px;font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--lime)}
.faq-visual b{display:block;font-size:21px;font-weight:700;line-height:1.45;letter-spacing:-.04em}
.faq-visual a{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:11px 18px;border-radius:999px;background:var(--lime);color:var(--forest);font-size:14px;font-weight:700;text-decoration:none}

.faq-list{display:grid;gap:12px;counter-reset:faq}
.faq-list details{counter-increment:faq;border:1px solid var(--line);border-radius:14px;background:#fff;transition:border-color .25s,box-shadow .25s}
.faq-list details:hover{border-color:#b9c7a8}
.faq-list details[open]{border-color:var(--forest);box-shadow:0 18px 40px -30px #14292380}
.faq-list summary{display:grid;grid-template-columns:44px 1fr 32px;align-items:center;gap:14px;padding:22px 24px;font-size:17px;font-weight:600;line-height:1.5;letter-spacing:-.03em;color:var(--ink);cursor:pointer;list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::before{content:counter(faq,decimal-leading-zero);font-size:13px;font-weight:700;letter-spacing:.06em;color:#9aa58f}
.faq-list details[open] summary::before{color:var(--forest)}
.faq-list summary span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sand);color:var(--forest);font-size:20px;line-height:1;transition:transform .3s,background .3s}
.faq-list details[open] summary span{transform:rotate(45deg);background:var(--lime)}
.faq-list p{margin:0;padding:0 24px 24px 82px;font-size:15px;line-height:1.85;color:#56645b}

/* ---- 태블릿 ---- */
@media(max-width:1150px){
  .faq-section{gap:44px}
}
@media(max-width:850px){
  .faq-section{grid-template-columns:1fr;gap:32px}
  .faq-visual{flex:none;aspect-ratio:16/9}
}

/* ---- 모바일 ---- */
@media(max-width:600px){
  .faq-visual{margin-top:24px;aspect-ratio:4/3;border-radius:14px}
  .faq-visual figcaption{padding:20px}
  .faq-visual b{font-size:18px}
  .faq-visual a{margin-top:14px;padding:10px 16px;font-size:13px}
  .faq-list{gap:10px}
  .faq-list summary{grid-template-columns:30px 1fr 28px;gap:10px;padding:18px;font-size:15px}
  .faq-list summary::before{font-size:12px}
  .faq-list summary span{width:28px;height:28px;font-size:18px}
  .faq-list p{padding:0 18px 20px 58px;font-size:14px;line-height:1.8}
}