/* GrowthRealty — entr.kr 만듦새 위에 GR 결. 흰 바탕 · 먹 · 주황 한 점(261006_0133 판). 색 숫자 금지(tokens.css). */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 60px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-weight: 450; line-height: 1.65; letter-spacing: -.01em; word-break: keep-all; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, p, figure, blockquote, ol, ul { margin: 0; }
ol, ul { padding: 0; list-style: none; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--ink); color: var(--paper); padding: 8px 16px; }
.skip:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.photo { background-size: cover; background-position: center; background-repeat: no-repeat; }

/* ── NAV — entr.kr 60px · 흰색 */
.nav { position: sticky; top: 0; z-index: 60; background: rgb(255 255 255 / .94); backdrop-filter: saturate(180%) blur(12px); -webkit-backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid transparent; transition: border-color .2s; }
.nav.scrolled { border-bottom-color: var(--line); }
.nav .wrap { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.mark { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; font-weight: 800; font-size: 14px; letter-spacing: .08em; }
.menu { display: flex; gap: 28px; font-size: 14px; font-weight: 600; letter-spacing: -.01em; }
.menu a { text-decoration: none; padding: 6px 0; transition: color .18s; }
.menu a:hover { color: var(--orange); }
.menu-btn { display: none; }

/* ── 공통 — entr.kr 리듬 */
section { border-top: 1px solid var(--line); padding: clamp(60px, 8.5vw, 116px) 0; }
.eyebrow { font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); display: flex; align-items: center; gap: 10px; margin: 0 0 clamp(28px, 4vw, 48px); }
.eyebrow::after { content: ""; flex: 1; height: 1px; background: var(--line); }
h2 { font-size: clamp(25px, 3.3vw, 39px); font-weight: 800; letter-spacing: -.035em; line-height: 1.24; margin: 0 0 18px; }
h2 span { display: block; }
.body { font-size: clamp(16px, 1.2vw, 17.5px); line-height: 1.75; max-width: 34em; }
.body.wide { max-width: 44em; margin-top: clamp(32px, 4vw, 48px); }
.note { margin-top: 16px; font-size: 15px; line-height: 1.7; }
.start-k { font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); }
.start-k.mt { margin-top: 26px; }

/* ── 1 HERO */
.hero { border-top: 0; padding: clamp(56px, 9vw, 116px) 0 clamp(60px, 8.5vw, 116px); }
.wordmark { font-weight: 800; line-height: 1.02; letter-spacing: -.045em; font-size: min(calc((100vw - 2 * var(--pad)) / 9.4), 124px); color: var(--orange); margin: 0 0 clamp(28px, 4vw, 48px); white-space: nowrap; }
.hero .eyebrow { margin-bottom: 18px; }
.hero h1 { font-size: clamp(30px, 4.4vw, 54px); font-weight: 800; letter-spacing: -.04em; line-height: 1.2; }
.hero h1 span { display: block; }
.lead { margin-top: 22px; font-size: clamp(16px, 1.35vw, 19px); line-height: 1.75; max-width: 38em; }
.ph-hero { background-image: var(--img-hero); aspect-ratio: 21 / 9; margin-top: clamp(40px, 5vw, 64px); }

/* ── 사진 + 글 짝 */
.pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: end; }
.pair.rev .photo { order: 2; }
.pair.top { align-items: start; }
.ph-asset { background-image: var(--img-asset); aspect-ratio: 4 / 5; }
.ph-pro { background-image: var(--img-pro); aspect-ratio: 4 / 5; }
.steps { margin-top: 28px; border-top: 1px solid var(--ink); }
.steps li { display: flex; align-items: baseline; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.steps span { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--orange); min-width: 1.8em; }
.steps b { font-size: clamp(17px, 1.6vw, 20px); font-weight: 800; letter-spacing: -.028em; }
.start { margin-top: 30px; }
.start-v { margin-top: 8px; font-size: clamp(20px, 2vw, 26px); font-weight: 800; letter-spacing: -.03em; }
.start-v i { font-style: normal; font-weight: 300; color: var(--orange); margin: 0 4px; }

/* 조문 조판 — 법률의 실체 */
.statute { margin-top: clamp(56px, 7vw, 96px); padding: clamp(28px, 4vw, 48px) 0 0; border-top: 1px solid var(--ink); }
.statute blockquote { font-family: var(--serif); font-weight: 600; font-size: clamp(22px, 2.6vw, 34px); line-height: 1.6; letter-spacing: -.025em; max-width: 30em; }
.statute mark { background: none; color: inherit; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 7px; }
.statute figcaption { margin-top: 18px; font-family: var(--mono); font-size: 11.5px; letter-spacing: .08em; color: var(--orange); }

/* ── 4 HOW WE WORK */
.ph-how { background-image: var(--img-how); aspect-ratio: 21 / 9; }
.split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); margin-top: clamp(40px, 5vw, 64px); align-items: start; }
.rows { border-top: 1px solid var(--ink); }
.rows li { display: grid; grid-template-columns: 2.2em 9em 1fr; gap: 12px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line); }
.rows .ix { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--orange); }
.rows b { font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
.rows em { font-style: normal; font-size: 15.5px; }

/* ── 5 GROWTH SYSTEM */
#gs-title { margin-bottom: clamp(32px, 4vw, 48px); }
.tri { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .62fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 40px); align-items: center; }
.tri-ph .photo { aspect-ratio: 4 / 5; }
.ph-sys-a { background-image: var(--img-sys-a); }
.ph-sys-p { background-image: var(--img-sys-p); }
.tri-ph figcaption { margin-top: 14px; font-size: 15px; line-height: 1.65; }
.tri-ph figcaption b { display: block; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); margin-bottom: 4px; }
.tri-mid { text-align: center; display: grid; gap: 14px; justify-items: center; }
.tri-line { position: relative; width: 1px; height: 72px; background: var(--line); overflow: hidden; }
.tri-line i { position: absolute; left: 0; top: -24px; width: 1px; height: 24px; background: var(--orange); animation: drop 2.6s var(--ease) infinite; }
@keyframes drop { to { transform: translateY(96px); } }
.tri-v { font-size: 15.5px; line-height: 1.65; font-weight: 600; max-width: 14em; }

/* ── 6 ALLPASS */
.product { font-size: 22px; font-weight: 800; letter-spacing: -.02em; margin-bottom: 16px; }
.product span { display: block; margin-top: 6px; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); }
.btn { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; border: 1.5px solid var(--orange); color: var(--orange); font-weight: 700; font-size: 15.5px; padding: 14px 26px; margin-top: 24px; transition: background-color .18s, color .18s; white-space: nowrap; }
.btn:hover { background: var(--orange); color: var(--paper); }
.btn span { transition: transform .2s var(--ease); }
.btn:hover span { transform: translateX(3px); }
.statute.card { margin-top: 0; padding: clamp(24px, 3vw, 36px); border: 1px solid var(--line); border-top: 2px solid var(--orange); }
.statute.card blockquote { font-size: clamp(19px, 1.8vw, 24px); }
.chain { display: flex; flex-wrap: wrap; gap: 6px 0; margin-bottom: 22px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; }
.chain li + li::before { content: "→"; margin: 0 10px; color: var(--orange); }
.chain li.on { color: var(--orange); font-weight: 500; }
.annot { margin-top: 22px; border-top: 1px solid var(--line); }
.annot li { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 15px; font-weight: 600; }
.annot span { color: var(--orange); font-weight: 400; }
.next { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: baseline; margin-top: clamp(48px, 6vw, 80px); padding-top: 20px; border-top: 1px solid var(--line); font-size: 15.5px; }

/* ── 7 COLLABORATION */
.ph-collab { background-image: var(--img-collab); aspect-ratio: 21 / 9; }

/* ── FOOT */
.foot { border-top: 1px solid var(--line); padding: 36px 0 44px; font-size: 13.5px; }
.exp { display: flex; flex-wrap: wrap; gap: 6px 18px; padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.exp span { font-family: var(--mono); font-weight: 500; color: var(--orange); }
.foot-in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; }
.foot-mark { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 16px; letter-spacing: -.01em; }
.foot a { text-decoration: none; border-bottom: 1px solid var(--line); }
.foot a:hover { color: var(--orange); border-color: var(--orange); }

