/* =========================================================
   법률사무소 모노리스 - design tokens
   톤 출처: leeko.com 메인 (중앙 세리프 워드마크 / 다크 히어로 /
   번호를 붙인 대형 세리프 섹션 제목 / 테라코타 포인트)
   ========================================================= */
:root {
  --ink:        #121619;
  --ink-soft:   #1c2126;
  --navy:       #182e4e;
  --stone-700:  #3a4046;
  --stone-600:  #4e5359;
  --stone-400:  #8b9199;
  --stone-300:  #c2c7cd;
  --stone-200:  #dcdfe3;
  --stone-100:  #eef0f2;
  --paper:      #ffffff;
  --accent:     #c0452a;
  --accent-lit: #e74e25;
  --ghost:      #e4e9ee;          /* 섹션 대형 숫자 */

  --serif: "Cormorant Garamond", "Noto Serif KR", Georgia, serif;
  --sans:  "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --kserif:"Noto Serif KR", "Cormorant Garamond", serif;

  --hd-h: 84px;
  --gut: clamp(20px, 5vw, 72px);
  --maxw: 1360px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.85;
  color: var(--stone-700);
  background: var(--paper);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
body.is-locked { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, dl, dd { margin: 0; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }

.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gut); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- header ---------- */
.hd {
  position: fixed; inset: 0 0 auto; z-index: 100;
  height: var(--hd-h);
  background: var(--paper);
  border-bottom: 1px solid var(--stone-200);
  transition: background .4s var(--ease), border-color .4s var(--ease), color .4s var(--ease);
}
.hd--over { background: transparent; border-bottom-color: transparent; color: var(--paper); }
.hd--over.is-stuck { background: var(--paper); border-bottom-color: var(--stone-200); color: var(--stone-700); }

.hd__inner {
  height: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gut);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
}
.hd__burger { width: 34px; height: 22px; position: relative; justify-self: start; }
.hd__burger span {
  position: absolute; left: 0; height: 1px; background: currentColor;
  transition: transform .35s var(--ease), opacity .25s var(--ease), width .35s var(--ease);
}
.hd__burger span:nth-child(1) { top: 3px;  width: 34px; }
.hd__burger span:nth-child(2) { top: 11px; width: 26px; }
.hd__burger span:nth-child(3) { top: 19px; width: 34px; }
.hd__burger:hover span:nth-child(2) { width: 34px; }
body.is-locked .hd { background: transparent; border-bottom-color: transparent; color: var(--paper); }
body.is-locked .hd__mark-en { color: var(--paper); }
body.is-locked .hd__mark-ko { color: rgba(255,255,255,.62); }
body.is-locked .hd__burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
body.is-locked .hd__burger span:nth-child(2) { opacity: 0; width: 0; }
body.is-locked .hd__burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); width: 34px; }

.hd__mark { justify-self: center; text-align: center; line-height: 1; }
.hd__mark-en {
  display: block; font-family: var(--serif); font-weight: 500;
  font-size: 26px; letter-spacing: .34em; text-indent: .34em;
  color: currentColor;
}
.hd--over:not(.is-stuck) .hd__mark-en { color: var(--paper); }
.hd:not(.hd--over) .hd__mark-en, .hd--over.is-stuck .hd__mark-en { color: var(--accent); }
.hd__mark-ko {
  display: block; margin-top: 7px;
  font-size: 10px; font-weight: 400; letter-spacing: .22em;
  color: var(--stone-400);
}
.hd--over:not(.is-stuck) .hd__mark-ko { color: rgba(255,255,255,.62); }

.hd__cta {
  justify-self: end; font-size: 13px; letter-spacing: .1em;
  padding-bottom: 3px; border-bottom: 1px solid currentColor;
  transition: color .3s var(--ease);
}
.hd__cta:hover { color: var(--accent); }

