/* 주식회사 리본넥서스 IR · readdy 「Boutique Law Firm」 틀 적용판 · 먹색/상아/세이지 · 선 1px · 모서리 0 */
:root {
  --ink: #171717; --ink-2: #2A2C2A; --mute: #60615E; --paper: #FFFFFF; --paper-2: #F7F7F5;
  --ivory: #F2F1ED; --ivory-85: rgba(242,241,237,.85); --ivory-70: rgba(242,241,237,.7); --ivory-60: rgba(242,241,237,.6); --ivory-45: rgba(242,241,237,.45); --ivory-10: rgba(242,241,237,.1); --ivory-20: rgba(242,241,237,.2);
  --accent: #96A296; --accent-deep: #5C675C; --line: #E5E7EB; --line-dark: var(--ivory-10);
  --font: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", "Inter Tight", Inter, system-ui, sans-serif;
  --fs-h1: clamp(44px, 5.8vw, 84px); --fs-h2: clamp(32px, 3.1vw, 46px); --fs-h2-big: clamp(36px, 4.2vw, 60px); --fs-h3: 24px; --fs-lead: clamp(20px, 2.1vw, 30px);
  --fs-body: 18px; --lh-body: 1.6; --fs-small: 15px; --lh-small: 1.6; --fs-label: 14px; --fs-micro: 13px;
  --fw-head: 350; --fw-h3: 400; --fw-body: 400;
  --pad-x: 40px; --sec-y: 96px; --head-max: 768px; --copy-max: 672px; --gap: 40px; --col-pad: 32px;
  --nav-h: 80px; --ease-out: cubic-bezier(.22,1,.36,1); --ease-std: cubic-bezier(.4,0,.2,1);
}
@media (max-width: 768px) { :root { --pad-x: 16px; --sec-y: 64px; --nav-h: 64px; --fs-body: 17px; --col-pad: 20px; } }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; font-family: var(--font); font-size: var(--fs-body); line-height: var(--lh-body); font-weight: var(--fw-body); color: var(--ink-2); background: var(--paper); word-break: keep-all; overflow-wrap: anywhere; letter-spacing: -0.005em; font-variant-numeric: tabular-nums; }
img, video { max-width: 100%; display: block; }
img { height: auto; }
a { color: inherit; text-decoration: none; transition: color .2s var(--ease-std), border-color .2s var(--ease-std), background-color .2s var(--ease-std); }
h1, h2, h3, h4 { margin: 0; font-weight: var(--fw-head); letter-spacing: -0.02em; line-height: 1.1; }
p, figure { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 1px solid currentColor; outline-offset: 3px; }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
.wrap { padding: 0 var(--pad-x); }
.arrow::after { content: " →"; }

/* ---------- 색 구간 ---------- */
.sec { padding: var(--sec-y) var(--pad-x); }
.sec.dark { background: var(--ink); color: var(--ivory); }
.sec.light { background: var(--paper); color: var(--ink); }
.light .muted, .light .small { color: var(--mute); }
.dark .muted, .dark .small { color: var(--ivory-70); }
.sec + .sec.light { border-top: 1px solid var(--line); }
.sec.dark + .sec.dark { border-top: 1px solid var(--line-dark); }

/* 머리줄: 라벨 + 번호 */
.shead { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line); padding: 20px 0; font-size: var(--fs-label); margin-bottom: 56px; }
.dark .shead { border-color: var(--line-dark); }
.shead .no { color: var(--accent-deep); font-size: var(--fs-micro); letter-spacing: .08em; }
.dark .shead .no { color: var(--accent); }
.shead .lab { font-weight: 400; }
@media (max-width: 768px) { .shead { margin-bottom: 40px; } }

/* 제목 블록 */
.h2 { font-size: var(--fs-h2); line-height: 1.08; max-width: var(--head-max); }
.h2 .sub { display: block; color: var(--mute); }
.dark .h2 .sub { color: var(--ivory-45); }
.lead { font-size: var(--fs-lead); line-height: 1.25; font-weight: var(--fw-head); max-width: var(--copy-max); }
.copy { font-size: var(--fs-body); line-height: var(--lh-body); max-width: var(--copy-max); }
.copy p + p { margin-top: 20px; }
.light .copy { color: var(--ink-2); } .light .copy p + p { color: var(--mute); }
.dark .copy { color: var(--ivory-85); } .dark .copy p + p { color: var(--ivory-70); }
.small { font-size: var(--fs-small); line-height: var(--lh-small); }
.label { font-size: var(--fs-label); }
.micro { font-size: var(--fs-micro); letter-spacing: .06em; }
.links { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 28px; font-size: var(--fs-label); }
.links a { display: inline-flex; align-items: center; min-height: 32px; }
.links a:hover { color: var(--accent-deep); } .dark .links a:hover { color: var(--accent); }
.intro2 { display: grid; grid-template-columns: 5fr 7fr; gap: var(--gap); align-items: start; }
.intro2 .right { max-width: var(--copy-max); justify-self: end; width: 100%; }
@media (max-width: 960px) { .intro2 { grid-template-columns: 1fr; gap: 28px; } .intro2 .right { justify-self: start; } }

/* 버튼 */
.btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 24px; border-radius: 9999px; border: 0; background: var(--accent); color: var(--ink); font-size: var(--fs-label); font-weight: 500; }
.btn:hover { background: var(--accent-deep); color: var(--ivory); }
.btn.dark { background: var(--ink); color: var(--ivory); }
.btn.dark:hover { background: var(--ink-2); }
.btn.ghost { background: transparent; border: 1px solid var(--line-dark); color: var(--ivory); }
.light .btn.ghost { border-color: var(--ink); color: var(--ink); }
.btn.ghost:hover { background: var(--accent); color: var(--ink); border-color: var(--accent); }
.tlink { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font-size: var(--fs-label); }
.tlink:hover { color: var(--accent-deep); } .dark .tlink:hover { color: var(--accent); }
.tag { display: inline-block; font-size: var(--fs-micro); letter-spacing: .04em; padding: 4px 10px; border: 1px solid var(--line); }
.dark .tag { border-color: var(--ivory-20); color: var(--ivory-85); }
.tag.on { border-color: var(--accent-deep); color: var(--accent-deep); }
.dark .tag.on { border-color: var(--accent); color: var(--accent); }

/* 펼침 */
.fold { border-top: 1px solid var(--line); }
.dark .fold { border-color: var(--line-dark); }
.fold > summary { display: flex; justify-content: space-between; align-items: center; min-height: 56px; padding: 12px 0; font-size: var(--fs-label); }
.fold > summary::after { content: "+"; font-size: 22px; font-weight: 300; }
.fold[open] > summary::after { content: "−"; }
.fold > .body { padding: 4px 0 24px; font-size: var(--fs-small); line-height: var(--lh-small); max-width: 820px; }
.fold > .body > * + * { margin-top: 14px; }
.light .fold > .body { color: var(--mute); } .dark .fold > .body { color: var(--ivory-70); }
.fold .body b { font-weight: 500; } .light .fold .body b { color: var(--ink); } .dark .fold .body b { color: var(--ivory); }
.steps li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 8px 0; }
.steps li::before { content: counter(s, decimal-leading-zero); counter-increment: s; font-size: var(--fs-micro); color: var(--accent-deep); padding-top: 3px; }
.steps { counter-reset: s; } .dark .steps li::before { color: var(--accent); }