/* 등장 */
.rv { opacity: 0; transform: translateY(14px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.rv.in { opacity: 1; transform: none; }

@media (max-width: 960px) {
  .menu { gap: 18px; font-size: 13px; }
  .pair, .split { grid-template-columns: 1fr; }
  .pair.rev .photo { order: 0; }
  .ph-asset, .ph-pro { aspect-ratio: 4 / 3; }
  .tri { grid-template-columns: 1fr 1fr; }
  .tri-mid { grid-column: 1 / -1; grid-row: 2; }
  .tri-line { display: none; }
}
@media (max-width: 767px) {
  .menu-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; margin-right: -10px; background: none; border: 0; cursor: pointer; color: var(--ink); }
  .menu-btn i, .menu-btn i::before, .menu-btn i::after { display: block; width: 20px; height: 2px; background: currentColor; position: relative; transition: transform .2s; }
  .menu-btn i::before, .menu-btn i::after { content: ""; position: absolute; left: 0; }
  .menu-btn i::before { top: -6px; } .menu-btn i::after { top: 6px; }
  .menu-btn[aria-expanded="true"] i { background: transparent; }
  .menu-btn[aria-expanded="true"] i::before { transform: translateY(6px) rotate(45deg); }
  .menu-btn[aria-expanded="true"] i::after { transform: translateY(-6px) rotate(-45deg); }
  .menu { position: absolute; left: 0; right: 0; top: 60px; flex-direction: column; gap: 0; background: var(--paper); border-bottom: 1px solid var(--line); padding: 6px var(--pad) 14px; display: none; font-size: 16px; }
  .menu.open { display: flex; }
  .menu a { padding: 12px 0; border-bottom: 1px solid var(--line); }
  .ph-hero, .ph-how, .ph-collab { aspect-ratio: 4 / 3; }
  .rows li { grid-template-columns: 2em 1fr; }
  .rows em { grid-column: 2; }
  .tri { grid-template-columns: 1fr; }
  .tri-mid { grid-row: auto; }
  .chain li + li::before { margin: 0 6px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .rv { opacity: 1; transform: none; }
}

/* ── 화면 한 장 = 한 구역 (PC · 혜린씨 2026-10-05) ───────────────── */
.law .statute { margin-top: 0; }
.statute.big blockquote { font-size: clamp(26px, 3.3vw, 46px); max-width: 26em; }
@media (min-width: 961px) and (min-height: 600px) {
  section.page { min-height: calc(100svh - 60px); display: flex; flex-direction: column; padding: clamp(28px, 5vh, 56px) 0; }
  section.page > .wrap { flex: 1; display: flex; flex-direction: column; width: 100%; min-height: 0; }
  .eyebrow { margin-bottom: clamp(14px, 3vh, 30px); }
  h2 { font-size: clamp(24px, min(3.1vw, 4.6vh), 38px); }
  .body { font-size: clamp(15px, min(1.15vw, 2vh), 17px); line-height: 1.7; }
  .steps { margin-top: clamp(14px, 2.4vh, 26px); }
  .steps li { padding: clamp(7px, 1.25vh, 12px) 0; }
  .rows li { padding: clamp(8px, 1.3vh, 13px) 0; }
  .note { margin-top: clamp(8px, 1.6vh, 16px); font-size: 14.5px; }

  /* 짝: 남은 높이를 사진이 채운다 */
  .pair.fill { flex: 1; min-height: 0; grid-template-rows: minmax(0, 1fr); align-items: stretch; }
  .pair.fill .photo { aspect-ratio: auto; height: 100%; min-height: 0; }
  .pair.fill .pair-text { align-self: center; }

  /* Hero — 워드마크 · 제목 · 글 · 남은 높이를 띠 사진이 채움 (1층 간판이 안 보이게 위층만) */
  .hero.page { padding-top: clamp(24px, 4.5vh, 56px); }
  .wordmark { font-size: min(calc((100vw - 2 * var(--pad)) / 9.4), 124px, 12.5vh); margin-bottom: clamp(14px, 3vh, 36px); }
  .hero h1 { font-size: clamp(28px, min(4.2vw, 6.2vh), 54px); }
  .lead { margin-top: clamp(10px, 2vh, 22px); font-size: clamp(15px, min(1.3vw, 2.1vh), 19px); }
  .ph-hero { aspect-ratio: auto; flex: 1; min-height: 140px; margin-top: clamp(18px, 3.5vh, 44px); background-position: center 12%; }

  /* 조문 한 장 — 가운데 */
  .law > .wrap { justify-content: center; }
  .law .eyebrow { margin-bottom: clamp(24px, 5vh, 56px); }

  /* Growth System — 사진 두 장이 남은 높이를 채움 */
  #gs-title { margin-bottom: clamp(14px, 2.6vh, 28px); }
  .tri { flex: 1; min-height: 0; grid-template-rows: minmax(0, 1fr); align-items: stretch; }
  .tri-ph { display: flex; flex-direction: column; min-height: 0; margin: 0; }
  .tri-ph .photo { aspect-ratio: auto; flex: 1; min-height: 0; }
  .tri-mid { align-self: center; }
  .tri-line { height: clamp(32px, 7vh, 72px); }
  .body.wide { margin-top: clamp(14px, 2.4vh, 28px); }

  /* AllPass */
  #allpass .pair.fill { align-items: center; }
  .statute.card blockquote { font-size: clamp(17px, min(1.7vw, 2.6vh), 23px); }
  .next { margin-top: clamp(16px, 3vh, 36px); }
}

/* ── 2차 수정 (혜린씨 2026-10-05) ─────────────────────────────── */
/* 단계 + 한 줄 설명 */
.steps.desc li { display: grid; grid-template-columns: 2.2em minmax(7.5em, auto) 1fr; gap: 6px 14px; align-items: baseline; }
.steps.desc em { font-style: normal; font-size: 15px; line-height: 1.55; }

/* Product — 네 블록 · 손을 대면 초록 */
.blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.blk { position: relative; border: 1px solid var(--line); padding: clamp(16px, 2vw, 24px); cursor: default; transition: background-color .28s var(--ease), color .28s var(--ease), border-color .28s var(--ease), transform .28s var(--ease); outline: none; }
.blk-law { grid-column: 1 / -1; }
.blk-k { display: flex; gap: 10px; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--orange); transition: color .28s var(--ease); }
.blk-q { margin-top: 12px; font-family: var(--serif); font-weight: 600; font-size: clamp(17px, min(1.6vw, 2.5vh), 22px); line-height: 1.6; letter-spacing: -.02em; }
.blk-c { margin-top: 10px; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; }
.blk-t { margin-top: 10px; font-size: 15px; font-weight: 600; line-height: 1.55; }
.blk:hover, .blk:focus-visible { background: var(--orange); border-color: var(--orange); color: var(--paper); transform: translateY(-2px); }
.blk:hover .blk-k, .blk:focus-visible .blk-k { color: var(--paper); }

/* Collaboration — 큰 단어 한 줄 · 손을 대면 설명이 바뀜 */
.words { margin: clamp(20px, 3vh, 32px) 0 clamp(8px, 1.6vh, 16px); }
.words-line { display: flex; flex-wrap: wrap; gap: 4px 0; }
.words-line button { all: unset; cursor: pointer; font-weight: 800; font-size: clamp(26px, min(3.2vw, 4.6vh), 44px); letter-spacing: -.04em; line-height: 1.2; color: var(--ink); padding: 0 .35em 2px 0; transition: color .2s var(--ease); }
.words-line button:not(:last-child)::after { content: "·"; font-weight: 300; margin-left: .35em; color: var(--line); }
.words-line button[aria-selected="true"], .words-line button:hover, .words-line button:focus-visible { color: var(--orange); }
.words-line button[aria-selected="true"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.words-d { margin-top: 14px; font-size: clamp(16px, 1.3vw, 19px); font-weight: 600; min-height: 1.6em; }
@media (max-width: 767px) { .blocks { grid-template-columns: 1fr; } .steps.desc li { grid-template-columns: 2em 1fr; } .steps.desc em { grid-column: 2; } }

/* ── v13 — Company · Product 공통 틀: 검정 헤더 · 푸터 (entr.kr 구조) · 경계 줄 · 번호 없음 ── */
.nav { background: var(--night); border-bottom: 0; }
.nav.scrolled { border-bottom: 0; }
.nav .mark, .nav .menu a { color: var(--paper); }
.nav .menu a:hover, .nav .menu a:focus-visible, .nav .mark:hover { color: var(--orange-on-dark); }
.menu-btn { color: var(--paper); }
section, section.page { border-top: 0; }
.eyebrow::after { display: none; }
.link { display: inline-flex; gap: 8px; margin-top: 22px; font-weight: 700; text-decoration: none; color: var(--orange); border-bottom: 1.5px solid var(--orange); padding-bottom: 4px; }

/* 세로로 쌓는 장(Hero · How We Work · Growth System · Product) */
.col { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.ph-hero { position: relative; margin-top: 0; }
.ph-hero .layer { position: absolute; inset: 0; width: 100%; height: 100%; }
.ph-hero .layer path { fill: none; stroke: rgb(255 255 255 / .85); stroke-width: 1; vector-effect: non-scaling-stroke; }
.ph-hero .layer .leader { stroke-dasharray: 3 4; }
.tick { position: absolute; right: 16px; bottom: 12px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; color: var(--paper); background: rgb(12 13 16 / .55); padding: 4px 8px; }
.hero-text { margin-top: clamp(18px, 3.4vh, 40px); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 8px 48px; align-items: end; }
.hero-text .eyebrow { grid-column: 1 / -1; margin-bottom: 4px; }
.hero-text .lead { margin-top: 0; }
.ph-how { aspect-ratio: auto; flex: 1; min-height: 180px; }
.how-text { margin-top: clamp(16px, 3vh, 36px); }
.how-head h2 { margin-bottom: clamp(12px, 2.2vh, 24px); }
.cells { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.cells li { border-top: 2px solid var(--ink); padding: 12px 4px 0 0; transition: border-color .2s; }
.cells li:hover { border-color: var(--orange); }
.cells b { display: block; font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
.cells em { display: block; margin-top: 4px; font-style: normal; font-size: 14px; line-height: 1.5; }
.gs-head h2 { margin-bottom: clamp(12px, 2.4vh, 26px); }

/* 양면 + 가운데 선순환 (Growth System · Product 같은 틀) */
.tri-mid { text-align: center; display: grid; gap: 10px; justify-items: center; }
.tri-k { font-family: var(--mono); font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); padding: 8px 12px; border: 1.5px solid var(--orange); }
.flowtxt { font-size: 14px; font-weight: 600; }
.flowtxt i { font-style: normal; color: var(--orange); margin: 0 4px; }
.bridge { position: relative; width: 1px; height: clamp(28px, 6vh, 64px); background: var(--line); overflow: hidden; }
.bridge i { position: absolute; left: 0; top: -20px; width: 1px; height: 20px; background: var(--orange); animation: drop 2.4s var(--ease) infinite; }
.bridge.rev i { animation-direction: reverse; }
.prod { display: flex; flex-direction: column; text-decoration: none; color: inherit; min-height: 0; }
.prod-vis { flex: 1; min-height: 0; border: 1px solid var(--line); border-top: 2px solid var(--orange); padding: clamp(18px, 2.4vw, 32px); display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; transition: border-color .25s, transform .25s var(--ease); }
.vis-k { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--orange); }
.vis-q { font-family: var(--serif); font-weight: 600; font-size: clamp(18px, min(1.8vw, 2.8vh), 26px); line-height: 1.5; letter-spacing: -.02em; }
.vis-note { font-family: var(--mono); font-size: 10.5px; letter-spacing: .06em; }
.prod-name { margin-top: 14px; font-size: 20px; font-weight: 800; letter-spacing: -.02em; display: flex; align-items: center; gap: 10px; }
.tag { font-family: var(--mono); font-size: 10.5px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; border: 1px solid var(--ink); padding: 2px 8px; }
.tag.on { border-color: var(--orange); color: var(--orange); }
.prod-d { margin-top: 6px; font-size: 15px; line-height: 1.6; }
.beta { margin-top: 12px; align-self: flex-start; font-weight: 700; font-size: 15px; color: var(--paper); background: var(--orange); padding: 10px 18px; transition: background-color .2s; }
.beta i { font-style: normal; margin-left: 6px; }

/* 푸터 — 헤더와 같은 검정 */
.foot { background: var(--night); color: var(--paper); border-top: 0; padding: 28px 0; }
.foot-in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px 28px; }
.foot .mark { color: var(--paper); text-decoration: none; display: inline-flex; gap: 9px; align-items: center; font-weight: 800; font-size: 13px; letter-spacing: .08em; }
.foot-c { font-size: 13px; opacity: .78; }
.foot-r { display: flex; gap: 12px; align-items: center; }
.foot-btn { color: var(--paper); text-decoration: none; font-weight: 700; font-size: 14px; border: 1.5px solid var(--orange-on-dark); padding: 8px 16px; transition: background-color .2s, color .2s; }
.foot-btn:hover { background: var(--orange-on-dark); color: var(--night); }
.family { position: relative; font-size: 14px; }
.family summary { cursor: pointer; list-style: none; padding: 8px 4px; }
.family summary::after { content: " ▾"; color: var(--orange-on-dark); }
.family summary:hover { color: var(--orange-on-dark); }
.family ul { position: absolute; right: 0; bottom: 100%; margin-bottom: 8px; min-width: 160px; background: var(--night); border: 1px solid rgb(255 255 255 / .16); padding: 6px 0; }
.family a { display: block; padding: 8px 14px; color: var(--paper); text-decoration: none; }
.family a:hover { color: var(--orange-on-dark); }
.foot a { border-bottom: 0; }

@media (min-width: 961px) and (min-height: 600px) {
  .ph-hero { flex: 1; min-height: 160px; }
  .tri .prod { height: 100%; }
}
@media (max-width: 960px) {
  .hero-text { grid-template-columns: 1fr; }
  .ph-hero, .ph-how { aspect-ratio: 16 / 9; }
  .cells { grid-template-columns: 1fr 1fr; }
  .prod-vis { min-height: 220px; }
}
@media (max-width: 767px) {
  .cells { grid-template-columns: 1fr; }
  .menu { background: var(--night); }
  .menu a { border-bottom-color: rgb(255 255 255 / .12); }
}

/* 수정 — wrap 이 곧 pair 인 장: 좌우 짝 되살림 · 사진이 남은 높이를 채움 */
section.page > .wrap.pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: stretch; }
section.page > .wrap.pair > .photo { aspect-ratio: auto; height: 100%; min-height: 320px; }
section.page > .wrap.pair > .pair-text { align-self: center; }
.wrap.pair.rev > .photo { order: 2; }
.hero h1 { font-size: clamp(28px, min(3.4vw, 5.2vh), 46px); }
@media (min-width: 961px) and (min-height: 600px) { section.page > .wrap.pair { grid-template-rows: minmax(0, 1fr); } }
@media (max-width: 960px) { section.page > .wrap.pair { grid-template-columns: 1fr; } section.page > .wrap.pair > .photo { min-height: 0; aspect-ratio: 4 / 3; height: auto; } .wrap.pair.rev > .photo { order: 0; } }

/* ── 261005_1859 판 — 주황(FRUIT) · 세 번째 블록 카피 · Product 정리 (혜린씨 · 지우님 · 클로이님 2026-10-05) ──
   주황은 점 · 선 · 밑줄 · 버튼 면 · 상태 · 연결점에만. 흰 바탕 위 글자는 먹, 검정 위 글자 hover 만 --orange-on-dark. */
.eyebrow { color: var(--ink); }
.eyebrow::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.mark { letter-spacing: -.01em; font-size: 15px; }
.nav .menu a[aria-current="true"] { color: var(--orange-on-dark); }

/* Hero — 건물 윤곽선 하나 + 네 표시. 좌표 · 층수 · 면적 같은 숫자는 촬영 위치가 정해지기 전까지 넣지 않는다 */
.ph-hero .layer .asset { stroke: var(--orange); stroke-width: 1.5; }
.facets { position: absolute; left: 16px; bottom: 14px; display: flex; flex-wrap: wrap; gap: 6px; }
.facets li { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; color: var(--paper); background: rgb(12 13 16 / .62); padding: 4px 10px; }
.facets li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--orange-on-dark); }