/* ---------- nav overlay ---------- */
.navov {
  position: fixed; inset: 0; z-index: 95;
  background: var(--ink);
  opacity: 0; visibility: hidden;
  transition: opacity .5s var(--ease), visibility .5s var(--ease);
  overflow-y: auto;
}
.navov.is-open { opacity: 1; visibility: visible; }
.navov__inner {
  min-height: 100%; max-width: var(--maxw); margin: 0 auto;
  padding: calc(var(--hd-h) + 56px) var(--gut) 64px;
  display: flex; flex-direction: column; justify-content: center;
}
.navov__item { border-top: 1px solid rgba(255,255,255,.13); }
.navov__item:last-child { border-bottom: 1px solid rgba(255,255,255,.13); }
.navov__item a {
  display: grid; grid-template-columns: 64px minmax(0, 300px) 1fr;
  align-items: baseline; gap: 0 20px;
  padding: 26px 0; color: rgba(255,255,255,.9);
  transition: color .3s var(--ease), padding-left .4s var(--ease);
}
.navov__item a:hover { color: var(--accent-lit); padding-left: 14px; }
.navov__num { font-family: var(--serif); font-style: normal; font-size: 15px; color: var(--stone-400); }
.navov__en { font-family: var(--serif); font-size: clamp(30px, 4.6vw, 54px); letter-spacing: .06em; line-height: 1.1; }
.navov__ko { font-size: 15px; letter-spacing: .05em; }
.navov__desc { grid-column: 2 / -1; font-size: 13px; color: var(--stone-400); line-height: 1.7; }
.navov__foot {
  margin-top: 48px; display: flex; flex-wrap: wrap; gap: 10px 32px;
  font-size: 13px; color: var(--stone-400);
}

/* ---------- hero ---------- */
.hero {
  position: relative; min-height: 100svh;
  display: flex; align-items: center;
  background: var(--ink); color: var(--paper); overflow: hidden;
}
.hero::before {                       /* 도면 그리드 */
  content: ""; position: absolute; inset: -10%; z-index: 2;
  background-image:
    linear-gradient(rgba(255,255,255,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.032) 1px, transparent 1px);
  background-size: 96px 96px;
  mask-image: linear-gradient(90deg, #000 0%, #000 40%, transparent 62%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 40%, transparent 62%);
}
.hero__bg {                           /* 실사 플레이트 - 오른쪽에 콘크리트 매스 */
  position: absolute; inset: 0; z-index: 0;
  background-image: url("../img/hero-monolith.jpg");
  background-image: image-set(url("../img/hero-monolith.webp") type("image/webp"),
                              url("../img/hero-monolith.jpg")  type("image/jpeg"));
  background-size: cover; background-position: 84% center; background-repeat: no-repeat;
}
/* 사진은 두 겹이다. 뒤 겹에 다음 컷을 깔고 앞 겹을 페이드해서 바꾼다 */
/* 앞 겹은 기본으로 보이고, 뒤 겹만 숨어서 대기한다.
   JS 가 안 돌거나 동작 줄이기 설정이면 앞 겹이 그대로 남는다 - 사진이 사라지지 않는다. */
.hero__bg { transition: opacity 1.1s var(--ease); }
.hero__bg--b { opacity: 0; }
.hero__veil {                         /* 왼쪽 글자가 읽히도록 덮는다 */
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg,
    rgba(18,22,25,.95) 0%, rgba(18,22,25,.90) 32%,
    rgba(18,22,25,.70) 54%, rgba(18,22,25,.14) 76%,
    rgba(18,22,25,0)   100%);
}
.hero__inner {
  position: relative; z-index: 3; width: 100%;
  min-height: 100svh; display: flex; flex-direction: column;
  padding-top: calc(var(--hd-h) + 56px); padding-bottom: 40px;
}
.hero__body { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; }
.hero__body > * { max-width: min(100%, 1080px); }

.hero__eyebrow {
  display: flex; align-items: center; gap: 14px;
  font-size: 13px; letter-spacing: .16em; color: var(--accent-lit);
  margin-bottom: 34px;
}
.hero__eyebrow::before { content: ""; width: 34px; height: 1px; background: var(--accent-lit); }