/* ---------- 상단 메뉴 ---------- */
.nav { position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--nav-h); background: rgba(23,23,23,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: var(--ivory); }
.nav .wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { font-size: 13px; letter-spacing: .3em; font-weight: 500; color: var(--ivory); text-transform: uppercase; }
.brand small { letter-spacing: .3em; margin-left: 10px; color: var(--ivory-60); }
.nav-list { display: flex; gap: 28px; align-items: center; }
.nav-list a { font-size: 13px; letter-spacing: .06em; color: var(--ivory-85); padding: 8px 0; }
.nav-list a:hover, .nav-list a.on { color: var(--accent); }
.nav-toggle { display: none; background: none; border: 1px solid var(--ivory-20); border-radius: 9999px; width: 44px; height: 44px; padding: 0; position: relative; margin-left: auto; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { content: ""; position: absolute; left: 13px; width: 16px; height: 1px; background: var(--ivory); transition: transform .25s var(--ease-out); }
.nav-toggle span { top: 21px; } .nav-toggle span::before { left: 0; top: -5px; } .nav-toggle span::after { left: 0; top: 5px; }
.nav.open .nav-toggle span { background: transparent; }
.nav.open .nav-toggle span::before { transform: translateY(5px) rotate(45deg); }
.nav.open .nav-toggle span::after { transform: translateY(-5px) rotate(-45deg); }
@media (max-width: 1060px) {
  .nav .wrap { justify-content: flex-start; } .nav nav { display: contents; } .nav-toggle { display: block; }
  .nav-list { position: fixed; top: var(--nav-h); left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--ink); border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); padding: 8px 0 16px; display: none; }
  .nav.open .nav-list { display: flex; }
  .nav-list a { padding: 14px var(--pad-x); font-size: 17px; letter-spacing: 0; border-bottom: 1px solid var(--line-dark); }
}

/* ---------- 첫 화면 ---------- */
.hero { position: relative; background: var(--ink); color: var(--ivory); padding: calc(var(--nav-h) + clamp(56px, 8vw, 110px)) var(--pad-x) 40px; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; opacity: .32; filter: grayscale(1) contrast(1.05); }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23,23,23,.5) 0%, rgba(23,23,23,.2) 45%, rgba(23,23,23,.95) 100%); }
.hero > :not(.hero-bg) { position: relative; z-index: 1; }
.hero h1 { font-size: var(--fs-h1); line-height: 1.02; max-width: var(--head-max); color: var(--ivory); }
.hero .lead { margin-top: 28px; color: var(--ivory-60); }
.hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 36px; }
.hero-meta { margin-top: 28px; font-size: var(--fs-small); color: var(--ivory-60); max-width: var(--copy-max); }
/* 하단 전면 카드(운영 화면 슬라이드) */
.update { margin-top: clamp(56px, 7vw, 96px); border: 1px solid var(--ivory-20); display: grid; grid-template-columns: 1.1fr 1fr; min-height: 440px; position: relative; background: var(--ink); }
.update .shots { position: relative; overflow: hidden; background: #0f0f0f; }
.update .shots .slide { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; padding: 24px 24px 52px; }
.update .shots .slide.on { display: flex; }
.update .shots img { max-width: 100%; max-height: 100%; object-fit: contain; }
.update .txt { padding: 40px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--ivory-20); }
.update .txt .micro { color: var(--accent); }
.update .txt h3 { margin-top: 14px; font-size: 26px; line-height: 1.3; font-weight: 400; color: var(--ivory); }
.update .txt p { margin-top: 12px; font-size: var(--fs-small); color: var(--ivory-70); max-width: 460px; }
.update .txt .tlink { margin-top: 20px; color: var(--ivory); }
.update .ctrl { position: absolute; top: 20px; right: 20px; display: flex; gap: 8px; }
.update .ctrl button { width: 36px; height: 36px; border-radius: 9999px; border: 1px solid var(--ivory-45); background: rgba(23,23,23,.6); color: var(--ivory); font-size: 15px; }
.update .ctrl button:hover { background: var(--accent); color: var(--ink); border-color: var(--accent); }
.update .idx { position: absolute; left: 24px; bottom: 16px; display: flex; align-items: center; gap: 12px; font-size: var(--fs-micro); color: var(--ivory-60); }
.update .idx i { display: block; width: 48px; height: 1px; background: var(--ivory-45); font-style: normal; }
.update .zoom { background: transparent; border: 0; }
@media (max-width: 960px) { .update { grid-template-columns: 1fr; min-height: 0; } .update .shots { aspect-ratio: 16 / 10; } .update .txt { border-left: 0; border-top: 1px solid var(--ivory-20); padding: 28px 20px 48px; } .update .ctrl { top: 12px; right: 12px; } }

/* ---------- 확대 버튼 ---------- */
.zoom { display: block; width: 100%; padding: 0; border: 1px solid var(--line); background: var(--paper-2); cursor: zoom-in; position: relative; overflow: hidden; }
.dark .zoom { border-color: var(--ivory-20); background: #0f0f0f; }
.zoom img { width: 100%; height: auto; display: block; }
.zoom.frame { aspect-ratio: 16 / 10; }
.zoom.frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.zoom.cover { aspect-ratio: 3 / 4; }
.zoom.cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.55) contrast(1.02); transition: filter .5s var(--ease-std); }
.zoom.cover:hover img { filter: saturate(.9); }
dialog.lightbox { border: 0; padding: 0; background: transparent; max-width: min(96vw, 1400px); max-height: 96vh; }
dialog.lightbox::backdrop { background: rgba(23,23,23,.92); }
dialog.lightbox figure { background: var(--paper); display: flex; flex-direction: column; max-height: 96vh; }
dialog.lightbox img { max-width: 96vw; max-height: calc(96vh - 60px); width: auto; height: auto; object-fit: contain; margin: 0 auto; background: var(--paper-2); }
dialog.lightbox figcaption { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px 10px 18px; font-size: var(--fs-small); color: var(--mute); }
dialog.lightbox button { border: 1px solid var(--ink); background: var(--ink); color: var(--ivory); border-radius: 9999px; padding: 0 18px; height: 40px; font-size: var(--fs-label); }

