:root {
  color-scheme: light;
  --bg: #f7f8fa;
  --surface: #ffffff;
  --ink: #111827;
  --muted: #667085;
  --navy: #18233a;
  --blue: #4169a1;
  --line: #e5e7eb;
  --pale-blue: #edf2f8;
  --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --sans: Inter, "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.project-description,
.section-intro,
.hero-lede,
.hero-english,
.activity-item > p,
.skills-heading > p:last-child,
.skill-row > span:last-child,
.education-major,
.project-subtitle,
.supporting-note,
.additional-card > p:not(.project-category) {
  word-break: keep-all;
  overflow-wrap: break-word;
  text-align: left;
  text-wrap: pretty;
}

.section-heading h2,
.skills-heading h2,
.contact-layout h2 {
  word-break: keep-all;
  text-wrap: balance;
}

.project-featured h3,
.project-standard h3,
.global-research h4,
.education-panel h3,
.activity-head h3,
.additional-card h3 {
  word-break: keep-all;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

.hero-role,
.skill-name,
.credential-row strong {
  word-break: keep-all;
  overflow-wrap: break-word;
  text-wrap: balance;
}

a { color: inherit; }

a:focus-visible {
  outline: 3px solid #7aa1d3;
  outline-offset: 4px;
  border-radius: 3px;
}

.container {
  width: min(1180px, calc(100% - 64px));
  margin-inline: auto;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 20;
  padding: 10px 14px;
  transform: translateY(-160%);
  background: var(--navy);
  color: white;
}

.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  border-bottom: 1px solid rgba(229, 231, 235, .88);
  background: rgba(247, 248, 250, .95);
  backdrop-filter: blur(12px);
}

.header-inner {
  min-height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: var(--navy);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  text-decoration: none;
  white-space: nowrap;
}

.wordmark-mark {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid #cbd3df;
  border-radius: 50%;
  color: var(--blue);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: -.1em;
}

.primary-nav {
  display: flex;
  align-items: center;
  gap: 31px;
}

.primary-nav a {
  color: #596273;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  transition: color .2s ease;
}

.primary-nav a:hover { color: var(--navy); }
.primary-nav .nav-linkedin { color: var(--navy); }
.primary-nav span { color: var(--blue); }

.hero {
  padding-top: 86px;
  overflow: hidden;
}

.hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr);
  align-items: center;
  gap: clamp(44px, 6vw, 78px);
  min-height: 445px;
}

.eyebrow {
  margin: 0;
  color: var(--blue);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .13em;
  line-height: 1.5;
}

.hero-copy .eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #5d6b80;
}

.status-dot, .signal-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  display: inline-block;
  border-radius: 50%;
  background: #668a69;
}

.hero h1 {
  margin: 24px 0 13px;
  color: var(--navy);
  font-size: clamp(58px, 7.1vw, 88px);
  font-weight: 600;
  letter-spacing: -.075em;
  line-height: .91;
}

.hero h1 span {
  color: #4b5b76;
  font-weight: 400;
}

.hero-role {
  margin: 22px 0 0;
  color: #39465c;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -.02em;
}

.hero-role span { padding-inline: 3px; color: #91a0b6; }

.hero-lede {
  max-width: 690px;
  margin: 24px 0 0;
  color: #293448;
  font-size: clamp(17px, 2vw, 20px);
  font-weight: 500;
  letter-spacing: -.045em;
  line-height: 1.7;
}

.hero-lede-line { display: block; }
.hero-phrase { display: inline-block; white-space: nowrap; }

.hero-english {
  max-width: 580px;
  margin: 13px 0 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.75;
}

.hero-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 29px;
}

.button {
  min-height: 43px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 17px;
  padding: 0 17px;
  border: 1px solid var(--navy);
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .2s ease, transform .2s ease;
}

.button-primary {
  background: var(--navy);
  color: white;
}

.button-primary:hover {
  background: #283954;
  transform: translateY(-2px);
}

.text-link {
  color: #38455a;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}

.text-link span { color: var(--blue); }
.text-link:hover { text-decoration: underline; text-underline-offset: 4px; }

.hero-visual {
  position: relative;
  min-height: 360px;
  padding: 22px 27px 19px;
  border: 1px solid #dce2eb;
  border-radius: 8px;
  background: #fbfcfd;
  box-shadow: 0 13px 32px rgba(24, 35, 58, .035);
}

.visual-topline, .visual-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #778397;
  font-family: var(--mono);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .1em;
}

.mono { font-family: var(--mono); }

.flow-stack {
  display: grid;
  gap: 0;
  margin-top: 23px;
}

.flow-step {
  min-height: 56px;
  display: grid;
  grid-template-columns: 29px minmax(120px, .9fr) minmax(130px, 1fr);
  align-items: center;
  column-gap: 12px;
}

.flow-index {
  color: #98a3b3;
  font-family: var(--mono);
  font-size: 9px;
}

.flow-label {
  color: var(--navy);
  font-size: 13px;
  font-weight: 600;
}

.flow-detail {
  color: #8993a3;
  font-family: var(--mono);
  font-size: 8px;
  text-align: right;
}

.visual-foot {
  gap: 10px;
  margin-top: 15px;
  padding-top: 13px;
  border-top: 1px solid #e7ebf0;
  font-size: 7px;
}

.visual-rule { height: 1px; flex: 1; background: #d9e0e9; }

.section { padding-block: 108px; }

.section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 42px;
  margin-bottom: 34px;
}

.section-heading h2, .skills-heading h2, .contact-layout h2 {
  margin: 13px 0 0;
  color: var(--navy);
  font-size: clamp(32px, 4.4vw, 48px);
  font-weight: 500;
  letter-spacing: -.065em;
  line-height: 1.11;
}

.section-intro {
  max-width: 480px;
  margin: 0 0 4px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.8;
}

.mobile-break { display: none; }

.project-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  transition: border-color .2s ease, transform .2s ease;
}

.project-card:hover, .additional-card:hover {
  transform: translateY(-2px);
  border-color: #aebbd0;
}

.project-featured {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, .78fr);
  overflow: hidden;
}

.project-featured-main { padding: 33px 34px 29px; }
.project-featured-main, .project-featured-side { min-width: 0; }
.project-featured + .project-featured { margin-top: 20px; }
.project-rates .project-featured-main { padding-block: 42px 36px; }

.project-overline {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 20px;
}