/* MONOLITH 대신 국문 제목이 화면의 무게중심을 잡는다 */
.hero__ko {
  font-family: var(--kserif); font-weight: 300;
  font-size: clamp(29px, 4.9vw, 58px); line-height: 1.44;
  letter-spacing: -.015em; color: #fff; max-width: 17em;
}
.hero__ko span { display: block; }
.hero__sub {
  margin-top: 30px; max-width: 33em; font-size: 16px; line-height: 2;
  color: rgba(255,255,255,.58);
}
.hero__acts { margin-top: 44px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; }
.hero__more {
  font-size: 14px; letter-spacing: .1em; color: rgba(255,255,255,.78);
  padding-bottom: 6px; border-bottom: 1px solid rgba(255,255,255,.3);
  transition: color .3s var(--ease), border-color .3s var(--ease);
}
.hero__more:hover { color: var(--accent-lit); border-color: var(--accent-lit); }

/* 첫 화면에서 사이트 구성을 보여주는 색인 */
.hero__index {
  flex: 0 0 auto; margin-top: 56px;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(255,255,255,.16);
}
.hero__index a {
  padding: 26px 24px 34px 0; border-left: 1px solid rgba(255,255,255,.16);
  padding-left: 24px; transition: background .3s var(--ease);
}
.hero__index a:first-child { border-left: 0; padding-left: 0; }
.hero__index a:hover { background: rgba(255,255,255,.04); }
.hero__index em {
  font-family: var(--serif); font-style: normal; font-size: 13px;
  letter-spacing: .14em; color: var(--accent-lit);
}
.hero__index b {
  display: block; margin-top: 9px; font-size: 16px; font-weight: 400;
  letter-spacing: .02em; color: #fff;
}
.hero__index small {
  display: block; margin-top: 7px; font-size: 12.5px; line-height: 1.7;
  color: rgba(255,255,255,.46);
}

/* ---------- numbered section ---------- */
.sec { position: relative; padding: clamp(96px, 13vw, 190px) 0; }
.sec + .sec { border-top: 1px solid var(--stone-200); }
.sec--dark { background: var(--ink); color: rgba(255,255,255,.72); border-top: 0; }
.sec--tight { padding: clamp(64px, 8vw, 118px) 0; }
.sec--tex { position: relative; isolation: isolate; }
.sec--tex::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background-image: url("../img/cta-band.jpg");
  background-image: image-set(url("../img/cta-band.webp") type("image/webp"),
                              url("../img/cta-band.jpg")  type("image/jpeg"));
  background-size: cover; background-position: center;
  opacity: .8;
}

.sec__head { position: relative; margin-bottom: clamp(48px, 6vw, 88px); }
.sec__num {
  position: absolute; top: -.46em; left: -.06em; z-index: 0;
  font-family: var(--serif); font-style: normal; font-weight: 300;
  font-size: clamp(92px, 14vw, 200px); line-height: 1;
  color: var(--ghost); pointer-events: none; user-select: none;
}
.sec--dark .sec__num { color: rgba(255,255,255,.07); }
.sec__title {
  position: relative; z-index: 1;
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(38px, 6.4vw, 92px); line-height: 1.02;
  letter-spacing: .045em; color: var(--navy);
  margin-left: clamp(24px, 5vw, 84px);
}
.sec--dark .sec__title { color: var(--paper); }
.sec__ko {
  position: relative; z-index: 1; margin-left: clamp(24px, 5vw, 84px);
  margin-top: 16px; font-size: 15px; letter-spacing: .16em; color: var(--stone-400);
}
.sec__lead {
  position: relative; z-index: 1; margin-left: clamp(24px, 5vw, 84px);
  margin-top: 24px; max-width: 40em; font-size: 17px; line-height: 1.95;
  color: var(--stone-600);
}
.sec--dark .sec__lead { color: rgba(255,255,255,.66); }

/* 좌우 교대 - leeko 는 홀수 좌 / 짝수 우 정렬 */
.sec--right .sec__head { text-align: right; }
.sec--right .sec__num { left: auto; right: -.06em; }
.sec--right .sec__title,
.sec--right .sec__ko { margin-left: 0; margin-right: clamp(24px, 5vw, 84px); }
.sec--right .sec__lead { margin-left: auto; margin-right: clamp(24px, 5vw, 84px); }

