/* ══════════════════════════════════════════════════════
 * guide.php 전용 스타일
 * /css/page-guide.css
 * ※ 원본 인라인 규칙 그대로 이관 (시각 동일성 우선)
 * ══════════════════════════════════════════════════════ */

    .guide-hero{background:var(--ink);padding:40px;text-align:center;margin:70px auto;}
    .gh-h1{font-family:'DM Serif Display',serif;font-size:clamp(28px,4vw,44px);color:white;margin-bottom:8px;}
    .gh-sub{font-size:var(--fs-14);color:rgba(255,255,255,.4);font-weight:300;}
    .guide-wrap{max-width:840px;margin:0 auto;padding:40px 40px 80px;}
    .guide-tabs{display:flex;justify-content:center;gap:8px;margin-bottom:32px;}
    .guide-tab{padding:10px 24px;border-radius:999px;font-size:var(--fs-14);font-weight:500;color:var(--ink-50);cursor:pointer;transition:.2s;border:1px solid var(--ink-10);text-decoration:none;}
    .guide-tab:hover{background:var(--ink-05);color:var(--ink);}
    .guide-tab.active{background:var(--ink);color:white;border-color:var(--ink);}
    .guide-content{display:none;}
    .guide-content.active{display:block;}
    /* 스텝 카드 (정적/DB 공용) */
    .step-flow{display:flex;flex-direction:column;gap:0;position:relative;}
    .step-flow::before{content:'';position:absolute;left:19px;top:40px;bottom:40px;width:2px;background:linear-gradient(to bottom,var(--terracotta),rgba(183,110,78,.1));z-index:0;}
    .step-card{display:flex;gap:20px;padding:24px 0;border-bottom:1px solid var(--ink-05);position:relative;z-index:1;}
    .step-num{flex-shrink:0;width:40px;height:40px;border-radius:50%;background:var(--terracotta);color:white;display:flex;align-items:center;justify-content:center;font-family:'DM Serif Display',serif;font-size:var(--fs-18);font-weight:700;box-shadow:0 3px 12px rgba(183,110,78,.3);}
    .step-body h3{font-size:var(--fs-16);font-weight:600;color:var(--ink);margin-bottom:6px;}
    .step-body p{font-size:var(--fs-13);color:var(--ink-60);line-height:1.8;font-weight:300;}
    .step-body ul{padding-left:20px;margin:6px 0;}
    .step-body ul li{font-size:var(--fs-13);color:var(--ink-60);margin-bottom:4px;line-height:1.7;}
    .step-body ul li::marker{color:var(--terracotta);}
    .step-tip{background:linear-gradient(135deg,rgba(183,110,78,.06),rgba(183,110,78,.02));border:1px solid rgba(183,110,78,.1);border-radius:10px;padding:12px 16px;margin-top:10px;font-size:var(--fs-12);color:var(--ink-60);line-height:1.7;}
    .step-tip strong{color:var(--terracotta);}
    /* DB 콘텐츠 스타일 */
    .guide-db{font-size:var(--fs-13);color:var(--ink-60);line-height:1.85;font-weight:300;}
    .guide-db strong{color:var(--ink);font-weight:500;}
    .guide-db ul{padding-left:20px;margin:8px 0;}
    .guide-db ul li{margin-bottom:6px;}
    .guide-db ul li::marker{color:var(--terracotta);}
    .guide-db h2,.guide-db h3{color:var(--ink);margin:20px 0 10px;}
    .guide-version{text-align:center;margin-bottom:24px;font-size:var(--fs-11);color:var(--ink-hint);}
    /* 가이드 인트로 */
    .guide-intro{background:linear-gradient(135deg,#fafaf8,#f5f3f0);border-radius:16px;padding:24px;border:1px solid rgba(26,20,16,.06);margin-bottom:28px;text-align:center;}
    .guide-intro p{font-size:var(--fs-14);color:var(--ink-60);line-height:1.7;margin:0;}
    .guide-intro strong{color:var(--ink);}
    @media(max-width:640px){.guide-wrap{padding:32px 20px 80px;}.guide-hero{padding:40px 20px;}.step-card{flex-direction:column;gap:12px;}.step-flow::before{left:19px;}}
  
