/* ===== guide.css — 검색 유입 콘텐츠 페이지(지역 랜딩 · 가이드) 전용 =====
   base.css 토큰만 사용한다(신규 컬러·폰트 토큰 0개).
   10개 페이지가 같은 파일을 공유하므로 페이지별 <style> 중복이 없다(CSP: 인라인 스크립트 0). */

/* ---- FAQ 아코디언 (services/contact 와 동일 규격) ---- */
.faq-list{ display:flex; flex-direction:column; gap:.7rem; }
.faq-item{ background:rgba(255,255,255,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.6); border-radius:var(--radius-md); overflow:hidden; box-shadow:0 10px 26px -18px rgba(4,94,120,.2); }
.faq-item summary{ list-style:none; cursor:pointer; padding:1.1rem 1.3rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; font-weight:700; font-size:.98rem; color:var(--ink); word-break:keep-all; overflow-wrap:anywhere; min-height:44px; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .q-mark{ color:var(--brand); flex:none; }
.faq-item summary .chev{ flex:none; width:18px; height:18px; color:var(--sub); transition:transform var(--dur-base) var(--ease); }
.faq-item[open] summary .chev{ transform:rotate(180deg); }
.faq-item .faq-a{ padding:0 1.3rem 1.2rem; color:var(--sub); font-size:.95rem; max-width:70ch; word-break:keep-all; overflow-wrap:anywhere; }

/* ---- 본문 문단(가이드 글) ---- */
.g-body{ display:flex; flex-direction:column; gap:var(--sp-2); max-width:72ch; margin-top:var(--sp-3); }
.g-body p{ color:var(--sub); font-size:1rem; line-height:1.75; word-break:keep-all; overflow-wrap:anywhere; }
.g-body p b, .g-body p strong{ color:var(--ink); }
.g-note{ margin-top:var(--sp-3); font-size:.91rem; color:var(--sub); word-break:keep-all; overflow-wrap:anywhere; max-width:72ch; }
.g-caveat{ margin-top:var(--sp-2); font-size:var(--fs-2xs); color:var(--sub); word-break:keep-all; overflow-wrap:anywhere; }

/* ---- 사진 + 설명 밴드 (텍스트만인 구간 방지) ---- */
.g-media{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:var(--sp-3); align-items:center; margin-top:var(--sp-4); }
.g-media.rev{ grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
.g-media.rev .g-media-fig{ order:2; }
.g-media-fig{ margin:0; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow-md); background:var(--white); }
.g-media-fig img{ width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; }
.g-media-fig figcaption{ padding:.6rem .9rem; font-size:var(--fs-2xs); color:var(--sub); background:var(--white); border-top:1px solid var(--line); word-break:keep-all; }
.g-media-txt h3{ font-size:var(--fs-h3); margin-bottom:.6rem; word-break:keep-all; }
.g-media-txt p{ color:var(--sub); font-size:.97rem; line-height:1.75; word-break:keep-all; overflow-wrap:anywhere; }
.g-media-txt ul{ margin-top:.8rem; display:flex; flex-direction:column; gap:.5rem; }
.g-media-txt li{ position:relative; padding-left:1.5rem; color:var(--sub); font-size:.95rem; word-break:keep-all; overflow-wrap:anywhere; }
.g-media-txt li::before{ content:""; position:absolute; left:.25rem; top:.62em; width:7px; height:7px; border-radius:50%; background:var(--accent); }
@media(max-width:760px){
  .g-media, .g-media.rev{ grid-template-columns:1fr; }
  .g-media.rev .g-media-fig{ order:0; }
}

/* ---- 가격 행 (시작가 + caveat) ---- */
.g-price{ display:flex; flex-direction:column; gap:.6rem; margin-top:var(--sp-3); }
.g-price-row{ display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem 1rem; padding:.95rem 1.15rem; background:var(--white); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); }
.g-price-row b{ font-size:1rem; color:var(--ink); word-break:keep-all; }
.g-price-row .amt{ margin-left:auto; font-weight:800; color:var(--brand); white-space:nowrap; }
.g-price-row span.desc{ flex:1 1 16rem; font-size:var(--fs-xs); color:var(--sub); word-break:keep-all; overflow-wrap:anywhere; }

/* ---- 관련 가이드 링크 카드 ---- */
.g-links{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:var(--sp-2); margin-top:var(--sp-3); }
.g-link{ display:flex; align-items:flex-start; gap:.75rem; padding:1rem 1.1rem; min-height:44px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); transition:box-shadow var(--dur-base) var(--ease), transform var(--dur-base) var(--ease); }
.g-link:hover{ text-decoration:none; box-shadow:var(--shadow-md); transform:translateY(-2px); }
.g-link .gl-ic{ flex:none; width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:linear-gradient(135deg,var(--brand),var(--accent)); box-shadow:0 6px 14px -8px rgba(4,94,120,.7); }
.g-link .gl-ic svg{ width:18px; height:18px; color:#fff; }
.g-link b{ display:block; color:var(--ink); font-size:.97rem; word-break:keep-all; }
.g-link span{ display:block; color:var(--sub); font-size:var(--fs-2xs); margin-top:.15rem; word-break:keep-all; overflow-wrap:anywhere; }

/* ---- 스크린리더 전용 표 캡션 ---- */
.sr-only{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