/* ---------- 회사 개요 ---------- */
.ov-grid { display: grid; grid-template-columns: 5fr 7fr; gap: var(--gap); align-items: start; }
.ov-grid .copy { max-width: var(--copy-max); }
.facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 56px; border-top: 1px solid var(--line); }
.facts > div { padding: 24px var(--col-pad) 24px 0; border-right: 1px solid var(--line); padding-left: 0; }
.facts > div:not(:first-child) { padding-left: var(--col-pad); }
.facts > div:nth-child(3n) { border-right: 0; }
.facts dt { font-size: var(--fs-micro); letter-spacing: .06em; color: var(--mute); }
.facts dd { margin: 8px 0 0; font-size: var(--fs-small); color: var(--ink); line-height: 1.55; }
.ov-photo { margin-top: 56px; display: grid; grid-template-columns: 7fr 5fr; gap: var(--gap); align-items: end; }
.ov-photo .zoom { aspect-ratio: 16 / 9; }
.ov-photo .zoom img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.55); }
.ov-photo figcaption { font-size: var(--fs-small); color: var(--mute); }
.ov-photo figcaption b { display: block; font-weight: 400; color: var(--ink); font-size: var(--fs-h3); line-height: 1.3; margin-bottom: 10px; }
.ov-folds { margin-top: 40px; }
@media (max-width: 960px) { .ov-grid, .ov-photo { grid-template-columns: 1fr; gap: 24px; } .facts { grid-template-columns: 1fr; } .facts > div { border-right: 0; border-bottom: 1px solid var(--line); padding: 16px 0 !important; } .facts > div:last-child { border-bottom: 0; } }

/* ---------- 사업부: 번호 목록 + 패널 ---------- */
.exp { display: grid; grid-template-columns: 7fr 5fr; gap: var(--gap); align-items: start; margin-top: 48px; }
.rows { border-top: 1px solid var(--line-dark); }
.rows button { display: grid; grid-template-columns: 48px 1fr 32px; align-items: center; width: 100%; text-align: left; padding: 24px 0; border: 0; border-bottom: 1px solid var(--line-dark); background: transparent; color: var(--ivory-60); font-size: 28px; font-weight: var(--fw-head); letter-spacing: -0.01em; line-height: 1.2; }
.rows button .no { font-size: var(--fs-micro); color: var(--accent-deep); letter-spacing: .06em; }
.rows button .ar { font-size: 18px; opacity: 0; transition: opacity .2s; text-align: right; }
.rows button:hover { color: var(--ivory); }
.rows button.on { color: var(--ivory); } .rows button.on .no { color: var(--accent); } .rows button.on .ar { opacity: 1; }
.panel { border: 1px solid var(--ivory-20); display: none; }
.panel.on { display: block; }
.panel .pimg { position: relative; aspect-ratio: 16 / 10; background: #0f0f0f; overflow: hidden; border-bottom: 1px solid var(--ivory-20); }
.panel .pimg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.panel .pimg .micro { position: absolute; left: 20px; top: 16px; color: var(--ivory-70); }
.panel .pbody { padding: 28px; }
.panel .micro { color: var(--accent); }
.panel h3 { margin-top: 10px; font-size: var(--fs-h3); line-height: 1.3; font-weight: 400; color: var(--ivory); }
.panel p { margin-top: 10px; font-size: var(--fs-small); color: var(--ivory-70); }
.panel ul { margin-top: 18px; border-top: 1px solid var(--line-dark); }
.panel li { padding: 10px 0; border-bottom: 1px solid var(--line-dark); font-size: var(--fs-small); color: var(--ivory-85); }
.panel .tlink { margin-top: 18px; color: var(--ivory); }
.detail { display: none; margin-top: 56px; border-top: 1px solid var(--line-dark); padding-top: 40px; }
.detail.on { display: grid; grid-template-columns: 7fr 5fr; gap: var(--gap); align-items: start; }
.detail h3 { font-size: var(--fs-h2); line-height: 1.1; }
.detail h3 .sub { display: block; color: var(--ivory-45); }
.detail .state { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: var(--fs-small); color: var(--ivory-70); }
.kv { margin-top: 28px; border-top: 1px solid var(--line-dark); }
.kv > div { display: grid; grid-template-columns: 140px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-dark); font-size: var(--fs-small); color: var(--ivory-85); }
.kv > div > span:first-child { color: var(--ivory-60); }
.kv b { font-weight: 500; color: var(--ivory); }
.nums { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 28px; border-top: 1px solid var(--line-dark); }
.nums > div { padding: 20px var(--col-pad) 20px 0; border-right: 1px solid var(--line-dark); }
.nums > div:not(:first-child) { padding-left: var(--col-pad); }
.nums > div:last-child { border-right: 0; }
.nums b { display: block; font-size: 34px; font-weight: var(--fw-head); letter-spacing: -0.02em; line-height: 1; color: var(--ivory); }
.nums span { display: block; margin-top: 8px; font-size: var(--fs-small); color: var(--ivory-70); }
@media (max-width: 960px) { .exp { grid-template-columns: 1fr; gap: 24px; } .rows button { font-size: 22px; padding: 18px 0; grid-template-columns: 36px 1fr 24px; } .detail.on { grid-template-columns: 1fr; } .kv > div { grid-template-columns: 1fr; gap: 4px; } .nums { grid-template-columns: 1fr; } .nums > div { border-right: 0; border-bottom: 1px solid var(--line-dark); padding: 16px 0 !important; } .nums > div:last-child { border-bottom: 0; } }

/* ---------- 재생기 ---------- */
.player { border: 1px solid var(--line-dark); background: var(--ink); display: flex; flex-direction: column; scroll-margin-top: calc(var(--nav-h) + 16px); }
.light .player { border-color: var(--line); background: var(--paper); }
.player video { width: 100%; aspect-ratio: 16 / 9; height: auto; background: #0f0f0f; }
.player .print-poster { display: none; }
.player-meta { padding: 20px 24px 22px; }
.player-meta .label { color: var(--accent); font-size: var(--fs-micro); letter-spacing: .06em; }
.player-meta .t { margin-top: 8px; display: flex; justify-content: space-between; gap: 12px; align-items: baseline; font-size: var(--fs-h3); font-weight: 400; color: var(--ivory); }
.light .player-meta .t { color: var(--ink); }
.player-meta .t span { font-size: var(--fs-small); color: var(--ivory-60); white-space: nowrap; }
.light .player-meta .t span { color: var(--mute); }
.player-meta .d { margin-top: 6px; font-size: var(--fs-small); color: var(--ivory-70); }
.light .player-meta .d { color: var(--mute); }
details.chap { margin-top: 16px; border-top: 1px solid var(--line-dark); }
.light details.chap { border-color: var(--line); }
details.chap summary { display: flex; justify-content: space-between; align-items: center; min-height: 48px; font-size: var(--fs-label); color: var(--ivory-85); }
.light details.chap summary { color: var(--ink); }
details.chap summary::after { content: "장면 펼치기"; font-size: var(--fs-micro); color: var(--ivory-60); }
details.chap[open] summary::after { content: "접기"; }
.chapters { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line-dark); }
.chapters button { border: 0; border-bottom: 1px solid var(--line-dark); background: transparent; color: var(--ivory-85); padding: 12px 0; font-size: var(--fs-small); text-align: left; display: flex; gap: 12px; min-height: 48px; align-items: baseline; }
.chapters button:nth-child(odd) { padding-right: 16px; border-right: 1px solid var(--line-dark); } .chapters button:nth-child(even) { padding-left: 16px; }
.chapters button b { font-weight: 400; color: var(--accent); min-width: 40px; }
.chapters button:hover { color: var(--ivory); }
.light .chapters, .light .chapters button { border-color: var(--line); color: var(--ink-2); }
.player-actions { display: flex; flex-wrap: wrap; gap: 0 24px; margin-top: 12px; }
.player-actions a, .player-actions button { color: var(--ivory-85); background: none; border: 0; padding: 0; min-height: 44px; display: inline-flex; align-items: center; font-size: var(--fs-label); }
.player-actions a:hover, .player-actions button:hover { color: var(--accent); }
.light .player-actions a, .light .player-actions button { color: var(--ink); }
@media (max-width: 480px) { .chapters { grid-template-columns: 1fr; } .chapters button:nth-child(odd) { border-right: 0; padding-right: 0; } .chapters button:nth-child(even) { padding-left: 0; } }