/* 단계 — 번호 대신 점 · 결실 단계만 주황 */
.steps span { min-width: 0; width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--mute); align-self: center; justify-self: start; }
.steps li.on span { background: var(--orange); border-color: var(--orange); }
.closing { margin-top: clamp(14px, 2.6vh, 28px); padding-left: 14px; border-left: 2px solid var(--orange); font-size: clamp(16px, min(1.3vw, 2.2vh), 19px); font-weight: 700; letter-spacing: -.02em; line-height: 1.55; }
.closing span { display: block; }
.closing.center { border-left: 0; padding-left: 0; text-align: center; }
.pair-text .body + .body { margin-top: 8px; }

/* 양면 틀 — 글자는 먹, 테두리 · 흐름 점만 주황 */
.tri-ph figcaption b { color: var(--ink); }
.tri-k { color: var(--ink); }
.tri-core { display: grid; gap: 8px; justify-items: center; }
.tri-d { max-width: 15em; font-size: 14px; line-height: 1.55; color: var(--mute); }
.vis-k { color: var(--mute); }
.tag { color: var(--mute); border-color: var(--line); }
.tag.on { color: var(--ink); border-color: var(--orange); }

/* Product 카드 */
.prod-vis { position: relative; text-decoration: none; color: inherit; }
a.prod-vis:hover { border-color: var(--orange); transform: translateY(-3px); }
.vis-q { font-size: clamp(17px, min(1.6vw, 2.5vh), 23px); }
.vis-d { font-size: 14.5px; line-height: 1.6; }
.oki, .play { position: absolute; top: clamp(16px, 2vw, 24px); right: clamp(16px, 2vw, 24px); }
.oki { width: 16px; height: 22px; }
.oki path { fill: var(--orange); } .oki circle { fill: var(--paper); }
.play { width: 13px; height: 15px; }
.play path { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-linejoin: round; }
.go { align-self: flex-start; margin-top: 4px; font-weight: 700; font-size: 14.5px; border-bottom: 2px solid var(--orange); padding-bottom: 2px; }
.go i { font-style: normal; margin-left: 4px; }
.beta-box { margin-top: 10px; padding: 12px 16px; border: 1px solid var(--line); border-left: 2px solid var(--orange); }
.beta-t { font-weight: 800; font-size: 15px; letter-spacing: -.02em; }
.beta-d { margin-top: 2px; font-size: 14px; line-height: 1.55; color: var(--mute); }
.beta { display: inline-block; margin-top: 10px; color: var(--ink); background: var(--orange); text-decoration: none; font-size: 14.5px; padding: 9px 16px; }
.beta:hover, .beta:focus-visible { background: var(--ink); color: var(--paper); }