/* ---------- practice cards ---------- */
.pcards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--stone-200); }
/* 칸이 홀수면 마지막 하나가 빈칸을 남긴다. 가로로 펴서 의도한 모양으로 만든다 */
.pcards > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.pcard { background: var(--paper); padding: clamp(32px, 4vw, 56px); transition: background .4s var(--ease); }
.pcard:hover { background: var(--stone-100); }
.pcard__num { font-family: var(--serif); font-style: normal; font-size: 15px; color: var(--accent); letter-spacing: .12em; }
.pcard__en { display: block; margin-top: 20px; font-family: var(--serif); font-size: 15px; letter-spacing: .2em; color: var(--stone-400); }
.pcard__ko { margin-top: 8px; font-family: var(--kserif); font-weight: 600; font-size: clamp(22px, 2.4vw, 29px); line-height: 1.4; color: var(--navy); }
.pcard__lead { margin-top: 16px; font-size: 15px; line-height: 1.9; color: var(--stone-600); }
.pcard__items { margin-top: 24px; border-top: 1px solid var(--stone-200); padding-top: 20px; }
.pcard__items li { position: relative; padding-left: 16px; font-size: 14px; line-height: 2.05; color: var(--stone-600); }
.pcard__items li::before { content: ""; position: absolute; left: 0; top: 14px; width: 6px; height: 1px; background: var(--accent); }

/* ---------- profile ---------- */
.prof { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
/* 인물 사진 + 소개 + 약력 세 칸 */
.prof--photo { grid-template-columns: minmax(0, .58fr) minmax(0, 1fr) minmax(0, 1.02fr); gap: clamp(28px, 3.6vw, 56px); }
.prof__photo { margin: 0; }
.prof__photo img { width: 100%; height: auto; filter: grayscale(1) contrast(1.04); }
.prof__name { font-family: var(--kserif); font-weight: 600; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.3; color: var(--navy); }
.sec--dark .prof__name { color: var(--paper); }
.prof__role { margin-top: 10px; font-size: 14px; letter-spacing: .16em; color: var(--accent); }
.prof__en { margin-top: 6px; font-family: var(--serif); font-size: 17px; letter-spacing: .18em; color: var(--stone-400); }
.prof__lead { margin-top: 28px; font-size: 16px; line-height: 2; color: var(--stone-600); max-width: 30em; }
.sec--dark .prof__lead { color: rgba(255,255,255,.7); }

.career { border-top: 1px solid var(--stone-200); }
.sec--dark .career { border-top-color: rgba(255,255,255,.15); }
.career li { display: grid; grid-template-columns: 92px 1fr; gap: 20px; padding: 15px 0; border-bottom: 1px solid var(--stone-200); font-size: 15px; }
.sec--dark .career li { border-bottom-color: rgba(255,255,255,.1); }
.career b { font-family: var(--serif); font-weight: 500; font-size: 17px; letter-spacing: .06em; color: var(--navy); }
.sec--dark .career b { color: var(--stone-300); }
.career li:last-child b { color: var(--accent); }
.career--plain li { grid-template-columns: 1fr; }

.figure { margin: 44px 0 0; }
.figure img { width: 100%; height: auto; filter: saturate(.86) contrast(1.02); }
.figure figcaption { margin-top: 12px; font-size: 12.5px; color: var(--stone-400); }

/* ---------- insight ---------- */
.icards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px); }
.icard { border-top: 1px solid var(--stone-300); padding-top: 24px; }
.icard__meta { font-size: 12px; letter-spacing: .14em; color: var(--stone-400); }
.icard__title { margin-top: 14px; font-family: var(--kserif); font-weight: 600; font-size: 20px; line-height: 1.55; color: var(--navy); }
.icard__excerpt { margin-top: 12px; font-size: 14px; line-height: 1.9; color: var(--stone-600); }
.empty { border-top: 1px solid var(--stone-300); padding-top: 32px; font-size: 15px; color: var(--stone-400); }

/* ---------- contact ---------- */
.cnt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.cnt__info div { display: grid; grid-template-columns: 110px 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.13); }
.cnt__info dt { font-size: 13px; letter-spacing: .14em; color: var(--stone-400); }
.cnt__info dd { margin: 0; font-size: 16px; color: rgba(255,255,255,.88); }
.cnt__note { font-size: 14px; line-height: 1.95; color: rgba(255,255,255,.55); }