/* ---------- 지표: 4단 선 칸 ---------- */
.cols4 { display: grid; grid-template-columns: repeat(4, 1fr); }
.cols4 > div { border-left: 1px solid var(--line); padding: var(--col-pad); min-height: 220px; display: flex; flex-direction: column; }
.dark .cols4 > div { border-color: var(--line-dark); }
.cols4 .no { font-size: var(--fs-micro); letter-spacing: .06em; color: var(--accent-deep); }
.dark .cols4 .no { color: var(--accent); }
.cols4 .big { margin-top: 28px; font-size: clamp(40px, 3.6vw, 56px); font-weight: var(--fw-head); letter-spacing: -0.03em; line-height: 1; color: var(--ink); white-space: nowrap; }
.dark .cols4 .big { color: var(--ivory); }
.cols4 .big small { font-size: .42em; margin-left: 2px; }
.cols4 h3 { margin-top: 28px; font-size: var(--fs-h3); line-height: 1.3; font-weight: var(--fw-h3); color: var(--ink); }
.dark .cols4 h3 { color: var(--ivory); }
.cols4 .big + h3 { margin-top: 14px; font-size: 17px; }
.cols4 .desc { margin-top: 12px; font-size: var(--fs-small); color: var(--mute); }
.dark .cols4 .desc { color: var(--ivory-70); }
.cols4 .fold { margin-top: auto; padding-top: 16px; }
.cols4 + .cols4 { border-top: 1px solid var(--line); } .dark .cols4 + .cols4 { border-color: var(--line-dark); }
.cols4 .fold > .body { max-width: none; }
@media (max-width: 960px) { .cols4 { grid-template-columns: 1fr 1fr; } .cols4 > div:nth-child(n+3) { border-top: 1px solid var(--line); } .dark .cols4 > div:nth-child(n+3) { border-color: var(--line-dark); } }
@media (max-width: 600px) { .cols4 { grid-template-columns: 1fr; } .cols4 > div { border-left: 0; border-top: 1px solid var(--line); padding: 24px 0; min-height: 0; } .dark .cols4 > div { border-color: var(--line-dark); } .cols4 .big { margin-top: 16px; font-size: 40px; } }

/* ---------- 사례: 전면 사진 + 3카드 ---------- */
.cases-hero { position: relative; min-height: 100svh; background: var(--ink); color: var(--ivory); display: flex; align-items: flex-end; overflow: hidden; }
.cases-hero img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); opacity: .55; }
.cases-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(23,23,23,.1) 0%, rgba(23,23,23,.75) 70%, rgba(23,23,23,.95) 100%); }
.cases-hero .in { position: relative; z-index: 1; width: 100%; padding: 160px var(--pad-x) 0; }
.cases-hero .micro { color: var(--accent); }
.cases-hero h2 { margin-top: 12px; font-size: var(--fs-h2-big); line-height: 1.05; max-width: 900px; color: var(--ivory); }
.cases-hero .small { margin-top: 20px; color: var(--ivory-70); max-width: var(--copy-max); }
.cards3 { margin-top: 56px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ivory-20); }
.cards3 a { display: block; padding: 28px var(--col-pad) 36px 0; border-right: 1px solid var(--ivory-20); color: var(--ivory); }
.cards3 a:not(:first-child) { padding-left: var(--col-pad); }
.cards3 a:last-child { border-right: 0; }
.cards3 .micro { color: var(--ivory-60); }
.cards3 h3 { margin-top: 12px; font-size: 20px; line-height: 1.35; font-weight: 400; }
.cards3 .tag { margin-top: 14px; }
.cards3 a:hover h3 { color: var(--accent); }
@media (max-width: 960px) { .cases-hero .in { padding-top: 120px; } .cards3 { grid-template-columns: 1fr; } .cards3 a { border-right: 0; border-bottom: 1px solid var(--ivory-20); padding: 20px 0 !important; } .cards3 a:last-child { border-bottom: 0; } }
/* 사례 상세 행 */
.case-rows { border-top: 1px solid var(--line-dark); }
.case { display: grid; grid-template-columns: 140px 1fr 5fr; gap: var(--gap); padding: 40px 0; border-bottom: 1px solid var(--line-dark); scroll-margin-top: calc(var(--nav-h) + 16px); }
.case .meta { font-size: var(--fs-micro); letter-spacing: .06em; color: var(--accent); }
.case .meta span { display: block; margin-top: 8px; color: var(--ivory-60); letter-spacing: 0; font-size: var(--fs-small); }
.case .who { font-size: 20px; line-height: 1.35; font-weight: 400; color: var(--ivory); }
.case .who small { display: block; margin-top: 6px; font-size: var(--fs-small); color: var(--ivory-60); }
.case .rt { font-size: var(--fs-h3); line-height: 1.35; font-weight: 400; color: var(--ivory); }
.case .rb { margin-top: 12px; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--ivory-85); max-width: var(--copy-max); }
.case .ev { margin-top: 20px; display: grid; grid-template-columns: repeat(4, auto); gap: 16px 32px; justify-content: start; }
.case .ev b { display: block; font-size: 26px; font-weight: var(--fw-head); color: var(--ivory); line-height: 1; }
.case .ev span { display: block; margin-top: 6px; font-size: var(--fs-micro); color: var(--ivory-60); }
.case .evtbl { margin-top: 20px; border-top: 1px solid var(--line-dark); font-size: var(--fs-small); max-width: 640px; }
.case .evtbl div { display: grid; grid-template-columns: 1fr 1fr 60px; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line-dark); color: var(--ivory-70); }
.case .evtbl div i { font-style: normal; color: var(--accent); }
.case .fold { margin-top: 20px; }
.case.small .rt { font-size: 20px; }
@media (max-width: 960px) { .case { grid-template-columns: 1fr; gap: 14px; padding: 28px 0; } .case .ev { grid-template-columns: 1fr 1fr; } }
.grow { display: grid; grid-template-columns: 1fr auto auto; gap: 24px 48px; align-items: end; padding: 32px 0; border-bottom: 1px solid var(--line-dark); }
.grow .t { font-size: 20px; font-weight: 400; color: var(--ivory); }
.grow .t small { display: block; margin-top: 8px; font-size: var(--fs-small); color: var(--ivory-60); max-width: var(--copy-max); }
.grow .num b { display: block; font-size: clamp(34px, 3.4vw, 52px); font-weight: var(--fw-head); color: var(--ivory); letter-spacing: -0.03em; line-height: 1; }
.grow .num span { display: block; margin-top: 8px; font-size: var(--fs-micro); color: var(--ivory-60); }
.grow .num.to b { color: var(--accent); }
@media (max-width: 860px) { .grow { grid-template-columns: 1fr 1fr; } .grow .t { grid-column: 1 / -1; } }

