/* 기능 안내 페이지 — 홈페이지(style.css) 색·글꼴을 그대로 쓰고 배치만 더한다 */
.g-wrap{ max-width:760px; margin:0 auto; padding:96px 20px 40px; }
.g-crumb{ font-size:13px; color:var(--ink-soft); margin:0 0 14px; }
.g-crumb a{ color:var(--ink-soft); text-decoration:none; }
.g-crumb a:hover{ text-decoration:underline; }
.g-title{ font-size:clamp(28px,5vw,40px); font-weight:900; letter-spacing:-.02em; margin:0 0 12px; color:var(--ink); }
.g-lead{ font-size:17px; line-height:1.7; color:var(--ink-soft); margin:0 0 36px; }
.g-sec{ font-size:20px; font-weight:800; color:var(--ink); margin:44px 0 16px; }
.g-steps{ list-style:none; padding:0; margin:0; counter-reset:step; display:grid; gap:14px; }
.g-step{ counter-increment:step; background:#fff; border:1px solid rgba(167,139,219,.16); border-radius:var(--r-md);
  box-shadow:var(--shadow-card); padding:20px 20px 20px 64px; position:relative; }
.g-step::before{ content:counter(step); position:absolute; left:20px; top:18px; width:30px; height:30px; border-radius:50%;
  background:var(--grad-soft); display:grid; place-items:center; font-weight:800; font-size:15px; color:var(--ink); }
.g-step p{ margin:4px 0 0; font-size:16px; line-height:1.65; color:var(--ink); }
.g-step img{ display:block; width:min(260px,100%); margin:16px 0 4px; border-radius:22px;
  filter:drop-shadow(0 18px 30px rgba(80,40,90,.25)); }
.g-tips{ margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.g-tips li{ background:var(--paper-2); border-radius:var(--r-sm); padding:14px 16px; font-size:15px; line-height:1.6; color:var(--ink); }
.g-hero-img{ display:block; width:min(280px,72vw); margin:0 auto 8px; filter:drop-shadow(0 30px 55px rgba(80,40,90,.3)); }
.g-more{ display:flex; flex-wrap:wrap; gap:10px; }
.g-more a{ background:#fff; border:1px solid rgba(167,139,219,.25); border-radius:999px; padding:9px 16px;
  font-size:14px; font-weight:600; color:var(--ink); text-decoration:none; }
.g-more a:hover{ border-color:var(--lav); }
.g-cta{ margin:56px 0 0; text-align:center; }
.g-cta p{ color:var(--ink-soft); margin:0 0 14px; }
.g-todo{ background:#FCF5BF; color:#1A1A1A; border-radius:8px; padding:2px 6px; font-size:14px; }
.g-img-todo{ width:min(260px,100%); aspect-ratio:9/19; margin:16px 0 4px; border-radius:22px; border:2px dashed rgba(167,139,219,.5);
  display:grid; place-items:center; padding:16px; text-align:center; font-size:13px; color:var(--ink-soft); background:var(--paper-2); }
.g-hero-todo{ margin:0 auto 8px; width:min(280px,72vw); }