@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css");

:root {
  --paper: #f2f4f1;
  --surface: #fafbf9;
  --ink: #15191c;
  --slate: #515b63;
  --rule: #d5d9d5;
  --blue: #1f4db8;
  --blue-soft: #e2e8f5;
  --white: #fafbf9;
  --max: 1440px;
  --gutter: clamp(20px, 4.2vw, 72px);
  --section: clamp(88px, 11vw, 176px);
  --serif: "Noto Serif KR", Georgia, serif;
  --sans: Pretendard, "Noto Sans KR", sans-serif;
  --mono: "IBM Plex Mono", Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 17px; line-height: 1.72; letter-spacing: .01em; word-break: keep-all; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--blue-soft); color: var(--ink); }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }

.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 10px 14px; background: var(--ink); color: var(--white); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.site-shell { min-height: 100vh; }
.site-header { position: relative; z-index: 20; display: flex; align-items: center; justify-content: space-between; width: min(100%, var(--max)); height: 76px; margin: 0 auto; padding: 0 var(--gutter); border-bottom: 1px solid var(--rule); }
.brand { font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.brand span { margin-left: 9px; color: var(--slate); font: 12px var(--mono); letter-spacing: .04em; }
.main-nav { display: flex; gap: clamp(24px, 3.2vw, 52px); align-items: center; }
.main-nav a { position: relative; min-height: 44px; display: inline-flex; align-items: center; font-size: 14px; font-weight: 600; }
.main-nav a::after { position: absolute; right: 0; bottom: -9px; left: 0; height: 1px; background: var(--ink); content: ""; transform: scaleX(0); transform-origin: right; transition: transform .2s ease; }
.main-nav a:hover::after, .main-nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.menu-button { display: none; border: 0; background: transparent; color: var(--ink); font: 12px var(--mono); }

.container { width: min(100%, var(--max)); margin: 0 auto; padding-inline: var(--gutter); }
.eyebrow { margin: 0 0 24px; color: var(--blue); font: 12px/1.5 var(--mono); letter-spacing: .04em; }
.display { margin: 0; max-width: 1180px; font-size: clamp(48px, 7vw, 104px); font-weight: 650; letter-spacing: -.02em; line-height: 1.12; }
.page-title { margin: 0; max-width: 1000px; font-size: clamp(42px, 6vw, 84px); font-weight: 650; letter-spacing: -.02em; line-height: 1.12; }
.lead { max-width: 740px; margin: 30px 0 0; color: var(--slate); font-size: clamp(18px, 1.5vw, 23px); line-height: 1.65; }
.text-link { display: inline-flex; align-items: center; gap: 22px; margin-top: 36px; padding-bottom: 5px; border-bottom: 1px solid var(--ink); font: 12px var(--mono); }
.text-link::after { content: "↗"; transition: transform .2s; }
.text-link:hover::after { transform: translate(3px, -3px); }
.section-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 48px; padding-top: 18px; border-top: 1px solid var(--ink); }
.section-head h2 { margin: 0; font-size: clamp(24px, 3vw, 42px); letter-spacing: -.02em; }
.section-head span { color: var(--slate); font-size: 13px; }

.home-hero { min-height: min(740px, calc(100dvh - 76px)); display: grid; align-content: center; padding-block: 72px; }
.hero-thesis em { color: var(--blue); font-style: normal; }
.home-section { padding-bottom: var(--section); }

.featured-list { border-top: 1px solid var(--rule); }
.featured-row { display: grid; grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr); min-height: 520px; border-bottom: 1px solid var(--rule); }
.featured-row:nth-child(even) .project-visual { order: 2; }
.featured-row:nth-child(even) .project-copy { order: 1; border-right: 1px solid var(--rule); border-left: 0; }
.project-visual { position: relative; overflow: hidden; min-height: 420px; background: #e7e9e6; }
.project-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.75,.2,1); }
.featured-row:hover .project-visual img { transform: scale(1.01); }
.project-copy { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(36px, 5vw, 76px); border-left: 1px solid var(--rule); }
.project-meta { color: var(--slate); font: 13px/1.7 var(--mono); }
.project-copy h3 { margin: 28px 0 22px; font-size: clamp(28px, 3vw, 47px); line-height: 1.22; letter-spacing: -.01em; }
.project-thesis { margin: 0; max-width: 540px; color: var(--slate); font-family: var(--serif); font-size: clamp(17px, 1.45vw, 21px); line-height: 1.75; }
.project-open { align-self: flex-start; margin-top: 48px; font: 13px var(--mono); }
.project-open::after { margin-left: 16px; content: "↗"; }

.operational-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--rule); }
.operational-item { min-height: 320px; padding: 32px 30px 38px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.operational-item:last-child { border-right: 0; }
.operational-item .op-index { color: var(--blue); font: 11px var(--mono); }
.operational-item h3 { margin: 72px 0 20px; font-size: clamp(22px, 2vw, 31px); line-height: 1.32; letter-spacing: -.01em; }
.operational-item p { margin: 0; color: var(--slate); font-size: 15px; }
.operational-item:hover { background: var(--blue-soft); }

.perspective { display: grid; grid-template-columns: 4fr 8fr; gap: 40px; padding-block: var(--section); border-top: 1px solid var(--ink); }
.perspective blockquote { margin: 0; font-family: var(--serif); font-size: clamp(30px, 4vw, 58px); font-weight: 600; line-height: 1.45; letter-spacing: -.015em; }
.perspective-copy { max-width: 670px; }
.perspective-copy p { margin: 0 0 20px; color: var(--slate); font-size: 18px; }

.page-hero { padding-block: clamp(90px, 12vw, 180px); border-bottom: 1px solid var(--rule); }
.page-hero .page-kicker { display: grid; grid-template-columns: 4fr 8fr; margin-bottom: 70px; }
.page-hero .page-kicker p { grid-column: 2; margin: 0; max-width: 760px; color: var(--slate); }
.project-catalog { padding-block: var(--section); }
.project-index { border-top: 0; }
.project-index-head { display: grid; grid-template-columns: minmax(0, 1fr) 110px 130px 180px; gap: 28px; align-items: center; min-height: 52px; border-block: 1px solid var(--ink); color: var(--slate); font-size: 14px; }
.project-index-head span:not(:first-child) { text-align: center; }
.index-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 130px 180px; gap: 28px; align-items: center; min-height: 108px; border-bottom: 1px solid var(--rule); transition: background .2s; }
.index-row:hover { background: var(--white); }
.index-row strong { font-size: clamp(18px, 2vw, 28px); letter-spacing: -.01em; }
.index-row span { align-self: stretch; justify-self: stretch; display: grid; place-items: center; min-width: 0; color: var(--slate); font: 13px/1.5 var(--mono); text-align: center; }
.index-row span:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.filters { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0 0 38px; }
.filter { padding: 6px 0; border: 0; border-bottom: 1px solid transparent; background: none; color: var(--slate); cursor: pointer; font: 12px var(--mono); }
.filter.active { border-color: var(--ink); color: var(--ink); }