/* ---------- 활동: 세로 사진 격자 ---------- */
.people { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.people figure { display: flex; flex-direction: column; }
.people figcaption { padding-top: 14px; display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; }
.people figcaption b { font-weight: 400; font-size: 16px; color: var(--ink); grid-column: 1; }
.people figcaption span { display: block; font-size: var(--fs-micro); color: var(--mute); grid-column: 1; }
.people figcaption .x { grid-column: 2; grid-row: 1; color: var(--mute); font-size: var(--fs-micro); }
@media (max-width: 1060px) { .people { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--pad-x)); padding: 0 var(--pad-x) 8px; } .people figure { flex: 0 0 72%; max-width: 321px; scroll-snap-align: start; } }
.ph-hint { display: none; margin-top: 10px; font-size: var(--fs-small); color: var(--mute); }
@media (max-width: 1060px) { .ph-hint { display: block; } }

/* ---------- 기술: 흐름 선 도식 ---------- */
.flow { margin-top: 56px; border-top: 1px solid var(--line-dark); padding-top: 40px; }
.flow .legend { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: var(--fs-micro); color: var(--ivory-60); }
.flow .legend span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid var(--ivory); margin-right: 8px; vertical-align: -1px; }
.flow .legend span.ext::before { border-style: dashed; }
.flow .legend span.chk::before { background: var(--accent); border-color: var(--accent); }
.nodes { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; margin-top: 28px; position: relative; }
.nodes::before { content: ""; position: absolute; left: 10%; right: 10%; top: 27px; height: 1px; background: var(--ivory-20); }
.node { position: relative; padding: 0 24px 0 0; }
.node .ic { position: relative; z-index: 1; width: 56px; height: 56px; border-radius: 50%; border: 1px solid var(--ivory); background: var(--ink); color: var(--ivory); display: flex; align-items: center; justify-content: center; }
.node .ic svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.node.check .ic { background: var(--accent); border-color: var(--accent); color: var(--ink); }
.node .no { position: absolute; left: 40px; top: -6px; z-index: 2; font-size: var(--fs-micro); color: var(--accent); background: var(--ink); padding: 0 4px; }
.node h4 { margin-top: 18px; font-size: 20px; font-weight: 400; color: var(--ivory); }
.node .when { font-size: var(--fs-micro); color: var(--accent); margin-top: 4px; letter-spacing: .04em; }
.node .act { margin-top: 10px; font-size: var(--fs-small); color: var(--ivory-70); }
.node .marks { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.node .mark { font-size: var(--fs-micro); padding: 3px 8px; border: 1px solid var(--ivory-45); color: var(--ivory-85); }
.node .mark.ext { border-style: dashed; }
.node .mark.chk { background: var(--accent); border-color: var(--accent); color: var(--ink); }
@media (max-width: 1060px) { .nodes { grid-template-columns: 1fr 1fr; gap: 32px 24px; } .nodes::before { display: none; } }
@media (max-width: 600px) { .nodes { grid-template-columns: 1fr; gap: 28px; } .node { padding: 0 0 0 72px; } .node .ic { position: absolute; left: 0; top: 0; } .node .no { left: 40px; } .node h4 { margin-top: 0; } .node:not(:last-child)::after { content: ""; position: absolute; left: 27px; top: 60px; bottom: -28px; width: 1px; background: var(--ivory-20); } }
.doc { border: 1px solid var(--ivory-20); padding: 18px 20px; font-size: var(--fs-small); color: var(--ivory-70); }
.doc .dh { display: flex; justify-content: space-between; gap: 12px; font-size: var(--fs-micro); color: var(--ivory-60); letter-spacing: .04em; margin-bottom: 12px; }
.doc table { width: 100%; border-collapse: collapse; }
.doc th, .doc td { text-align: left; vertical-align: top; padding: 8px 8px 8px 0; border-bottom: 1px solid var(--line-dark); font-size: var(--fs-small); line-height: 1.5; color: var(--ivory-85); }
.doc thead th { color: var(--ivory-60); font-weight: 400; font-size: var(--fs-micro); }
.doc td.ok { color: var(--accent); white-space: nowrap; }
.doc td:first-child { white-space: nowrap; color: var(--ivory-60); }
.doc .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.doc .chips span { border: 1px solid var(--ivory-20); padding: 4px 10px; font-size: var(--fs-micro); color: var(--ivory-85); }
.doc pre { margin: 10px 0 0; font: 14px/1.6 ui-monospace, Consolas, monospace; color: var(--ivory-85); white-space: pre; overflow-x: auto; border-top: 1px solid var(--line-dark); padding-top: 10px; }
.doc ul li { padding: 6px 0; border-bottom: 1px solid var(--line-dark); color: var(--ivory-85); }
.doc ul li b { font-weight: 500; color: var(--ivory); }
.doc details.raw summary { margin-top: 10px; font-size: var(--fs-micro); color: var(--accent); min-height: 32px; display: inline-flex; align-items: center; }
@media (max-width: 600px) { .doc table, .doc tbody, .doc tr, .doc td { display: block; width: 100%; } .doc thead { display: none; } .doc tr { padding: 8px 0; border-bottom: 1px solid var(--line-dark); } .doc td { border: 0; padding: 2px 0; white-space: normal; } .doc td[data-th]::before { content: attr(data-th) " · "; color: var(--ivory-60); } .doc td.ok::before { content: "결과 · "; color: var(--ivory-60); } }
.devlog { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 14px; }
.devlog b { display: block; font-size: 26px; font-weight: var(--fw-head); color: var(--ivory); }
.devlog span { display: block; margin-top: 6px; font-size: var(--fs-micro); color: var(--ivory-60); }
@media (max-width: 800px) { .devlog { grid-template-columns: 1fr 1fr; } }

/* ---------- 연혁: 행 목록 ---------- */
.ins { display: grid; grid-template-columns: 4fr 8fr; gap: 48px; align-items: start; }
.tabs { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: var(--fs-label); margin-bottom: 16px; }
.tabs button { background: none; border: 0; color: var(--ivory-60); padding: 6px 0; min-height: 36px; }
.tabs button.on, .tabs button:hover { color: var(--ivory); }
.rlist { border-top: 1px solid var(--line-dark); }
.rlist li { display: grid; grid-template-columns: 1fr 32px; gap: 16px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line-dark); }
.rlist li[hidden] { display: none; }
.rlist .t { font-size: 17px; color: var(--ivory); line-height: 1.4; }
.rlist li.key .t { color: var(--ivory); } .rlist li:not(.key) .t { color: var(--ivory-85); }
.rlist .m { margin-top: 6px; font-size: var(--fs-micro); color: var(--ivory-60); letter-spacing: .02em; }
.rlist .m i { font-style: normal; color: var(--accent); }
.rlist .ar { width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--ivory-45); display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--ivory); }
.light .rlist { border-color: var(--line); } .light .rlist li { border-color: var(--line); } .light .rlist .t { color: var(--ink); } .light .rlist .m { color: var(--mute); } .light .rlist .ar { border-color: var(--ink); color: var(--ink); }
.light .rlist a.t:hover { color: var(--accent-deep); }
@media (max-width: 960px) { .ins { grid-template-columns: 1fr; gap: 28px; } }