.project-number { color: #8190a7; font: 11px var(--mono); }

.project-category {
  color: #748198;
  font: 9px var(--mono);
  letter-spacing: .09em;
}

.project-overline .project-category {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 4px;
  min-width: 0;
}

.project-overline .project-category > span { white-space: nowrap; }

.title-unit { display: inline-block; white-space: nowrap; }

.project-category i, .source-list i { color: #afbac8; font-style: normal; }

.project-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  padding: 4px 7px;
  border: 1px solid #dbe2eb;
  border-radius: 3px;
  color: #5a6a84;
  font: 8px var(--mono);
  letter-spacing: .07em;
  text-decoration: none;
  transition: border-color .2s ease, color .2s ease;
}

.project-badge:hover { border-color: #aebbd0; color: var(--navy); }

.project-featured h3 {
  margin: 23px 0 21px;
  color: var(--navy);
  font-size: clamp(28px, 2.2vw, 32px);
  font-weight: 600;
  letter-spacing: -.055em;
  line-height: 1.25;
}

.project-description {
  max-width: 720px;
  margin: 0;
  color: #5e6879;
  font-size: 16px;
  letter-spacing: -.01em;
  line-height: 1.8;
  text-align: left;
}

/* Career records use the existing project cards and visual hierarchy. */
.career-record { margin-top: 19px; color: #5e6879; }
.record-block + .record-block { margin-top: 18px; }
.record-block h4 {
  margin: 0 0 9px;
  color: var(--navy);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: -.015em;
}
.record-meta {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: 8px 18px;
  margin: 0;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.record-meta > div { display: grid; grid-template-columns: 77px minmax(0, 1fr); gap: 6px; }
.record-meta > div:last-child { grid-column: 1 / -1; }
.record-meta dt { color: #8190a2; font-size: 11px; line-height: 1.8; }
.record-meta dd { margin: 0; font-size: 12px; line-height: 1.8; word-break: keep-all; overflow-wrap: break-word; }
.record-block ul, .record-notes, .activity-item ul { list-style: none; margin: 0; padding: 0; }
.record-block li, .record-notes li, .activity-item li {
  position: relative;
  padding-left: 12px;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.record-block li { font-size: 13px; line-height: 1.8; }
.record-block li + li { margin-top: 6px; }
.record-block li::before, .record-notes li::before, .activity-item li::before {
  position: absolute; left: 0; top: .85em; content: ""; width: 3px; height: 3px; background: #91a0b5;
}
.record-notes { margin-top: 16px; padding-top: 11px; border-top: 1px solid var(--line); }
.record-notes li { color: #8792a2; font-size: 11px; line-height: 1.8; }
.record-notes li + li { margin-top: 5px; }
.activity-item ul { margin-top: 10px; }
.activity-item li { font-size: 13px; line-height: 1.8; color: var(--muted); }
.activity-item li + li { margin-top: 3px; }
@media (max-width: 720px) {
  .record-meta { grid-template-columns: 1fr; gap: 8px; }
  .record-meta > div:last-child { grid-column: auto; }
  .record-meta > div { grid-template-columns: 70px minmax(0, 1fr); }
  .record-block + .record-block { margin-top: 19px; }
  .record-block li { font-size: 13px; line-height: 1.85; }
  .record-block h4 { font-size: 12px; }
}
@media print {
  .career-record { margin-top: 12pt; }
  .record-block + .record-block { margin-top: 11pt; }
  .record-block h4 { font-size: 10pt; margin-bottom: 5pt; break-after: avoid; }
  .record-block li, .record-meta dd { font-size: 9.5pt; line-height: 1.7; }
  .record-meta dt, .record-notes li { font-size: 8.5pt; }
  .record-block li, .record-meta > div { break-inside: avoid; }
}

.project-rates h3 { font-size: clamp(28px, 2.35vw, 32px); }
.project-systematic h3 { font-size: clamp(25px, 2.8vw, 30px); }

#work .project-featured-main > .project-description + .project-description,
#work .project-standard .project-description + .project-description { margin-top: 20px; }

.card-link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-top: 20px;
  color: var(--navy);
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
}

.card-link span { color: var(--blue); transition: transform .2s ease; }
.card-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.card-link:hover span { transform: translate(2px, -2px); }

.project-featured-side {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 31px 28px 24px;
  border-left: 1px solid #e4e9f0;
  background: #f4f6f9;
}

.side-label, .panel-label {
  margin: 0;
  color: #75839a;
  font: 9px var(--mono);
  letter-spacing: .1em;
}

.featured-metrics { display: grid; gap: 18px; margin-block: 19px; }
.featured-metric { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; min-width: 0; }
.featured-metric strong { flex: 0 0 auto; color: var(--navy); font: 500 23px var(--mono); letter-spacing: -.07em; white-space: nowrap; }
.featured-metric strong span { margin-left: 3px; color: #76849a; font-size: 12px; }
.featured-metric strong i { color: #a0acbd; font-style: normal; font-size: 15px; }
.featured-metric > span { min-width: 0; color: #687587; font-size: 10px; text-align: right; word-break: keep-all; overflow-wrap: normal; }
.side-footnote {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 13px;
  border-top: 1px solid #dfe5ed;
  color: #68768a;
  font: 10px/1.65 var(--sans);
}

.signal-dot { width: 6px; height: 6px; }

.project-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.project-standard { display: flex; flex-direction: column; min-width: 0; padding: 27px 25px 24px; }
.project-standard h3 { margin: 22px 0 21px; color: var(--navy); font-size: 22px; font-weight: 600; letter-spacing: -.055em; line-height: 1.24; }
.project-subtitle { margin: 0 0 15px; color: #63718a; font-size: 11px; font-weight: 500; }
.project-standard .project-description { max-width: none; font-size: 16px; line-height: 1.8; }
.project-standard .project-description + .project-description { margin-top: 18px; }
#work #project-global > .project-description + .project-description { margin-top: 18px; }
.project-standard .card-link { margin-top: auto; padding-top: 19px; }
.project-links { display: flex; flex-wrap: wrap; gap: 0 20px; margin-top: auto; }
.project-links .card-link { margin-top: 0; }

.metric-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 20px;
  padding: 14px 15px;
  border: 1px solid #edf0f4;
  border-radius: 5px;
  background: #fafbfc;
}

.metric-pair > div { display: grid; gap: 3px; }
.metric-pair > div + div { padding-left: 14px; border-left: 1px solid #e5e9ef; }
.metric-pair strong { color: var(--navy); font: 500 20px var(--mono); letter-spacing: -.06em; }
.metric-pair strong i { color: #a0acbd; font-size: 15px; font-style: normal; }
.metric-pair strong > span { font-size: 12px; }
.metric-pair span { color: #687587; font-size: 11px; line-height: 1.5; }
.metric-single { grid-template-columns: 1fr; }
.experiment-note { max-width: 720px; margin: 12px 0 0; color: #778294; font: 11px/1.6 var(--sans); text-align: left; word-break: keep-all; overflow-wrap: break-word; text-wrap: pretty; }

.global-research {
  margin-top: 18px;
  padding: 15px 16px;
  border-left: 2px solid #bac7d8;
  background: #f5f7fa;
}

.global-research .project-category { margin: 0; }
.global-research h4 { margin: 5px 0 10px; color: var(--navy); font-size: 17px; font-weight: 600; line-height: 1.4; }
.global-research p:not(.project-category) { max-width: none; margin: 0; color: #5e6879; font-size: 15px; line-height: 1.8; text-align: left; word-break: keep-all; overflow-wrap: break-word; text-wrap: pretty; }
.global-research p + p { margin-top: 12px !important; }
#project-global > .metric-pair { margin-top: 16px; }

.result-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 18px;
  min-width: 0;
}

.result-chips span {
  padding: 5px 7px;
  border: 1px solid #e7ebf0;
  border-radius: 3px;
  color: #748096;
  font: 9px var(--mono);
  white-space: nowrap;
}

.result-chips b { color: #3e587d; font-weight: 500; }

.compact-process {
  margin-top: 16px;
  color: #798699;
  font: 9px var(--mono);
}

.project-automation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 245px;
  gap: 35px;
  margin-top: 20px;
  padding: 28px 32px;
}

.project-automation h3 { margin: 19px 0 13px; color: var(--navy); font-size: 25px; font-weight: 600; letter-spacing: -.05em; }
.project-automation .project-description { max-width: 720px; font-size: 12px; }
.project-automation .project-description + .project-description { margin-top: 16px; }
.project-badge-light { margin-left: 2px; color: #65748b; background: #f8fafc; }
.source-list { display: flex; flex-wrap: wrap; gap: 9px; min-width: 0; margin: 16px 0 0; color: #53627a; font: 9px var(--mono); }
.source-list span { white-space: nowrap; }
.project-automation blockquote { margin: 17px 0 0; padding-left: 11px; border-left: 2px solid #8397b2; color: #748096; font-size: 11px; font-style: italic; }
.project-automation .card-link { margin-top: 15px; }

@media (min-width: 721px) and (max-width: 882px) {
  .project-standard:has(.source-list) .compact-process {
    display: grid;
    width: max-content;
    max-width: 100%;
    grid-template-columns: max-content max-content;
    column-gap: 9px;
    row-gap: 8px;
  }

  .project-standard:has(.source-list) .compact-process .process-item-last {
    grid-column: 1 / -1;
    justify-self: center;
  }
}

.automation-flow {
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 16px 22px;
  border-left: 1px solid #e5e9ef;
  color: #718097;
  font: 9px var(--mono);
}

.automation-flow b { margin: 2px 0; color: #9aa7b8; font-weight: 400; }
.automation-flow-final { color: var(--navy); font-weight: 600; }

.operations-section {
  border-block: 1px solid #e1e6ed;
  background: #f1f3f6;
  color: #25324a;
}

.section-heading-light h2 { color: #18233a; }
.section-heading-light .eyebrow { color: #4169a1; }
.section-heading-light .section-intro { color: #667085; }

.ops-layout {
  display: block;
}

.ops-steps {
  position: relative;
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ops-steps::before {
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 14px;
  width: 1px;
  background: #c8d2df;
  content: "";
}

.ops-steps li {
  position: relative;
  min-height: 49px;
  display: grid;
  grid-template-columns: 30px minmax(190px, 1fr) minmax(165px, .8fr);
  align-items: center;
  gap: 13px;
  border-bottom: 1px solid #dde3ea;
}

.ops-index {
  z-index: 1;
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  border: 1px solid #aebbcb;
  border-radius: 50%;
  background: #ffffff;
  color: #6f7e94;
  font: 8px var(--mono);
}

.ops-steps li:first-child .ops-index,
.ops-steps li:last-child .ops-index {
  border-color: #6f89ac;
  background: #e7eef7;
  color: #27466e;
}

.ops-steps strong { color: #25324a; font-size: 12px; font-weight: 500; }
.ops-tag { color: #7a8699; font: 9px var(--mono); text-align: right; }

.section-heading-compact { margin-bottom: 30px; }
.section-heading-compact h2 { font-size: clamp(29px, 3.7vw, 40px); }
.section-heading-compact .section-intro { max-width: 480px; font-size: 14px; }

.additional-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.additional-card {
  padding: 24px 27px 22px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: white;
  transition: border-color .2s ease, transform .2s ease;
}

.additional-top { display: flex; align-items: center; gap: 11px; }
.additional-card h3 { margin: 18px 0 7px; color: var(--navy); font-size: 19px; font-weight: 600; letter-spacing: -.04em; }
.additional-card > p:not(.project-category) { min-height: 61px; margin: 0; color: #687486; font-size: 11px; line-height: 1.75; }

.tag-row { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; margin-top: 17px; }
.tag-row span { padding: 4px 7px; border-radius: 3px; background: #f1f4f8; color: #67768d; font: 9px var(--mono); white-space: nowrap; }
.additional-card .card-link { margin-top: 18px; }

.skills-section { padding-block: 87px; border-block: 1px solid var(--line); background: #f1f3f6; }

.skills-layout {
  display: grid;
  grid-template-columns: minmax(220px, .65fr) minmax(0, 1.35fr);
  gap: 74px;
  align-items: start;
}

.skills-heading h2 { font-size: 38px; }
.skills-heading > p:last-child { max-width: 260px; margin: 15px 0 0; color: #748093; font-size: 11px; line-height: 1.8; }

.skills-list { border-top: 1px solid #d9dfe7; }
.skill-row { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid #d9dfe7; }
.skill-row > span { min-width: 0; }
.skill-name { color: var(--navy); font-size: 12px; font-weight: 600; }
.skill-row > span:last-child { color: #687587; font-size: 11px; }
.skill-row i { color: #a1adbd; font-style: normal; }

.background-section { padding-bottom: 93px; }

.background-grid {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr);
  gap: 18px;
}

.education-panel {
  position: relative;
  min-height: 280px;
  overflow: hidden;
  padding: 25px 27px;
  border: 1px solid #dce2ea;
  border-radius: 7px;
  background: #f0f3f7;
}

.education-panel h3 { position: relative; z-index: 1; margin: 35px 0 8px; color: var(--navy); font-size: 22px; font-weight: 600; letter-spacing: -.045em; }
.education-major { position: relative; z-index: 1; margin: 0; color: #647187; font-size: 15px; line-height: 1.75; }
.education-meta { position: absolute; right: 27px; bottom: 24px; left: 27px; z-index: 1; display: flex; justify-content: space-between; gap: 8px; padding-top: 12px; border-top: 1px solid #d9dfe7; color: #647187; font: 11px var(--sans); }
.education-seal { position: absolute; right: 11px; bottom: 14px; color: rgba(103, 124, 153, .08); font: 600 125px/1 var(--sans); letter-spacing: -.1em; }

.activity-list { padding: 23px 26px 11px; border: 1px solid var(--line); border-radius: 7px; background: white; }
.activity-item { padding: 15px 0 14px; border-bottom: 1px solid #edf0f4; }
.activity-item:last-child { border-bottom: 0; }
.activity-head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.activity-head h3 { margin: 0; color: var(--navy); font-size: 13px; font-weight: 600; }
.activity-head span { color: #778294; font: 10px var(--mono); white-space: nowrap; }
.activity-item > p { margin: 6px 0 0; color: #687587; font-size: 13px; line-height: 1.7; }
.activity-item > p i { padding-inline: 2px; color: #b3bdca; font-style: normal; }

.credentials-section {
  padding-block: 29px;
  border-block: 1px solid var(--line);
  background: rgba(255, 255, 255, .64);
}

.credentials-inner {
  display: grid;
  grid-template-columns: 1.1fr repeat(4, 1fr);
  align-items: center;
  gap: 18px;
}

.credentials-heading .eyebrow { font-size: 8px; }
.credentials-heading h2 { margin: 5px 0 0; color: var(--navy); font-size: 18px; font-weight: 600; letter-spacing: -.04em; }
.credential-row { min-height: 54px; display: grid; align-content: center; gap: 1px; padding-left: 16px; border-left: 1px solid #e2e6ec; }
.credential-row strong { color: #334057; font-size: 10px; font-weight: 600; }
.credential-row span, .credential-row time { color: #7b8697; font-size: 8px; }
.credential-row time { font-family: var(--mono); }

.contact-section { padding-block: 88px; background: #eef1f5; }

.contact-layout {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: 60px;
  align-items: start;
}

.contact-layout h2 { font-size: 42px; }
.contact-links { border-top: 1px solid #d4dbe5; }
.contact-links a { display: grid; grid-template-columns: 75px minmax(0, 1fr) 20px; align-items: center; gap: 12px; min-height: 58px; border-bottom: 1px solid #d4dbe5; text-decoration: none; }
.contact-links a > span:first-child { color: #7a8799; font: 9px var(--mono); }
.contact-links strong { color: #334057; font-size: 12px; font-weight: 500; }
.contact-arrow { color: var(--blue); transition: transform .2s ease; }
.contact-links a:hover strong { color: var(--navy); text-decoration: underline; text-underline-offset: 4px; }
.contact-links a:hover .contact-arrow { transform: translate(2px, -2px); }

.site-footer { padding-block: 19px; background: var(--navy); color: white; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.footer-wordmark { color: #f4f6f9; font-size: 9px; }
.footer-wordmark .wordmark-mark { border-color: #5b6c86; color: #c2d2e7; }
.footer-inner p { margin: 0; color: #a9b5c6; font: 8px var(--mono); letter-spacing: .02em; }
.footer-year { color: #9aa8bb; font: 8px var(--mono); }

@media (max-width: 980px) {
  .hero-layout { gap: 46px; grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr); }
  .flow-step { grid-template-columns: 25px minmax(0, .9fr) minmax(0, 1fr); column-gap: 9px; }
  .project-featured { grid-template-columns: minmax(0, 1.8fr) minmax(235px, .8fr); }
  .project-featured-main { padding-inline: 28px; }
  .project-featured-side { padding-inline: 22px; }
  .credentials-inner { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .credentials-heading { grid-column: 1 / -1; }
  .credential-row:first-of-type { padding-left: 0; border-left: 0; }
}

@media (max-width: 860px) {
  .project-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 72px; }
  .container { width: min(100% - 40px, 560px); }
  .header-inner { min-height: 62px; }
  .primary-nav { gap: 15px; }
  .primary-nav a { font-size: 10px; }
  .primary-nav .nav-external { display: none; }
  .wordmark { font-size: 9px; gap: 7px; }
  .wordmark-mark { width: 25px; height: 25px; }

  .hero { padding-top: 56px; }
  .hero-layout { grid-template-columns: 1fr; gap: 35px; min-height: 0; }
  .hero h1 { margin-top: 20px; font-size: clamp(58px, 17vw, 78px); }
  .hero-role { max-width: 380px; font-size: 13px; line-height: 1.7; }
  .hero-lede { font-size: 17px; }
  .hero-english { max-width: 420px; font-size: 16px; }
  .hero-actions { gap: 17px; margin-top: 23px; }
  .hero-visual { width: 100%; min-height: 335px; padding-inline: 20px; }
  .flow-step { grid-template-columns: 25px minmax(0, 1fr); column-gap: 9px; row-gap: 2px; padding-block: 6px; }
  .flow-detail { grid-column: 2; text-align: left; }
  .section { padding-block: 76px; }
  .section-heading { display: block; margin-bottom: 25px; }
  .section-heading h2 { font-size: 36px; }
  .section-intro { max-width: 100%; margin-top: 14px; font-size: 15px; }
  .mobile-break { display: initial; }
  .project-featured { grid-template-columns: 1fr; }
  .project-featured-main { padding: 24px 21px 23px; }
  .project-rates .project-featured-main { padding-block: 28px; }
  .project-overline { flex-wrap: wrap; gap: 8px; }
  .project-category { font-size: 8px; }
  .project-badge { font-size: 7px; }
  .project-featured h3 { font-size: 25px; }
  .project-rates h3 { font-size: 27px; }
  .project-systematic h3 { font-size: 25px; }
  .project-description, .project-standard .project-description { font-size: 16px; line-height: 1.8; }
  #work .project-featured-main > .project-description + .project-description,
  #work .project-standard .project-description + .project-description { margin-top: 19px; }
  .project-featured-side { min-height: 182px; padding: 18px 21px 16px; border-top: 1px solid #e4e9f0; border-left: 0; }
  .featured-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 12px; margin-block: 15px; }
  .featured-metric { display: grid; gap: 3px; }
  .featured-metric strong { font-size: 17px; }
  .featured-metric > span { text-align: left; font-size: 10px; }
  .side-footnote { font-size: 9px; }
  .project-grid, .additional-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 14px; }
  .project-standard { padding: 23px 21px 21px; }
  .project-standard h3 { font-size: 22px; }
  .project-standard .project-description { min-height: 0; }
  .global-research { padding: 16px; }
  .global-research p:not(.project-category) { font-size: 16px; }
  .project-automation { grid-template-columns: 1fr; gap: 12px; margin-top: 14px; padding: 23px 21px; }
  .project-automation h3 { font-size: 21px; }
  .automation-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr; align-items: center; justify-items: center; gap: 4px; padding: 14px 0 0; border-top: 1px solid #e5e9ef; border-left: 0; font-size: 7px; text-align: center; }
  .automation-flow b { margin: 0; transform: rotate(-90deg); }

  .operations-section { padding-block: 73px; }
  .ops-steps li { grid-template-columns: 28px minmax(0, 1fr); gap: 9px 11px; min-height: 57px; padding-block: 6px; }
  .ops-steps strong { font-size: 12px; }
  .ops-tag { grid-column: 2; grid-row: 2; margin: -11px 0 0; padding-bottom: 7px; text-align: left; font-size: 10px; white-space: normal; }
  .section-heading-compact h2 { font-size: 31px; }
  .additional-card { padding: 21px; }
  .additional-card > p:not(.project-category) { min-height: 0; }

  .skills-section { padding-block: 68px; }
  .skills-layout { grid-template-columns: 1fr; gap: 27px; }
  .skills-heading h2 { font-size: 32px; }
  .skill-row { grid-template-columns: 95px 1fr; gap: 10px; padding-block: 13px; }
  .skill-row > span:last-child { font-size: 9px; line-height: 1.7; }
  .background-grid { grid-template-columns: 1fr; gap: 14px; }
  .education-panel { min-height: 245px; }
  .activity-list { padding: 20px 18px 8px; }
  .activity-head { display: block; }
  .activity-head span { display: block; margin-top: 3px; }
  .activity-item > p { font-size: 12px; }

  .credentials-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 9px; }
  .credentials-heading { grid-column: 1 / -1; }
  .credential-row { min-height: 50px; padding-left: 10px; }
  .credential-row:nth-of-type(odd) { padding-left: 0; border-left: 0; }
  .credential-row strong { font-size: 11px; }
  .credential-row span, .credential-row time { font-size: 9px; }

  .contact-section { padding-block: 66px; }
  .contact-layout { grid-template-columns: 1fr; gap: 25px; }
  .contact-layout h2 { font-size: 36px; }
  .contact-links a { grid-template-columns: 54px minmax(0, 1fr) 16px; gap: 8px; min-height: 53px; }
  .contact-links strong { overflow-wrap: anywhere; font-size: 10px; }
  .footer-inner { flex-wrap: wrap; gap: 9px 15px; }
  .footer-inner p { order: 3; width: 100%; font-size: 7px; }
}

@media (max-width: 390px) {
  .container { width: calc(100% - 32px); }
  .primary-nav { gap: 10px; }
  .primary-nav a { font-size: 9px; }
  .primary-nav .nav-linkedin { display: none; }
  .hero-actions { gap: 12px; }
  .button { padding-inline: 12px; }
  .text-link { font-size: 10px; }
  .project-badge-light { display: none; }
  .automation-flow { font-size: 7px; }
  .ops-steps li { grid-template-columns: 25px minmax(100px, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}

/* Investment strategy research edition */
.hero { padding-top: 70px; }
.hero-role { margin: 16px 0 0; font-size: 14px; }
.application-label { margin: 8px 0 0; color: #53627a; font-size: 13px; font-weight: 500; line-height: 1.8; word-break: keep-all; }
.application-label > span { margin-inline: 8px; color: #9aa5b6; }
.hero h1 { font-size: clamp(64px, 6.8vw, 84px); }
.hero-lede { max-width: 610px; font-size: clamp(21px, 2.1vw, 25px); line-height: 1.65; font-weight: 500; letter-spacing: -.055em; }
.hero-english { max-width: 545px; line-height: 1.85; }
.hero-visual { min-height: 368px; }
.flow-label { font-size: 14px; }
.flow-detail { color: #6c788b; font-size: 9px; }
.primary-nav a { font-size: 12px; }
.project-featured { grid-template-columns: minmax(0, 2fr) minmax(260px, .85fr); }
.project-featured-main { padding: 34px 36px 32px; }
.project-featured h3 { margin: 21px 0 17px; font-size: clamp(27px, 2.6vw, 33px); line-height: 1.35; text-wrap: balance; }
.project-lead { max-width: 700px; margin: 0 0 18px; color: #273b5a; font-size: 17px; font-weight: 500; line-height: 1.85; word-break: keep-all; overflow-wrap: break-word; text-wrap: pretty; }
.project-description { color: #596579; font-size: 15px; line-height: 1.9; word-break: keep-all; overflow-wrap: break-word; text-wrap: pretty; }
#work .project-featured-main > .project-description + .project-description { margin-top: 15px; }
.experiment-note { font-size: 12px; line-height: 1.8; word-break: keep-all; overflow-wrap: break-word; text-wrap: pretty; }
.project-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; margin-top: 19px; gap: 9px 21px; }
.project-links .card-link { width: fit-content; max-width: 100%; margin-top: 0; font-size: 12px; line-height: 1.65; }
.project-badge { font-size: 8px; }
.side-label { color: #65758d; font-size: 10px; }
.side-footnote { margin-top: 25px; font-size: 11px; align-items: baseline; }
.briefing-side { background: #edf2f8; }
.briefing-checks { display: grid; gap: 22px; margin-top: 28px; }
.briefing-checks > div { position: relative; padding-left: 29px; }
.briefing-checks > div > span { position: absolute; top: 3px; left: 0; color: #8c9ab0; font: 10px var(--mono); }
.briefing-checks h4 { margin: 0 0 7px; color: #2b3e5a; font-size: 14px; font-weight: 600; }
.briefing-checks p { margin: 0; color: #64748b; font-size: 12px; line-height: 1.85; word-break: keep-all; }
.research-topics { display: grid; gap: 0; margin-top: 23px; border-top: 1px solid #e5eaf1; }
.research-topics h4 { margin: 0; padding: 16px 0 7px; color: #3e587d; font-size: 13px; font-weight: 500; }
.research-topics > div { display: grid; grid-template-columns: 59px minmax(0, 1fr); gap: 17px; padding: 13px 0; border-bottom: 1px solid #e5eaf1; }
.topic-label { display: block; color: #567397; font: 10px/1.7 var(--mono); letter-spacing: .07em; }
.research-topics .topic-label { padding-top: 2px; }
.research-topics p { margin: 0; color: #627088; font-size: 12px; line-height: 1.9; word-break: keep-all; }
.rates-side { background: #f0f3f8; }
.event-total { display: grid; gap: 2px; margin-top: 25px; }
.event-total strong { color: #263d5f; font: 500 47px/1.15 var(--mono); letter-spacing: -.06em; }
.event-total > span { color: #748297; font-size: 12px; }
.curve-chart { margin: 28px 0 0; }
.curve-bars { display: flex; align-items: flex-end; justify-content: center; gap: 27px; min-height: 152px; padding: 0 15px; border-bottom: 1px solid #c9d4e3; }
.curve-column { display: grid; justify-items: center; width: 65px; gap: 8px; }
.curve-column strong { color: #304f77; font: 500 23px var(--mono); }
.curve-bar { width: 100%; border-radius: 4px 4px 0 0; }
.curve-widen { height: 100px; background: #4169a1; }
.curve-narrow { height: 89.47px; background: #a6b6cf; }
.curve-column > span { position: relative; padding: 5px 0 12px; font-size: 12px; color: #5c6e88; }
.curve-chart figcaption { margin-top: 14px; color: #768398; font-size: 11px; line-height: 1.8; text-align: center; }
.automation-side { background: #eef4f3; }
.time-comparison { margin-block: 31px; }
.time-caption { color: #637787; font-size: 12px; }
.time-comparison > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 11px; margin-top: 11px; }
.time-before { color: #93a0ae; font: 400 30px var(--mono); }
.time-arrow { color: #93a0ae; font-size: 20px; }
.time-comparison strong { color: #295b57; font: 500 40px var(--mono); letter-spacing: -.06em; }
.time-comparison small { margin-left: 4px; font: 12px var(--sans); letter-spacing: -.01em; }
.time-comparison p { color: #7a8890; font-size: 11px; line-height: 1.85; word-break: keep-all; }
.adoption-block { padding-top: 24px; border-top: 1px solid #d9e5e1; }
.adoption-block h4 { margin: 11px 0 7px; color: #355856; font-size: 21px; font-weight: 500; line-height: 1.5; letter-spacing: -.035em; }
.adoption-block p { color: #748886; font-size: 12px; }
.featured-metric strong { font-size: 25px; }
.featured-metric > span { font-size: 11px; }
.additional-research { margin-top: 30px; border: 1px solid #dce3ed; border-radius: 7px; background: #f1f4f8; }
.additional-research > summary { display: flex; align-items: center; gap: 22px; padding: 22px 28px; cursor: pointer; list-style: none; color: #31465f; font-size: 14px; font-weight: 500; }
.additional-research > summary::-webkit-details-marker { display: none; }
.additional-research > summary:focus-visible { outline: 3px solid #7aa1d3; outline-offset: 3px; }
.summary-caption { margin-left: auto; color: #7b889a; font-size: 11px; font-weight: 400; }
.summary-toggle { color: #627b9e; font: 19px var(--mono); transition: transform .15s ease; }
.additional-research[open] .summary-toggle { transform: rotate(45deg); }
.additional-research .additional-grid { padding: 0 22px 22px; }
.additional-card > p:not(.project-category) { min-height: 0; font-size: 13px; line-height: 1.9; }
.additional-card .project-links { margin-top: 0; }
.ops-steps li { min-height: 62px; }
.ops-steps strong { font-size: 15px; }
.ops-tag { font: 12px var(--sans); word-break: keep-all; }
.section-heading { display: block; }
.section-heading .section-intro { max-width: none; margin: 18px 0 0; }
.credentials-heading .eyebrow { font-size: 9px; }
.credential-row strong { font-size: 12px; }
.credential-row span, .credential-row time { font-size: 10px; }
.activity-item > p { font-size: 13px; line-height: 1.85; }
.contact-note { color: #7a8799; font-size: 12px; word-break: keep-all; }
.site-footer .footer-inner p { font-size: 9px; }

@media (min-width: 721px) and (max-width: 980px) {
  .project-featured { grid-template-columns: minmax(0, 1.7fr) minmax(220px, .8fr); }
  .project-featured-main { padding-inline: 26px; }
  .project-badge { display: none; }
  .time-comparison > div { gap: 8px; }
  .time-comparison strong { font-size: 33px; }
  .time-before { font-size: 25px; }
}

@media (max-width: 720px) {
  .hero { padding-top: 56px; }
  .header-inner { gap: 16px; }
  .primary-nav { gap: 13px; }
  .primary-nav a { font-size: 10px; white-space: nowrap; }
  .hero h1 { font-size: clamp(60px, 17vw, 76px); }
  .hero-role { font-size: 12px; }
  .application-label { font-size: 11px; }
  .application-label > span { margin-inline: 4px; }
  .hero-lede { font-size: 21px; line-height: 1.7; }
  .desktop-break { display: none; }
  .hero-english { font-size: 14px; line-height: 1.95; }
  .hero-visual { min-height: 342px; }
  .flow-label { font-size: 13px; }
  .flow-detail { font-size: 9px; }
  .project-featured { grid-template-columns: 1fr; }
  .project-featured-main { padding: 26px 22px; }
  .project-featured h3, .project-rates h3 { font-size: 26px; }
  .project-lead { font-size: 16px; line-height: 1.85; }
  .project-description { font-size: 15px; line-height: 1.95; }
  .project-featured-side { padding: 24px 22px; min-height: 0; }
  .project-links { grid-template-columns: 1fr; gap: 7px; }
  .project-links .card-link { font-size: 11px; }
  .briefing-checks { gap: 20px; margin-top: 21px; }
  .briefing-checks p { font-size: 13px; }
  .research-topics > div { grid-template-columns: 51px minmax(0, 1fr); gap: 11px; }
  .research-topics p { font-size: 12px; }
  .event-total { margin-top: 17px; }
  .event-total strong { font-size: 40px; }
  .curve-chart { max-width: 270px; margin: 19px auto 0; }
  .time-comparison { margin: 23px 0; }
  .time-comparison strong { font-size: 39px; }
  .adoption-block h4 br { display: none; }
  .adoption-block h4 { font-size: 21px; }
  .side-footnote { font-size: 11px; }
  .additional-research > summary { flex-wrap: wrap; gap: 5px 11px; padding: 19px 21px; }
  .summary-caption { order: 3; flex-basis: 100%; margin-left: 0; }
  .summary-toggle { margin-left: auto; }
  .additional-research .additional-grid { padding: 0 14px 14px; }
  .ops-steps li { min-height: 75px; gap: 7px 11px; }
  .ops-steps strong { font-size: 14px; }
  .ops-tag { margin: -12px 0 0; padding-bottom: 10px; font-size: 11px; line-height: 1.75; }
  .credential-row strong { font-size: 11px; }
  .credential-row span, .credential-row time { font-size: 10px; }
  .contact-links strong { font-size: 12px; }
}

@media print {
  .site-header, .skip-link, .hero-actions, .site-footer { display: none; }
  body { background: white; font-size: 11pt; }
  .container { width: 100%; }
  .hero, .section, .contact-section { padding-block: 18pt; }
  .hero h1 { font-size: 40pt; }
  .hero-layout { grid-template-columns: 1fr; min-height: 0; gap: 15pt; }
  .hero-visual { display: none; }
  .project-featured { break-inside: avoid; grid-template-columns: 1fr; margin-top: 14pt; }
  .project-featured-main { padding: 16pt; }
  .project-featured-side { display: none; }
  .project-description { font-size: 10pt; }
  .additional-research > .additional-grid { display: grid; }
  .background-grid, .contact-layout { grid-template-columns: 1fr; }
  a { text-decoration: underline; }
}

.sample-shell { width: min(960px, calc(100% - 64px)); margin: 0 auto; padding: 48px 0 72px; }
.sample-back { display: inline-block; margin-bottom: 34px; color: var(--blue); font-size: 13px; text-underline-offset: 4px; }
.sample-header { padding-bottom: 28px; border-bottom: 2px solid var(--navy); }
.sample-header h1 { margin: 14px 0; color: var(--navy); font-size: clamp(27px, 4vw, 42px); letter-spacing: -.045em; line-height: 1.25; }
.sample-header h1 span { display: block; margin-bottom: 9px; font-family: var(--mono); font-size: .65em; letter-spacing: -.035em; }
.sample-deck { margin: 12px 0; color: var(--muted); font-size: 15px; line-height: 1.85; }
.sample-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--muted); font-size: 11px; }
.sample-label { display: inline-block; padding: 5px 10px; border: 1px solid #c8d4e4; background: var(--pale-blue); color: var(--blue); font-size: 11px; font-weight: 600; }
.sample-contents { display: flex; flex-wrap: wrap; gap: 9px 17px; padding: 22px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.sample-contents a { color: var(--blue); text-underline-offset: 3px; }
.sample-section { padding: 25px 0; border-bottom: 1px solid var(--line); }
.sample-section h2 { margin: 0 0 15px; color: var(--navy); font-size: 20px; letter-spacing: -.035em; }
.sample-bullets { margin: 0; padding: 0; list-style: none; }
.sample-bullets li { padding-left: 17px; position: relative; margin: 0 0 13px; line-height: 1.9; word-break: keep-all; overflow-wrap: anywhere; }
.sample-bullets li::before { content: "•"; position: absolute; left: 0; color: var(--blue); }
.sample-bullets a { color: var(--blue); font-size: 12px; text-underline-offset: 3px; }
.sample-section time { font-family: var(--mono); font-size: 13px; font-weight: 600; }
.sample-note { margin: 16px 0 0; color: var(--muted); font-size: 12px; line-height: 1.85; overflow-wrap: anywhere; }
.sample-audit { margin-top: 27px; padding: 21px 24px; border: 1px solid var(--line); border-radius: 7px; background: white; }
.sample-audit summary { color: var(--navy); font-size: 13px; font-weight: 600; cursor: pointer; }
.sample-audit p { font-size: 12px; line-height: 1.9; color: var(--muted); overflow-wrap: anywhere; }
.sample-audit a { color: var(--blue); }
@media (max-width: 720px) {
  .sample-shell { width: calc(100% - 36px); padding: 25px 0 44px; }
  .sample-back { margin-bottom: 24px; }
  .sample-header h1 { font-size: 28px; }
  .sample-deck, .sample-bullets li { font-size: 14px; }
  .sample-section { padding: 23px 0; }
  .sample-audit { padding: 17px; }
}
@media print {
  .sample-shell { width: 100%; padding: 0; }
  .sample-back, .sample-contents { display: none; }
  .sample-header h1 { font-size: 23pt; }
  .sample-section { padding: 12pt 0; }
  .sample-section h2 { break-after: avoid; }
  .sample-bullets li { break-inside: avoid; font-size: 10pt; }
  .sample-audit { display: none; }
}
/* Global FI Sales portfolio additions */
.hero-support {
  max-width: 540px;
  margin: 15px 0 0;
  color: #63718a;
  font-size: 14px;
  line-height: 1.9;
  word-break: keep-all;
}

.settlement-side { background: #f2f5f8; }
.settlement-steps { display: grid; gap: 0; margin: 18px 0 14px; padding: 0; list-style: none; }
.settlement-steps li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 11px 0;
  border-bottom: 1px solid #dce4ee;
}
.settlement-steps li > span { color: #8795aa; font: 10px var(--mono); }
.settlement-steps li div { display: grid; gap: 3px; min-width: 0; }
.settlement-steps strong { color: #304360; font-size: 12px; font-weight: 600; }
.settlement-steps small { color: #7a8799; font-size: 10px; line-height: 1.55; }
.settlement-steps b { color: #70819a; font: 8px var(--mono); letter-spacing: .06em; }
.settlement-result {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  margin-top: auto;
  padding: 16px;
  border: 1px solid #dce4ee;
  background: #fff;
}
.settlement-result strong { color: #2d5574; font: 500 37px/1 var(--mono); }
.settlement-result span { color: #40526a; font-size: 12px; font-weight: 600; }
.settlement-result small { color: #8190a4; font-size: 10px; }

.implementation-side { background: #eef4f3; }
.briefing-engine { display: grid; gap: 10px; margin: 20px 0 5px; }
.engine-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.engine-inputs > div, .engine-output {
  display: grid;
  gap: 4px;
  padding: 11px;
  border: 1px solid #d8e4e1;
  background: rgba(255,255,255,.68);
}
.engine-inputs strong { color: #365e5a; font: 11px var(--mono); letter-spacing: .06em; }
.engine-inputs span { color: #435a61; font-size: 11px; font-weight: 600; }
.engine-inputs small { color: #7c8f8d; font-size: 9px; }
.engine-arrow { color: #66817d; font: 16px var(--mono); text-align: center; line-height: 1; }
.engine-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.engine-checks span {
  padding: 7px 6px;
  border: 1px solid #d8e4e1;
  color: #526b68;
  font-size: 9px;
  text-align: center;
}
.engine-output { background: #e1eeeb; border-color: #c9ddd8; }
.engine-output strong { color: #315b56; font-size: 12px; }
.engine-output span { color: #69817d; font-size: 9px; }
.implementation-side .time-comparison { margin: 20px 0 14px; padding-top: 14px; border-top: 1px solid #d8e4e1; }
.implementation-side .time-comparison strong { font-size: 34px; }
.implementation-side .time-before { font-size: 26px; }
.implementation-side .side-footnote { margin-top: auto; }

.credit-side { background: #f4f3f0; }
.credit-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 19px 0; }
.credit-market { display: grid; gap: 6px; min-width: 0; padding: 11px; border: 1px solid #e3e0d9; background: rgba(255,255,255,.65); }
.credit-market > span { color: #8b806d; font: 8px var(--mono); letter-spacing: .07em; }
.credit-market strong { color: #4f473d; font-size: 11px; line-height: 1.5; }
.credit-market small { color: #857c70; font: 9px var(--mono); }
.credit-factor-table { border-top: 1px solid #dedad1; }
.credit-factor-table > div { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: 1px solid #e5e1d8; }
.credit-factor-table .credit-factor-head { color: #8a8174; font-size: 9px; }
.credit-factor-table strong { color: #5b5247; font-size: 10px; }
.credit-factor-table span[role="cell"] { color: #736a60; font-size: 10px; line-height: 1.7; word-break: keep-all; }
.credit-conclusion { display: grid; gap: 7px; margin-top: 16px; padding: 13px; background: #ebe7de; }
.credit-conclusion span { color: #8b806e; font: 8px var(--mono); letter-spacing: .08em; }
.credit-conclusion strong { color: #52493d; font-size: 12px; line-height: 1.7; }
.visual-disclaimer { margin: 10px 0 0; color: #898174; font-size: 9px; line-height: 1.6; }

.study-side { background: #f0f3f8; }
.study-side .event-total { display: flex; align-items: baseline; gap: 12px; }
.study-side .event-total strong { font-size: 42px; }
.study-side .event-total > span { line-height: 1.65; }
.study-curve-chart { margin-top: 17px; }
.study-side .curve-bars { min-height: 138px; }
.study-side .curve-column { gap: 6px; }
.study-side .curve-widen { height: 95px; }
.study-side .curve-narrow { height: 85px; }
.study-side .curve-column > span { font-size: 10px; white-space: nowrap; }
.study-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin: 18px 0; padding: 12px 0; border-top: 1px solid #d9e1eb; border-bottom: 1px solid #d9e1eb; }
.study-stats > div { display: grid; gap: 5px; min-width: 0; }
.study-stats span { color: #7a8798; font-size: 8px; line-height: 1.45; }
.study-stats strong { color: #354e70; font: 500 17px var(--mono); white-space: nowrap; }
.study-stats small { margin-left: 2px; color: #7c8aa0; font: 9px var(--sans); }
.dv01-visual { display: grid; gap: 8px; padding: 13px; border: 1px solid #d7e0eb; background: rgba(255,255,255,.65); }
.dv01-visual .side-label { margin-bottom: 2px; font-size: 8px; line-height: 1.6; }
.dv01-visual > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.dv01-visual > div span { color: #69778c; font-size: 9px; }
.dv01-visual > div strong { font: 500 12px var(--mono); white-space: nowrap; }
.dv01-visual .positive { color: #37695f; }
.dv01-visual .negative { color: #a65a56; }
.dv01-visual > small { margin-top: 2px; color: #8792a1; font-size: 8px; line-height: 1.55; }
.study-side .side-footnote { margin-top: 16px; }

@media (max-width: 980px) {
  .settlement-steps b { display: none; }
  .study-stats { gap: 5px; }
}
@media (max-width: 720px) {
  .hero-support { max-width: none; font-size: 13px; }
  .settlement-side, .implementation-side, .credit-side, .study-side { padding: 23px 22px; }
  .settlement-steps li { grid-template-columns: 23px minmax(0, 1fr) auto; }
  .settlement-steps b { display: inline; }
  .settlement-steps strong { font-size: 12px; }
  .settlement-steps small { font-size: 10px; }
  .implementation-side .time-comparison { margin: 20px 0 14px; }
  .implementation-side .time-comparison strong { font-size: 37px; }
  .credit-factor-table > div { grid-template-columns: 76px minmax(0, 1fr); }
  .credit-factor-table span[role="cell"] { font-size: 11px; }
  .study-side .curve-chart { max-width: none; }
  .study-side .curve-bars { max-width: 300px; margin-inline: auto; }
  .study-stats { gap: 8px; }
  .study-stats span { font-size: 9px; }
  .study-stats strong { font-size: 19px; }
  .dv01-visual > div span { font-size: 10px; }
  .dv01-visual > div strong { font-size: 13px; }
}
@media (max-width: 390px) {
  .settlement-steps b { font-size: 7px; }
  .study-stats { gap: 4px; }
  .study-stats span { font-size: 8px; }
  .study-stats strong { font-size: 16px; }
  .credit-factor-table > div { grid-template-columns: 69px minmax(0, 1fr); gap: 7px; }
}

