@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;500;600;700&display=swap');

/* 법무법인 거평 — 제목 명조 / 본문 Pretendard, 직각·헤어라인 기반 편집형 레이아웃 */

:root {
  --gpm-navy: #0B1E3D;
  --gpm-navy-800: #0E2344;
  --gpm-navy-700: #1D3A66;
  --gpm-gold: #B08C2B;
  --gpm-gold-600: #8C6E1E;
  --gpm-gold-100: #F4EFE2;
  --gpm-bg: #FFFFFF;
  --gpm-tint: #F5F4F1;
  --gpm-surface: #FFFFFF;
  --gpm-text: #14202F;
  --gpm-neutral-600: #55606F;
  --gpm-neutral-400: #8C95A1;
  --gpm-neutral-300: #D4D7DC;
  --gpm-neutral-200: #E6E7E9;
  --gpm-neutral-100: #F5F4F1;
  --gpm-divider: rgba(20,32,47,0.14);
  --gpm-line: rgba(20,32,47,0.16);
  --gpm-line-strong: rgba(20,32,47,0.34);
  --gpm-font: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif;
  --gpm-serif: 'Noto Serif KR', 'Nanum Myeongjo', 'Apple SD Gothic Neo', serif;
}

html, body.gpm-page, body.gp-page { margin: 0; padding: 0; }
.gpm-page { background: var(--gpm-bg); color: var(--gpm-text); font-family: var(--gpm-font); font-weight: 400; letter-spacing: -0.012em; overflow-x: hidden; overflow-x: clip; -webkit-font-smoothing: antialiased; }
/* ↑ clip: 게시판 페이지는 그누보드 default.css 의 html{overflow-y:scroll} 때문에 body 가 스크롤 상자가 되어 hidden 이면 상단 묶음 sticky 가 깨진다 */
.gpm-page * { box-sizing: border-box; }
.gpm-page a { text-decoration: none; color: inherit; }
.gpm-page img, .gpm-page video { display: block; max-width: 100%; }
.gpm-page h1, .gpm-page h2, .gpm-page h3, .gpm-page h4 { font-family: var(--gpm-serif); font-weight: 700; letter-spacing: -0.035em; line-height: 1.38; margin: 0; }
.gpm-page p { margin: 0; }