/* ---------- 협력 4칸 ---------- */
.cols4 .name { margin-top: 28px; font-size: 22px; font-weight: 400; line-height: 1.3; color: var(--ink); }

/* ---------- 영상관 ---------- */
.vcards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-top: 16px; }
.vcard { display: flex; flex-direction: column; text-align: left; padding: 0; border: 1px solid var(--ivory-20); background: transparent; color: var(--ivory); cursor: pointer; }
.vcard .th { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.vcard .th img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.6); transition: filter .5s var(--ease-std); }
.vcard:hover .th img, .vcard.on .th img { filter: saturate(1); }
.vcard .th .tri { position: absolute; left: 12px; bottom: 12px; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--ivory); display: flex; align-items: center; justify-content: center; }
.vcard .th .tri::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent var(--ivory); margin-left: 2px; }
.vcard .th .len { position: absolute; right: 12px; bottom: 14px; font-size: var(--fs-micro); color: var(--ivory); }
.vcard .tx { padding: 14px 16px 16px; }
.vcard .tt, .vcard .tp { display: block; }
.vcard .tt { font-size: 15px; color: var(--ivory); line-height: 1.4; }
.vcard .tp { margin-top: 4px; font-size: var(--fs-micro); color: var(--ivory-60); }
.vcard.on { border-color: var(--accent); }
.vcard.on .tt::before { content: "선택됨 · "; color: var(--accent); }
.vcard.playing .tt::before { content: "재생 중 · "; color: var(--accent); }
@media (max-width: 1060px) { .vcards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .vcards { grid-template-columns: 1fr; gap: 10px; } .vcard { display: grid; grid-template-columns: 112px 1fr; align-items: center; } .vcard .th { aspect-ratio: 16 / 10; } .vcard .th .tri { display: none; } .vcard .th .len { right: 6px; bottom: 6px; } .vcard .tx { padding: 8px 12px; } .vcard .tp { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; } }

/* ---------- 자료실 ---------- */
.lib-row { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line); }
.lib-row .t { font-size: 17px; color: var(--ink); }
.lib-row .m { margin-top: 6px; font-size: var(--fs-micro); color: var(--mute); }
.lib-row .act { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 640px) { .lib-row { grid-template-columns: 1fr; gap: 12px; } }

/* ---------- 연락처 ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.cinfo { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); max-width: 560px; }
.cinfo dt { font-size: var(--fs-micro); letter-spacing: .06em; color: var(--mute); }
.cinfo dd { margin: 8px 0 0; font-size: var(--fs-small); color: var(--ink); line-height: 1.55; }
.cinfo dd a:hover { color: var(--accent-deep); }
.cmail { border-top: 1px solid var(--line); padding-top: 24px; }
.cmail .micro { color: var(--mute); }
.cmail a.big { display: block; margin-top: 12px; font-size: clamp(24px, 2.6vw, 34px); font-weight: var(--fw-head); letter-spacing: -0.02em; color: var(--ink); line-height: 1.2; word-break: break-all; }
.cmail a.big:hover { color: var(--accent-deep); }
.cmail p { margin-top: 14px; font-size: var(--fs-small); color: var(--mute); max-width: 480px; }
.cmail .btn { margin-top: 24px; }
@media (max-width: 960px) { .contact-grid { grid-template-columns: 1fr; gap: 36px; } }

/* ---------- 바닥 ---------- */
.footer { background: var(--ink); color: var(--ivory-70); padding: 64px var(--pad-x) 32px; font-size: var(--fs-small); }
.footer .cols { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 40px; }
.footer .brand { display: block; margin-bottom: 16px; }
.footer h5 { margin: 0 0 14px; font-size: var(--fs-micro); letter-spacing: .12em; color: var(--ivory-60); font-weight: 400; }
.footer li { padding: 4px 0; } .footer li a:hover { color: var(--accent); }
.footer .bottom { margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--line-dark); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; font-size: var(--fs-micro); color: var(--ivory-60); }
@media (max-width: 860px) { .footer .cols { grid-template-columns: 1fr 1fr; gap: 28px; } }
@media (max-width: 560px) { .footer .cols { grid-template-columns: 1fr; } }