/* 버튼 · 링크 · 선택 */
.btn { background: var(--orange); border-color: var(--orange); color: var(--ink); }
.btn:hover { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.link { color: var(--ink); border-bottom: 2px solid var(--orange); }
.link:hover { border-bottom-color: var(--ink); }
.words-line button { color: rgb(17 18 20 / .5); }
.words-line button[aria-selected="true"], .words-line button:hover, .words-line button:focus-visible { color: var(--ink); }
.words-line button[aria-selected="true"] { text-decoration-color: var(--orange); }

/* 푸터 */
.foot .mark { letter-spacing: -.01em; font-size: 14px; }

@media (min-width: 961px) and (min-height: 600px) {
  .pd-head h2 { margin-bottom: clamp(6px, 1.2vh, 12px); }
  .pd-head .body { margin-bottom: clamp(12px, 2.2vh, 24px); }
  #system .closing { margin-top: clamp(12px, 2.4vh, 24px); }
  .vis-q { font-size: clamp(16px, min(1.5vw, 2.4vh), 22px); }
}

/* ── 261005_1943 판 — Hero: 사진 위 약 56% · 아래 회사 소개 · 오른쪽 아래 네 역량 · Team / Contact (혜린씨 2026-10-05) ── */
.hero-text { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 20px clamp(32px, 5vw, 72px); align-items: end; }
.hero-main .eyebrow { margin-bottom: clamp(10px, 1.8vh, 18px); }
.hero-main .lead { margin-top: clamp(10px, 1.8vh, 18px); max-width: 33em; }
.hero-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: clamp(16px, 2.6vh, 28px); }
.hero-cta .btn { margin-top: 0; padding: 12px 22px; font-size: 15px; }
.btn.line { background: transparent; border-color: var(--ink); color: var(--ink); }
.btn.line:hover { background: var(--ink); color: var(--paper); }
.lenses { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 14px; align-self: end; }
.lenses li { border-top: 2px solid var(--ink); padding-top: 14px; position: relative; }
.lenses li::before { content: ""; position: absolute; left: 0; top: -2px; width: 28px; height: 2px; background: var(--orange); }
.lenses b { display: block; font-size: clamp(24px, min(2.5vw, 3.9vh), 36px); font-weight: 800; letter-spacing: -.035em; line-height: 1.2; }
.lenses em { display: block; margin-top: 6px; font-style: normal; font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.ph-hero .layer .asset { fill: rgb(255 98 0 / .12); }

@media (min-width: 961px) and (min-height: 600px) {
  .hero.page { padding-top: clamp(16px, 2.6vh, 32px); padding-bottom: clamp(20px, 3.4vh, 40px); }
  .hero .ph-hero { flex: 0 0 auto; height: calc((100svh - 60px) * .52); min-height: 0; }
  .hero .hero-text { flex: 1; margin-top: clamp(16px, 3vh, 36px); }
}
@media (max-width: 960px) {
  .hero-text { grid-template-columns: 1fr; }
  .lenses { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; margin-top: 8px; }
}
@media (min-width: 961px) and (min-height: 600px) and (max-height: 840px) {
  .beta-box { padding: 9px 14px; margin-top: 8px; }
  .beta { margin-top: 6px; padding: 7px 14px; }
  .prod-name { margin-top: 10px; }
  .pd-head .body { margin-bottom: 10px; }
  .prod-vis { padding: 16px 20px; gap: 8px; }
}

/* ── 261005_1959 판 — 설명 2줄 · 키워드 = 핵심 업무 · 주황은 강조와 흐름에만 · 링크 아닌 곳에 링크 표시 없음 (혜린씨 2026-10-05) ── */
br.pc { display: none; }
@media (min-width: 961px) { br.pc { display: inline; } }
.body.d { max-width: none; }

/* 흐름 — 다섯 단계를 주황이 차례로 지나간다(작업 흐름). 고정 주황 점 없음 */
.flow { position: relative; margin-top: clamp(14px, 2.4vh, 26px); border-top: 1px solid var(--ink); }
.flow li { position: relative; display: grid; grid-template-columns: 22px minmax(7em, auto) 1fr; gap: 0 14px; align-items: center; padding: clamp(7px, 1.25vh, 12px) 10px clamp(7px, 1.25vh, 12px) 6px; border-bottom: 1px solid var(--line); animation: flow-row 6s linear infinite; animation-delay: calc(var(--i) * 1s); }
.flow li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid var(--mute); background: var(--paper); justify-self: center; animation: flow-dot 6s linear infinite; animation-delay: inherit; }
.flow li:not(:last-child)::after { content: ""; position: absolute; left: 16px; top: calc(50% + 6px); height: calc(100% - 12px); width: 1px; background: var(--line); }
.flow b { font-size: clamp(16px, 1.5vw, 19px); font-weight: 800; letter-spacing: -.028em; }
.flow em { font-style: normal; font-size: 14.5px; color: var(--mute); }
#pro .flow li { animation: flow-row3 3.6s linear infinite; animation-delay: calc(var(--i) * 1.2s); } #pro .flow li::before { animation: flow-dot3 3.6s linear infinite; animation-delay: inherit; }
@keyframes flow-row { 0%, 14% { background: var(--orange-tint); } 16.5%, 100% { background: transparent; } }
@keyframes flow-dot { 0%, 14% { background: var(--orange); border-color: var(--orange); } 16.5%, 100% { background: var(--paper); border-color: var(--mute); } }
@keyframes flow-row3 { 0%, 24% { background: var(--orange-tint); } 27.5%, 100% { background: transparent; } }
@keyframes flow-dot3 { 0%, 24% { background: var(--orange); border-color: var(--orange); } 27.5%, 100% { background: var(--paper); border-color: var(--mute); } }

/* 칸 — 커서가 머문 칸을 옅은 주황으로 채운다. 버튼만 진한 주황 */
.cells li { padding: 12px 10px 12px 10px; transition: background-color .2s, border-color .2s; }
.cells li:hover { background: var(--orange-tint); border-color: var(--orange); }
.cells.two { grid-template-columns: 1fr 1fr; gap: 0 12px; margin-top: clamp(14px, 2.4vh, 24px); }
.cells.two li { border-top: 1px solid var(--line); }
.cells.two li:nth-child(-n+2) { border-top: 2px solid var(--ink); }
.cells.two li:hover { border-top-color: var(--orange); }
#contact .btn { margin-top: clamp(14px, 2.4vh, 24px); }

/* 중심축 — 세 칸이 같은 크기 · 가운데가 축(검정 판) · 양쪽으로 흐르는 선 */
.axis { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 22px); margin-top: clamp(14px, 2.6vh, 28px); }
.ax { margin: 0; display: flex; flex-direction: column; min-height: 0; position: relative; z-index: 1; }
.ax-box { position: relative; aspect-ratio: 4 / 3; background-size: cover; background-position: center; }
.ax figcaption { margin-top: 12px; display: grid; gap: 4px; align-content: start; }
.ax figcaption b { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; }
.ax figcaption > span { font-size: 14.5px; line-height: 1.6; }
.core .ax-box { background: var(--night); color: var(--paper); display: grid; place-items: center; text-align: center; }
.core-k { font-size: clamp(22px, min(2.2vw, 3.6vh), 32px); font-weight: 800; letter-spacing: -.03em; }
.core-k::before { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--orange-on-dark); margin: 0 auto 14px; box-shadow: 0 0 0 6px rgb(255 130 0 / .18); }
.flowtag { position: absolute; font-family: var(--mono); font-size: 11.5px; letter-spacing: .1em; color: rgb(255 255 255 / .78); }
.flowtag i { font-style: normal; color: var(--orange-on-dark); }
.flowtag.l { left: 16px; top: 14px; } .flowtag.r { right: 16px; bottom: 14px; }
.core figcaption b::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--orange); }
.axis-line { position: absolute; left: 0; right: 0; top: 0; height: 0; z-index: 2; pointer-events: none; }
.axis-line i { position: absolute; top: 0; height: 2px; width: 18%; background: linear-gradient(90deg, transparent, var(--orange), transparent); animation: axis-run 4.8s linear infinite; }
.axis-line i.rev { animation-direction: reverse; animation-delay: -2.4s; }
@keyframes axis-run { from { left: 0; } to { left: 82%; } }

/* Product 상자 — 이미지 자리 · 링크는 AllPass 상자 · 버튼만 진한 주황 */
.prod-box { border: 1px solid var(--line); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; text-decoration: none; color: inherit; transition: background-color .2s, border-color .2s; }
a.prod-box:hover { background: var(--orange-tint); border-color: var(--orange); }
.pb-name { font-size: clamp(24px, min(2.4vw, 3.8vh), 34px); font-weight: 800; letter-spacing: .02em; }
.pb-k { font-family: var(--mono); font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--mute); }
.prod-box .oki, .prod-box .play { position: static; margin-bottom: 4px; }
.prod-box .oki { width: 20px; height: 27px; } .prod-box .play { width: 16px; height: 18px; }
.pb-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 6px; }
.pb-cta .beta { margin-top: 0; }
.go { color: var(--ink); text-decoration: none; }

@media (min-width: 961px) and (min-height: 600px) {
  /* How We Work — Hero 와 같은 비율 */
  #how .ph-how { flex: 0 0 auto; height: calc((100svh - 60px) * .50); min-height: 0; }
  #how .how-text { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; margin-top: clamp(14px, 2.6vh, 30px); }
  /* 중심축 — 남은 높이를 세 상자가 같이 채운다 */
  .axis { flex: 1; min-height: 0; grid-template-rows: minmax(0, 1fr) auto; }
  .ax { display: grid; grid-row: span 2; grid-template-rows: subgrid; }
  .ax-box { flex: 1; aspect-ratio: auto; min-height: 0; }
  .axis-line { top: calc(var(--axis-mid, 40%)); }
  .gs-head .body.d { margin-top: 0; }
  .gs-head h2 { margin-bottom: clamp(8px, 1.4vh, 14px); }
}
@media (max-width: 960px) {
  .axis { grid-template-columns: 1fr; }
  .axis-line { display: none; }
  .cells.two { grid-template-columns: 1fr; }
  .cells.two li:nth-child(2) { border-top: 1px solid var(--line); }
}
@media (prefers-reduced-motion: reduce) { .axis-line { display: none; } }
@media (min-width: 961px) and (min-height: 600px) and (max-height: 840px) {
  #how .ph-how { height: calc((100svh - 60px) * .44); }
}

/* ── 261005_2030 판 (혜린씨 2026-10-05 20:2x 피드백) ─────────────────────────────
   생애주기 = 동그라미(잇는 선 없음) · 서로 다른 분야 키워드 = 주황 선 한 줄 칸(.kw) · 라벨 = 주황 글자 · 행동 유도 = 검정 밑줄 → 커서에 주황 밑줄
   스스로 움직이는 것 없음 — 모두 커서가 닿을 때만 반응 · 화살표 없음 */