.gpm-wrap { max-width: 1180px; margin: 0 auto; padding: 0 28px; }
.gpm-inner { max-width: 1180px; margin: 0 auto; padding: 0 28px; }
.gpm-band { padding: 92px 0; }
.gpm-band-tint { background: var(--gpm-tint); }
.gpm-band-navy { background: var(--gpm-navy); color: #fff; }
.gpm-band-navy h2, .gpm-band-navy h3 { color: #fff; }

/* 소제목 라벨 · 제목 · 텍스트링크 */
.gpm-label { font-size: 14.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gpm-gold-600); display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.gpm-label::before { content: ''; width: 26px; height: 1px; background: currentColor; flex: 0 0 26px; }
.gpm-band-navy .gpm-label { color: var(--gpm-gold); }
.gpm-h2 { font-size: clamp(25px, 3.1vw, 36px); }
.gpm-h3 { font-size: clamp(20px, 2.2vw, 25px); }
.gpm-lede { font-size: 15px; line-height: 1.85; color: var(--gpm-neutral-600); }
.gpm-band-navy .gpm-lede { color: rgba(255,255,255,.72); }
.gpm-textlink { font-size: 13px; font-weight: 600; border-bottom: 1px solid var(--gpm-line-strong); padding-bottom: 3px; white-space: nowrap; }
.gpm-textlink:hover { border-bottom-color: var(--gpm-gold); color: var(--gpm-gold-600); }
.gpm-band-navy .gpm-textlink { border-bottom-color: rgba(255,255,255,.4); }
.gpm-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 22px; border-bottom: 1px solid var(--gpm-line-strong); margin-bottom: 0; }

/* 버튼 */
.gpm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--gpm-font); font-weight: 600; font-size: 14px; padding: 15px 30px; cursor: pointer; border: 1px solid var(--gpm-line-strong); background: transparent; color: inherit; }
.gpm-btn-solid { background: var(--gpm-navy); border-color: var(--gpm-navy); color: #fff; }
.gpm-btn-solid:hover { background: #071527; }
.gpm-btn-gold { background: var(--gpm-gold); border-color: var(--gpm-gold); color: #fff; }
.gpm-btn-gold:hover { background: var(--gpm-gold-600); }
.gpm-btn-outline-navy { border-color: var(--gpm-navy); color: var(--gpm-navy); }
.gpm-btn-ghost { border-color: rgba(255,255,255,.45); color: #fff; }

/* 프로모 배너 */
.gpm-promo { background: var(--gpm-navy); color: rgba(255,255,255,.9); text-align: center; font-size: 15px; font-weight: 600; padding: 10px 40px; position: relative; letter-spacing: 0; }
.gpm-promo strong { color: var(--gpm-gold); font-weight: 700; }
.gpm-promo-close { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); background: none; border: none; color: rgba(255,255,255,0.5); cursor: pointer; font-size: 16px; line-height: 1; }

/* 네비게이션 */
/* 상단 묶음: 프로모 배너와 GNB 가 PC·모바일 모두 함께 따라온다 */
.gpm-top { position: sticky; top: 0; z-index: 50; }
html { scroll-padding-top: var(--gpm-top-h, 118px); }
.gpm-nav { background: #fff; border-bottom: 1px solid var(--gpm-line); position: relative; }
.gpm-nav-inner { max-width: 1180px; margin: 0 auto; padding: 18px 28px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.gpm-nav-brand { font-family: var(--gpm-serif); font-weight: 700; font-size: 21px; letter-spacing: -0.04em; color: var(--gpm-navy); white-space: nowrap; }
.gpm-nav-links { display: flex; gap: 34px; flex-wrap: wrap; }
.gpm-nav-links a { font-size: 14px; font-weight: 500; color: var(--gpm-text); position: relative; padding: 2px 0; }
.gpm-nav-links a::after { content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 1px; background: var(--gpm-gold); transform: scaleX(0); transition: transform .18s; }
.gpm-nav-links a:hover::after { transform: scaleX(1); }
.gpm-nav-phone { font-family: var(--gpm-serif); font-weight: 600; color: var(--gpm-navy); font-size: 17px; letter-spacing: -0.03em; white-space: nowrap; }
.gpm-nav-toggle { display: none; width: 32px; height: 32px; border: none; background: transparent; padding: 0; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
.gpm-nav-toggle span { display: block; width: 22px; height: 1px; background: var(--gpm-navy); }

/* 히어로 — 풀블리드 사진 + 좌측 정렬 */
.gpm-hero { position: relative; min-height: 560px; display: flex; align-items: flex-end; overflow: hidden; background: var(--gpm-navy); }
.gpm-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gpm-hero-veil { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(6,17,33,.92) 0%, rgba(6,17,33,.72) 46%, rgba(6,17,33,.28) 100%); }
.gpm-hero-body { position: relative; max-width: 1180px; width: 100%; margin: 0 auto; padding: 0 28px 76px; color: #fff; }
.gpm-hero-eyebrow { font-size: 14.5px; letter-spacing: .14em; color: rgba(255,255,255,.66); margin-bottom: 22px; }
.gpm-hero-title { font-size: clamp(30px, 4.4vw, 52px); color: #fff; line-height: 1.3; max-width: 17em; word-break: keep-all; }
.gpm-page .gpm-hero-lede { margin-top: 22px; font-size: 15.5px; line-height: 1.8; color: rgba(255,255,255,.76); max-width: 34em; word-break: keep-all; }
.gpm-hero-cta { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 38px; }
.gpm-hero-tel { display: flex; flex-direction: column; gap: 2px; }
.gpm-hero-tel b { font-family: var(--gpm-serif); font-size: 21px; font-weight: 600; letter-spacing: -0.03em; }
.gpm-hero-tel span { font-size: 14.5px; color: rgba(255,255,255,.6); letter-spacing: .04em; }

/* 지표 스트립 */
.gpm-stats { border-bottom: 1px solid var(--gpm-line); }
.gpm-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.gpm-stat { padding: 30px 26px; border-left: 1px solid var(--gpm-line); }
.gpm-stat:first-child { border-left: none; padding-left: 0; }
.gpm-stat-num { font-family: var(--gpm-serif); font-size: 29px; font-weight: 600; letter-spacing: -0.05em; color: var(--gpm-navy); line-height: 1.1; }
.gpm-stat-num small { font-size: 15px; font-weight: 500; margin-left: 3px; letter-spacing: 0; }
.gpm-stat-label { font-size: 12.5px; color: var(--gpm-neutral-600); margin-top: 8px; }

/* 좌측 고정 제목 + 우측 본문 (비대칭 2단) */
.gpm-split { display: grid; grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.3fr); gap: 72px; align-items: start; }
.gpm-split-head { position: sticky; top: calc(var(--gpm-top-h, 118px) + 24px); }
.gpm-split-head .gpm-h2 { margin-bottom: 20px; }
.gpm-split-foot { margin-top: 28px; }

/* 성공사례 — 결과 선행 목록 */
.gpm-wc-row { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 26px; padding: 26px 0; border-top: 1px solid var(--gpm-line); }
.gpm-wc-row:last-child { border-bottom: 1px solid var(--gpm-line); }
.gpm-wc-row:hover .gpm-wc-title { color: var(--gpm-gold-600); }
.gpm-wc-outcome { font-family: var(--gpm-serif); font-size: 15px; font-weight: 600; color: var(--gpm-gold-600); letter-spacing: -0.04em; padding-top: 2px; }
.gpm-wc-title { font-family: var(--gpm-serif); font-size: 19px; font-weight: 600; letter-spacing: -0.04em; line-height: 1.5; }
.gpm-wc-desc { font-size: 13.5px; line-height: 1.8; color: var(--gpm-neutral-600); margin-top: 8px; }

/* 성공사례 — 클로드디자인 원본: 대형 키커 + 사진 카드 */
.gpm-wcase-kicker { font-family: var(--gpm-serif); font-weight: 700; font-size: clamp(36px, 6vw, 56px); color: var(--gpm-neutral-300); margin: 8px 0 28px; letter-spacing: 0.02em; line-height: 1.1; }
.gpm-wcase-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.gpm-wcase-card { position: relative; min-height: 340px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; background: var(--gpm-navy-800); }
.gpm-wcase-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.gpm-wcase-card:hover .gpm-wcase-img { transform: scale(1.04); }
.gpm-wcase-body { position: relative; padding: 24px; color: #fff; display: flex; flex-direction: column; gap: 8px; background: linear-gradient(180deg, transparent 0%, rgba(11,30,61,.9) 65%); }
.gpm-wcase-num { font-size: 14.5px; opacity: .85; }
.gpm-wcase-title { font-family: var(--gpm-serif); font-weight: 700; font-size: 19px; line-height: 1.3; letter-spacing: -0.04em; }
.gpm-wcase-desc { font-size: 14.5px; line-height: 1.6; opacity: .8; }

/* 풀블리드 인용 밴드 */
.gpm-quote { position: relative; padding: 108px 0; overflow: hidden; background: var(--gpm-navy); }
.gpm-quote-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .34; }
.gpm-quote-body { position: relative; max-width: 1180px; margin: 0 auto; padding: 0 28px; }
.gpm-quote-text { font-family: var(--gpm-serif); font-size: clamp(21px, 2.7vw, 31px); font-weight: 500; line-height: 1.68; letter-spacing: -0.04em; color: #fff; max-width: 21em; }
.gpm-quote-by { margin-top: 26px; font-size: 12.5px; letter-spacing: .1em; color: rgba(255,255,255,.62); }

/* 업무분야 — 사진 카드 (헤어라인 이음새 그리드) */
.gpm-area-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--gpm-line); border: 1px solid var(--gpm-line); margin-top: 34px; }
.gpm-area-card { background: #fff; display: flex; flex-direction: column; }
.gpm-area-card-photo { aspect-ratio: 4/3; overflow: hidden; background: var(--gpm-neutral-200); }
.gpm-area-card-photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: filter .35s, transform .5s; }
.gpm-area-card:hover .gpm-area-card-photo img { filter: grayscale(0); transform: scale(1.03); }
.gpm-area-card-body { padding: 15px 16px 18px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.gpm-area-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding-bottom: 9px; border-bottom: 1px solid var(--gpm-divider); }
.gpm-area-card-name { font-family: var(--gpm-serif); font-size: 17px; font-weight: 600; letter-spacing: -0.045em; }
.gpm-area-card:hover .gpm-area-card-name { color: var(--gpm-gold-600); }
.gpm-area-card-count { font-size: 14.5px; color: var(--gpm-neutral-400); }
.gpm-area-card-items { font-size: 14.5px; line-height: 1.75; color: var(--gpm-neutral-600); }

/* 정의형 목록 (차별점) */
.gpm-defs { border-top: 1px solid rgba(255,255,255,.18); }
.gpm-def-row { display: grid; grid-template-columns: minmax(0, 0.62fr) minmax(0, 1fr); gap: 32px; padding: 26px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.gpm-def-title { font-family: var(--gpm-serif); font-size: 18px; font-weight: 600; letter-spacing: -0.04em; color: #fff; }
.gpm-def-desc { font-size: 13.5px; line-height: 1.85; color: rgba(255,255,255,.7); }

/* 변호인단 로스터 */
.gpm-roster { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; margin-top: 44px; }
.gpm-roster-photo { width: 100%; aspect-ratio: 3/4; overflow: hidden; background: var(--gpm-neutral-200); }
.gpm-roster-photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.04); transition: filter .35s; }
.gpm-roster-item:hover .gpm-roster-photo img { filter: grayscale(0); }
.gpm-roster-nameline { display: flex; align-items: baseline; gap: 10px; padding: 18px 0 12px; border-bottom: 1px solid var(--gpm-line-strong); }
.gpm-roster-name { font-family: var(--gpm-serif); font-size: 22.5px; font-weight: 600; letter-spacing: -0.05em; }
.gpm-roster-role { font-size: 14.5px; letter-spacing: .08em; color: var(--gpm-gold-600); }
.gpm-roster-lines { padding-top: 12px; }
.gpm-roster-lines div { font-size: 14.5px; line-height: 1.6; color: var(--gpm-neutral-600); padding: 5px 0; border-bottom: 1px solid var(--gpm-divider); }
.gpm-roster-lines div:last-child { border-bottom: none; }

/* 상담 시나리오 — 비대칭 2단 */
.gpm-ask { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: 64px; align-items: start; }
.gpm-ask-list { margin-top: 26px; }
.gpm-ask-item { font-family: var(--gpm-serif); font-size: 17px; font-weight: 500; letter-spacing: -0.035em; line-height: 1.6; padding: 19px 0 19px 26px; border-bottom: 1px solid var(--gpm-line); position: relative; }
.gpm-ask-item:first-child { border-top: 1px solid var(--gpm-line); }
.gpm-ask-item::before { content: ''; position: absolute; left: 0; top: 30px; width: 13px; height: 1px; background: var(--gpm-gold); }
.gpm-ask-box { border: 1px solid var(--gpm-line-strong); padding: 34px 30px; }
.gpm-ask-box-title { font-family: var(--gpm-serif); font-size: 19px; font-weight: 600; letter-spacing: -0.04em; margin-bottom: 14px; }
.gpm-ask-box p { font-size: 13px; line-height: 1.8; color: var(--gpm-neutral-600); margin-bottom: 22px; }
.gpm-ask-box .gpm-btn { width: 100%; }
.gpm-ask-tel { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--gpm-line); }
.gpm-ask-tel b { display: block; font-family: var(--gpm-serif); font-size: 23px; font-weight: 600; letter-spacing: -0.04em; color: var(--gpm-navy); }
.gpm-ask-tel span { font-size: 14.5px; color: var(--gpm-neutral-400); letter-spacing: .05em; }

/* 지점안내 */
.gpm-branch-tabs { display: flex; gap: 32px; margin: 30px 0 0; flex-wrap: wrap; border-bottom: 1px solid var(--gpm-line); }
.gpm-branch-tab { padding: 0 0 14px; font-family: var(--gpm-serif); font-size: 16px; font-weight: 600; letter-spacing: -0.04em; background: none; cursor: pointer; border: none; border-bottom: 2px solid transparent; color: var(--gpm-neutral-400); margin-bottom: -1px; }
.gpm-branch-tab.on { color: var(--gpm-navy); border-bottom-color: var(--gpm-navy); }
.gpm-branch-panel { display: none; }
.gpm-branch-panel.on { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 44px; align-items: start; padding-top: 40px; }
.gpm-branch-photo { position: relative; width: 100%; aspect-ratio: 4/3; margin: 0; overflow: hidden; background: var(--gpm-neutral-200); }
.gpm-branch-photo img { width: 100%; height: 100%; object-fit: cover; }
/* 도시 풍경 캡션(사무소 건물이 아님을 밝히고, 필요한 사진은 출처 표기) */
.gpm-branch-photo figcaption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 36px 18px 14px; background: linear-gradient(180deg, rgba(6,17,33,0) 0%, rgba(6,17,33,.72) 100%); font-size: 14px; font-weight: 500; color: #fff; }
.gpm-branch-photo figcaption small { font-size: 11.5px; font-weight: 400; color: rgba(255,255,255,.72); }
.gpm-branch-photo figcaption a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.gpm-branch-name { font-family: var(--gpm-serif); font-size: 21px; font-weight: 600; letter-spacing: -0.045em; margin-bottom: 16px; }
.gpm-branch-line { font-size: 13.5px; color: var(--gpm-neutral-600); line-height: 1.75; padding: 7px 0; border-bottom: 1px solid var(--gpm-divider); }
.gpm-branch-map { width: 100%; aspect-ratio: 16/9; border: 0; margin-top: 20px; filter: saturate(.85); }
.gpm-branch-maplinks { display: flex; gap: 20px; margin-top: 12px; }
.gpm-branch-maplinks a { font-size: 14.5px; font-weight: 500; color: var(--gpm-navy); border-bottom: 1px solid var(--gpm-line-strong); padding-bottom: 2px; }

/* 푸터 */
.gpm-footer { background: var(--gpm-navy-800); color: rgba(255,255,255,0.72); padding: 62px 28px 34px; font-size: 12.5px; letter-spacing: 0; }
.gpm-footer-inner { max-width: 1180px; margin: 0 auto; }
.gpm-footer-top { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; border-bottom: 1px solid rgba(255,255,255,0.16); padding-bottom: 22px; margin-bottom: 22px; }
.gpm-footer-brand { font-family: var(--gpm-serif); font-weight: 600; font-size: 19px; letter-spacing: -0.04em; color: #fff; }
.gpm-footer-line { color: rgba(255,255,255,.58); margin-bottom: 6px; line-height: 1.85; }
.gpm-footer-copy { color: rgba(255,255,255,.36); margin-top: 20px; font-size: 14.5px; }

/* 스티키 전화 버튼 */
.gpm-sticky-call { position: fixed; right: 22px; bottom: 22px; z-index: 60; background: var(--gpm-navy); color: #fff; font-weight: 500; font-size: 12.5px; padding: 14px 20px; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.14); }
.gpm-sticky-call .gpm-dot { width: 6px; height: 6px; border-radius: 50%; background: #29B765; }

/* ── 서브페이지 ── */

/* 목록/본문 공통 배너 */
.gpm-list-banner { border-bottom: 1px solid var(--gpm-line); padding: 54px 28px 30px; }
.gpm-list-banner-title { max-width: 1180px; margin: 0 auto; font-size: clamp(26px, 3.4vw, 38px); letter-spacing: -0.045em; }
.gpm-list-search-row { padding: 30px 28px 0; max-width: 1180px; margin: 0 auto; }
.gpm-list-search-row form { display: flex; max-width: 460px; }
.gpm-list-search-row input { flex: 1; border: none; border-bottom: 1px solid var(--gpm-line-strong); padding: 11px 2px; font-size: 14px; font-family: var(--gpm-font); background: transparent; }
.gpm-list-search-row input:focus { outline: none; border-bottom-color: var(--gpm-gold); }
.gpm-list-search-row button { border: none; border-bottom: 1px solid var(--gpm-line-strong); background: transparent; color: var(--gpm-navy); padding: 0 6px; font-family: var(--gpm-font); font-weight: 600; font-size: 13px; cursor: pointer; }
.gpm-cat-tabs { padding: 26px 28px 0; display: flex; gap: 22px; flex-wrap: wrap; max-width: 1180px; margin: 0 auto; }
.gpm-cat-tab { font-size: 13.5px; font-weight: 500; color: var(--gpm-neutral-400); padding-bottom: 4px; border-bottom: 1px solid transparent; }
.gpm-cat-tab:hover { color: var(--gpm-text); }
.gpm-cat-tab.on { color: var(--gpm-navy); font-weight: 600; border-bottom-color: var(--gpm-navy); }

.gpm-case-rows { padding: 34px 28px 48px; max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; border-top: 1px solid var(--gpm-line); margin-top: 26px; }
/* 목록 행 : 좌측 문서 썸네일 + 우측 본문 */
.gpm-case-row { display: grid; grid-template-columns: 160px minmax(0, 1fr); column-gap: 28px; align-items: start; padding: 26px 0; border-bottom: 1px solid var(--gpm-line); color: var(--gpm-text); }
.gpm-case-row-thumb { aspect-ratio: 3/4; overflow: hidden; background: var(--gpm-neutral-100); border: 1px solid var(--gpm-line); }
.gpm-case-row-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; transition: transform .5s ease; }
.gpm-case-row:hover .gpm-case-row-thumb img { transform: scale(1.03); }
.gpm-case-row-body { display: flex; flex-direction: column; gap: 9px; }
.gpm-case-row-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.gpm-case-row-cat { font-size: 13px; letter-spacing: -0.02em; color: var(--gpm-navy); border: 1px solid var(--gpm-navy); padding: 3px 9px; }
.gpm-case-row-outcome { font-family: var(--gpm-serif); font-size: 14.5px; font-weight: 600; color: var(--gpm-gold-600); letter-spacing: -0.04em; }
.gpm-case-row-title { font-family: var(--gpm-serif); font-size: 19px; font-weight: 600; letter-spacing: -0.04em; line-height: 1.45; }
.gpm-case-row:hover .gpm-case-row-title { color: var(--gpm-gold-600); }
.gpm-case-row-desc { font-size: 14.5px; color: var(--gpm-neutral-600); line-height: 1.85; max-width: 62em; }
.gpm-case-row-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 3px; }
.gpm-case-row-lawyers { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.gpm-case-row-lawyer { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; color: var(--gpm-neutral-600); }
.gpm-case-row-lawyer img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; object-position: center top; background: var(--gpm-neutral-100); }
.gpm-case-row-lawyer b { font-weight: 600; color: var(--gpm-text); }
.gpm-case-row-date { font-size: 14.5px; color: var(--gpm-neutral-400); margin-left: auto; }

.gpm-pagination { display: flex; justify-content: center; align-items: center; gap: 4px; padding: 0 28px 72px; }
.gpm-pagination a, .gpm-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; font-size: 13px; color: var(--gpm-neutral-400); }
.gpm-pagination .on { color: var(--gpm-navy); font-weight: 600; border-bottom: 1px solid var(--gpm-navy); }

/* 성공사례 상세 */
.gpm-case-hero { border-bottom: 1px solid var(--gpm-line); padding: 46px 28px 34px; }
.gpm-case-hero-inner { max-width: 1180px; margin: 0 auto; }
.gpm-case-crumb { font-size: 14.5px; color: var(--gpm-neutral-400); margin-bottom: 16px; }
.gpm-case-kicker { font-size: 14.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gpm-gold-600); margin-bottom: 12px; }
.gpm-case-hero-title { font-size: clamp(23px, 3.1vw, 34px); letter-spacing: -0.045em; max-width: 24em; }

.gpm-case-layout { padding: 44px 28px 76px; display: grid; grid-template-columns: minmax(0,2.5fr) minmax(250px,1fr); gap: 56px; max-width: 1180px; margin: 0 auto; align-items: start; }
.gpm-case-meta-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-bottom: 26px; font-size: 14.5px; color: var(--gpm-neutral-400); }

.gpm-toc { border-top: 1px solid var(--gpm-line-strong); border-bottom: 1px solid var(--gpm-line); padding: 22px 0; margin-bottom: 44px; }
.gpm-toc-label { font-size: 13.5px; letter-spacing: .16em; color: var(--gpm-gold-600); font-weight: 600; margin-bottom: 14px; }
.gpm-toc a { display: block; font-size: 14px; color: var(--gpm-neutral-600); padding: 5px 0; }
.gpm-toc a:hover { color: var(--gpm-navy); }

.gpm-case-section { margin-bottom: 52px; scroll-margin-top: calc(var(--gpm-top-h, 118px) + 12px); }
.gpm-case-section-head { font-family: var(--gpm-serif); font-size: 21px; font-weight: 600; letter-spacing: -0.045em; line-height: 1.5; padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--gpm-line-strong); }
.gpm-case-section p { font-size: 14.5px; line-height: 1.95; color: #26313F; margin: 0 0 1.25em; }
.gpm-case-section p:last-child { margin-bottom: 0; }
/* 원문에 남은 서체 지정을 무력화하고 본문 서체로 통일 */
.gpm-case-section p, .gpm-case-section div, .gpm-case-section span, .gpm-case-section li,
.gpm-case-section td, .gpm-case-section b, .gpm-case-section strong {
  font-family: var(--gpm-font) !important; letter-spacing: -0.015em;
}
.gpm-case-section span, .gpm-case-section div, .gpm-case-section li { font-size: 14.5px; line-height: 1.92; }
.gpm-case-section p:empty, .gpm-case-section div:empty { display: none; }
/* 판결문·처분서 사본 */
.gpm-case-doc { margin: 0; }
.gpm-case-doc img { width: 100%; max-width: 660px; display: block; border: 1px solid var(--gpm-line); background: #fff; }
.gpm-case-doc figcaption { margin-top: 12px; font-size: 13px; color: var(--gpm-neutral-400); }
.gpm-case-highlight { border-left: 2px solid var(--gpm-gold); background: var(--gpm-tint); padding: 22px 24px; margin: 26px 0; }
.gpm-case-highlight-title { font-family: var(--gpm-serif); font-size: 15.5px; font-weight: 600; letter-spacing: -0.04em; margin-bottom: 10px; }
.gpm-case-highlight p { margin: 0; font-size: 13.5px; line-height: 1.85; }
.gpm-case-img { width: 100%; max-width: 480px; margin: 24px 0; overflow: hidden; }
.gpm-case-img img { width: 100%; height: auto; }

.gpm-case-note { border-top: 1px solid var(--gpm-line-strong); padding: 24px 0 0; font-size: 13.5px; line-height: 1.85; color: var(--gpm-neutral-600); margin-bottom: 52px; }

.gpm-related-h4 { font-family: var(--gpm-serif); font-size: 17px; font-weight: 600; letter-spacing: -0.04em; padding-bottom: 14px; border-bottom: 1px solid var(--gpm-line-strong); margin-bottom: 0; }
.gpm-related-info-grid { display: grid; grid-template-columns: repeat(2, 1fr); margin-bottom: 44px; }
.gpm-related-info-item { padding: 16px 4px; font-size: 13.5px; color: var(--gpm-text); border-bottom: 1px solid var(--gpm-line); }
.gpm-related-info-item:hover { color: var(--gpm-gold-600); }

.gpm-case-sidebar { position: sticky; top: calc(var(--gpm-top-h, 118px) + 20px); display: flex; flex-direction: column; gap: 24px; }
.gpm-case-phonebox { display: block; border-top: 2px solid var(--gpm-navy); padding: 16px 0; }
.gpm-case-phonebox .label { display: block; font-size: 14.5px; letter-spacing: .12em; color: var(--gpm-gold-600); margin-bottom: 4px; }
.gpm-case-phonebox .num { font-family: var(--gpm-serif); font-weight: 600; font-size: 23px; letter-spacing: -0.04em; color: var(--gpm-navy); }
.gpm-side-box { border-top: 1px solid var(--gpm-line-strong); padding-top: 16px; }
.gpm-side-box-title { font-size: 14.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gpm-gold-600); margin-bottom: 12px; }
.gpm-side-case-item { display: block; padding: 11px 0; border-bottom: 1px solid var(--gpm-divider); color: var(--gpm-text); }
.gpm-side-case-item:last-child { border-bottom: none; }
.gpm-side-case-tag { font-size: 10.5px; color: var(--gpm-neutral-400); }
.gpm-side-case-title { font-family: var(--gpm-serif); font-size: 14px; font-weight: 500; letter-spacing: -0.035em; line-height: 1.55; margin-top: 3px; }
.gpm-side-case-item:hover .gpm-side-case-title { color: var(--gpm-gold-600); }
.gpm-side-field-item { display: block; padding: 11px 0; border-bottom: 1px solid var(--gpm-divider); font-size: 14px; font-family: var(--gpm-serif); font-weight: 500; letter-spacing: -0.035em; color: var(--gpm-text); }
.gpm-side-field-item:last-child { border-bottom: none; }
.gpm-side-field-item:hover { color: var(--gpm-gold-600); }
.gpm-members-box { border-top: 1px solid var(--gpm-line-strong); padding-top: 16px; }
.gpm-members-box-title { font-size: 14.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--gpm-gold-600); margin-bottom: 14px; }
.gpm-member-row { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--gpm-divider); }
.gpm-member-row:last-of-type { border-bottom: none; }
.gpm-member-avatar { width: 42px; height: 54px; flex-shrink: 0; overflow: hidden; background: var(--gpm-neutral-200); }
.gpm-member-avatar img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.gpm-member-name { font-family: var(--gpm-serif); font-size: 14.5px; font-weight: 600; letter-spacing: -0.04em; }
.gpm-member-role { font-size: 14.5px; color: var(--gpm-neutral-400); margin-top: 2px; }
.gpm-members-box-note { font-size: 10.5px; color: var(--gpm-neutral-400); margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--gpm-divider); }