/* ---------- 등장 · 인쇄 ---------- */
@media (prefers-reduced-motion: no-preference) {
  html.js-anim .reveal { transform: translateY(20px); transition: transform .45s var(--ease-out); }
  html.js-anim .reveal.in { transform: none; }
}
.print-url { display: none; }
@media print {
  @page { margin: 14mm; }
  body { font-size: 12pt; color: #000; background: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .nav { position: static; height: auto; background: var(--ink); } .nav-toggle, .nav-list { display: none !important; }
  html.js-anim .reveal { transform: none !important; }
  .hero { padding-top: 24px; } .hero-bg, .hero::before, .cases-hero img.bg, .cases-hero::before { display: none; }
  .cases-hero { min-height: 0; }
  .sec { padding-block: 28px; }
  video, details.chap, .player-actions, .update .ctrl, .vcards, .hero-cta, .tabs, .ph-hint, .lib-row .act { display: none !important; }
  .fold > .body, .rlist li[hidden] { display: block !important; }
  .detail, .panel { display: grid !important; margin-top: 24px; }
  .update .shots .slide { display: flex; position: static; }
  .player .print-poster { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
  .player .print-url { display: block !important; font-size: 10pt; color: #333; margin-top: 6px; word-break: break-all; }
  .case, .player, figure, .node, .cols4 > div, .rlist li, .doc { break-inside: avoid; page-break-inside: avoid; }
  .shead, h2, h3 { break-after: avoid; page-break-after: avoid; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9.5pt; color: #333; }
  .cmail a::after, .lib-row a::after { content: none; }
  dialog { display: none !important; }
}

/* 첫 화면 회사 소개 영상 (11/9 대표 요청: 제안서 슬라이드 자리) */
.hero-video { position: relative; margin-top: 56px; border: 1px solid rgba(242,241,237,.18); background: #0d0d0d; }
.hero-video video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #000; object-fit: cover; }
.hero-video .hv-bar { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 24px 28px; border-top: 1px solid rgba(242,241,237,.14); }
.hero-video .micro { color: #96A296; font-size: 15px; margin: 0 0 6px; }
.hero-video h3 { margin: 0; color: #F2F1ED; font-size: 22px; line-height: 1.45; font-weight: 400; }
.hero-video .hv-ch { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; max-width: 560px; }
.hero-video .hv-ch button { min-height: 44px; padding: 0 16px; border: 1px solid rgba(242,241,237,.28); border-radius: 999px; background: transparent; color: #F2F1ED; font: inherit; font-size: 15px; cursor: pointer; }
.hero-video .hv-ch button:hover { border-color: #96A296; color: #96A296; }
@media (max-width: 860px) {
  .hero-video { margin-top: 36px; }
  .hero-video .hv-bar { grid-template-columns: 1fr; padding: 18px 16px; }
  .hero-video h3 { font-size: 18px; }
  .hero-video .hv-ch { justify-content: flex-start; }
}
@media print { .hero-video video { display: none; } }

/* ===== 8판 (2026-11-10) · IR 티저 · 숫자 대신 규모 · 경영진 · 기사 배포 · 미팅 요청 ===== */
.nav-list a.nav-cta { border: 1px solid var(--accent); border-radius: 9999px; padding: 8px 16px; color: var(--ivory); }
.nav-list a.nav-cta:hover { background: var(--accent); color: var(--ink); }
@media (max-width: 1060px) { .nav-list a.nav-cta { border: 0; border-radius: 0; padding: 14px var(--pad-x); color: var(--accent); } }
.hero-kicker { font-size: var(--fs-label); letter-spacing: .14em; color: var(--accent); margin-bottom: 22px; }
.hero h1 { font-size: clamp(46px, 6.6vw, 104px); line-height: 1.0; max-width: 1100px; }
.hero .lead { max-width: 760px; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.65; color: var(--ivory-70); }
.scale { margin-top: 72px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ivory-20); }
.scale li { padding: 28px 28px 8px 0; border-right: 1px solid var(--ivory-10); }
.scale li + li { padding-left: 28px; }
.scale li:last-child { border-right: 0; }
.scale b { display: block; font-size: clamp(32px, 3.4vw, 54px); font-weight: var(--fw-head); letter-spacing: -0.03em; line-height: 1; color: var(--ivory); white-space: nowrap; }
.scale span { display: block; margin-top: 14px; font-size: var(--fs-small); color: var(--ivory-60); max-width: 240px; }
@media (max-width: 860px) { .scale { grid-template-columns: 1fr 1fr; } .scale li { padding: 22px 16px 18px 0 !important; border-right: 0; border-bottom: 1px solid var(--ivory-10); } .scale li:nth-child(even) { padding-left: 16px !important; border-left: 1px solid var(--ivory-10); } }
.h2.big2 { font-size: var(--fs-h2-big); line-height: 1.06; }
.pull { margin-top: 28px !important; padding-left: 20px; border-left: 2px solid var(--accent); font-size: clamp(20px, 1.8vw, 24px); line-height: 1.5; color: var(--ink); }
.facts dd { color: var(--ink); }
.note { margin-top: 40px; font-size: var(--fs-small); color: var(--mute); }
.dark .note, .cases-hero .note { color: var(--ivory-60); }

/* 경영진 */
.team { margin-top: 64px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line-dark); }
.team li { padding: 36px var(--col-pad) 36px 0; border-right: 1px solid var(--line-dark); display: flex; flex-direction: column; }
.team li + li { padding-left: var(--col-pad); }
.team li:last-child { border-right: 0; }
.team .mono { width: 88px; height: 88px; border-radius: 50%; border: 1px solid var(--ivory-20); display: grid; place-items: center; font-size: 34px; font-weight: 300; color: var(--ivory); background: radial-gradient(circle at 30% 25%, rgba(150,162,150,.28), rgba(150,162,150,0) 70%); }
.team .role { margin-top: 28px; font-size: var(--fs-micro); letter-spacing: .08em; color: var(--accent); }
.team h3 { margin-top: 10px; font-size: clamp(28px, 2.4vw, 36px); font-weight: var(--fw-head); color: var(--ivory); }
.team .area { margin-top: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--line-dark); font-size: 16px; color: var(--ivory-85); }
.team .desc { margin-top: 16px; font-size: var(--fs-small); color: var(--ivory-60); }
@media (max-width: 1060px) { .team { grid-template-columns: 1fr 1fr; } .team li { padding: 28px 20px 28px 0 !important; border-right: 0; border-bottom: 1px solid var(--line-dark); } .team li:nth-child(even) { padding-left: 20px !important; border-left: 1px solid var(--line-dark); } }
@media (max-width: 600px) { .team { grid-template-columns: 1fr; } .team li { padding: 28px 0 !important; border-left: 0 !important; display: grid; grid-template-columns: 72px 1fr; column-gap: 18px; } .team .mono { width: 72px; height: 72px; font-size: 28px; grid-row: 1 / span 2; } .team .role { margin-top: 8px; } .team h3 { margin-top: 4px; } .team .area, .team .desc { grid-column: 1 / -1; } }

/* 사업 패널 보강 */
.panel p .why { display: block; margin-bottom: 4px; font-weight: 400; font-size: var(--fs-micro); letter-spacing: .08em; color: var(--accent); }
.panel p.meet { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--ivory-20); color: var(--ivory); font-size: var(--fs-small); }
.press-vis { display: flex; align-items: center; justify-content: center; background: radial-gradient(ellipse at 50% 40%, #232623, #0f0f0f 70%) !important; }
.press-vis ol { display: grid; gap: 10px; width: min(78%, 380px); }
.press-vis li { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border: 1px solid var(--ivory-20); color: var(--ivory); font-size: 17px; background: rgba(23,23,23,.6); }
.press-vis li span { font-size: var(--fs-micro); color: var(--accent); letter-spacing: .06em; }
.press-vis li:last-child { border-color: var(--accent); }

/* 기술 6칸 */
.grid6 { margin-top: 56px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.grid6 li { padding: 32px var(--col-pad) 36px 0; border-bottom: 1px solid var(--line); }
.grid6 li:not(:nth-child(3n+1)) { padding-left: var(--col-pad); border-left: 1px solid var(--line); }
.grid6 .no { font-size: var(--fs-micro); letter-spacing: .08em; color: var(--accent-deep); }
.grid6 h3 { margin-top: 16px; font-size: var(--fs-h3); font-weight: var(--fw-h3); color: var(--ink); line-height: 1.3; }
.grid6 p { margin-top: 12px; font-size: var(--fs-small); color: var(--mute); }
@media (max-width: 960px) { .grid6 { grid-template-columns: 1fr 1fr; } .grid6 li { padding: 24px 16px 28px 0 !important; border-left: 0 !important; } .grid6 li:nth-child(even) { padding-left: 16px !important; border-left: 1px solid var(--line) !important; } }
@media (max-width: 600px) { .grid6 { grid-template-columns: 1fr; } .grid6 li, .grid6 li:nth-child(even) { padding: 24px 0 !important; border-left: 0 !important; } }
.light-flow { border-top-color: var(--line); }
.flow-t { font-size: var(--fs-h3); font-weight: 400; color: var(--ink); }
.vsteps { margin-top: 28px; display: grid; grid-template-columns: repeat(5, 1fr); }
.vsteps li { position: relative; padding: 20px 20px 0 0; border-top: 2px solid var(--ink); }
.vsteps li + li { padding-left: 20px; }
.vsteps li::before { content: ""; position: absolute; top: -6px; left: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
.vsteps li + li::before { left: 20px; }
.vsteps .when { display: block; font-size: var(--fs-micro); letter-spacing: .08em; color: var(--accent-deep); }
.vsteps b { display: block; margin-top: 8px; font-weight: 400; font-size: 19px; color: var(--ink); }
.vsteps li > span:last-child { display: block; margin-top: 8px; font-size: var(--fs-small); color: var(--mute); }
@media (max-width: 960px) { .vsteps { grid-template-columns: 1fr; } .vsteps li, .vsteps li + li { padding: 0 0 22px 28px; border-top: 0; border-left: 2px solid var(--ink); } .vsteps li::before, .vsteps li + li::before { left: -6px; top: 2px; } }

/* 고객·협력 묶음 */
#partners .in { padding-bottom: 96px; }
.groups { margin-top: 56px; display: grid; grid-template-columns: 1.3fr 1fr 1.3fr; border-top: 1px solid var(--ivory-20); }
.groups > div { padding: 28px var(--col-pad) 8px 0; }
.groups > div + div { padding-left: var(--col-pad); border-left: 1px solid var(--ivory-20); }
.groups .gh { font-size: var(--fs-micro); letter-spacing: .1em; color: var(--accent); }
.groups li { padding: 16px 0; border-bottom: 1px solid var(--ivory-10); }
.groups li b { display: block; font-weight: 400; font-size: 19px; color: var(--ivory); }
.groups li span { display: block; margin-top: 6px; font-size: var(--fs-small); color: var(--ivory-70); }
.groups li i { display: inline-block; margin-top: 10px; font-style: normal; font-size: var(--fs-micro); padding: 3px 10px; border: 1px solid var(--accent); border-radius: 9999px; color: var(--accent); }
@media (max-width: 960px) { .groups { grid-template-columns: 1fr; } .groups > div, .groups > div + div { padding: 24px 0 0 !important; border-left: 0; } .groups > div + div { margin-top: 16px; border-top: 1px solid var(--ivory-20); } }

/* 미팅 요청 */
.meeting { background: var(--ivory); color: var(--ink); }
.meeting .shead { border-color: rgba(23,23,23,.15); }
.meet-grid { display: grid; grid-template-columns: 7fr 5fr; gap: 72px; align-items: start; }
.reveal-list { margin-top: 40px; border-top: 1px solid rgba(23,23,23,.15); }
.reveal-list li { display: grid; grid-template-columns: 56px 1fr; column-gap: 8px; padding: 20px 0; border-bottom: 1px solid rgba(23,23,23,.15); }
.reveal-list span { grid-row: 1 / span 2; font-size: var(--fs-micro); color: var(--accent-deep); letter-spacing: .06em; padding-top: 6px; }
.reveal-list b { font-weight: 400; font-size: 22px; color: var(--ink); }
.reveal-list em { font-style: normal; margin-top: 4px; font-size: var(--fs-small); color: var(--mute); }
.meeting .cmail { background: var(--ink); color: var(--ivory); border: 0; padding: 40px; position: sticky; top: calc(var(--nav-h) + 24px); }
.meeting .cmail .micro { color: var(--accent); }
.meeting .cmail .mq { margin-top: 18px; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.3; color: var(--ivory); font-weight: var(--fw-head); max-width: none; }
.meeting .cmail p { color: var(--ivory-70); }
.meeting .cmail a.big { margin-top: 28px; color: var(--ivory); font-size: clamp(22px, 2vw, 28px); }
.meeting .cmail a.big:hover { color: var(--accent); }
.meeting .cmail .btn.dark { background: var(--accent); color: var(--ink); }
.meeting .cmail .btn.dark:hover { background: var(--ivory); }
.meeting .cmail .addr { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--ivory-10); font-size: var(--fs-micro); color: var(--ivory-60); }
@media (max-width: 960px) { .meet-grid { grid-template-columns: 1fr; gap: 40px; } .meeting .cmail { position: static; padding: 28px 20px; } }

.facts > div:nth-child(3n+1) { padding-left: 0; }
#partners img.bg { opacity: .22; }
#partners::before { background: linear-gradient(180deg, rgba(23,23,23,.3) 0%, rgba(23,23,23,.85) 45%, rgba(23,23,23,.97) 100%); }
/* 그룹 구조 */
.group { margin-top: 56px; }
.group .gh { font-size: var(--fs-micro); letter-spacing: .1em; color: var(--accent-deep); }
.group ol { margin-top: 16px; display: grid; grid-template-columns: 1.2fr 1fr 1fr; border: 1px solid var(--line); }
.group li { padding: 24px var(--col-pad); display: flex; flex-direction: column; gap: 6px; }
.group li + li { border-left: 1px solid var(--line); }
.group li.core { background: var(--ink); }
.group li span { font-size: var(--fs-micro); letter-spacing: .08em; color: var(--accent-deep); }
.group li.core span { color: var(--accent); }
.group li b { font-weight: 400; font-size: 21px; color: var(--ink); }
.group li.core b { color: var(--ivory); }
.group li em { font-style: normal; font-size: var(--fs-small); color: var(--mute); }
.group li.core em { color: var(--ivory-70); }
@media (max-width: 860px) { .group ol { grid-template-columns: 1fr; } .group li + li { border-left: 0; border-top: 1px solid var(--line); } .group li { padding: 20px; } }