.btn {
  display: inline-flex; align-items: center; gap: 14px;
  padding: 19px 40px; font-size: 14px; letter-spacing: .12em;
  background: var(--accent); color: #fff;
  transition: background .3s var(--ease), gap .3s var(--ease);
}
.btn:hover { background: var(--accent-lit); gap: 22px; }
.btn::after { content: "→"; font-family: var(--serif); }
.btn--ghost { background: transparent; color: currentColor; box-shadow: inset 0 0 0 1px currentColor; }
.btn--ghost:hover { background: var(--accent); color: #fff; box-shadow: none; }

/* ---------- page head (하위 페이지) ---------- */
.phead { position: relative; padding: calc(var(--hd-h) + clamp(64px, 9vw, 130px)) 0 clamp(48px, 7vw, 96px); border-bottom: 1px solid var(--stone-200); }
.phead__num { display: block; font-family: var(--serif); font-style: normal; font-size: 15px; letter-spacing: .2em; color: var(--accent); }
.phead__title { margin-top: 18px; font-family: var(--serif); font-weight: 400; font-size: clamp(42px, 7vw, 100px); line-height: 1; letter-spacing: .05em; color: var(--navy); }
.phead__ko { margin-top: 18px; font-size: 15px; letter-spacing: .18em; color: var(--stone-400); }
.phead__lead { margin-top: 28px; max-width: 42em; font-size: 17px; line-height: 1.95; color: var(--stone-600); }

/* ---------- footer ---------- */
.ft { background: var(--ink); color: rgba(255,255,255,.55); padding: clamp(64px, 8vw, 104px) 0 56px; font-size: 14px; }
.ft__inner { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gut); }
.ft__brand { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.ft__glyph { display: inline-flex; color: var(--accent); }
.ft__glyph svg { width: 26px; height: 26px; }
.ft__mark { font-family: var(--serif); font-size: 24px; letter-spacing: .3em; color: var(--paper); }
.ft__ko { font-size: 13px; letter-spacing: .14em; }
.ft__nav { display: flex; flex-wrap: wrap; gap: 12px 34px; margin: 34px 0 40px; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.12); }
.ft__nav a { font-size: 14px; transition: color .3s var(--ease); }
.ft__nav a:hover { color: var(--accent-lit); }
.ft__info { display: flex; flex-wrap: wrap; gap: 8px 40px; }
.ft__info div { display: flex; gap: 12px; }
.ft__info dt { color: var(--stone-400); font-size: 13px; }
.ft__info dd { margin: 0; font-size: 13px; }
.ft__note { margin-top: 34px; max-width: 56em; font-size: 12.5px; line-height: 1.9; color: rgba(255,255,255,.36); }
.ft__copy { margin-top: 20px; font-size: 12px; color: rgba(255,255,255,.3); }

/* 넓은 화면에서만 끊는 줄바꿈. 좁은 화면은 브라우저가 접게 둔다 */
@media (max-width: 768px) { br.brk { display: none; } }