.eyebrow { color: var(--orange); }
.eyebrow::before { display: none; }

/* 행동 유도 */
.link { color: var(--ink); border-bottom: 1.5px solid var(--ink); padding-bottom: 3px; gap: 0; transition: border-color .18s; }
.link:hover, .link:focus-visible { color: var(--ink); border-bottom-color: var(--orange); }
.go { margin-top: 0; font-size: 14.5px; font-weight: 700; }

/* 생애주기 — 동그라미만 · 커서가 닿은 단계만 옅은 주황 + 주황 동그라미 */
.flow { border-top: 1px solid var(--line); }
.flow li, .flow li::before, #pro .flow li, #pro .flow li::before { animation: none; }
.flow li:not(:last-child)::after { display: none; }
.flow li { transition: background-color .18s; cursor: default; }
.flow li::before { transition: background-color .18s, border-color .18s; }
.flow li:hover { background: var(--orange-tint); }
.flow li:hover::before { background: var(--orange); border-color: var(--orange); }

/* 서로 다른 분야 키워드 — 한 줄 주황 선 · 글자 단계 통일 */
.kw { display: grid; gap: 0 14px; align-self: end; }
.kw.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kw.k5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kw.k2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; margin-top: clamp(14px, 2.4vh, 24px); }
.kw li { border-top: 2px solid var(--orange); padding: 12px 8px 12px 0; transition: background-color .18s; }
.kw li:hover { background: var(--orange-tint); }
.kw b { display: block; font-size: 17px; font-weight: 800; letter-spacing: -.02em; line-height: 1.3; }
.kw em { display: block; margin-top: 4px; font-style: normal; font-size: 14px; line-height: 1.5; color: var(--mute); }
.kw.k2 li { padding-left: 0; }
#contact .btn { margin-top: clamp(14px, 2.4vh, 24px); }

/* Hero — 한 동을 짚는다 */
.pick-tag { position: absolute; font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); background: var(--orange); padding: 4px 9px; left: var(--tag-x, 76%); top: var(--tag-y, 22%); transform: translate(0, -50%); }
.ph-hero .layer .asset { stroke: var(--orange); stroke-width: 2; fill: rgb(255 98 0 / .16); }
.ph-hero .layer .leader { stroke: var(--orange); }

/* How We Work — Hero 와 같은 짜임 */
#how .hero-text { margin-top: clamp(16px, 3vh, 36px); }
#how .hero-main h2 { margin-bottom: clamp(8px, 1.4vh, 14px); }

/* Professionals — 사진을 덜 자른다(손과 서류가 보이게) */
#pro .wrap.pair > .photo { height: auto; aspect-ratio: 4 / 3; align-self: center; min-height: 0; }

/* 중심축 — 두 줄이 세 칸을 가로지른다 · 위 = 왼쪽에서 오른쪽, 아래 = 오른쪽에서 왼쪽 · 커서가 닿으면 흐른다 */
.core .ax-box { grid-template-rows: 1fr auto 1fr; padding: 0 18px; }
.lane { display: grid; gap: 2px; justify-items: center; align-self: center; }
.lane.up { align-self: end; padding-bottom: 14px; }
.lane.down { align-self: start; padding-top: 14px; }
.lane b { font-size: clamp(15px, 1.3vw, 18px); font-weight: 800; letter-spacing: -.02em; color: var(--paper); }
.lane span { font-size: 12.5px; color: rgb(255 255 255 / .62); }
.core-k::before { display: none; }
.core-k { padding: 8px 0; }
.flowtag { display: none; }
.axis-line { display: none; }
.rail { position: absolute; left: 0; right: 0; height: 2px; background: rgb(255 98 0 / .55); z-index: 2; pointer-events: none; top: var(--rail-up, 35%); overflow: hidden; }
.rail.down { top: var(--rail-down, 55%); }
.rail i { position: absolute; top: 0; height: 2px; width: 22%; background: linear-gradient(90deg, transparent, var(--orange-on-dark), transparent); opacity: 0; }
.axis:hover .rail.up i { opacity: 1; animation: rail-r 2.4s linear infinite; }
.axis:hover .rail.down i { opacity: 1; animation: rail-l 2.4s linear infinite; }
@keyframes rail-r { from { left: -22%; } to { left: 100%; } }
@keyframes rail-l { from { left: 100%; } to { left: -22%; } }
.ax:not(.core) .ax-box::after { content: ""; position: absolute; inset: 0; background: rgb(12 13 16 / 0); }

/* Product 상자 아이콘 · RealPlay = 주황 원 안 흰 재생 */
.prod-box .rp { width: 30px; height: 30px; margin-bottom: 4px; }
.rp circle { fill: var(--orange); } .rp path { fill: var(--paper); }
.prod-box .play { display: none; }

@media (min-width: 961px) and (min-height: 600px) {
  #how .ph-how { flex: 0 0 auto; height: calc((100svh - 60px) * .50); }
  #how .hero-text { flex: 1; }
}
@media (min-width: 961px) and (min-height: 600px) and (max-height: 840px) {
  #how .ph-how { height: calc((100svh - 60px) * .46); }
}
@media (max-width: 960px) {
  .kw.k4, .kw.k5 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
  .kw li { margin-bottom: 10px; }
  .rail { display: none; }
  #pro .wrap.pair > .photo { aspect-ratio: 4 / 3; }
}
@media (min-width: 961px) and (min-height: 600px) {
  .hero .ph-hero { height: calc((100svh - 60px) * .58); background-position: center 55%; }
  .hero .hero-text { align-items: end; }
}
.pick-tag { --tag-x: 80%; --tag-y: 20.5%; }
.core figcaption b::before { display: none; }
.hero-main .lead { font-size: clamp(15px, min(1.2vw, 2vh), 17.5px); }

/* ── 261005_2108 판 (혜린씨 20:5x 피드백 · 90%) ──────────────────────────────────
   키워드 단계 하나: 입지 · 자산 분석 · 예비 전문가 · Legal · Asset · ALLPASS · Contact Asset 가 같은 글자.
   장식 없음 — 커서가 닿으면 키워드 글자만 주황. 행동 유도 하나: 처음부터 굵은 주황 밑줄 → 커서에 주황 면 · 흰 글자. */
.eyebrow { font-weight: 700; }

/* 키워드 단계 */
.kw b, .flow b, .ax figcaption b, .pb-name { font-family: var(--sans); font-size: clamp(16px, 1.35vw, 18px); font-weight: 800; letter-spacing: -.02em; text-transform: none; line-height: 1.3; color: var(--ink); transition: color .18s; }
.pb-name { font-size: clamp(22px, min(2.2vw, 3.6vh), 30px); letter-spacing: .01em; }
.kw li:hover, .flow li:hover { background: transparent; }
.kw li:hover b, .flow li:hover b, .ax:hover figcaption b { color: var(--orange); }
.kw li { padding: 12px 8px 12px 0; }
.kw.k4 li { padding-bottom: 4px; }

/* 생애주기 — 동그라미 없이 글자만 */
.flow li { grid-template-columns: minmax(8em, auto) 1fr; padding-left: 0; }
.flow li::before, .flow li:hover::before { display: none; }

/* 행동 유도 하나 */
.cta { display: inline-block; align-self: flex-start; margin: clamp(16px, 2.6vh, 26px) 0 0 -12px; padding: 8px 12px 7px; font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); text-decoration: none; background: linear-gradient(var(--orange), var(--orange)) 0 100% / 100% 3px no-repeat; transition: background-size .2s var(--ease), color .2s; }
.cta:hover, .cta:focus-visible { background-size: 100% 100%; color: var(--paper); }
.pb-cta { margin-top: 4px; }
.pb-cta .cta { margin-top: 0; }
.soon { display: inline-block; margin-left: -12px; padding: 8px 12px 7px; font-size: 15.5px; font-weight: 800; letter-spacing: -.01em; color: var(--mute); background: linear-gradient(var(--line), var(--line)) 0 100% / 100% 3px no-repeat; }

/* Hero — 짚은 건물만 선명하게, 나머지는 어둡게 내려놓는다 */
.ph-hero .layer .dim { fill: rgb(12 13 16 / .58); }
.ph-hero .layer .asset { fill: none; stroke-width: 2.5; }

/* Professionals — Asset 과 같은 크기 · 오른쪽 면 전체 · 손과 계약서 위주로 자른다 */
#pro .wrap.pair > .photo { aspect-ratio: auto; height: 100%; min-height: 320px; align-self: stretch; }
.ph-pro { background-position: 42% 32%; background-size: 170%; }

/* How We Work — 오른쪽 키워드 2열 × 3행(Contact 와 같은 꼴) */
#how .kw.k2 { margin-top: 0; align-self: end; }

/* 중심축 — 가운데 판을 중심으로 길쭉한 고리 하나 · 그 안에서 빛이 돈다(위 = 왼쪽→오른쪽, 아래 = 오른쪽→왼쪽) */
.rail { display: none; }
.loop { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 2; }
.loop rect { fill: none; vector-effect: non-scaling-stroke; }
.loop-base { stroke: rgb(255 98 0 / .6); stroke-width: 2; }
.loop-light { stroke: var(--orange-on-dark); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: 70 930; animation: loop-run 5s linear infinite; filter: drop-shadow(0 0 4px rgb(255 130 0 / .9)); }
@keyframes loop-run { to { stroke-dashoffset: -1000; } }
.lane span { font-size: 12.5px; color: rgb(255 255 255 / .7); }

