/* 올리한나 — 걸어온 길 */
.hhero { padding: 7.5rem var(--pad) clamp(2.5rem, 6vh, 4rem); max-width: var(--wide); margin: 0 auto; }
.hhero__in { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.hhero .eyebrow { color: var(--joy); }
.hhero h1 { margin-top: 0.9rem; font-weight: 400; font-size: clamp(2rem, 5.5vw, 3.2rem); line-height: 1.25; }
.hhero h1 .en { display: block; margin-top: 0.35rem; font-size: 0.42em; font-weight: 300; letter-spacing: 0.08em; color: var(--ink-faint); }
.hhero .lead { margin-top: 1.2rem; }
.hhero__d { margin-top: 1.4rem; max-width: 34rem; font-weight: 300; font-size: 0.98rem; line-height: 2; color: var(--ink-soft); }
.hhero__d + .hhero__d { margin-top: 0.9rem; }
.hhero__art { position: relative; margin: 0; }
.hhero__photo { width: 100%; max-width: 380px; height: auto; margin: 0 auto; display: block; }
.hhero__ch { position: absolute; right: 4%; bottom: -4%; width: clamp(64px, 9vw, 104px); height: auto; transform: rotate(6deg); }
@media (max-width: 820px) {
  .hhero__in { grid-template-columns: 1fr; }
  .hhero__art { order: -1; }
  .hhero__photo { max-width: 260px; }
}
@media (max-width: 620px) { .hhero { padding-top: 8.6rem; } }



/* ── 걸어온 길 ── */
.path { padding: clamp(2.2rem, 6vh, 4rem) var(--pad) clamp(3.6rem, 9vh, 5.8rem); background: var(--card); }
.path__in { max-width: calc(var(--wide) - 2 * var(--pad)); margin: 0 auto; }
.path .eyebrow { color: var(--joy); }
.path .lead { margin-top: 1rem; max-width: 40rem; }
.path__grid { margin-top: 2.4rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.4rem, 3vw, 2.6rem); }
.path__col h3 { font-weight: 700; font-size: 0.95rem; letter-spacing: 0.02em; padding-bottom: 0.7rem; border-bottom: 2px solid var(--ink); }
.path__col ul { list-style: none; margin: 0; padding: 0; }
.path__col li { display: grid; grid-template-columns: 5.2em 1fr; gap: 0.7rem; padding: 0.8rem 0; border-bottom: 1px solid rgba(43,42,38,0.12); }
.path__col i { font-style: normal; font-size: 0.8rem; letter-spacing: 0.04em; color: var(--ink-faint); padding-top: 0.15rem; }
.path__col span { font-weight: 300; font-size: 0.92rem; line-height: 1.75; color: var(--ink-soft); word-break: keep-all; }
.path__col:nth-child(1) h3 { border-color: var(--coral); }
.path__col:nth-child(2) h3 { border-color: var(--joy); }
.path__col:nth-child(3) h3 { border-color: var(--butter); }
.path__cred + .path__cred { margin-top: 0.5rem; }
.path__cred b { display: inline-block; min-width: 3.2em; font-weight: 700; color: var(--ink); }
.path__cred { margin-top: 2.2rem; font-weight: 300; font-size: 0.88rem; line-height: 1.9; color: var(--ink-faint); word-break: keep-all; }
#career { scroll-margin-top: 6.5rem; }
@media (max-width: 820px) { .path__grid { grid-template-columns: 1fr; gap: 1.6rem; } }
@media (max-width: 620px) { #career { scroll-margin-top: 8.6rem; } }

/* 마무리 인용 — 긴 문장이라 한 단계 작게 */
.meet blockquote { font-size: clamp(1.25rem, 3.4vw, 2rem); line-height: 1.6; max-width: 36rem; margin: 0 auto; }

/* 걸어온 길 — 사진 둘레로 글이 흐르게 (2026-09-28) */
.hhero__in { display: block; max-width: 54rem; margin: 0 auto; }
.hhero__txt::after { content: ""; display: block; clear: both; }
.hhero__art { float: right; width: clamp(260px, 40%, 400px); margin: 0.4rem 0 0 0;
  shape-margin: 1.4rem;
  /* 사진 윤곽(투명 배경)을 따라 — photos/hanna-cut.webp 의 알파에서 뽑은 좌표 */
  shape-outside: polygon(100% 0%, 25% 0%, 25% 5%, 22% 5%, 22% 10%, 20% 10%, 20% 15%, 19% 15%, 19% 20%, 6% 20%, 6% 25%, 0% 25%, 0% 35%, 2% 35%, 2% 44%, 3% 44%, 3% 49%, 4% 49%, 4% 54%, 6% 54%, 6% 59%, 11% 59%, 11% 64%, 17% 64%, 17% 69%, 20% 69%, 20% 89%, 13% 89%, 13% 94%, 10% 94%, 10% 100%, 100% 100%); }
.hhero__photo { max-width: none; width: 100%; }
.hhero__d { max-width: none; text-align: justify; }
@media (max-width: 820px) {
  .hhero__art { float: none; width: min(260px, 72%); margin: 1.6rem auto 0.4rem; shape-outside: none; }
  .hhero__d { text-align: left; }
}

/* 제 서랍 속 도구들 — 학력·자격을 강점으로 (서랍 앞판 모양) */
.tools__h { font-weight: 700; font-size: clamp(1.1rem, 2.4vw, 1.3rem); letter-spacing: 0.02em; }
.tools__row { list-style: none; margin: 1.4rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.tool { position: relative; background: var(--paper); border: 1px solid rgba(43,42,38,0.12); border-radius: 10px; padding: 1.5rem 1.1rem 1.1rem; box-shadow: inset 0 -5px 0 rgba(43,42,38,0.05); }
.tool__knob { position: absolute; top: 0.7rem; left: 50%; width: 26px; height: 7px; margin-left: -13px; border-radius: 999px; background: var(--k, #E9612B); }
.tool:nth-child(2) { --k: var(--joy); } .tool:nth-child(3) { --k: #E86F92; } .tool:nth-child(4) { --k: var(--butter); }
.tool em { display: block; font-style: normal; font-size: 0.72rem; letter-spacing: 0.14em; color: var(--ink-faint); }
.tool b { display: block; margin-top: 0.3rem; font-weight: 700; font-size: 0.98rem; line-height: 1.45; }
.tool span { display: block; margin-top: 0.5rem; font-weight: 300; font-size: 0.84rem; line-height: 1.7; color: var(--ink-soft); word-break: keep-all; }
.tool small { display: block; margin-top: 0.7rem; padding-top: 0.6rem; border-top: 1px dashed rgba(43,42,38,0.18); font-size: 0.76rem; line-height: 1.6; color: var(--ink-faint); word-break: keep-all; }
.path__sub { margin-top: clamp(2.4rem, 6vh, 3.4rem); font-weight: 700; font-size: 0.8rem; letter-spacing: 0.16em; color: var(--ink-faint); }
.path__sub + .path__grid { margin-top: 0.9rem; }
/* 이력은 한 단계 작게 */
.path__col h3 { font-size: 0.86rem; padding-bottom: 0.55rem; }
.path__col li { grid-template-columns: 4.8em 1fr; gap: 0.6rem; padding: 0.6rem 0; }
.path__col i { font-size: 0.72rem; }
.path__col span { font-size: 0.82rem; line-height: 1.7; }
@media (max-width: 900px) { .tools__row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 420px) { .tools__row { grid-template-columns: 1fr; } }

/* 서랍장 — 카드 대신 진짜 서랍처럼: 나무 틀 · 이름표 홀더 · 손잡이 · 살짝 열린 서랍 속 */
.tool, .tool__knob { all: unset; }
.cabinet { margin-top: 1.4rem; padding: 14px; gap: 14px; border-radius: 14px;
  background: #CFAE82; box-shadow: inset 0 2px 0 rgba(255,255,255,0.35), inset 0 -4px 0 rgba(0,0,0,0.12), 0 14px 28px rgba(43,42,38,0.12); }
.drawer { --d: #FBE3D6; display: flex; flex-direction: column; }
.drawer:nth-child(2) { --d: #DCE8F4; } .drawer:nth-child(3) { --d: #F8DDE6; } .drawer:nth-child(4) { --d: #FBF0C8; }
.drawer__front { position: relative; z-index: 1; background: var(--d); border-radius: 6px; padding: 1.1rem 0.8rem 1rem; text-align: center;
  box-shadow: inset 0 0 0 1px rgba(43,42,38,0.08), inset 0 -6px 0 rgba(43,42,38,0.08), 0 4px 0 rgba(43,42,38,0.14); }
.drawer__label { display: inline-block; max-width: 100%; padding: 0.35rem 0.8rem; border: 2px solid #A88758; border-radius: 3px; background: #FFFDF8;
  font-weight: 700; font-size: 0.92rem; line-height: 1.4; color: var(--ink); box-shadow: inset 0 1px 2px rgba(43,42,38,0.12); word-break: keep-all; }
.drawer__label em { display: block; font-style: normal; font-weight: 400; font-size: 0.66rem; letter-spacing: 0.16em; color: var(--ink-faint); }
.drawer__pull { display: block; width: 58px; height: 14px; margin: 0.8rem auto 0; border: 4px solid #8C6D45; border-top: 0; border-radius: 0 0 16px 16px; }
.drawer__tray { margin: 0 8px; padding: 1.1rem 1rem 0.9rem; background: #FFFDF8; border-radius: 0 0 6px 6px;
  box-shadow: inset 0 8px 10px -8px rgba(43,42,38,0.35), inset 0 0 0 1px rgba(43,42,38,0.08); flex: 1; }
.drawer__tray p { font-weight: 300; font-size: 0.84rem; line-height: 1.7; color: var(--ink-soft); word-break: keep-all; }
.drawer__tray small { display: block; margin-top: 0.6rem; font-size: 0.74rem; line-height: 1.6; color: var(--ink-faint); word-break: keep-all; }
@media (hover: hover) {
  .drawer__tray { transition: transform 0.35s var(--ease); transform-origin: top; }
  .drawer:hover .drawer__front { transform: translateY(2px); }
}

/* 마지막 한마디 — 한나가 말하듯, 손글씨로 (그리운X국한박 사랑스러운 · 원본 파일 그대로 사용) */
@font-face { font-family: "Griun Sarang"; src: url(/fonts/griun-sarang.ttf) format("truetype"); font-display: swap; }
.meet blockquote { font-family: "Griun Sarang", var(--a2z), sans-serif; font-weight: 400; font-size: clamp(1.2rem, 3vw, 1.65rem); line-height: 1.75; letter-spacing: 0; max-width: 30rem; }
.meet blockquote cite { font-family: var(--a2z); }
/* 한마디 두 줄로 — 폭을 넓히고 한 단계 작게, 이름까지 손글씨 */
.meet blockquote { max-width: 44rem; font-size: clamp(1.1rem, 2.5vw, 1.45rem); }
.meet blockquote cite { font-family: "Griun Sarang", var(--a2z), sans-serif; font-size: 1rem; letter-spacing: 0.08em; }