/* ---------- reveal ---------- */
.rv { opacity: 0; transform: translateY(30px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .rv { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* ---------- responsive ---------- */
@media (max-width: 1024px) {
  .pcards, .prof, .cnt { grid-template-columns: minmax(0, 1fr); }
  .prof--photo { grid-template-columns: minmax(0, .78fr) minmax(0, 1.6fr); }
  .prof--photo > *:last-child { grid-column: 1 / -1; }
  .icards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prof { gap: 44px; }
}
@media (max-width: 768px) {
  :root { --hd-h: 68px; }
  body { font-size: 15px; }
  .hd__mark-en { font-size: 20px; letter-spacing: .28em; text-indent: .28em; }
  .hd__mark-ko { font-size: 9px; }
  .hd__cta { font-size: 12px; }
  /* 세로 화면에선 글자가 폭을 다 쓴다. 글 앉는 가운데만 눌러 덮고 위아래로 질감을 남긴다 */
  .hero__bg { background-position: 68% center; }
  .hero__veil {
    background: linear-gradient(180deg,
      rgba(18,22,25,.52) 0%,  rgba(18,22,25,.92) 22%,
      rgba(18,22,25,.92) 74%, rgba(18,22,25,.58) 100%);
  }
  /* 구절 하나가 한 줄에 들어가야 한다. 넘치면 '출신' 같은 한 단어가 혼자 떨어진다 */
  .hero__ko { max-width: none; font-size: clamp(20px, 5.9vw, 26px); line-height: 1.5; }
  .hero__inner { padding-top: calc(var(--hd-h) + 36px); padding-bottom: 28px; }
  .hero__index { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 40px; }
  .hero__index a { padding: 18px 16px 22px; border-left: 1px solid rgba(255,255,255,.16); }
  .hero__index a:first-child { padding-left: 16px; }
  .hero__index a:nth-child(odd) { border-left: 0; padding-left: 0; }
  .hero__index a:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.16); }
  .hero__index small { display: none; }
  .icards { grid-template-columns: minmax(0, 1fr); }
  .navov__item a { grid-template-columns: 44px 1fr; gap: 0 16px; padding: 22px 0; }
  .navov__ko { grid-column: 2; margin-top: 6px; }
  .navov__desc { grid-column: 2; }
  .sec__title, .sec__ko, .sec__lead { margin-left: 0; }
  .sec--right .sec__head { text-align: left; }
  .sec--right .sec__num { left: -.06em; right: auto; }
  .sec--right .sec__title, .sec--right .sec__ko, .sec--right .sec__lead { margin-right: 0; }
  .career li { grid-template-columns: 68px 1fr; gap: 14px; }
  .prof--photo { grid-template-columns: minmax(0, 1fr); }
  .prof--photo > *:last-child { grid-column: auto; }
  .prof__photo { max-width: 250px; }
  .cnt__info div { grid-template-columns: 92px 1fr; gap: 14px; }
}

/* ---------- 상담 신청 양식 ---------- */
.note { padding: 16px 20px; font-size: 15px; line-height: 1.8; margin-bottom: 24px; }
.note--good { background: rgba(24,46,78,.06); color: var(--navy); border-left: 3px solid var(--navy); }
.note--bad  { background: rgba(192,69,42,.08); color: var(--accent); border-left: 3px solid var(--accent); }

.frm { max-width: 900px; }
.frm__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.frm__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.frm__f { display: block; margin-bottom: 20px; }
.frm__k { display: block; margin-bottom: 8px; font-size: 14px; color: var(--stone-600); letter-spacing: .02em; }
.frm__k em { font-style: normal; margin-left: 6px; font-size: 12px; color: var(--accent); }
.frm input[type=text], .frm input[type=tel], .frm input[type=email], .frm select, .frm textarea {
  width: 100%; padding: 13px 14px; font: inherit; font-size: 15.5px; line-height: 1.6;
  color: var(--ink); background: var(--paper);
  border: 1px solid var(--stone-300); border-radius: 0;
  transition: border-color .2s var(--ease);
}
.frm textarea { resize: vertical; min-height: 150px; }
.frm :is(input, select, textarea):focus {
  outline: none; border-color: var(--navy); box-shadow: inset 0 0 0 1px var(--navy);
}
.frm select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--stone-400) 50%), linear-gradient(135deg, var(--stone-400) 50%, transparent 50%); background-position: right 18px center, right 12px center; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 38px; }

.frm__agree { display: flex; gap: 12px; align-items: flex-start; margin: 6px 0 28px; padding-top: 20px; border-top: 1px solid var(--stone-200); }
.frm__agree input { margin-top: 5px; flex: 0 0 auto; width: 17px; height: 17px; accent-color: var(--navy); }
.frm__agree span { font-size: 14px; line-height: 1.85; color: var(--stone-600); }

.frm__acts { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.frm__acts .btn { border: 0; cursor: pointer; }
.frm__hint { font-size: 13.5px; line-height: 1.8; color: var(--stone-400); max-width: 32em; }

@media (max-width: 768px) {
  .frm__row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .frm__acts .btn { width: 100%; justify-content: center; }
}