/* Product — 아이콘 둘 같은 크기 · 같은 여백(지도 마커 구멍 = 재생 표시) */
.prod-box .oki, .prod-box .rp { width: 21px; height: 28px; margin-bottom: 2px; }
.rp circle { fill: var(--orange); } .rp path { fill: var(--paper); }

@media (max-width: 960px) {
  .loop { display: none; }
  #pro .wrap.pair > .photo { aspect-ratio: 4 / 3; height: auto; }
  .ph-pro { background-size: cover; }
  .cta, .soon { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .loop-light { animation: none; stroke-dasharray: none; stroke-opacity: .0; } }
#how .hero-text.how-text { display: grid; flex-direction: initial; justify-content: initial; }
.flow li { grid-template-columns: minmax(7.5em, auto) minmax(0, 1fr); }
@media (max-width: 960px) { section.page > .wrap.pair { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 480px) { .flow li { grid-template-columns: minmax(0, 1fr); } .flow em { margin-top: 2px; } }
@media (max-width: 960px) { #pro .wrap.pair > .photo { min-height: 0; width: 100%; } }

/* ── 261005_2131 판 (혜린씨 마무리 다듬기 2) ─────────────────────────────────────── */
/* 라벨 — 고정폭 글꼴은 400 · 500 만 불러와서 굵게 하면 가짜 굵기로 뭉개졌다. 본문 글꼴(Pretendard)로 또렷하게 */
.eyebrow { font-family: var(--sans); font-size: 13px; font-weight: 700; letter-spacing: .1em; }

/* Hero — 더 어둡게 누르고 짚은 건물만 밝게 · 글을 사진에 붙인다 */
.ph-hero .layer .dim { fill: rgb(12 13 16 / .72); }
.ph-hero .layer .lift { fill: rgb(255 255 255 / .16); mix-blend-mode: screen; }
@media (min-width: 961px) and (min-height: 600px) {
  .hero .ph-hero { height: calc((100svh - 60px) * .62); }
  .hero .hero-text, #how .hero-text.how-text { flex: 0 0 auto; margin-top: clamp(16px, 2.8vh, 30px); }
  #how .ph-how { height: calc((100svh - 60px) * .56); }
}
@media (min-width: 961px) and (min-height: 600px) and (max-height: 840px) {
  .hero .ph-hero { height: calc((100svh - 60px) * .58); }
  #how .ph-how { height: calc((100svh - 60px) * .50); }
}

/* 키워드 칸 — 선 없이 */
.flow, .flow li { border: 0; }
#how .kw li, #contact .kw li { border-top: 0; padding-top: 6px; }

/* Professionals — Asset 과 같은 높이 · 오른쪽을 잘라 서명하는 손이 가운데 */
.ph-pro { background-size: auto 140%; background-position: 24% 2%; }

/* 중심축 — 처음 판의 결: 아주 가는 선 + 꼬리 달린 빛 · 양쪽 칸 가운데의 점에서 돈다 */
.loop-base { stroke: rgb(255 130 0 / .3); stroke-width: 1; }
.loop-light { stroke: var(--orange-on-dark); stroke-linecap: round; filter: none; animation: loop-run2 4.8s linear infinite; }
.loop-light.t1 { stroke-width: 2.4; stroke-dasharray: 18 982; --o: 0; filter: drop-shadow(0 0 5px rgb(255 130 0 / .95)); }
.loop-light.t2 { stroke-width: 1.6; stroke-dasharray: 60 940; --o: 42; opacity: .5; }
.loop-light.t3 { stroke-width: 1.2; stroke-dasharray: 130 870; --o: 112; opacity: .2; }
@keyframes loop-run2 { from { stroke-dashoffset: var(--o); } to { stroke-dashoffset: calc(var(--o) - 1000); } }
.loop .node { fill: var(--orange-on-dark); filter: drop-shadow(0 0 6px rgb(255 130 0 / .9)); animation: node-pulse 2.4s ease-in-out infinite; }
@keyframes node-pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }

/* Product — 상자 안 글자를 위로 올려 고리가 지나갈 자리를 비운다 */
.prod-box { justify-content: flex-start; padding-top: 14%; }
@media (prefers-reduced-motion: reduce) { .loop-light { animation: none; opacity: 0; } .loop .node { animation: none; } }
.ph-hero .layer .lift { fill: rgb(255 255 255 / .3); } .ph-hero .layer .dim { fill: rgb(12 13 16 / .76); }
/* 꼬리 셋을 고정값 키프레임으로(변수 키프레임은 보간되지 않아 빛이 튄다) */
.loop-light.t1 { animation-name: run-t1; } .loop-light.t2 { animation-name: run-t2; } .loop-light.t3 { animation-name: run-t3; }
@keyframes run-t1 { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -1000; } }
@keyframes run-t2 { from { stroke-dashoffset: 42; } to { stroke-dashoffset: -958; } }
@keyframes run-t3 { from { stroke-dashoffset: 112; } to { stroke-dashoffset: -888; } }
.loop-base { stroke: rgb(255 130 0 / .55); stroke-width: 1.25; }

/* ── 261005_2149 판 (혜린씨 · 지우/클로이 검수 전 마지막 수정) ─────────────────────── */
/* 메뉴 대문자 */
.nav .menu a { text-transform: uppercase; letter-spacing: .04em; }

/* Hero — 사진과 표시 층을 함께 당긴다(배율 1.6 · 찜한 건물 중심) · 그 건물은 원래 밝기 그대로 */
.ph-hero { background-image: none; overflow: hidden; }
.ph-hero .zoom { position: absolute; inset: 0; background: var(--img-hero) center 55% / cover no-repeat; transform: scale(1.6); transform-origin: 65.8% 50%; }
.ph-hero .layer .lift { display: none; }
.pick-tag { --tag-x: 81.8%; --tag-y: 18%; }

/* 키워드 단계 — 자산 분석 크기(20px)로 · 설명은 검정 · 대문글 아래 설명글과 같은 크기 */
.kw b, .flow b, .ax figcaption b { font-size: clamp(17px, 1.45vw, 20px); }
.flow em, .kw em, .ax figcaption > span { color: var(--ink); font-size: clamp(15px, 1.2vw, 17.5px); line-height: 1.55; }
@media (min-width: 961px) and (min-height: 600px) {
  .flow em, .kw em, .ax figcaption > span { font-size: clamp(15px, min(1.15vw, 2vh), 17px); }
}
/* 생애주기 줄 간격 좁게 */
.flow { margin-top: clamp(10px, 1.8vh, 18px); }
.flow li { padding: clamp(4px, .8vh, 7px) 0; }

/* Contact — 조금 당겨서 가까이 */
.ph-collab { background-size: 135%; background-position: 50% 62%; }

/* ── 261005_2157 판 — Contact = 그로스라운지 실제 사무실 사진(혜린씨 제공) · 창가 쪽을 살린다 ── */
.ph-collab { background-size: cover; background-position: 6% 50%; }

/* ── 261005_2200 판 — 사진 톤 맞추기 · Hero 찜한 건물 원래 밝기 · 라운지 사진 수직 바로잡기 ──
   측정(평균 밝기 0~255, 원본 → 보정): Asset 97→124 · Professionals 51→약 118 · How 114→124 · System 자산 106→126 · System 전문가 87→약 122 · Contact 186→133 · Hero 131(원본 유지) */

/* Hero — v13 의 「사진 위 선은 채우지 않음」 규칙이 마스크의 구멍까지 비워 찜한 건물도 어둡게 눌렸다. 구멍은 반드시 채운다 */
.ph-hero .layer mask path { fill: #000; stroke: none; }
.ph-hero .layer mask rect { fill: #fff; }

/* 사진 톤 보정 · 라운지 수직 보정은 지우님께 요청(혜린씨 2208) — 화면 보정은 걷어 내고 원본 그대로 둔다 */
.ph-collab { background-size: cover; background-position: 6% 50%; }

/* ── 261005_2223 판 — 지우님 톤 보정본 6장(드라이브 GR_261005_2213_*_j). 5장은 화면 사용 영역 그대로 잘린 보정본이라 가운데 맞춤 ── */
.ph-asset, .ph-pro, .ph-how, .ph-sys-a, .ph-sys-p { background-size: cover; background-position: center; filter: none; }
.ph-collab { background-size: cover; background-position: 6% 50%; }

/* ── 261005_2232 판 — Hero = 지우님 이미지(윤곽선 · VALUE ADD 포함) 한 장 · 아키의 확대 · 막 · 표시 층은 걷어 냄 ──
   이미지 1916×821(2.33:1). 찜한 건물 + 표시 = 가로 53~85% · 세로 13~75% */
section.hero .ph-hero { background-image: var(--img-hero) !important; background-size: cover; background-position: 60% 50%; filter: none; }
@media (max-width: 960px) { section.hero .ph-hero { background-position: 95% 50%; } }

/* ── 261005_2249 판 — Contact = 지우님 보정본(1450×1085) · 창밖 도시 → 창 → 창가 업무공간 · 추가 필터 없음 ──
   원본 구간(가로): 창 · 강남 빌딩숲 0~34% · 가운데 기둥 35~48% · 창가 업무공간 28~53% · TV 65~83% */
.ph-collab { background-size: cover; background-position: 0% 50%; filter: none; }
@media (max-width: 960px) { .ph-collab { background-size: auto 160%; background-position: 0% 22%; } }

/* ── 261005_2337 판 — Professionals = R11(평면도를 사이에 둔 두 사람 · 혜린씨 확정). 세로 원본 3701×5335 라 가운데 맞춤 ── */
.ph-pro { background-size: cover; background-position: 50% 50%; filter: none; }
@media (min-width: 961px) { .ph-pro { background-size: auto 132%; background-position: 55% 42%; } }   /* VIZZE 로고(위 노트북 · 아래 도면 묶음)를 화면 밖으로 — 계산기 옆 작은 표기는 남음 */
@media (max-width: 960px) { .ph-pro { background-size: cover; background-position: 55% 45%; } }

/* ── 261005_2347 판 — How We Work = K27(계약 서류 · 펜 · 태블릿과 두 사람의 손 · 혜린씨 확정). 위 Professionals(도면 · 판단) → 여기(계약 · 실행) ── */
.ph-how { background-size: cover; background-position: 50% 50%; filter: none; }

/* ── 261005_2349 판 — How We Work(K27) 앵글을 사람 쪽으로: 조금 당기고 위로 올려 테이블 면적을 줄인다(혜린씨) ── */
@media (min-width: 961px) { .ph-how { background-size: 122% auto; background-position: 40% 12%; } }
@media (max-width: 960px) { .ph-how { background-size: cover; background-position: 40% 20%; } }

/* ── 261006_0045 판 — 지우님 · 클로이님 · 혜린씨 마지막 기획(지우 0038) ──────────────────────
   8구역 Hero → Asset → Professionals → Expertise → Ecosystem → Product → Founder's Note → Contact · 대문글 아래 설명 전부 삭제 · 키워드 영어 */

/* Hero — 사진이 화면 전체 · 짚은 건물은 왼쪽 · 오른쪽에 네 기준 */
.hero-full { position: relative; padding: 0 !important; overflow: hidden; background: var(--night); }
.hero-bg { position: absolute; inset: 0; background: var(--img-hero) 30% 50% / cover no-repeat; }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(12 13 16 / 0) 40%, rgb(12 13 16 / .55) 62%, rgb(12 13 16 / .82) 100%); }
.hero-over { position: relative; z-index: 1; display: flex; align-items: center; justify-content: flex-end; min-height: calc(100svh - 60px); }
.lens { width: min(440px, 40%); }
.lens-k { list-style: none; display: grid; gap: clamp(2px, .8vh, 8px); }
.lens-k button { all: unset; cursor: pointer; display: block; font-weight: 800; font-size: clamp(34px, min(4.2vw, 7vh), 62px); line-height: 1.1; letter-spacing: .01em; color: var(--paper); transition: color .18s; }
.lens-k button:hover, .lens-k button:focus-visible, .lens-k button.on { color: var(--orange-on-dark); }
.lens-k button:focus-visible { outline: 2px solid var(--orange-on-dark); outline-offset: 4px; }
.lens-d { margin-top: clamp(18px, 3vh, 30px); padding-top: 14px; border-top: 2px solid var(--orange-on-dark); max-width: 22em; font-size: clamp(15px, 1.25vw, 18px); font-weight: 600; color: rgb(255 255 255 / .9); min-height: 3.2em; }

/* 대문글 아래 설명이 없어져 생긴 간격 정리 */
.pair-text h2 + .flow, .pair-text h2 + .kw { margin-top: clamp(14px, 2.6vh, 28px); }
.gs-head h2 { margin-bottom: 0; }

/* Ecosystem · Product — 고리 위 흐름 이름만 */
.lane span { display: none; }
.lane.up { padding-bottom: 12px; } .lane.down { padding-top: 12px; }

/* Product — 상자 안 작은 라벨 삭제 뒤 이름만 가운데 */
.prod-box { justify-content: center; padding-top: 0; }

/* Founder's Note — 글 폭을 좁혀 대표 인사말처럼 · 주황은 한 곳 */
.founder > .wrap { display: flex; justify-content: center; }
.note { width: min(640px, 100%); }
.note-q { font-size: clamp(24px, min(2.5vw, 4vh), 34px); font-weight: 800; letter-spacing: -.035em; line-height: 1.32; margin: 0 0 clamp(16px, 3vh, 30px); }
.note-q span { display: block; }
.note p:not(.eyebrow):not(.sign) { font-size: clamp(15px, min(1.1vw, 2vh), 16.5px); line-height: 1.85; margin: 0 0 clamp(8px, 1.6vh, 14px); color: var(--ink); }
.note .hl { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 1.5px; text-underline-offset: 5px; }
.note .sign { margin-top: clamp(16px, 3vh, 30px); font-size: 15px; color: var(--mute); }
.note .sign b { color: var(--ink); font-weight: 800; margin-right: 2px; }
@media (min-width: 961px) and (min-height: 600px) { .founder > .wrap { align-items: center; } }

@media (max-width: 960px) {
  .hero-bg { background-position: 28% 50%; }
  .hero-bg::after { background: linear-gradient(0deg, rgb(12 13 16 / .88) 0%, rgb(12 13 16 / .5) 42%, rgb(12 13 16 / 0) 72%); }
  .hero-over { min-height: 78svh; align-items: flex-end; justify-content: flex-start; padding-bottom: 28px; }
  .lens { width: 100%; }
  .lens-k { grid-template-columns: 1fr 1fr; gap: 6px 16px; }
  .lens-k button { font-size: clamp(24px, 7vw, 34px); }
}
@media (max-width: 480px) { .kw.k2 { grid-template-columns: 1fr; } .kw.k2 li { margin-bottom: 4px; } }
/* Hero 네 기준을 오른쪽으로 — 공통 「section.page > .wrap = 세로 쌓기」 규칙을 이 칸만 가로로 되돌린다 */
section.hero-full > .wrap.hero-over { flex-direction: row; align-items: center; justify-content: flex-end; }
@media (max-width: 960px) { section.hero-full > .wrap.hero-over { align-items: flex-end; justify-content: flex-start; } }
.lens-k button { -webkit-text-fill-color: currentColor; }   /* all: unset 이 글자 채움색을 부모의 흰색으로 고정해 주황 hover 가 안 보이던 것 */
.prod-box { justify-content: flex-start; padding-top: 18%; }   /* 이름을 위로 — 고리가 상자 가운데를 지나간다 */

/* ── 261006_0133 판 — Hero 지우님 반전본 · 네 기준은 VALUE ADD 오른쪽에서 표시 폭만큼 띄워서 · 대문글 7개 · 키워드 크게 · 설명 간격 넓게 ── */
section.hero-full .hero-bg { background-position: 100% 50%; }
.hero-bg::after { background: linear-gradient(90deg, rgb(12 13 16 / 0) 52%, rgb(12 13 16 / .42) 66%, rgb(12 13 16 / .72) 100%); }
@media (min-width: 961px) {
  section.hero-full > .wrap.hero-over { max-width: none; padding: 0; position: static; }
  .lens { position: absolute; left: var(--lens-left, 70%); top: 50%; transform: translateY(-50%); width: auto; max-width: calc(100% - var(--lens-left, 70%) - 24px); z-index: 1; }
  .lens-k button { font-size: clamp(30px, min(3.3vw, 6vh), 52px); }
  .lens-d { max-width: 20em; }
}

/* 키워드 — 크게 되돌리고 설명과 간격을 넓힌다 */
.kw b, .flow b, .ax figcaption b { font-size: clamp(19px, 1.75vw, 25px); }
.flow li { grid-template-columns: minmax(9.5em, auto) minmax(0, 1fr); gap: 0 clamp(20px, 2.2vw, 36px); padding: clamp(5px, .9vh, 8px) 0; }
.flow li b { font-size: clamp(19px, 1.75vw, 25px); }
.flow { --kw: 1; }
#pro .flow li { grid-template-columns: minmax(7em, auto) minmax(0, 1fr); }
.kw em { margin-top: 6px; }
@media (max-width: 480px) { .flow li { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

/* ═══ 261006_0338 — 혜린씨 03:3x 마무리 수정 (이 블록이 위 규칙들보다 이긴다) ═══ */
/* Hero — 선명한 VALUE ADD 표시. 위치 · 크기는 script.js 가 이미지 좌표(982~1139 × 170~207)로 맞춘다 */
.va-tag { position: absolute; z-index: 1; display: grid; place-items: center; background: #FB6801; color: #190900; font-family: var(--mono); font-weight: 700; letter-spacing: .14em; line-height: 1; white-space: nowrap; pointer-events: none; }
@media (max-width: 960px) { .va-tag { display: none; } }


/* Expertise — 카테고리 · 대문글을 이미지 바로 아래 왼쪽에 붙이고, 키워드 위 주황 선은 지운다(옛 #how 규칙은 id 가 바뀌어 안 먹고 있었음) */
#expertise .hero-text.how-text { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 clamp(32px, 5vw, 72px); align-items: start; margin-top: clamp(18px, 2.6vh, 28px); }
#expertise .hero-main { align-self: start; }
#expertise .kw.k2 { margin-top: 0; align-self: start; }
#expertise .kw li { border-top: 0; padding-top: 6px; }
@media (max-width: 960px) { #expertise .hero-text.how-text { grid-template-columns: 1fr; gap: 14px; } }


/* ═══ 261006_0408 — 사진 칸 네 구역 같은 틀(혜린씨 「레이아웃은 전부 통일」) ═══ */
.ph-founder { background-image: var(--img-founder); background-size: cover; background-position: 50% 50%; }
@media (min-width: 961px) {
  .pt-body > .flow, .pt-body > .kw { margin-top: 0; }
  /* 사진 크기 · 자리는 네 구역 모두 .wrap.pair 의 같은 칸(Professional 과 같은 오른쪽 칸 · 높이 = 구역 높이) */
  #pro .wrap.pair > .photo, #founder .wrap.pair > .photo { aspect-ratio: auto; height: 100%; min-height: 320px; align-self: stretch; }
  #founder > .wrap { flex-direction: row; }
}
@media (max-width: 960px) { .pt-body { margin-top: clamp(14px, 2.6vh, 28px); } }
/* Founder's Note 글 — 글자는 그대로, 문단 사이를 조금 더 */
#founder .note { width: auto; margin-top: 0; }   /* .note 의 옛 위 여백 16px 이 카테고리를 사진 윗선 아래로 밀었음 */
#founder .note .pt-body p:not(.sign) { margin: 0 0 clamp(14px, 2.4vh, 22px); }
#founder .note .sign { margin-top: clamp(18px, 3vh, 30px); }
@media (min-width: 961px) and (max-height: 800px) { #founder .note .pt-body p:not(.sign) { font-size: 14.5px; line-height: 1.72; margin-bottom: 12px; } #founder .note .sign { margin-top: 14px; } }   /* 1024×768 에서 글이 사진보다 38px 길어 사진이 늘어나던 것 */

/* ═══ 261006_0429 ═══ */
/* Hero — 어둡게 덮는 그라데이션을 VALUE ADD 표시 오른쪽 끝(--lens-left)부터 시작해 표시를 밝게 둔다 */
@media (min-width: 961px) {
  section.hero-full .hero-bg::after { background: linear-gradient(90deg, rgb(12 13 16 / 0) 0, rgb(12 13 16 / 0) calc(var(--lens-left, 60%) - 8px), rgb(12 13 16 / .46) calc(var(--lens-left, 60%) + 170px), rgb(12 13 16 / .7) 100%); }
}
.va-tag { display: none; }

/* 사진 칸 네 구역 — 머리는 사진 윗선, 키워드는 칸 높이의 34% 지점에서 시작(네 구역 같은 높이 · 「글자가 중간 정도에」) */
@media (min-width: 961px) {
  #asset .wrap.pair > .pair-text, #pro .wrap.pair > .pair-text, #founder .wrap.pair > .pair-text, #contact .wrap.pair > .pair-text { align-self: stretch; display: grid; grid-template-rows: minmax(auto, 34%) auto minmax(0, 1fr); justify-content: stretch; }
  .pt-head { grid-row: 1; align-self: start; padding-bottom: clamp(24px, 3.4vh, 36px); }   /* 글이 긴 Founder 가 낮은 화면에서 34% 를 못 지킬 때도 남는 최소 간격 */
  .pt-body { grid-row: 2; margin-top: 0; }
}

/* Expertise — 사진은 구역 높이의 절반 이하 · 아래 네 칸: 대문글 왼쪽 위, 키워드 오른쪽 아래 */
@media (min-width: 961px) {
  #expertise .ph-how { flex: 0 0 auto; height: calc((100svh - 60px) * .38); min-height: 0; }   /* .46 은 대각선 배치에서 한 화면을 56px 넘었음 */
  #expertise .hero-text.how-text { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "head ." ". kw"; align-items: start; }
  #expertise .hero-main { grid-area: head; }
  #expertise .kw.k2 { grid-area: kw; }
}
@media (min-width: 961px) and (max-height: 820px) { #expertise .ph-how { height: calc((100svh - 60px) * .34); } }   /* 1280×800 · 1024×768 에서 16 · 6px 넘던 것 */

/* ═══ 261006_0440 — Expertise 사진: 여성의 손과 계약서가 칸 가운데(혜린씨 「여자 손이 짤렸어」) ═══ */
/* K27 실측(1200×800): 손 가로 20~47% · 세로 32~50%, 계약서 세로 37~61%. 122% 확대는 그대로(23:49 확정 앵글), 세로 기준만 12% → 42% */
@media (min-width: 961px) { #expertise .ph-how { background-size: 122% auto; background-position: 0% 42%; } }

/* ═══ 261006_0452 — 구역마다 내용의 세로 끝선 통일(혜린씨 「페이지의 세로 크기 통일」) ═══ */
/* 일곱 구역 중 Expertise 만 아래 끝이 1440 에서 9px · 1024 에서 21px 짧았다 → 사진이 남는 높이를 채워 아래 끝을 다른 구역과 같게. 사진은 구역의 절반 이하 */
@media (min-width: 961px) {
  #expertise .ph-how { flex: 1 1 0; height: auto; min-height: 0; max-height: 50%; }
  #expertise .hero-text.how-text { flex: 0 0 auto; }
}

/* ═══ 261006_0521 — 메뉴 오른쪽 KO | EN 전환(entr.kr 과 같은 방식) ═══ */
.menu .lang { display: inline-flex; align-items: center; gap: 8px; margin-left: 6px; font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.menu .lang a { opacity: .55; } .menu .lang a[aria-current="true"] { opacity: 1; }
.menu .lang i { font-style: normal; opacity: .35; font-weight: 400; }

/* ═══ 중심축 빛 — A 데이터 흐름 · 흰빛 · 잔상 (혜린씨 261006 「주황 빼고 · 실제 빛이나 데이터가 흐르는 것처럼 · 흰빛 · 살짝 노란 빛 · 꼬리 잔상 · 얇고 세련되게」) ═══ */
/* 주황 빛 조각 세 개(.loop-light)는 숨긴다 · 바탕 = 옅은 회색 실선 + 천천히 흐르는 점선 · 빛 두 개(7초 · 11초 한 바퀴, 빨라졌다 느려짐) · 꼬리 여섯 겹 */
.loop .loop-light { display: none; }
.loop .loop-base { stroke: rgb(140 144 152 / .22); stroke-width: 1; }
.loop .x-dots { fill: none; stroke: rgb(150 154 162 / .55); stroke-width: 1; stroke-dasharray: 1 6; animation: loop-dots 10s linear infinite; }
@keyframes loop-dots { to { stroke-dashoffset: -70; } }
.loop .c1, .loop .c2 { fill: none; stroke-linecap: round; stroke: #FFF4CF; }
.loop .q0 { stroke: #FFFDF4; stroke-width: 1.6; filter: drop-shadow(0 0 2px rgb(255 238 170 / .95)) drop-shadow(0 0 7px rgb(255 214 120 / .75)) drop-shadow(0 0 1px rgb(200 150 40 / .6)); }
.loop .q1 { stroke-width: 1.4; opacity: .8; filter: drop-shadow(0 0 4px rgb(255 220 140 / .6)); }
.loop .q2 { stroke-width: 1.2; opacity: .55; stroke: #FFE9A8; }
.loop .q3 { stroke-width: 1; opacity: .36; stroke: #F5D98A; }
.loop .q4 { stroke-width: .9; opacity: .2; stroke: #E9CC7A; }
.loop .q5 { stroke-width: .8; opacity: .1; stroke: #E0C26E; }
.loop .c1.q0 { stroke-dasharray: 4 996; animation: c1k0 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k0 { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -1000; } }
.loop .c1.q1 { stroke-dasharray: 22 978; animation: c1k1 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k1 { from { stroke-dashoffset: 18; } to { stroke-dashoffset: -982; } }
.loop .c1.q2 { stroke-dasharray: 55 945; animation: c1k2 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k2 { from { stroke-dashoffset: 51; } to { stroke-dashoffset: -949; } }
.loop .c1.q3 { stroke-dasharray: 100 900; animation: c1k3 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k3 { from { stroke-dashoffset: 96; } to { stroke-dashoffset: -904; } }
.loop .c1.q4 { stroke-dasharray: 160 840; animation: c1k4 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k4 { from { stroke-dashoffset: 156; } to { stroke-dashoffset: -844; } }
.loop .c1.q5 { stroke-dasharray: 240 760; animation: c1k5 7s cubic-bezier(.55,.05,.35,.95) 0s infinite; }
@keyframes c1k5 { from { stroke-dashoffset: 236; } to { stroke-dashoffset: -764; } }
.loop .c2.q0 { stroke-dasharray: 3 997; animation: c2k0 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k0 { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -1000; } }
.loop .c2.q1 { stroke-dasharray: 18 982; animation: c2k1 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k1 { from { stroke-dashoffset: 15; } to { stroke-dashoffset: -985; } }
.loop .c2.q2 { stroke-dasharray: 45 955; animation: c2k2 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k2 { from { stroke-dashoffset: 42; } to { stroke-dashoffset: -958; } }
.loop .c2.q3 { stroke-dasharray: 85 915; animation: c2k3 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k3 { from { stroke-dashoffset: 82; } to { stroke-dashoffset: -918; } }
.loop .c2.q4 { stroke-dasharray: 135 865; animation: c2k4 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k4 { from { stroke-dashoffset: 132; } to { stroke-dashoffset: -868; } }
.loop .c2.q5 { stroke-dasharray: 200 800; animation: c2k5 11s cubic-bezier(.6,0,.3,1) -4.2s infinite; }
@keyframes c2k5 { from { stroke-dashoffset: 197; } to { stroke-dashoffset: -803; } }
.loop .node { fill: #FFF8E1; filter: drop-shadow(0 0 3px rgb(255 226 150 / .95)) drop-shadow(0 0 8px rgb(255 205 110 / .6)); animation: loop-node 3.6s ease-in-out infinite; }
@keyframes loop-node { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .loop .x-dots, .loop .c1, .loop .c2, .loop .node { animation: none; } .loop .c1, .loop .c2 { display: none; } }