.detail-hero { padding: 90px 0 0; }
.detail-topline { display: grid; grid-template-columns: 8fr 4fr; gap: 30px; margin-bottom: 70px; }
.detail-topline .project-meta { text-align: right; }
.detail-thesis { max-width: 1240px; margin: 0 0 clamp(72px, 10vw, 150px); font-family: var(--serif); font-size: clamp(38px, 5.6vw, 82px); font-weight: 600; line-height: 1.34; letter-spacing: -.02em; }
.detail-visual { min-height: clamp(420px, 63vw, 840px); overflow: hidden; background: #e2e5e2; }
.detail-visual img { width: 100%; height: 100%; min-height: inherit; padding: clamp(16px, 3vw, 44px); object-fit: contain; background: #e7e9e6; }
.detail-visual .visual-system { position: relative; min-height: inherit; }
.detail-layout { display: grid; grid-template-columns: 3fr 9fr; gap: clamp(40px, 6vw, 100px); padding-block: var(--section); }
.detail-rail { position: relative; min-width: 0; }
.rail-inner { position: sticky; top: 30px; }
.fact-list { margin: 0 0 70px; }
.fact-list div { padding: 13px 0; border-top: 1px solid var(--rule); }
.fact-list dt { color: var(--slate); font: 10px var(--mono); text-transform: uppercase; }
.fact-list dd { margin: 4px 0 0; font-size: 14px; }
.decision-nav { display: grid; gap: 13px; }
.decision-nav a { color: var(--slate); font: 11px var(--mono); }
.decision-nav a.active { color: var(--blue); }
.detail-content { max-width: 850px; min-width: 0; }
.case-section { padding: 0 0 clamp(90px, 11vw, 150px); scroll-margin-top: 30px; }
.case-section h2 { margin: 0 0 36px; font-size: clamp(30px, 4vw, 52px); letter-spacing: -.02em; }
.case-section > p { margin: 0; max-width: 760px; font-size: clamp(17px, 1.7vw, 21px); line-height: 1.85; }
.problem-list { list-style: none; margin: 0; padding: 0; counter-reset: problem; }
.problem-list li { display: grid; grid-template-columns: 52px 1fr; padding: 25px 0; border-top: 1px solid var(--rule); font-size: 18px; counter-increment: problem; }
.problem-list li::before { color: var(--blue); content: counter(problem); font: 13px var(--mono); }
.process-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.process-item { min-height: 260px; padding: 25px 24px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.process-item:last-child { border-right: 0; }
.process-item span { color: var(--blue); font: 10px var(--mono); }
.process-item p { margin: 60px 0 0; color: var(--slate); font-size: 15px; }
.decision-table { border-top: 1px solid var(--ink); }
.decision-row { display: grid; grid-template-columns: 1fr 1fr 1fr; border-bottom: 1px solid var(--rule); }
.decision-cell { min-height: 170px; padding: 20px 22px; border-right: 1px solid var(--rule); }
.decision-cell:last-child { border-right: 0; }
.decision-cell span { display: block; margin-bottom: 30px; color: var(--slate); font: 10px var(--mono); }
.decision-cell:nth-child(2) { color: var(--blue); }
.impact-list { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ink); }
.impact-list li { min-height: 210px; padding: 25px 22px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.impact-list li:last-child { border-right: 0; }
.case-note { margin-top: 32px; padding-left: 18px; border-left: 2px solid var(--blue); color: var(--slate); font-size: 13px; }

.about-intro { display: grid; grid-template-columns: 8fr 4fr; gap: 80px; }
.about-profile { align-self: end; color: var(--slate); }
.capability-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); }
.capability { min-height: 300px; padding: 24px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.capability:last-child { border-right: 0; }
.capability span { color: var(--blue); font: 12px var(--mono); }
.capability h3 { margin: 70px 0 20px; font-size: 25px; }
.capability p { margin: 0; color: var(--slate); font-size: 14px; }
.timeline { border-top: 1px solid var(--ink); }
.timeline-row { display: grid; grid-template-columns: 2fr 3fr 7fr; gap: 30px; padding: 30px 0; border-bottom: 1px solid var(--rule); }
.timeline-row time { color: var(--blue); font: 12px var(--mono); }
.timeline-row strong { font-size: 18px; }
.timeline-row p { margin: 0; color: var(--slate); }

.contact-page { display: grid; align-content: space-between; min-height: calc(100vh - 96px); padding-block: clamp(80px, 10vw, 150px) 45px; }
.contact-page .page-title { max-width: 1120px; }
.contact-row { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 120px; padding-top: 22px; border-top: 1px solid var(--ink); }
.contact-email { font-size: clamp(25px, 4vw, 60px); letter-spacing: -.01em; }
.contact-channels { display: flex; align-items: flex-end; gap: clamp(48px, 7vw, 110px); }
.contact-phone { font-size: clamp(25px, 3.2vw, 48px); letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.copy-button { min-height: 44px; border: 0; border-bottom: 1px solid var(--ink); background: none; cursor: pointer; font: 13px var(--mono); }

.site-footer { display: flex; justify-content: space-between; width: min(100%, var(--max)); margin: 0 auto; padding: 32px var(--gutter); border-top: 1px solid var(--rule); color: var(--slate); font: 10px var(--mono); }
.reveal { opacity: 1; transform: none; }
.empty-state { padding: 70px 0; color: var(--slate); }

/* 2026 refinement: evidence-led portfolio */
.hero-support { max-width: 700px; margin: 38px 0 0; color: var(--slate); font-size: clamp(17px, 1.5vw, 22px); line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 18px 34px; margin-top: 42px; }
.hero-actions a { min-height: 44px; display: inline-flex; align-items: center; font-size: 15px; font-weight: 650; border-bottom: 1px solid currentColor; }

.featured-lead { display: grid; grid-template-columns: minmax(0, 8fr) minmax(320px, 4fr); min-height: 600px; margin-bottom: 70px; background: var(--surface); }
.featured-lead .project-visual { min-height: 600px; }
.featured-lead-copy { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(34px, 4.8vw, 72px); border-left: 1px solid var(--rule); }
.featured-lead-copy h3 { margin: 0 0 25px; font-size: clamp(32px, 3.4vw, 52px); line-height: 1.2; letter-spacing: -.01em; }
.featured-lead-copy p { margin: 0; color: var(--slate); font-family: var(--serif); font-size: clamp(17px, 1.45vw, 21px); line-height: 1.8; }
.work-index { border-top: 1px solid var(--ink); }
.work-index-row { display: grid; grid-template-columns: 1fr 3fr 5fr auto; gap: 32px; align-items: baseline; padding: 34px 0; border-bottom: 1px solid var(--rule); }
.work-index-row:hover strong { color: var(--blue); }
.work-index-industry, .work-index-open { color: var(--slate); font: 12px var(--mono); }
.work-index-row strong { font-size: clamp(20px, 2vw, 29px); letter-spacing: -.01em; transition: color .2s; }
.work-index-row p { margin: 0; color: var(--slate); font-size: 15px; line-height: 1.7; }
.work-index-open { white-space: nowrap; }

.operational-grid { display: block; border-top: 1px solid var(--ink); }
.operational-item { display: grid; grid-template-columns: 2fr 3fr 2fr 4fr auto; gap: 28px; align-items: baseline; min-height: 0; padding: 28px 0; border-right: 0; border-bottom: 1px solid var(--rule); }
.operational-item:last-child { border-right: 0; }
.operational-item:hover { background: transparent; color: inherit; }
.operational-item:hover h3 { color: var(--blue); }
.operational-item h3 { margin: 0; font-size: 21px; transition: color .2s; }
.operational-item p { margin: 0; font-size: 15px; }
.op-period, .op-role, .op-arrow { color: var(--slate); font-size: 13px; }
.op-arrow { white-space: nowrap; }

.case-map { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(30px, 4vw, 62px); background: var(--surface); color: var(--ink); }
.case-map-head, .case-map-foot { display: flex; justify-content: space-between; gap: 20px; color: var(--slate); font: 13px/1.5 var(--mono); }
.case-map-body { display: grid; grid-template-columns: 1fr 80px 1fr; align-items: center; gap: 28px; }
.case-map-point small { display: block; margin-bottom: 20px; color: var(--slate); font-size: 13px; }
.case-map-point strong { display: block; font-size: clamp(21px, 2.4vw, 36px); font-weight: 600; line-height: 1.45; letter-spacing: -.01em; }
.case-map-point.decision strong { color: var(--blue); }
.case-map-connector { position: relative; height: 1px; background: var(--rule); }
.case-map-connector::after { position: absolute; top: -4px; right: 0; width: 8px; height: 8px; border-top: 1px solid var(--blue); border-right: 1px solid var(--blue); content: ""; transform: rotate(45deg); }

.detail-thesis { font-family: var(--sans); font-weight: 650; line-height: 1.22; }
.detail-visual { background: var(--surface); }
.detail-content { max-width: 900px; }
.case-section { padding-bottom: clamp(80px, 9vw, 130px); }
.case-section h2 { margin-bottom: 42px; }
.process-grid { display: block; border-top: 1px solid var(--ink); }
.process-item { display: grid; grid-template-columns: 2fr 5fr; gap: 40px; min-height: 0; padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--rule); }
.process-item h3 { margin: 0; font-size: 20px; }
.process-item p { margin: 0; font-size: 17px; line-height: 1.75; }
.decision-table { border-top: 1px solid var(--ink); }
.decision-row { display: grid; grid-template-columns: 1fr; padding: 52px 0; border-bottom: 1px solid var(--rule); }
.decision-cell { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 32px; min-height: 0; padding: 13px 0; border: 0; }
.decision-cell span { margin: 0; color: var(--slate); font-size: 13px; }
.decision-cell p { margin: 0; font-size: 18px; line-height: 1.7; }
.decision-cell.decision p { color: var(--blue); font-weight: 650; }
.impact-list { display: block; border-top: 1px solid var(--ink); }
.impact-list li, .impact-list li:last-child { position: relative; min-height: 0; padding: 24px 0 24px 30px; border-right: 0; border-bottom: 1px solid var(--rule); font-size: 18px; }
.impact-list li::before { position: absolute; top: 34px; left: 2px; width: 10px; height: 2px; background: var(--blue); content: ""; }

.capability-grid { display: block; border-top: 1px solid var(--ink); }
.capability { display: grid; grid-template-columns: 2fr 3fr 6fr; gap: 30px; align-items: baseline; min-height: 0; padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--rule); }
.capability:last-child { border-right: 0; }
.capability h3, .capability p { margin: 0; }
.capability h3 { font-size: 22px; }
.capability p { font-size: 16px; }

.project-meta { font-size: 13px; }
.fact-list dt { font-size: 12px; }
.fact-list dd { font-size: 15px; }
.decision-nav a { font-size: 12px; }
.site-footer { font-size: 12px; }

@media (max-width: 980px) {
  .featured-lead { grid-template-columns: 1fr; }
  .featured-lead-copy { gap: 55px; border-top: 1px solid var(--rule); border-left: 0; }
  .work-index-row { grid-template-columns: 1fr 3fr; }
  .work-index-row p { grid-column: 2; }
  .work-index-open { display: none; }
  .operational-item { grid-template-columns: 1fr 2fr 1fr; }
  .operational-item p { grid-column: 2 / 4; }
  .op-arrow { display: none; }
  .case-map-body { grid-template-columns: 1fr; }
  .case-map-connector { width: 1px; height: 48px; margin-left: 8px; }
  .case-map-connector::after { top: auto; right: -4px; bottom: 0; transform: rotate(135deg); }
}

@media (max-width: 680px) {
  .home-hero { min-height: calc(100dvh - 76px); padding-block: 52px; }
  .display { font-size: clamp(40px, 12vw, 56px); line-height: 1.18; }
  .hero-support { margin-top: 30px; }
  .featured-lead { min-height: 0; margin-bottom: 48px; }
  .featured-lead .project-visual { min-height: 320px; }
  .work-index-row { grid-template-columns: 1fr; gap: 10px; padding: 28px 0; }
  .work-index-row p { grid-column: 1; }
  .operational-item { grid-template-columns: 1fr; gap: 9px; padding: 28px 0; }
  .operational-item p { grid-column: 1; margin-top: 12px; }
  .case-map { padding: 28px 20px; }
  .case-map-head, .case-map-foot { font-size: 12px; }
  .case-map-point strong { font-size: 20px; }
  .process-item { grid-template-columns: 1fr; gap: 15px; }
  .decision-row { padding: 38px 0; }
  .decision-cell { grid-template-columns: 1fr; gap: 8px; padding: 11px 0; }
  .decision-cell p { font-size: 17px; }
  .capability { grid-template-columns: 1fr; gap: 10px; }
  .capability p { margin-top: 8px; }
}

/* Sitewide 2026 — Clear Service Journey */
body:not(.home-v2) {
  --paper: #fff;
  --surface: #eaf4f5;
  --ink: #122b3a;
  --slate: #49616b;
  --rule: #b8cdd1;
  --blue: #078fa2;
  --blue-soft: #eaf4f5;
  background: #fff;
  color: var(--ink);
  font-size: 18px;
}
body:not(.home-v2) .site-shell { max-width: none; background: #fff; }
body:not(.home-v2) .container { width: min(100% - 80px, 1320px); }
body:not(.home-v2) .site-header { height: 88px; padding-inline: max(40px, calc((100vw - 1320px) / 2)); border-color: var(--rule); background: rgba(255,255,255,.96); }
body:not(.home-v2) .brand { font-size: 20px; letter-spacing: -.01em; }
body:not(.home-v2) .brand span { color: #078fa2; font-size: 13px; letter-spacing: .02em; }
body:not(.home-v2) .main-nav { gap: 38px; font-size: 16px; }
body:not(.home-v2) .main-nav a[aria-current="page"] { color: #078fa2; }
body:not(.home-v2) .eyebrow,
body:not(.home-v2) .project-meta { font-size: 15px; line-height: 1.65; }
body:not(.home-v2) .page-title { font-family: var(--sans); font-size: clamp(52px, 6.5vw, 92px); font-weight: 700; line-height: 1.14; letter-spacing: -.02em; }
body:not(.home-v2) .section-head { align-items: end; margin-bottom: 52px; }
body:not(.home-v2) .section-head h2 { font-size: clamp(38px, 4.4vw, 60px); letter-spacing: -.02em; }
body:not(.home-v2) .section-head span { color: var(--slate); font-size: 15px; }
body:not(.home-v2) .home-section,
body:not(.home-v2) .project-catalog { padding-block: clamp(88px, 9vw, 132px); }

body[data-page="projects"] .page-hero,
body[data-page="about"] .page-hero {
  width: min(100% - 80px, 1320px);
  padding-block: clamp(96px, 10vw, 142px) clamp(88px, 9vw, 126px);
  border: 0;
  background: #35c2d3;
  color: #fff;
  box-shadow: 0 0 0 100vmax #35c2d3;
  clip-path: inset(0 -100vmax);
}
body[data-page="projects"] .page-hero .page-kicker { grid-template-columns: 6fr 6fr; margin-bottom: 56px; }
body[data-page="projects"] .page-hero .page-kicker p { grid-column: 2; max-width: 670px; color: #122b3a; font-size: 18px; line-height: 1.75; }
body[data-page="projects"] .page-hero .eyebrow,
body[data-page="about"] .page-hero .eyebrow { color: #122b3a; }

body[data-page="projects"] .featured-lead { min-height: 560px; margin-bottom: 72px; background: #eaf4f5; }
body[data-page="projects"] .featured-lead .project-visual { min-height: 560px; background: #fff; }
body[data-page="projects"] .featured-lead-copy { padding: clamp(36px, 4.5vw, 64px); border-color: var(--rule); }
body[data-page="projects"] .featured-lead-copy h3 { font-size: clamp(36px, 3.8vw, 54px); }
body[data-page="projects"] .featured-lead-copy p { color: var(--ink); font-family: var(--sans); font-size: 18px; line-height: 1.75; }
body[data-page="projects"] .project-open { color: #e64f35; font-size: 16px; font-weight: 750; }
body[data-page="projects"] .work-index { border-color: var(--ink); }
body[data-page="projects"] .work-index-row { grid-template-columns: 1fr 2.6fr 4.6fr auto; gap: 34px; padding: 38px 0; }
body[data-page="projects"] .work-index-industry,
body[data-page="projects"] .work-index-open { color: #49616b; font: 600 15px var(--sans); }
body[data-page="projects"] .work-index-row strong { font-size: clamp(24px, 2.1vw, 31px); }
body[data-page="projects"] .work-index-row p { color: #49616b; font-size: 17px; line-height: 1.75; }
body[data-page="projects"] .filters { gap: 8px; margin-bottom: 38px; }
body[data-page="projects"] .filter { min-height: 44px; padding: 9px 16px; border-color: #8baab0; border-radius: 0; font-size: 16px; }
body[data-page="projects"] .filter.active { border-color: #122b3a; background: #122b3a; color: #fff; }
body[data-page="projects"] .index-row { grid-template-columns: minmax(0, 1fr) 110px 130px 180px; min-height: 108px; padding: 28px 0; }
body[data-page="projects"] .index-row strong { font-size: clamp(21px, 2vw, 28px); }
body[data-page="projects"] .index-row span { font-size: 15px; }

body[data-page="detail"] .detail-hero { width: min(100% - 80px, 1320px); padding-top: clamp(78px, 8vw, 116px); }
body[data-page="detail"] .detail-topline { margin-bottom: clamp(48px, 6vw, 72px); }
body[data-page="detail"] .detail-thesis { max-width: 1160px; margin-bottom: clamp(64px, 7vw, 96px); font-size: clamp(44px, 5.5vw, 76px); line-height: 1.22; }
body[data-page="detail"] .detail-visual { min-height: 0; height: clamp(430px, 53vw, 720px); border: 1px solid var(--rule); background: #eaf4f5; }
body[data-page="detail"] .detail-visual > img { min-height: 0; padding: clamp(14px, 2.5vw, 34px); background: #eaf4f5; }
body[data-page="detail"] .detail-visual > .project-visual { height: 100%; }
body[data-page="detail"] .detail-layout { grid-template-columns: minmax(220px, 3fr) minmax(0, 9fr); padding-block: clamp(88px, 9vw, 128px); }
body[data-page="detail"] .fact-list dt { font-size: 15px; }
body[data-page="detail"] .fact-list dd { font-size: 17px; line-height: 1.65; }
body[data-page="detail"] .decision-nav a { min-height: 42px; font-size: 15px; }
body[data-page="detail"] .case-section { padding-bottom: clamp(80px, 8vw, 112px); }
body[data-page="detail"] .case-section h2 { margin-bottom: 32px; font-size: clamp(38px, 4.4vw, 58px); }
body[data-page="detail"] .case-section > p,
body[data-page="detail"] .problem-list li,
body[data-page="detail"] .impact-list li { font-size: 19px; line-height: 1.8; }
body[data-page="detail"] .process-item h3 { font-size: 23px; }
body[data-page="detail"] .process-item p,
body[data-page="detail"] .decision-cell p { font-size: 18px; line-height: 1.75; }
body[data-page="detail"] .decision-cell span { font-size: 15px; }

body[data-page="about"] .about-intro { grid-template-columns: 7fr 5fr; gap: clamp(54px, 7vw, 110px); }
body[data-page="about"] .about-profile { color: #122b3a; font-size: 19px; line-height: 1.75; }
body[data-page="about"] .about-profile p { margin: 0 0 18px; }
body[data-page="about"] .capability { grid-template-columns: 1.5fr 2.6fr 6fr; gap: 36px; padding: 34px 0; }
body[data-page="about"] .capability span { color: #078fa2; font: 700 15px var(--sans); }
body[data-page="about"] .capability h3 { font-size: 25px; }
body[data-page="about"] .capability p { color: #49616b; font-size: 18px; line-height: 1.75; }
body[data-page="about"] .timeline-row { grid-template-columns: 1.7fr 3fr 7.3fr; padding: 34px 0; }
body[data-page="about"] .timeline-row time { color: #078fa2; font: 700 15px var(--sans); }
body[data-page="about"] .timeline-row strong { font-size: 22px; }
body[data-page="about"] .timeline-row p { color: #49616b; font-size: 18px; line-height: 1.7; }

body[data-page="contact"] { background: #35c2d3; }
body[data-page="contact"] .site-shell { min-height: 100vh; background: #35c2d3; }
body[data-page="contact"] .contact-page { width: min(100% - 80px, 1320px); min-height: calc(100vh - 88px - 74px); padding-block: clamp(82px, 9vw, 124px) 60px; color: #fff; }
body[data-page="contact"] .contact-page .eyebrow { color: #122b3a; }
body[data-page="contact"] .contact-page .page-title { max-width: 1120px; font-size: clamp(48px, 6vw, 84px); }
body[data-page="contact"] .contact-row { margin-top: clamp(70px, 9vw, 120px); border-color: rgba(18,43,58,.55); }
body[data-page="contact"] .contact-email { font-size: clamp(28px, 4vw, 58px); }
body[data-page="contact"] .contact-phone { font-size: clamp(26px, 3.2vw, 46px); }
body[data-page="contact"] .copy-button { min-height: 48px; padding: 10px 18px; border: 1px solid #122b3a; background: #122b3a; color: #fff; font-size: 15px; }

body:not(.home-v2) .site-footer { max-width: none; padding: 26px max(40px, calc((100vw - 1320px) / 2)); border-color: rgba(255,255,255,.18); background: #122b3a; color: rgba(255,255,255,.72); font-size: 14px; }

@media (max-width: 860px) {
  body:not(.home-v2) .container,
  body[data-page="projects"] .page-hero,
  body[data-page="about"] .page-hero,
  body[data-page="detail"] .detail-hero,
  body[data-page="contact"] .contact-page { width: min(100% - 44px, 1320px); }
  body:not(.home-v2) .site-header { padding-inline: 22px; }
  body[data-page="projects"] .page-hero .page-kicker,
  body[data-page="about"] .about-intro { display: grid; grid-template-columns: 1fr; gap: 38px; }
  body[data-page="projects"] .page-hero .page-kicker p { grid-column: 1; }
  body[data-page="projects"] .featured-lead { grid-template-columns: 1fr; }
  body[data-page="projects"] .featured-lead-copy { min-height: 430px; border-top: 1px solid var(--rule); border-left: 0; }
  body[data-page="projects"] .work-index-row { grid-template-columns: 1fr 3fr; }
  body[data-page="projects"] .work-index-row p,
  body[data-page="projects"] .work-index-open { grid-column: 2; }
  body[data-page="detail"] .detail-layout { grid-template-columns: 1fr; }
  body[data-page="detail"] .detail-rail { position: static; }
  body[data-page="detail"] .rail-inner { position: static; }
  body[data-page="detail"] .decision-nav { display: flex; overflow-x: auto; gap: 18px; padding-bottom: 10px; }
  body[data-page="about"] .capability,
  body[data-page="about"] .timeline-row { grid-template-columns: 1.5fr 3fr 5.5fr; gap: 22px; }
}

@media (max-width: 680px) {
  body:not(.home-v2) { font-size: 17px; }
  body:not(.home-v2) .main-nav { background: #122b3a; color: #fff; }
  body:not(.home-v2) .main-nav a[aria-current="page"] { color: #48d0dd; }
  body:not(.home-v2) .page-title { font-size: clamp(43px, 12vw, 58px); }
  body:not(.home-v2) .home-section,
  body:not(.home-v2) .project-catalog { padding-block: 76px; }
  body[data-page="projects"] .page-hero,
  body[data-page="about"] .page-hero { padding-block: 76px; }
  body[data-page="projects"] .page-hero .page-kicker { margin-bottom: 42px; }
  body[data-page="projects"] .featured-lead .project-visual { min-height: 300px; }
  body[data-page="projects"] .featured-lead-copy { min-height: 390px; }
  body[data-page="projects"] .work-index-row { grid-template-columns: 1fr; gap: 10px; padding: 30px 0; }
  body[data-page="projects"] .work-index-row p,
  body[data-page="projects"] .work-index-open { grid-column: 1; }
  body[data-page="projects"] .index-row { grid-template-columns: 1fr 1fr; gap: 10px 18px; }
  body[data-page="projects"] .index-row strong { grid-column: 1 / -1; }
  body[data-page="detail"] .detail-topline { grid-template-columns: 1fr; gap: 18px; }
  body[data-page="detail"] .detail-topline .project-meta { text-align: left; }
  body[data-page="detail"] .detail-thesis { font-size: clamp(38px, 10.5vw, 50px); }
  body[data-page="detail"] .detail-visual { height: 330px; }
  body[data-page="detail"] .detail-layout { padding-block: 72px; }
  body[data-page="detail"] .case-section { padding-bottom: 74px; }
  body[data-page="about"] .capability,
  body[data-page="about"] .timeline-row { grid-template-columns: 1fr; gap: 8px; padding: 28px 0; }
  body[data-page="about"] .capability p,
  body[data-page="about"] .timeline-row p { margin-top: 10px; }
  body[data-page="contact"] .contact-page { min-height: calc(100vh - 88px); padding-block: 72px 46px; }
  body[data-page="contact"] .contact-row { align-items: flex-start; flex-direction: column; gap: 30px; }
  body[data-page="contact"] .contact-channels { align-items: flex-start; flex-direction: column; gap: 28px; }
  body:not(.home-v2) .site-footer { padding-inline: 22px; }
}

@media (max-width: 980px) {
  .home-hero { grid-template-columns: 1fr; min-height: 700px; }
  .hero-meta { justify-self: end; }
  .featured-row { grid-template-columns: 1fr; }
  .featured-row:nth-child(even) .project-visual, .featured-row:nth-child(even) .project-copy { order: initial; }
  .featured-row:nth-child(even) .project-copy, .project-copy { border-top: 1px solid var(--rule); border-right: 0; border-left: 0; }
  .operational-grid { grid-template-columns: 1fr; }
  .operational-item, .operational-item:last-child { min-height: 220px; border-right: 0; }
  .operational-item h3 { margin-top: 42px; }
  .perspective { grid-template-columns: 1fr; }
  .page-hero .page-kicker { grid-template-columns: 1fr; }
  .page-hero .page-kicker p { grid-column: 1; }
  .detail-layout { grid-template-columns: 1fr; }
  .detail-visual .project-visual { width: 100%; height: 100%; min-height: inherit; }
  .detail-visual .visual-system { height: 100%; }
  .rail-inner { position: static; }
  .fact-list { display: grid; grid-template-columns: 1fr 1fr; margin-bottom: 32px; }
  .decision-nav { position: sticky; top: 0; z-index: 5; grid-auto-flow: column; justify-content: start; width: 100%; max-width: calc(100vw - (var(--gutter) * 2)); overflow-x: auto; padding: 14px 0; background: var(--paper); border-block: 1px solid var(--rule); }
  .decision-nav a { white-space: nowrap; margin-right: 24px; }
  .about-intro { grid-template-columns: 1fr; }
  .capability-grid { grid-template-columns: 1fr 1fr; }
  .capability:nth-child(2) { border-right: 0; }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  .site-header { height: 76px; }
  .brand span { display: none; }
  .menu-button { display: block; min-width: 44px; min-height: 44px; }
  .main-nav { position: fixed; inset: 76px 0 0; display: none; align-content: start; padding: 60px var(--gutter); background: var(--paper); }
  .menu-open .main-nav { display: grid; gap: 24px; }
  .main-nav a { font-family: var(--sans); font-size: 36px; font-weight: 600; letter-spacing: -.01em; }
  .display { font-size: clamp(42px, 13vw, 68px); }
  .home-hero { min-height: calc(100vh - 76px); padding-block: 60px; }
  .hero-meta { justify-self: start; }
  .section-head { align-items: flex-end; }
  .section-head span { text-align: right; }
  .project-visual { min-height: 310px; }
  .project-copy { padding: 34px 20px 42px; }
  .featured-row { min-height: auto; }
  .index-row { grid-template-columns: 1fr auto; gap: 6px 18px; padding-block: 24px; }
  .index-row span:nth-of-type(1) { grid-column: 1; }
  .index-row span:nth-of-type(2) { display: none; }
  .index-row span:last-child { grid-column: 2; grid-row: 1 / span 2; }
  .detail-topline { grid-template-columns: 1fr; }
  .detail-topline .project-meta { text-align: left; }
  .fact-list { grid-template-columns: 1fr; }
  .process-grid, .impact-list { grid-template-columns: 1fr; }
  .process-item, .process-item:last-child, .impact-list li, .impact-list li:last-child { min-height: auto; border-right: 0; }
  .process-item p { margin-top: 34px; }
  .decision-row { grid-template-columns: 1fr; }
  .decision-cell { min-height: auto; border-right: 0; border-bottom: 1px solid var(--rule); }
  .decision-cell:last-child { border-bottom: 0; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability, .capability:nth-child(2), .capability:last-child { min-height: 230px; border-right: 0; }
  .timeline-row { grid-template-columns: 1fr; gap: 8px; }
  .contact-row { display: grid; gap: 30px; }
  .site-footer { display: grid; gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Home 2026 — Clear Service Journey */
.home-v2 {
  --aqua: #35c2d3;
  --aqua-bright: #48d0dd;
  --navy: #122b3a;
  --mist: #eaf4f5;
  --coral: #ff6b4a;
  background: #fff;
  color: var(--navy);
}
.home-v2 .site-header { position: absolute; inset: 0 0 auto; width: 100%; max-width: none; color: var(--navy); border-color: rgba(18,43,58,.22); }
.home-v2 .brand span { color: rgba(18,43,58,.76); }
.home-v2 .main-nav a::after { background: var(--navy); }
.home-v2 .menu-button { color: var(--navy); }
.journey-container { width: min(100%, 1440px); margin-inline: auto; padding-inline: clamp(24px, 5vw, 78px); }
.section-label { margin: 0 0 22px; color: var(--aqua); font: 700 13px/1.4 var(--mono); letter-spacing: .03em; text-transform: uppercase; }
.section-title-row { display: flex; justify-content: space-between; gap: 60px; align-items: flex-end; margin-bottom: clamp(48px, 7vw, 92px); }
.section-title-row h2 { margin: 0; font-size: clamp(38px, 5.5vw, 76px); line-height: 1.15; letter-spacing: -.02em; }
.section-title-row > p, .section-title-row > a { margin: 0; color: #52666f; font-size: 17px; line-height: 1.7; }

.journey-hero { position: relative; min-height: 900px; overflow: hidden; background: var(--aqua); color: #fff; }
.journey-route { position: absolute; top: 120px; left: -5%; width: 63%; height: 250px; border: 2px solid rgba(255,255,255,.45); border-color: rgba(255,255,255,.45) transparent transparent; border-radius: 50%; transform: rotate(7deg); }
.journey-route::before, .journey-route::after { position: absolute; width: 14px; height: 14px; border-radius: 50%; background: var(--coral); content: ""; }
.journey-route::before { top: 13px; left: 70%; }
.journey-route::after { top: 74px; right: 4%; background: #fff; }
.hero-copy { position: relative; z-index: 4; width: min(54%, 760px); padding: 132px 0 124px max(24px, calc((100vw - 1440px) / 2 + 5vw)); }
.hero-identity { width: min(100%, 520px); padding-bottom: 24px; border-bottom: 1px solid rgba(18,43,58,.3); }
.hero-name { margin: 0; color: #fff; font-size: clamp(68px, 6vw, 88px); font-weight: 750; line-height: 1; letter-spacing: -.02em; }
.hero-role { margin: 15px 0 0; color: var(--navy); font-size: clamp(19px, 1.55vw, 23px); font-weight: 750; letter-spacing: -.01em; }
.hero-message { margin-top: 34px; }
.hero-label { margin: 0 0 10px; color: var(--navy); font: 700 13px/1.4 var(--mono); letter-spacing: .05em; }
.hero-thesis { margin: 0; font-size: clamp(46px, 4.6vw, 68px); font-weight: 700; line-height: 1.14; letter-spacing: -.025em; }
.hero-thesis em { color: var(--navy); font-style: normal; }
.hero-summary { max-width: 610px; margin: 18px 0 0; color: var(--navy); font-size: clamp(17px, 1.35vw, 20px); font-weight: 560; line-height: 1.72; }
.hero-proof { width: min(100%, 610px); margin: 26px 0 0; padding: 10px 0; border-block: 1px solid rgba(18,43,58,.3); color: var(--navy); }
.hero-proof div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 16px; padding: 6px 0; }
.hero-proof dt { font-size: 13px; font-weight: 750; }
.hero-proof dd { margin: 0; font-size: 16px; font-weight: 620; line-height: 1.5; }
.hero-actions { gap: 22px 32px; margin-top: 30px; }
.hero-actions a { color: var(--navy); border-color: var(--navy); }
.hero-actions .hero-primary { gap: 42px; padding: 16px 20px; border: 1px solid #fff; background: #fff; color: var(--navy); }
.hero-scene { position: absolute; z-index: 3; right: -3%; bottom: -4px; width: min(56vw, 820px); height: 74%; }
.hero-scene img { width: 100%; height: 100%; object-fit: contain; object-position: right bottom; filter: drop-shadow(0 18px 22px rgba(18,43,58,.16)) saturate(.85); }
.digital-layers { position: absolute; z-index: 1; right: -8%; bottom: -70px; width: 80%; height: 280px; }
.digital-layers i { position: absolute; right: 0; bottom: 0; width: 100%; height: 210px; border-radius: 52% 0 0 0/55% 0 0 0; background: rgba(255,255,255,.24); transform: rotate(-2deg); }
.digital-layers i:nth-child(2) { right: 5%; bottom: -24px; background: rgba(255,255,255,.48); transform: rotate(2deg); }
.digital-layers i:nth-child(3) { right: -4%; bottom: -70px; background: #fff; transform: rotate(-1deg); }

.career-proof { padding: clamp(110px, 12vw, 180px) 0; background: #fff; }
.career-proof h2 { max-width: 1050px; margin: 0 0 90px; font-size: clamp(42px, 5.7vw, 80px); line-height: 1.2; letter-spacing: -.02em; }
.proof-index { border-top: 2px solid var(--navy); }
.proof-index article { display: grid; grid-template-columns: 1.4fr 2.2fr 4fr; gap: 40px; align-items: baseline; padding: 30px 0; border-bottom: 1px solid #b9cdd1; }
.proof-index article > span { color: #61737b; font-size: 14px; }
.proof-index strong { font-size: clamp(22px, 2.5vw, 35px); letter-spacing: -.01em; }
.proof-index p { margin: 0; color: #52666f; font-size: 17px; }

.selected-lead { padding: clamp(100px, 11vw, 170px) 0; background: var(--mist); }
.journey-lead-case { display: grid; grid-template-columns: minmax(0, 7fr) minmax(360px, 5fr); background: #fff; }
.journey-lead-case .project-visual { min-height: 720px; background: #dce9ea; }
.journey-lead-case .project-visual img { object-fit: contain; padding: 28px; }
.journey-case-copy { display: flex; flex-direction: column; padding: clamp(36px, 4vw, 64px); border-left: 1px solid #bdd0d4; }
.case-heading span, .journey-case-copy dt { color: #61737b; font-size: 13px; }
.case-heading h3 { margin: 14px 0 42px; font-size: clamp(34px, 3.8vw, 54px); line-height: 1.2; letter-spacing: -.01em; }
.journey-case-copy dl { margin: 0; }
.journey-case-copy dl div { display: grid; grid-template-columns: 90px 1fr; gap: 20px; padding: 20px 0; border-top: 1px solid #c9d8db; }
.journey-case-copy dd { margin: 0; font-size: 16px; line-height: 1.7; }
.journey-case-copy dl div:nth-child(3) dd { color: #087f91; font-weight: 700; }
.case-link { margin-top: auto; padding-top: 32px; color: #087f91; font-weight: 700; }

.selected-more { padding: clamp(110px, 12vw, 180px) 0; background: #fff; }
.journey-case-row { display: grid; grid-template-columns: 70px 3fr 3fr 1.5fr 30px; gap: 34px; align-items: start; padding: 44px 0; border-top: 1px solid #afc4c8; }
.journey-case-row:last-child { border-bottom: 1px solid #afc4c8; }
.case-row-no { color: var(--aqua); font: 700 15px var(--mono); }
.case-row-title span, .case-row-decision span, .case-row-role span { color: #61737b; font-size: 13px; }
.case-row-title h3 { margin: 10px 0 16px; font-size: clamp(25px, 2.7vw, 38px); line-height: 1.25; letter-spacing: -.01em; }
.case-row-title p, .case-row-role p { margin: 0; color: #52666f; font-size: 15px; line-height: 1.7; }
.case-row-decision strong { display: block; margin-top: 13px; color: #087f91; font-size: 17px; line-height: 1.7; }
.case-row-open { color: var(--coral); font-size: 24px; transition: transform .2s; }
.journey-case-row:hover .case-row-open { transform: translateX(6px); }

.operation-record { padding: clamp(110px, 12vw, 180px) 0; background: var(--navy); color: #fff; }
.operation-record .section-label { color: var(--aqua-bright); }
.operation-record .section-title-row > p { color: rgba(255,255,255,.68); }
.operation-row { display: grid; grid-template-columns: 1.5fr 2.3fr 1.3fr 3.2fr 30px; gap: 28px; align-items: baseline; padding: 30px 0; border-top: 1px solid rgba(255,255,255,.28); }
.operation-row:last-child { border-bottom: 1px solid rgba(255,255,255,.28); }
.operation-row time, .operation-row > span { color: rgba(255,255,255,.6); font-size: 13px; }
.operation-row h3 { margin: 0; font-size: 21px; }
.operation-row p { margin: 0; color: rgba(255,255,255,.72); font-size: 15px; }
.operation-row b { color: var(--coral); font-size: 22px; }

.work-method { position: relative; overflow: hidden; padding: clamp(120px, 13vw, 190px) 0; background: var(--aqua); color: #fff; }
.work-method::after { position: absolute; right: -15%; bottom: -180px; width: 70%; height: 330px; border: 2px solid rgba(255,255,255,.45); border-radius: 50%; content: ""; transform: rotate(-6deg); }
.work-method .section-label { color: var(--navy); }
.work-method h2 { max-width: 1080px; margin: 0; font-size: clamp(42px, 5.7vw, 78px); line-height: 1.2; letter-spacing: -.02em; }
.method-flow { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5, 1fr); margin: 90px 0 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.65); }
.method-flow li { position: relative; min-height: 260px; padding: 28px 25px; border-right: 1px solid rgba(255,255,255,.4); }
.method-flow li:last-child { border-right: 0; }
.method-flow li::before { position: absolute; top: -7px; left: 25px; width: 13px; height: 13px; border-radius: 50%; background: var(--coral); content: ""; }
.method-flow span { font: 700 13px var(--mono); }
.method-flow strong { display: block; margin: 55px 0 18px; font-size: 25px; }
.method-flow p { margin: 0; font-size: 15px; line-height: 1.7; }

.archive-contact { background: #fff; }
.archive-block { padding: clamp(110px, 12vw, 180px) 0; }
.archive-block h2 { margin: 0 0 60px; font-size: clamp(42px, 5.7vw, 78px); line-height: 1.2; letter-spacing: -.02em; }
.archive-categories { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 46px; }
.archive-categories span { padding: 11px 20px; border: 1px solid #94b0b6; border-radius: 999px; font-weight: 700; }
.archive-block > a { display: inline-block; padding-bottom: 6px; border-bottom: 2px solid var(--aqua); font-weight: 700; }
.contact-block { margin-inline: calc(var(--gutter) * -1); padding: clamp(80px, 9vw, 130px) var(--gutter); background: var(--navy); color: #fff; }
.contact-block p { margin: 0 0 24px; color: var(--aqua-bright); font-size: 16px; }
.contact-block h2 { max-width: 1120px; margin: 0; font-size: clamp(38px, 5vw, 72px); line-height: 1.25; letter-spacing: -.02em; }
.contact-block a { display: flex; justify-content: space-between; align-items: center; margin-top: 62px; padding: 20px 0; border-block: 1px solid rgba(255,255,255,.45); font-size: 25px; font-weight: 700; }
.home-v2 .site-footer { max-width: none; background: var(--navy); color: rgba(255,255,255,.6); border-color: rgba(255,255,255,.2); }

@media (max-width: 980px) {
  .journey-hero { min-height: 1020px; }
  .hero-copy { width: 74%; padding-top: 150px; }
  .hero-scene { width: 72vw; height: 57%; }
  .journey-lead-case { grid-template-columns: 1fr; }
  .journey-lead-case .project-visual { min-height: 560px; }
  .journey-case-copy { border-top: 1px solid #bdd0d4; border-left: 0; }
  .journey-case-row { grid-template-columns: 50px 3fr 3fr 30px; }
  .case-row-role { grid-column: 2 / 4; }
  .operation-row { grid-template-columns: 1fr 2fr 1fr; }
  .operation-row p { grid-column: 2 / 4; }
  .operation-row b { display: none; }
  .method-flow { grid-template-columns: 1fr 1fr; }
  .method-flow li { min-height: 220px; border-bottom: 1px solid rgba(255,255,255,.4); }
}

@media (max-width: 680px) {
  .home-v2 .main-nav { background: var(--aqua); color: #fff; }
  .journey-hero { min-height: 980px; }
  .hero-copy { width: 100%; padding: 130px 22px 0; }
  .hero-copy h1 { font-size: clamp(46px, 13.2vw, 64px); }
  .hero-summary { font-size: 16px; }
  .hero-scene { right: -18%; width: 116vw; height: 48%; }
  .digital-layers { width: 130%; height: 190px; }
  .section-title-row { display: grid; gap: 24px; }
  .career-proof h2 { margin-bottom: 55px; }
  .proof-index article { grid-template-columns: 1fr; gap: 8px; padding: 26px 0; }
  .journey-lead-case .project-visual { min-height: 330px; }
  .journey-case-copy { padding: 30px 20px; }
  .journey-case-copy dl div { grid-template-columns: 70px 1fr; }
  .journey-case-row { grid-template-columns: 36px 1fr 24px; gap: 16px; }
  .case-row-decision, .case-row-role { grid-column: 2 / 4; }
  .operation-row { grid-template-columns: 1fr; gap: 8px; }
  .operation-row p { grid-column: 1; margin-top: 12px; }
  .method-flow { grid-template-columns: 1fr; }
  .method-flow li { min-height: 0; padding: 25px 0 30px; border-right: 0; }
  .method-flow li::before { left: 0; }
  .method-flow strong { margin: 24px 0 10px; }
  .archive-categories { gap: 8px; }
  .archive-categories span { padding: 8px 14px; }
}

/* Hero resilience — intermediate widths and browser zoom */
.home-v2 .hero-copy {
  box-sizing: content-box;
  width: min(48vw, 730px);
}
.home-v2 .hero-role { white-space: nowrap; }
.home-v2 .hero-copy h1,
.home-v2 .hero-summary { word-break: keep-all; overflow-wrap: normal; }

@media (max-width: 1180px) {
  .home-v2 .journey-hero { min-height: 1080px; }
  .home-v2 .journey-route::after { display: none; }
  .home-v2 .hero-copy {
    box-sizing: border-box;
    width: 100%;
    max-width: 790px;
    padding: 126px 40px 0;
  }
  .home-v2 .hero-name { font-size: clamp(66px, 8vw, 84px); }
  .home-v2 .hero-thesis { font-size: clamp(48px, 6vw, 64px); }
  .home-v2 .hero-summary { max-width: 660px; }
  .home-v2 .hero-scene { right: -6%; width: 70vw; height: 37%; }
}

@media (max-width: 680px) {
  .home-v2 .journey-hero { min-height: 960px; }
  .home-v2 .hero-copy { max-width: none; padding: 106px 22px 0; }
  .home-v2 .hero-role { white-space: normal; }
  .home-v2 .hero-name { font-size: clamp(55px, 16vw, 68px); }
  .home-v2 .hero-role { margin-top: 10px; font-size: 18px; }
  .home-v2 .hero-identity { padding-bottom: 18px; }
  .home-v2 .hero-message { margin-top: 26px; }
  .home-v2 .hero-label { margin-bottom: 8px; font-size: 12px; }
  .home-v2 .hero-thesis { font-size: clamp(37px, 10.6vw, 48px); line-height: 1.12; }
  .home-v2 .hero-thesis em { display: block; }
  .home-v2 .hero-summary { max-width: 100%; margin-top: 16px; font-size: 16px; word-break: normal; overflow-wrap: anywhere; }
  .home-v2 .hero-proof { margin-top: 20px; padding-block: 8px; }
  .home-v2 .hero-proof div { grid-template-columns: 72px minmax(0, 1fr); gap: 10px; padding: 5px 0; }
  .home-v2 .hero-proof dt { font-size: 12px; }
  .home-v2 .hero-proof dd { font-size: 14px; }
  .home-v2 .hero-actions { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 16px; margin-top: 24px; }
  .home-v2 .hero-actions a { justify-content: space-between; min-width: 0; font-size: 14px; }
  .home-v2 .hero-actions .hero-primary { gap: 12px; padding-inline: 14px; }
  .home-v2 .hero-scene { right: -25%; width: 118vw; height: 34%; }
}

/* Readability scale — desktop/tablet and mobile use separate minimums */
@media (min-width: 681px) {
  .home-v2 .brand span,
  .home-v2 .main-nav a,
  .home-v2 .section-label,
  .home-v2 .hero-actions a,
  .home-v2 .proof-index article > span,
  .home-v2 .case-heading span,
  .home-v2 .journey-case-copy dt,
  .home-v2 .case-row-no,
  .home-v2 .case-row-title span,
  .home-v2 .case-row-decision span,
  .home-v2 .case-row-role span,
  .home-v2 .operation-row time,
  .home-v2 .operation-row > span,
  .home-v2 .method-flow span,
  body:not(.home-v2) .brand span,
  body:not(.home-v2) .main-nav a,
  body:not(.home-v2) .eyebrow,
  body:not(.home-v2) .project-meta,
  body:not(.home-v2) .section-head span,
  body[data-page="projects"] .work-index-industry,
  body[data-page="projects"] .work-index-open,
  body[data-page="projects"] .index-row span,
  body[data-page="detail"] .fact-list dt,
  body[data-page="detail"] .decision-nav a,
  body[data-page="detail"] .decision-cell span,
  body[data-page="about"] .capability span,
  body[data-page="about"] .timeline-row time,
  body:not(.home-v2) .site-footer { font-size: 16px; }

  .home-v2 .case-row-title p,
  .home-v2 .case-row-role p,
  .home-v2 .operation-row p,
  .home-v2 .method-flow p { font-size: 18px; }

  .home-v2 .case-row-decision strong { font-size: 19px; }
  .home-v2 .journey-case-copy dd { font-size: 18px; }
  .home-v2 .proof-index p { font-size: 18px; }
}

@media (max-width: 680px) {
  .home-v2 .section-label,
  .home-v2 .case-heading span,
  .home-v2 .journey-case-copy dt,
  .home-v2 .case-row-no,
  .home-v2 .case-row-title span,
  .home-v2 .case-row-decision span,
  .home-v2 .case-row-role span,
  .home-v2 .operation-row time,
  .home-v2 .operation-row > span,
  .home-v2 .method-flow span { font-size: 15px; }

  .home-v2 .journey-case-copy dd,
  .home-v2 .case-row-title p,
  .home-v2 .case-row-role p,
  .home-v2 .operation-row p,
  .home-v2 .method-flow p { font-size: 16px; }

  .home-v2 .case-row-decision strong { font-size: 17px; }
}

/* Company-led project access */
.company-projects { padding: clamp(110px, 12vw, 180px) 0; background: #fff; }
.company-project-index { border-top: 2px solid var(--navy); }
.company-project-row { display: grid; grid-template-columns: 4fr 8fr; border-bottom: 1px solid #afc4c8; }
.company-wordmark { display: flex; gap: 24px; align-items: baseline; padding: 34px 36px 34px 0; border-right: 1px solid #c6d5d8; }
.company-wordmark span { color: #078fa2; font: 700 16px var(--mono); }
.company-wordmark strong { font-size: clamp(25px, 2.7vw, 38px); line-height: 1.25; letter-spacing: -.01em; word-break: keep-all; }
.company-project-links { display: grid; }
.company-project-links a { display: grid; grid-template-columns: 2fr 5fr 28px; gap: 28px; align-items: center; min-height: 94px; padding: 22px 0 22px 38px; border-bottom: 1px solid #d3dfe1; }
.company-project-links a:last-child { border-bottom: 0; }
.company-project-links a:hover b { color: #078fa2; }
.company-project-links span { color: #52666f; font-size: 16px; line-height: 1.55; }
.company-project-links b { font-size: clamp(19px, 1.7vw, 24px); line-height: 1.45; transition: color .2s; }
.company-project-links i { color: var(--coral); font-size: 23px; font-style: normal; }
.company-project-all { display: flex; justify-content: space-between; margin-top: 46px; padding: 22px 0; border-block: 1px solid var(--navy); font-size: 18px; font-weight: 750; }

.project-count { margin: 0 0 12px; color: #49616b; font-size: 16px; text-align: right; }
body[data-page="projects"] .index-row strong { display: grid; gap: 7px; }
body[data-page="projects"] .index-row strong small { color: #078fa2; font-size: 16px; font-weight: 700; letter-spacing: 0; }
body[data-page="projects"] .index-row.has-detail strong small::after { margin-left: 12px; color: #e64f35; content: "상세 보기 →"; }
body[data-page="projects"] .index-row.archive-only { cursor: default; }
body[data-page="projects"] .index-row.archive-only:hover { background: transparent; }

@media (max-width: 980px) {
  .company-project-row { grid-template-columns: 1fr; }
  .company-wordmark { border-right: 0; border-bottom: 1px solid #c6d5d8; }
  .company-project-links a { padding-left: 0; }
}

@media (max-width: 680px) {
  .company-projects { padding: 78px 0; }
  .company-wordmark { gap: 16px; padding: 26px 0 22px; }
  .company-wordmark span { font-size: 15px; }
  .company-wordmark strong { font-size: 27px; }
  .company-project-links a { grid-template-columns: 1fr 24px; gap: 7px 12px; min-height: 0; padding: 20px 0; }
  .company-project-links span { grid-column: 1; font-size: 15px; }
  .company-project-links b { grid-column: 1; font-size: 18px; }
  .company-project-links i { grid-column: 2; grid-row: 1 / 3; align-self: center; }
  .company-project-all { font-size: 16px; }
  .project-count, body[data-page="projects"] .index-row strong small { font-size: 15px; }
}

/* Compact semantic visual when a project has no supplied screenshot */
body[data-page="detail"] .detail-visual.is-map { height: auto; min-height: 420px; }
body[data-page="detail"] .detail-visual.is-map > .project-visual { min-height: 420px; }
body[data-page="detail"] .detail-visual.is-map .case-map { padding-block: 42px; }

@media (max-width: 680px) {
  body[data-page="detail"] .detail-visual.is-map,
  body[data-page="detail"] .detail-visual.is-map > .project-visual { min-height: 360px; }
  body[data-page="detail"] .detail-visual.is-map .case-map { padding-block: 26px; }
}

/* Tighter vertical rhythm — remove non-functional top whitespace */
body[data-page="projects"] .page-hero,
body[data-page="about"] .page-hero {
  padding-top: clamp(62px, 6vw, 86px);
  padding-bottom: clamp(70px, 7vw, 98px);
}
body[data-page="projects"] .page-hero .page-kicker { margin-bottom: 38px; }
body[data-page="detail"] .detail-hero { padding-top: clamp(54px, 5.5vw, 78px); }
body[data-page="contact"] .contact-page { padding-top: clamp(62px, 6vw, 88px); }
body:not(.home-v2) .home-section,
body:not(.home-v2) .project-catalog { padding-top: clamp(68px, 7vw, 96px); padding-bottom: clamp(82px, 8vw, 112px); }

.career-proof { padding-top: clamp(72px, 7.5vw, 104px); padding-bottom: clamp(80px, 8vw, 116px); }
.company-projects { padding-top: clamp(72px, 7.5vw, 104px); padding-bottom: clamp(80px, 8vw, 116px); }
.operation-record { padding-top: clamp(74px, 7.5vw, 108px); padding-bottom: clamp(82px, 8vw, 118px); }
.work-method { padding-top: clamp(78px, 8vw, 114px); padding-bottom: clamp(86px, 8.5vw, 122px); }
.archive-block { padding-top: clamp(68px, 7vw, 98px); padding-bottom: clamp(74px, 7.5vw, 106px); }

@media (max-width: 680px) {
  body[data-page="projects"] .page-hero,
  body[data-page="about"] .page-hero { padding-block: 54px 64px; }
  body[data-page="projects"] .page-hero .page-kicker { margin-bottom: 30px; }
  body[data-page="detail"] .detail-hero { padding-top: 48px; }
  body[data-page="contact"] .contact-page { padding-top: 54px; }
  body:not(.home-v2) .home-section,
  body:not(.home-v2) .project-catalog { padding-top: 58px; padding-bottom: 72px; }
  .career-proof,
  .company-projects,
  .operation-record,
  .work-method { padding-top: 66px; padding-bottom: 78px; }
  .archive-block { padding-top: 62px; padding-bottom: 72px; }
}

/* Compact case-study reading mode */
body[data-page="detail"] .detail-topline { margin-bottom: clamp(26px, 3vw, 40px); }
body[data-page="detail"] .detail-hero { padding-top: clamp(44px, 4.5vw, 62px); }
body[data-page="detail"] .detail-thesis {
  max-width: 1280px;
  margin-bottom: clamp(34px, 4vw, 54px);
  font-size: clamp(37px, 3.45vw, 50px);
  line-height: 1.24;
  letter-spacing: -.01em;
  word-break: keep-all;
}
body[data-page="detail"] .detail-visual { height: clamp(300px, 28vw, 380px); }
body[data-page="detail"] .detail-layout { padding-top: clamp(62px, 6vw, 86px); padding-bottom: clamp(76px, 7vw, 104px); }
body[data-page="detail"] .case-section { padding-bottom: clamp(52px, 5.5vw, 72px); }
body[data-page="detail"] .case-section h2 {
  margin-bottom: 24px;
  font-size: clamp(30px, 2.8vw, 40px);
  line-height: 1.25;
}
body[data-page="detail"] .decision-row { padding-block: 34px; }

body[data-page="detail"] .detail-visual.is-map,
body[data-page="detail"] .detail-visual.is-map > .project-visual { min-height: 300px; }
body[data-page="detail"] .detail-visual.is-map .case-map { padding-block: 30px; }

@media (max-width: 680px) {
  body[data-page="detail"] .detail-topline { margin-bottom: 24px; }
  body[data-page="detail"] .detail-thesis { margin-bottom: 30px; font-size: clamp(32px, 9vw, 40px); line-height: 1.28; }
  body[data-page="detail"] .detail-visual { height: 280px; }
  body[data-page="detail"] .detail-layout { padding-block: 54px 70px; }
  body[data-page="detail"] .case-section { padding-bottom: 56px; }
  body[data-page="detail"] .case-section h2 { font-size: clamp(29px, 8vw, 36px); }
  body[data-page="detail"] .detail-visual.is-map,
  body[data-page="detail"] .detail-visual.is-map > .project-visual { min-height: 340px; }
}

/* Evidence map — connected context, decision and contribution */
.case-map { display: grid; grid-template-rows: auto 1fr auto; gap: 0; justify-content: stretch; padding: clamp(26px, 3vw, 42px); }
.case-map-head { display: grid; grid-template-columns: 1fr auto; gap: 40px; padding-bottom: 20px; border-bottom: 1px solid #b9cdd1; font-family: var(--sans); }
.case-map-head div { display: grid; gap: 6px; }
.case-map-head div:last-child { text-align: right; }
.case-map-head small,
.case-map-foot small { color: #61737b; font-size: 16px; line-height: 1.45; }
.case-map-head strong { font-size: 18px; line-height: 1.45; }
.case-map-body { padding-block: clamp(26px, 3vw, 42px); }
.case-map-point small { margin-bottom: 12px; font-size: 16px; }
.case-map-point strong { font-size: clamp(23px, 2.15vw, 32px); line-height: 1.42; }
.case-map-foot { display: grid; grid-template-columns: 1fr 1.25fr; gap: 44px; align-items: center; padding-top: 22px; border-top: 1px solid #b9cdd1; font-family: var(--sans); }
.case-map-role { display: grid; gap: 8px; }
.case-map-role strong { font-size: 19px; }
.case-map-contribution { display: grid; grid-template-columns: 104px 1fr; gap: 22px; align-items: center; }
.case-map-contribution > div { display: grid; gap: 8px; }
.case-map-contribution > div strong { font-size: 17px; line-height: 1.55; }
.contribution-ring { position: relative; display: grid; place-items: center; width: 104px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#0798ac var(--contribution), #d4e2e4 0); }
.contribution-ring::after { position: absolute; inset: 12px; border-radius: 50%; background: #eaf4f5; content: ""; }
.contribution-ring b { position: relative; z-index: 1; font-size: 20px; }

@media (max-width: 680px) {
  .case-map { padding: 24px 20px; }
  .case-map-head { grid-template-columns: 1fr; gap: 14px; }
  .case-map-head div:last-child { text-align: left; }
  .case-map-head small,
  .case-map-foot small,
  .case-map-point small { font-size: 15px; }
  .case-map-body { padding-block: 24px; }
  .case-map-foot { grid-template-columns: 1fr; gap: 22px; }
  .case-map-contribution { grid-template-columns: 88px 1fr; gap: 18px; }
  .contribution-ring { width: 88px; }
  .contribution-ring::after { inset: 10px; }
  .contribution-ring b { font-size: 17px; }
}

/* Shared signature — a quiet trace of the service journey across subpages */
body:not(.home-v2) .page-hero,
body[data-page="detail"] .detail-hero,
body[data-page="contact"] .contact-page { position: relative; }
body:not(.home-v2) .page-hero::before,
body[data-page="detail"] .detail-hero::before,
body[data-page="contact"] .contact-page::before {
  position: absolute;
  top: 22px;
  left: 0;
  width: 190px;
  border-top: 1px solid #078fa2;
  content: "";
}
body:not(.home-v2) .page-hero::after,
body[data-page="detail"] .detail-hero::after,
body[data-page="contact"] .contact-page::after {
  position: absolute;
  top: 17px;
  left: 186px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ff6b4a;
  content: "";
}
body[data-page="projects"] .page-hero::before,
body[data-page="about"] .page-hero::before,
body[data-page="contact"] .contact-page::before { border-color: rgba(18,43,58,.48); }

/* Fast project-to-project navigation for interviews and portfolio reviews */
.project-sequence { display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top: 8px; border-block: 1px solid var(--ink); }
.project-sequence a { min-height: 132px; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; padding: 22px; transition: background .2s, color .2s; }
.project-sequence a + a { border-left: 1px solid var(--rule); }
.project-sequence a:hover { background: var(--surface); }
.project-sequence span { color: var(--slate); font-size: 15px; }
.project-sequence strong { font-size: 18px; line-height: 1.45; }
.sequence-all { text-align: center; }
.sequence-project.next { text-align: right; }
.sequence-project.is-empty + a { border-left: 0; }

@media (max-width: 680px) {
  body:not(.home-v2) .page-hero::before,
  body[data-page="detail"] .detail-hero::before,
  body[data-page="contact"] .contact-page::before { top: 16px; width: 120px; }
  body:not(.home-v2) .page-hero::after,
  body[data-page="detail"] .detail-hero::after,
  body[data-page="contact"] .contact-page::after { top: 11px; left: 116px; }
  .project-sequence { grid-template-columns: 1fr; }
  .project-sequence a { min-height: 0; padding: 22px 0; }
  .project-sequence a + a { border-top: 1px solid var(--rule); border-left: 0; }
  .project-sequence .is-empty { display: none; }
  .sequence-all, .sequence-project.next { text-align: left; }
}

/* Project archive columns — one alignment system for labels and values */
@media (max-width: 980px) and (min-width: 681px) {
  body[data-page="projects"] .project-index-head,
  body[data-page="projects"] .index-row { grid-template-columns: minmax(0, 1fr) 84px 96px 150px; gap: 16px; }
  body[data-page="projects"] .index-row span { font-size: 14px; }
}

@media (max-width: 680px) {
  body[data-page="projects"] .project-index-head { display: none; }
  body[data-page="projects"] .project-index { border-top: 1px solid var(--ink); }
  body[data-page="projects"] .index-row { grid-template-columns: 1fr; gap: 0; padding: 24px 0; }
  body[data-page="projects"] .index-row strong { grid-column: 1; margin-bottom: 16px; }
  body[data-page="projects"] .index-row span {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    min-height: 34px;
    text-align: right;
  }
  body[data-page="projects"] .index-row span::before { color: var(--slate); content: attr(data-label); font-family: var(--sans); font-weight: 650; text-align: left; }
  body[data-page="projects"] .index-row span:last-child { white-space: normal; }
}