@media (max-width: 1000px) {
  .gpm-split { grid-template-columns: 1fr; gap: 40px; }
  .gpm-split-head { position: static; }
  .gpm-ask { grid-template-columns: 1fr; gap: 40px; }
  .gpm-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .gpm-stat:nth-child(3) { border-left: none; padding-left: 0; }
  .gpm-roster { grid-template-columns: repeat(2, 1fr); gap: 26px; }
  .gpm-area-cards { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 760px) {
  .gpm-band { padding: 62px 0; }
  .gpm-nav-links, .gpm-nav-phone { display: none; }
  .gpm-nav-toggle { display: flex; }
  .gpm-nav.gpm-nav-open .gpm-nav-links { display: flex; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; background: #fff; border-top: 1px solid var(--gpm-line); }
  .gpm-nav.gpm-nav-open .gpm-nav-links a { padding: 15px 28px; border-bottom: 1px solid var(--gpm-line); }
  .gpm-hero { min-height: 480px; }
  .gpm-hero-veil { background: linear-gradient(180deg, rgba(6,17,33,.74) 0%, rgba(6,17,33,.92) 100%); }
  .gpm-hero-body { padding-bottom: 52px; }
  /* 두 줄 제목이 휴대폰 폭에서도 두 줄로 들어가게 */
  .gpm-hero-title { font-size: clamp(22px, 6.9vw, 30px); }
  .gpm-hero-lede br { display: none; }
  .gpm-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .gpm-wc-row { grid-template-columns: 1fr; gap: 8px; }
  .gpm-area-cards { grid-template-columns: repeat(2, 1fr); }
  .gpm-def-row { grid-template-columns: 1fr; gap: 10px; }
  .gpm-roster { grid-template-columns: 1fr; gap: 34px; }
  .gpm-branch-panel.on { grid-template-columns: 1fr; gap: 28px; }
  .gpm-branch-tabs { gap: 20px; }
  .gpm-case-layout { grid-template-columns: 1fr; gap: 44px; padding: 32px 28px 60px; }
  .gpm-case-sidebar { position: static; }
  .gpm-case-row { grid-template-columns: 104px minmax(0, 1fr); column-gap: 16px; }
  .gpm-case-row-title { font-size: 17px; }
  /* 모바일에서는 요약을 4줄까지만 보여 목록이 과하게 길어지지 않게 한다 */
  .gpm-case-row-desc { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
  .gpm-related-info-grid { grid-template-columns: 1fr; }
  .gpm-head-row { flex-direction: column; align-items: flex-start; gap: 14px; }
}

/* 로고 이미지 (img/gp/logo.svg · logo-white.svg) */
.gpm-nav-brand { display: flex; align-items: center; line-height: 0; flex-shrink: 0; }
.gpm-nav-brand img { height: 40px; width: auto; }
.gpm-footer-brand { line-height: 0; }
.gpm-footer-brand img { height: 38px; width: auto; }
@media (max-width: 760px) {
  .gpm-nav-brand img { height: 32px; }
}
/* 프런티어 표기 중(inc_gp_brand.php) — 프런티어 로고는 세로 쌓기형이라 조금 더 키운다 */
.gpm-nav-brand img[src*="brand_frontier"] { height: 52px; }
.gpm-footer-brand img[src*="brand_frontier"] { height: 56px; }
@media (max-width: 760px) {
  .gpm-nav-brand img[src*="brand_frontier"] { height: 42px; }
}

/* 하단 플로팅 상담 바 (frontierlaw .footer-online 구조를 거평 톤으로 이식) */
body.gpm-page { padding-bottom: 80px; }
.gpm-sticky-call { display: none; }
.gpm-fo { position: fixed; left: 0; bottom: 0; z-index: 333; width: 100%; background: var(--gpm-navy); border-top: 1px solid rgba(176,140,43,.45); font-family: var(--gpm-font); }
.gpm-fo-inner { display: flex; align-items: center; gap: 28px; max-width: 1180px; margin: 0 auto; padding: 12px 28px; }
.gpm-fo-tel { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.gpm-fo-tel dt { font-size: 14px; color: var(--gpm-gold); letter-spacing: .04em; }
.gpm-fo-tel dd { margin: 0; font-family: var(--gpm-serif); font-weight: 600; font-size: 23px; letter-spacing: -0.03em; color: #fff; }
.gpm-fo-form { display: flex; align-items: center; gap: 18px; flex: 1; min-width: 0; }
.gpm-fo-form h5 { flex-shrink: 0; margin: 0; font-size: 14.5px; font-weight: 500; color: rgba(255,255,255,.55); }
.gpm-fo-fields { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)) auto; align-items: center; gap: 16px; flex: 1; margin: 0; padding: 0; list-style: none; }
.gpm-fo-fields input[type="text"], .gpm-fo-fields select { width: 100%; height: 38px; border: 0; border-bottom: 1px solid rgba(255,255,255,.45); background: transparent; color: #fff; font-family: var(--gpm-font); font-size: 14.5px; border-radius: 0; outline: none; -webkit-appearance: none; appearance: none; }
.gpm-fo-fields input[type="text"]::placeholder { color: rgba(255,255,255,.5); }
.gpm-fo-fields input[type="text"]:focus, .gpm-fo-fields select:focus { border-bottom-color: var(--gpm-gold); }
.gpm-fo-fields select { color: rgba(255,255,255,.75); cursor: pointer; }
.gpm-fo-fields select option { color: #14202F; }
.gpm-fo-agree { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: rgba(255,255,255,.7); white-space: nowrap; cursor: pointer; }
.gpm-fo-agree input { width: 15px; height: 15px; margin: 0; accent-color: var(--gpm-gold); }
.gpm-fo-btn { flex-shrink: 0; height: 50px; padding: 0 22px; border: 0; background: var(--gpm-gold); color: #fff; font-family: var(--gpm-font); font-weight: 600; font-size: 15px; cursor: pointer; }
.gpm-fo-btn:hover { background: var(--gpm-gold-600); }
@media (max-width: 1024px) {
  .gpm-fo-inner { gap: 18px; padding: 12px 20px; }
  .gpm-fo-form h5 { display: none; }
  .gpm-fo-tel { flex-direction: column; align-items: flex-start; gap: 2px; }
  .gpm-fo-tel dd { font-size: 19px; }
}
@media (max-width: 768px) {
  body.gpm-page { padding-bottom: 132px; }
  .gpm-fo-inner { gap: 12px; padding: 10px 14px; }
  .gpm-fo-tel { display: none; }
  .gpm-fo-fields { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px 12px; }
  .gpm-fo-fields input[type="text"], .gpm-fo-fields select { height: 32px; font-size: 13px; }
  .gpm-fo-agree { grid-column: 1 / -1; font-size: 11.5px; }
  .gpm-fo-btn { align-self: stretch; height: auto; width: 72px; padding: 0 8px; font-size: 13.5px; line-height: 1.35; }
}

/* 모바일 전용 하단 고정 바 + 간편상담 창 (frontierlaw _menu.php .bottom-bar 구조를 거평 톤으로 이식) */
.gpm-bb, .gpm-qc { display: none; }
body.gpm-qc-lock { position: fixed; width: 100%; overflow: hidden; }
@media (max-width: 768px) {
  .gpm-fo { display: none; }
  body.gpm-page { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
  .gpm-bb { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9000; display: flex; height: calc(60px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); background: var(--gpm-navy); border-top: 1px solid rgba(176,140,43,.45); }
  .gpm-bb-item { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; background: none; border: 0; padding: 0; color: #fff; font-family: var(--gpm-font); font-size: 12.5px; letter-spacing: -0.03em; -webkit-tap-highlight-color: transparent; cursor: pointer; }
  .gpm-bb-item img { width: 20px; height: 20px; object-fit: contain; }
  .gpm-bb-quick { color: var(--gpm-gold); font-weight: 600; }

  .gpm-qc { position: fixed; inset: 0; z-index: 10000; background: rgba(6,17,33,.6); align-items: flex-end; justify-content: center; }
  .gpm-qc.on { display: flex; }
  .gpm-qc-box { position: relative; width: 100%; max-width: 480px; background: #fff; border-radius: 16px 16px 0 0; padding: 24px 20px calc(20px + env(safe-area-inset-bottom)); box-shadow: 0 -8px 24px rgba(0,0,0,.2); animation: gpm-qc-up .25s ease-out; }
  @keyframes gpm-qc-up { from { transform: translateY(100%); } to { transform: translateY(0); } }
  .gpm-qc-close { position: absolute; top: 14px; right: 16px; background: none; border: 0; padding: 6px; font-size: 18px; line-height: 1; color: var(--gpm-neutral-400); cursor: pointer; }
  .gpm-qc-box h3 { font-family: var(--gpm-serif); font-size: 19px; font-weight: 700; color: var(--gpm-navy); margin: 0 0 4px; }
  .gpm-qc-sub { font-size: 13px; color: var(--gpm-neutral-600); margin: 0 0 16px; }
  .gpm-qc-box ul { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
  .gpm-qc-box input[type="text"], .gpm-qc-box input[type="tel"], .gpm-qc-box select { width: 100%; height: 46px; padding: 0 14px; border: 1px solid var(--gpm-neutral-300); border-radius: 8px; background: var(--gpm-tint); color: var(--gpm-text); font-family: var(--gpm-font); font-size: 14px; box-sizing: border-box; }
  .gpm-qc-box select { -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C95A1' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 14px center; background-size: 16px; }
  .gpm-qc-chk label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--gpm-neutral-600); }
  .gpm-qc-chk input { accent-color: var(--gpm-gold); }
  .gpm-qc-submit { width: 100%; height: 50px; border: 0; border-radius: 8px; background: var(--gpm-gold); color: #fff; font-family: var(--gpm-font); font-size: 16px; font-weight: 700; cursor: pointer; }
}

/* 지점안내: 왼쪽 사진과 오른쪽 열의 높이 맞춤 (2열일 때만, 모바일 1열은 제외) */
@media (min-width: 761px) {
  .gpm-branch-panel.on { align-items: stretch; }
  .gpm-branch-info { display: flex; flex-direction: column; }
  .gpm-branch-map { flex: 1 1 auto; aspect-ratio: auto; min-height: 200px; }
}

/* 서브페이지 공용 히어로 비주얼 (업무분야·성공사례·변호사소개 등)
   모든 페이지가 gp-main.css를 불러오므로 여기에 둔다. 클래스명은 기존 업무분야 페이지와 호환을 위해 유지. */
.gp-px-hero { position: relative; min-height: 420px; display: flex; align-items: flex-end; overflow: hidden; background: #0B1E3D; color: #fff; }
.gp-px-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gp-px-hero-veil { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(6,17,33,.92) 0%, rgba(6,17,33,.7) 50%, rgba(6,17,33,.3) 100%); }
.gp-px-hero-body { position: relative; width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 28px 64px; }
.gp-px-hero-eyebrow { font-size: 14.5px; letter-spacing: .18em; color: #B08C2B; margin-bottom: 16px; }
.gp-px-hero-title { font-family: var(--gpm-serif); font-weight: 700; font-size: clamp(32px, 4.6vw, 52px); letter-spacing: -0.045em; line-height: 1.25; color: #fff; }
.gp-px-hero-sub { margin-top: 14px; font-size: 15.5px; line-height: 1.8; color: rgba(255,255,255,.76); }
.gp-px-hero-search { max-width: 520px; margin-top: 30px; display: flex; border-bottom: 1px solid rgba(255,255,255,.5); }
.gp-px-hero-search input { flex: 1; min-width: 0; background: transparent; border: none; color: #fff; font-family: var(--gpm-font); font-size: 15px; padding: 12px 2px; }
.gp-px-hero-search input::placeholder { color: rgba(255,255,255,.55); }
.gp-px-hero-search input:focus { outline: none; }
.gp-px-hero-search:focus-within { border-bottom-color: #B08C2B; }
.gp-px-hero { min-height: 360px; }
.gp-px-hero-body { padding: 0 20px 44px; }
.gp-px-hero-search button { background: none; border: none; color: #fff; font-family: var(--gpm-font); font-weight: 600; font-size: 14px; padding: 0 4px; cursor: pointer; white-space: nowrap; }
.gp-px-hero-search button:hover { color: var(--gpm-gold); }
.gp-px-hero-crumb { font-size: 13px; color: rgba(255,255,255,.62); margin-bottom: 16px; }
.gp-px-hero-crumb a { color: rgba(255,255,255,.8); }
.gp-px-hero-crumb a:hover { color: #fff; }
.gp-px-hero-title.is-sm { font-size: clamp(24px, 3.2vw, 38px); max-width: 26em; }

/* 성공사례 목록 (그누보드 case 게시판 연동) */
.gpm-case-empty { max-width: 1180px; margin: 0 auto; padding: 60px 28px; text-align: center; font-size: 14.5px; color: var(--gpm-neutral-400); }
.gpm-case-disclaimer { max-width: 1180px; margin: 0 auto; padding: 0 28px 72px; font-size: 12.5px; color: var(--gpm-neutral-400); }
.gpm-case-meta-list { display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 18px 0; border-top: 1px solid var(--gpm-line); border-bottom: 1px solid var(--gpm-line); margin-bottom: 36px; font-size: 13.5px; }
.gpm-case-meta-list dt { font-size: 11.5px; color: var(--gpm-gold-600); letter-spacing: .08em; margin-bottom: 3px; }
.gpm-case-meta-list dd { margin: 0; font-family: var(--gpm-serif); font-weight: 600; letter-spacing: -.03em; }
.gpm-case-meta-list > div { min-width: 92px; }

/* ─────────────────────────────────────────────
   법인소개 (page/about.php) — 이름 舁平 풀이
   그림은 조세 사이트 홈 인트로처럼 윤곽선을 긋고 채우는 SVG.
   html.gpm-anim(움직임 허용 + IntersectionObserver)일 때만 처음 상태를 숨기고 움직인다.
   ───────────────────────────────────────────── */
.gpm-hanja { font-family: 'Noto Serif TC', var(--gpm-serif); font-weight: 600; }
/* 한글은 어절 단위로만 줄바꿈 */
.gpm-ah, .gpm-about-intro, .gpm-char, .gpm-about-next { word-break: keep-all; overflow-wrap: break-word; }

/* 히어로 */
.gpm-ah { position: relative; overflow: hidden; background: var(--gpm-navy); color: #fff; }
.gpm-ah::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 119px, rgba(176,140,43,.09) 119px) center top / 120px 100%; pointer-events: none; }
.gpm-ah-crumb { position: relative; max-width: 1180px; margin: 0 auto; padding: 26px 28px 0; font-size: 13px; color: rgba(255,255,255,.62); }
.gpm-ah-crumb a { color: rgba(255,255,255,.8); }
.gpm-ah-crumb a:hover { color: #fff; }
.gpm-ah-in { position: relative; display: flex; flex-direction: column; align-items: center; padding: 60px 20px 100px; text-align: center; }
.gpm-ah-mark { width: 128px; height: auto; overflow: visible; }
.gpm-ah-mark .fl { fill: var(--gpm-gold); }
.gpm-ah-mark .ln path { fill: none; stroke: none; }
.gpm-page .gpm-ah-title { margin-top: 40px; font-family: var(--gpm-serif); font-size: clamp(32px, 4.4vw, 50px); font-weight: 700; letter-spacing: -0.045em; line-height: 1.2; color: #fff; }
.gpm-ah-title .t, .gpm-ah-title .r, .gpm-ah-title .h { display: block; }
.gpm-ah-title .r { width: min(320px, 62vw); height: 1px; margin: 32px auto 28px; background: var(--gpm-gold); }
.gpm-ah-title .h { margin-right: -.3em; font-size: clamp(38px, 5vw, 58px); font-weight: 500; letter-spacing: .3em; line-height: 1.05; color: var(--gpm-gold); }
.gpm-page .gpm-ah-sub { margin-top: 34px; font-size: 16px; line-height: 1.8; color: rgba(255,255,255,.76); }

.gpm-anim .gpm-ah-mark .ln path { stroke: var(--gpm-gold); stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: 1; animation: gpm-draw 1s cubic-bezier(.65,.05,.35,1) .15s forwards, gpm-out .45s ease 1.25s forwards; }
.gpm-anim .gpm-ah-mark .fl { opacity: 0; animation: gpm-in .5s ease 1s forwards; }
.gpm-anim .gpm-ah-title .t { opacity: 0; transform: translateY(26px); animation: gpm-rise .7s cubic-bezier(.2,.7,.2,1) 1.15s forwards; }
.gpm-anim .gpm-ah-title .r { transform: scaleX(0); animation: gpm-rule .6s cubic-bezier(.65,.05,.35,1) 1.5s forwards; }
.gpm-anim .gpm-ah-title .h { clip-path: inset(0 100% 0 0); animation: gpm-reveal .8s cubic-bezier(.65,.05,.35,1) 1.7s forwards; }
.gpm-anim .gpm-ah-sub { opacity: 0; animation: gpm-in .7s ease 2.2s forwards; }

/* 이름에 담은 뜻 */
.gpm-about-intro { padding: 100px 0 88px; }
.gpm-about-statement { font-family: var(--gpm-serif); font-size: clamp(24px, 3vw, 38px); font-weight: 500; line-height: 1.62; letter-spacing: -0.045em; color: var(--gpm-navy); text-wrap: balance; }
.gpm-about-statement em { font-style: normal; color: var(--gpm-gold-600); }

/* 舁 · 平 */
.gpm-char { padding-bottom: 32px; }
.gpm-char-row { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 76px; align-items: center; padding: 72px 0; border-top: 1px solid var(--gpm-line-strong); }
.gpm-char-row.is-rev { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); }
.gpm-char-row.is-rev .gpm-gp { order: -1; }
.gpm-char-head { display: flex; align-items: center; gap: 20px; margin-bottom: 28px; padding-bottom: 24px; border-bottom: 1px solid var(--gpm-line); }
.gpm-char-glyph { font-size: clamp(56px, 5.4vw, 72px); line-height: .9; color: var(--gpm-navy); }
.gpm-char-read { padding-bottom: 0; }
.gpm-char-read b { display: block; font-family: var(--gpm-serif); font-size: 23px; font-weight: 600; letter-spacing: -0.03em; color: var(--gpm-text); }
.gpm-char-read span { display: block; margin-top: 4px; font-size: 14.5px; letter-spacing: .02em; color: var(--gpm-gold-600); }
.gpm-char-body p { max-width: 34em; margin: 0 0 1em; font-size: 16px; line-height: 1.95; color: #26313F; }
.gpm-char-body p:last-child { margin-bottom: 0; }
.gpm-char-meanings { list-style: none; margin: 30px 0 0; padding: 0; border-top: 1px solid var(--gpm-line); max-width: 30em; }
.gpm-char-meanings li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--gpm-line); font-size: 16px; color: var(--gpm-text); }
.gpm-char-meanings li span { font-size: 18px; color: var(--gpm-neutral-400); }

/* 글자 패널 : 종이색 바탕 + 금색 세로 실선 (조세 인트로 바탕과 같은 결) */
.gpm-gp { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 44px; aspect-ratio: 4 / 5; margin: 0; padding: 48px 36px 36px; overflow: hidden; background: var(--gpm-gold-100); }
.gpm-gp::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 79px, rgba(176,140,43,.12) 79px) center top / 80px 100%; pointer-events: none; }
.gpm-gp svg { position: relative; width: 62%; height: auto; overflow: visible; }
.gpm-gp .ln path { fill: none; stroke: none; }
.gpm-gp .up .fl, .gpm-gp .gl .fl { fill: var(--gpm-navy); }
.gpm-gp .dn .fl { fill: var(--gpm-gold); }
.gpm-gp .lv line { stroke: var(--gpm-gold); stroke-width: 4; }
.gpm-char-parts { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px; width: 100%; padding: 20px 0 0; border-top: 1px solid rgba(176,140,43,.4); }
.gpm-char-part { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.gpm-char-part .g { font-size: 40px; line-height: 1; color: var(--gpm-navy); }
.gpm-char-part.is-gold .g { color: var(--gpm-gold-600); }
.gpm-char-part small { font-size: 13px; line-height: 1.45; color: var(--gpm-neutral-600); }
.gpm-char-op { font-size: 22px; color: var(--gpm-neutral-400); }

/* 舁 : 윗부분·아랫부분이 떨어진 채 윤곽을 긋고 → 마주 모인 뒤 → 채운다 */
.gpm-anim .gpm-gp .ln path { stroke-width: 4; stroke-dasharray: 1; stroke-dashoffset: 1; }
.gpm-anim .gpm-gp .up .ln path, .gpm-anim .gpm-gp .gl .ln path { stroke: var(--gpm-navy); }
.gpm-anim .gpm-gp .dn .ln path { stroke: var(--gpm-gold-600); }
.gpm-anim .gpm-gp .fl { opacity: 0; }
.gpm-anim .gpm-gp .up { transform: translateY(-120px); }
.gpm-anim .gpm-gp .dn { transform: translateY(120px); }
.gpm-anim .gpm-gp .gpm-char-parts > * { opacity: 0; }
.gpm-anim .gpm-gp.is-in .up .ln path { animation: gpm-draw 1.1s cubic-bezier(.65,.05,.35,1) .1s forwards, gpm-out .4s ease 2.1s forwards; }
.gpm-anim .gpm-gp.is-in .dn .ln path { animation: gpm-draw 1.1s cubic-bezier(.65,.05,.35,1) .3s forwards, gpm-out .4s ease 2.1s forwards; }
.gpm-anim .gpm-gp.is-in .up, .gpm-anim .gpm-gp.is-in .dn { animation: gpm-meet .8s cubic-bezier(.65,.05,.35,1) 1.35s forwards; }
.gpm-anim .gpm-gp.is-in .up .fl, .gpm-anim .gpm-gp.is-in .dn .fl { animation: gpm-in .5s ease 1.95s forwards; }
.gpm-anim .gpm-gp.is-in .gpm-char-parts > :nth-child(1) { animation: gpm-in .5s ease .3s forwards; }
.gpm-anim .gpm-gp.is-in .gpm-char-parts > :nth-child(2),
.gpm-anim .gpm-gp.is-in .gpm-char-parts > :nth-child(3) { animation: gpm-in .5s ease .5s forwards; }
.gpm-anim .gpm-gp.is-in .gpm-char-parts > :nth-child(4),
.gpm-anim .gpm-gp.is-in .gpm-char-parts > :nth-child(5) { animation: gpm-in .5s ease 2.1s forwards; }

/* 平 : 수면 선이 가운데서 번진 뒤 글자를 긋고 채운다 */
.gpm-anim .gpm-gp .lv line { transform: scaleX(0); transform-box: fill-box; transform-origin: center; }
.gpm-anim .gpm-gp.is-in .lv line { animation: gpm-rule .9s cubic-bezier(.65,.05,.35,1) forwards; }
.gpm-anim .gpm-gp.is-in .lv line:nth-child(2) { animation-delay: .15s; }
.gpm-anim .gpm-gp.is-in .lv line:nth-child(3) { animation-delay: .3s; }
.gpm-anim .gpm-gp.is-in .gl .ln path { animation: gpm-draw 1.2s cubic-bezier(.65,.05,.35,1) .35s forwards, gpm-out .4s ease 1.8s forwards; }
.gpm-anim .gpm-gp.is-in .gl .fl { animation: gpm-in .6s ease 1.45s forwards; }

@keyframes gpm-draw { to { stroke-dashoffset: 0; } }
@keyframes gpm-out { to { stroke-opacity: 0; } }
@keyframes gpm-in { to { opacity: 1; } }
@keyframes gpm-rise { to { opacity: 1; transform: none; } }
@keyframes gpm-rule { to { transform: scaleX(1); } }
@keyframes gpm-reveal { to { clip-path: inset(0 0 0 0); } }
@keyframes gpm-meet { to { transform: translateY(0); } }

/* 다음으로 */
.gpm-about-next { padding: 72px 0 104px; }
.gpm-about-next-inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--gpm-line-strong); }
.gpm-about-next-link { display: flex; flex-direction: column; gap: 8px; padding: 34px 32px 34px 0; border-bottom: 1px solid var(--gpm-line); }
.gpm-about-next-link + .gpm-about-next-link { padding-left: 32px; border-left: 1px solid var(--gpm-line); }
.gpm-about-next-link .k { font-size: 14.5px; letter-spacing: .06em; color: var(--gpm-gold-600); }
.gpm-about-next-link .t { font-family: var(--gpm-serif); font-size: 24px; font-weight: 600; letter-spacing: -0.04em; color: var(--gpm-navy); }
.gpm-about-next-link .d { font-size: 14.5px; color: var(--gpm-neutral-600); }
.gpm-about-next-link:hover .t { color: var(--gpm-gold-600); }
.gpm-about-next-link:focus-visible { outline: 2px solid var(--gpm-gold); outline-offset: 4px; }

@media (max-width: 900px) {
  .gpm-ah-crumb { padding: 20px 20px 0; }
  .gpm-ah-in { padding: 44px 20px 72px; }
  .gpm-ah-mark { width: 96px; }
  .gpm-page .gpm-ah-title { margin-top: 30px; }
  .gpm-ah-title .r { margin: 24px auto 22px; }
  .gpm-page .gpm-ah-sub { margin-top: 26px; font-size: 15px; }
  .gpm-about-intro { padding: 64px 0 56px; }
  .gpm-about-statement { font-size: 23px; }
  .gpm-about-statement br { display: none; }
  .gpm-char { padding-bottom: 16px; }
  .gpm-char-row, .gpm-char-row.is-rev { grid-template-columns: 1fr; gap: 36px; padding: 52px 0; }
  .gpm-char-row .gpm-gp, .gpm-char-row.is-rev .gpm-gp { order: -1; aspect-ratio: auto; gap: 32px; padding: 44px 20px 26px; }
  .gpm-gp svg { width: 50%; }
  .gpm-char-head { gap: 18px; }
  .gpm-char-parts { gap: 6px; }
  .gpm-char-part .g { font-size: 32px; }
  .gpm-char-part small { font-size: 12px; }
  .gpm-char-glyph { font-size: 52px; }
  .gpm-about-next { padding: 48px 0 80px; }
  .gpm-about-next-inner { grid-template-columns: 1fr; }
  .gpm-about-next-link, .gpm-about-next-link + .gpm-about-next-link { padding: 28px 0; border-left: 0; }
}

/* ─────────────────────────────────────────────
   홈 인트로 (index.php → inc_gp_intro.php, tools/intro_build.py 가 생성)
   조세 사이트 인트로와 같은 연출: 심볼을 선으로 그린 뒤 채우고 → 워드마크가 한 글자씩 올라오고 → 금색 선 → 문구.
   <head> 스크립트가 탭당 1회만 html.has-gpi 를 붙인다. 클릭·키 입력·휠·터치 스크롤로 건너뛴다.
   스크롤은 잠그지 않는다 — body 를 잠그면 윈도 PC 에서 인트로가 끝날 때 스크롤바가 생기며 화면이 옆으로 튄다.
   ───────────────────────────────────────────── */
.gpi { display: none; }
html.has-gpi .gpi { display: flex; position: fixed; inset: 0; z-index: 999999; align-items: center; justify-content: center; background: #F7F4EC; cursor: pointer; animation: gpi-out .7s ease 2.9s forwards; }
.gpi::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 119px, rgba(176,140,43,.08) 119px) center top / 120px 100%; pointer-events: none; }
.gpi-in { position: relative; display: flex; flex-direction: column; align-items: center; }
.gpi-logo { width: min(440px, 80vw); height: auto; overflow: visible; }
.gpi-mk .ln path { fill: none; stroke: var(--gpm-gold); stroke-width: 2.6; stroke-dasharray: 1; stroke-dashoffset: 1; animation: gpm-draw 1s cubic-bezier(.65,.05,.35,1) .1s forwards, gpm-out .4s ease 1.2s forwards; }
.gpi-mk .fl { fill: var(--gpm-gold); opacity: 0; animation: gpm-in .45s ease .95s forwards; }
.gpi-w path { fill: var(--gpm-navy); opacity: 0; transform: translateY(46px); animation: gpm-rise .6s cubic-bezier(.2,.7,.2,1) forwards; }
.gpi-en { fill: var(--gpm-neutral-600); opacity: 0; animation: gpm-in .6s ease 1.5s forwards; }
.gpi-rule { display: block; width: min(340px, 62vw); height: 1px; margin: 40px 0 30px; background: var(--gpm-gold); transform: scaleX(0); animation: gpm-rule .6s cubic-bezier(.65,.05,.35,1) 1.55s forwards; }
.gpm-page .gpi-tag { margin: 0; font-family: var(--gpm-serif); font-size: clamp(17px, 2.1vw, 22px); font-weight: 500; letter-spacing: -.02em; color: var(--gpm-navy); white-space: nowrap; clip-path: inset(0 100% 0 0); animation: gpm-reveal .8s cubic-bezier(.65,.05,.35,1) 1.75s forwards; }
@keyframes gpi-out { to { opacity: 0; visibility: hidden; } }
@media (max-width: 768px) { .gpi-mk .ln path { stroke-width: 3.4; } } /* 폰에서 1.8 은 0.6px 로 선긋기가 거의 안 보였다 */
@media (min-width: 769px) { .gpi-logo { width: min(560px, 54vw); } .gpi-rule { width: min(400px, 40vw); margin: 48px 0 34px; } }
@media (prefers-reduced-motion: reduce) { html.has-gpi .gpi { display: none; } }

/* 넓은 화면(QHD 100% 등)에서만 전체 1.25배 (2026-10-01 사용자 요청)
   사이트 크기는 FHD(1920) 100% 기준으로 맞춰져 있어 FHD·노트북·휴대폰은 그대로 둔다.
   화면 폭이 2200px 를 넘는 경우 = QHD(2560) 를 윈도 배율 100% 로 쓰거나 4K 를 150% 로 쓰는 경우에만 키운다.
   (QHD 를 윈도 125% 로 쓰면 폭이 2048px 이라 이미 OS 가 키워 주므로 해당 없음)
   글자·여백·사진을 한꺼번에 키우려고 zoom 을 쓴다(브라우저 확대와 같은 효과). */
@media (min-width: 2200px) {
  html { zoom: 1.25; }
}
