:root {
  --teal: #073f42;
  --teal-dark: #052f31;
  --ivory: #f5f3ed;
  --off-white: #fbfaf7;
  --charcoal: #202524;
  --muted: #626a67;
  --coral: #cf7465;
  --line: #c8cbc5;
  --page: clamp(22px, 4.8vw, 72px);
  --shell: 1460px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ivory); }
body { margin: 0; overflow-x: hidden; background: var(--ivory); color: var(--charcoal); font-family: Pretendard, "Noto Sans KR", system-ui, sans-serif; line-height: 1.65; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 4px; }
::selection { background: var(--coral); color: var(--teal-dark); }
.case-skip { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 14px; background: var(--off-white); transform: translateY(-160%); }
.case-skip:focus { transform: translateY(0); }
.case-header { height: 76px; position: absolute; inset: 0 0 auto; z-index: 20; display: flex; align-items: center; justify-content: space-between; padding: 0 var(--page); }
.case-wordmark { min-height: 44px; display: inline-flex; align-items: center; gap: 9px; padding: 4px 12px 4px 4px; background: var(--ivory); color: #000; text-decoration: none; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.case-wordmark img { width: 36px; height: 36px; object-fit: contain; }
.case-nav { display: flex; align-items: center; gap: clamp(22px, 3vw, 48px); }
.case-nav a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.case-nav .case-nav-action { color: var(--coral); }
.case-shell { width: min(var(--shell), 100%); margin-inline: auto; padding-inline: var(--page); }
.case-label { margin: 0; color: var(--teal); font-size: 10px; font-weight: 800; line-height: 1.2; letter-spacing: .13em; }
.case-media { margin: 0; overflow: hidden; background: #dfd8ca; }
.case-media img { width: 100%; height: 100%; display: block; object-fit: cover; }
.case-panel { background: var(--off-white); }
.case-panel p, .case-copy > p, .case-narrative-note p, .case-delta-copy p { margin: 0; font-size: clamp(14px, 1.05vw, 16px); word-break: keep-all; }
.case-panel p + p, .case-copy > p + p, .case-narrative-note p + p, .case-delta-copy p + p { margin-top: 16px; }

.case-intro { min-height: 100svh; position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: end; padding-top: clamp(132px, 16vh, 180px); padding-bottom: clamp(100px, 11vw, 160px); }
.case-intro-heading { position: relative; z-index: 3; grid-column: 1 / span 8; align-self: start; margin-bottom: clamp(48px, 6vw, 84px); }
.case-title-display { max-width: 980px; margin: 0; font-size: clamp(68px, 8.7vw, 132px); font-weight: 560; line-height: .91; letter-spacing: -.065em; word-break: keep-all; }
.case-intro-media { grid-column: 1 / span 9; min-height: clamp(500px, 52vw, 760px); }
.case-intro-media img { object-position: center; }
.case-intro-panel { position: relative; z-index: 2; grid-column: 8 / -1; margin-left: clamp(-100px, -7vw, -64px); margin-bottom: clamp(34px, 5vw, 76px); padding: clamp(30px, 4vw, 58px); }
.case-intro-panel .case-label { margin-bottom: 28px; }

.case-section-heading { display: grid; grid-template-columns: 1fr 9fr 2fr; align-items: start; margin-bottom: clamp(48px, 6vw, 86px); }
.case-section-heading h2 { grid-column: 2 / span 2; max-width: 980px; margin: 0; font-size: clamp(54px, 6.4vw, 94px); font-weight: 570; line-height: .98; letter-spacing: -.055em; word-break: keep-all; }
.case-diagnosis { position: relative; padding-top: clamp(120px, 12vw, 180px); padding-bottom: clamp(150px, 14vw, 220px); }
.case-diagnosis-media { width: 82%; min-height: clamp(540px, 55vw, 820px); }
.case-diagnosis-panel { position: absolute; z-index: 2; right: var(--page); bottom: clamp(70px, 7vw, 110px); width: min(560px, 42vw); padding: clamp(30px, 3.5vw, 52px); background: var(--teal-dark); color: var(--off-white); }
.case-diagnosis-panel .case-label { color: var(--coral); }
.case-diagnosis-panel .case-lead { margin-top: 24px; color: rgb(251 250 247 / 76%); }
.case-numbered-list { margin: 28px 0 0; padding: 0; list-style: none; }
.case-numbered-list li { display: grid; grid-template-columns: 28px 1fr; gap: 14px; padding: 18px 0; border-top: 1px solid rgb(251 250 247 / 22%); }
.case-numbered-list li > span { color: var(--coral); font-size: 9px; font-weight: 800; letter-spacing: .1em; }
.case-numbered-list strong { display: block; font-size: 14px; line-height: 1.45; }
.case-numbered-list p { margin: 8px 0 0; color: rgb(251 250 247 / 68%); font-size: 12px; line-height: 1.6; }

.case-split { min-height: 900px; display: grid; grid-template-columns: minmax(0, 7fr) minmax(350px, 5fr); align-items: center; padding-top: clamp(110px, 11vw, 170px); padding-bottom: clamp(110px, 11vw, 170px); }
.case-split-text-first { grid-template-columns: minmax(350px, 5fr) minmax(0, 7fr); }
.case-copy { position: relative; z-index: 2; max-width: 620px; padding: clamp(26px, 3.5vw, 54px); background: var(--ivory); }
.case-split-text-first .case-copy { margin-right: clamp(-92px, -6vw, -56px); }
.case-expertise-panel { position: relative; z-index: 2; margin-left: clamp(-92px, -6vw, -56px); padding: clamp(30px, 3.7vw, 56px); }
.case-copy h2, .case-expertise-panel h2 { margin: 18px 0 30px; font-size: clamp(42px, 4.5vw, 68px); font-weight: 580; line-height: 1.02; letter-spacing: -.05em; word-break: keep-all; }
.case-split-media { min-height: clamp(560px, 52vw, 780px); }
.case-patient .case-split-media, .case-expertise .case-split-media { min-height: 0; aspect-ratio: 5 / 4; }
.case-patient .case-split-media img, .case-expertise .case-split-media img { object-position: center; }
.case-question-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 36px; border-top: 1px solid var(--charcoal); }
.case-question-grid p { min-height: 94px; margin: 0; padding: 15px 12px 15px 0; border-bottom: 1px solid var(--line); font-size: 12px; line-height: 1.55; }
.case-question-grid p:nth-child(odd) { padding-right: 20px; }
.case-question-grid p:nth-child(even) { padding-left: 20px; border-left: 1px solid var(--line); }
.case-question-grid span { display: block; margin-bottom: 8px; color: var(--coral); font-size: 8px; font-weight: 800; }
.case-question-grid + p { margin-top: 24px; }
.case-value-chain { margin: 34px 0; border-top: 1px solid var(--charcoal); border-bottom: 1px solid var(--charcoal); padding: 18px 0; }
.case-value-chain div { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; }
.case-value-chain small { color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.case-value-chain strong { font-size: 16px; }
.case-value-chain > span { display: block; margin: 4px 0 4px auto; width: 14px; color: var(--coral); }

.case-narrative { background: var(--teal-dark); color: var(--off-white); }
.case-narrative-content { position: relative; z-index: 2; padding-top: clamp(104px, 10vw, 150px); padding-bottom: clamp(104px, 10vw, 150px); }
.case-narrative .case-label { color: var(--coral); font-size: clamp(12px, .9vw, 14px); }
.case-narrative h2 { max-width: 900px; margin: 30px 0 0; font-size: clamp(40px, 4.2vw, 56px); font-weight: 540; line-height: 1.18; letter-spacing: -.04em; word-break: keep-all; }
.case-narrative-note { width: min(680px, 100%); margin: 42px 0 0; padding-top: 30px; border-top: 1px solid rgb(251 250 247 / 22%); color: rgb(251 250 247 / 76%); }
.case-narrative-note p { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.7; }
.case-narrative-single-line { white-space: nowrap; }

.case-editorial-list { margin: 34px 0; padding: 0; border-top: 1px solid var(--charcoal); list-style: none; counter-reset: execution; }
.case-editorial-list li { counter-increment: execution; position: relative; padding: 13px 0 13px 34px; border-bottom: 1px solid var(--line); font-size: 13px; }
.case-editorial-list li::before { content: "0" counter(execution); position: absolute; left: 0; color: var(--coral); font-size: 8px; font-weight: 800; }

.case-result { position: relative; padding-top: clamp(130px, 13vw, 200px); padding-bottom: clamp(170px, 15vw, 230px); }
.case-result-heading { position: relative; z-index: 3; margin-bottom: -5vw; color: var(--charcoal); }
.case-result-media { width: 100%; min-height: clamp(620px, 58vw, 860px); }
.case-impact { position: relative; z-index: 2; width: min(1160px, calc(100% - (var(--page) * 2))); margin: clamp(-100px, -7vw, -70px) auto 0; display: grid; grid-template-columns: 5fr 7fr; background: var(--off-white); }
.case-impact-intro { padding: clamp(32px, 4vw, 58px); }
.case-impact-intro .case-label { margin-bottom: 28px; }
.case-impact-intro p { margin: 0; font-size: 14px; }
.case-impact-intro p + p { margin-top: 16px; }
.case-impact-grid { display: grid; grid-template-columns: 1fr 1fr; border-left: 1px solid var(--line); }
.case-impact-title { grid-column: 1 / -1; margin: 0; padding: 28px clamp(24px, 3vw, 42px); border-bottom: 1px solid var(--line); font-size: clamp(24px, 2.4vw, 34px); font-weight: 580; line-height: 1; letter-spacing: -.035em; }
.case-impact-grid > div { min-height: 210px; padding: clamp(24px, 3vw, 42px); border-bottom: 1px solid var(--line); }
.case-impact-grid > div:nth-of-type(2) { border-left: 1px solid var(--line); }
.case-impact-grid > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
.case-impact-grid small { color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.case-impact-grid p { margin: 18px 0 0; font-size: 13px; line-height: 1.6; }
.case-impact-number > strong { display: block; margin-top: 18px; color: var(--coral); font-size: clamp(46px, 5vw, 72px); font-weight: 570; line-height: .9; letter-spacing: -.06em; }

.case-delta { background: var(--teal); color: var(--off-white); }
.case-delta-grid { min-height: 760px; display: grid; grid-template-columns: 7fr 5fr; gap: clamp(60px, 8vw, 140px); align-items: center; padding-top: 120px; padding-bottom: 120px; }
.case-delta .case-label { color: var(--coral); }
.case-delta h2 { max-width: 820px; margin: 34px 0 0; font-size: clamp(58px, 7vw, 104px); font-weight: 550; line-height: .96; letter-spacing: -.06em; word-break: keep-all; }
.case-delta-copy { color: rgb(251 250 247 / 76%); }
.case-delta-formula { padding-top: 24px; border-top: 1px solid rgb(251 250 247 / 28%); color: var(--off-white); font-size: 11px !important; font-weight: 750; letter-spacing: .04em; }
.case-delta-wordmark { color: var(--off-white); font-size: 11px !important; font-weight: 800; letter-spacing: .1em; }

.case-footer { display: grid; grid-template-columns: 2fr 5fr; gap: 40px; padding: 30px var(--page); background: var(--ivory); color: #000; border-top: 1px solid rgb(32 37 36 / 18%); }
.case-footer-brand { display: inline-flex; align-items: center; gap: 10px; width: max-content; text-decoration: none; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.case-footer-brand img { width: 34px; height: 34px; object-fit: contain; }
.case-footer p { margin: 0; color: rgb(32 37 36 / 68%); font-size: 12px; }

@media (max-width: 900px) {
  .case-intro-panel { grid-column: 7 / -1; }
  .case-diagnosis-panel { width: min(600px, 50vw); }
  .case-split, .case-split-text-first { grid-template-columns: 1fr 1fr; }
  .case-impact { grid-template-columns: 1fr; }
  .case-impact-grid { border-left: 0; border-top: 1px solid var(--line); }
}

@media (max-width: 680px) {
  .case-header { height: 68px; }
  .case-nav a:not(.case-nav-action) { display: none; }
  .case-nav { gap: 0; }
  .case-wordmark { padding-right: 8px; }
  .case-wordmark img { width: 32px; height: 32px; }
  .case-intro { min-height: auto; display: block; padding-top: 116px; padding-bottom: 88px; }
  .case-intro-heading { margin-bottom: 44px; }
  .case-title-display { font-size: clamp(58px, 17vw, 70px); }
  .case-intro-media { min-height: 270px; margin-inline: calc(var(--page) * -1); }
  .case-intro-panel { margin: 0; padding: 34px 0 0; background: transparent; }
  .case-section-heading { display: block; margin-bottom: 42px; }
  .case-section-heading h2 { margin-top: 18px; font-size: clamp(46px, 13vw, 56px); }
  .case-diagnosis { padding-top: 90px; padding-bottom: 90px; }
  .case-diagnosis-media { width: calc(100% + (var(--page) * 2)); min-height: 300px; margin-left: calc(var(--page) * -1); }
  .case-diagnosis-panel { position: relative; right: auto; bottom: auto; width: auto; margin: 0; padding: 34px var(--page); }
  .case-numbered-list p { font-size: 13px; }
  .case-split, .case-split-text-first { min-height: auto; display: flex; flex-direction: column; padding-top: 90px; padding-bottom: 90px; }
  .case-split > * { min-width: 0; width: 100%; }
  .case-split-text-first .case-copy { order: 2; }
  .case-split-text-first .case-split-media { order: 1; }
  .case-split-media { width: calc(100% + (var(--page) * 2)); min-height: 310px; margin-inline: calc(var(--page) * -1); }
  .case-patient .case-split-media, .case-expertise .case-split-media { min-height: 0; aspect-ratio: 5 / 4; }
  .case-copy, .case-expertise-panel { max-width: none; margin: 0; padding: 34px 0 0; background: transparent; }
  .case-copy h2, .case-expertise-panel h2 { font-size: clamp(42px, 12vw, 50px); }
  .case-question-grid { grid-template-columns: 1fr; }
  .case-question-grid p:nth-child(even) { padding-left: 0; border-left: 0; }
  .case-narrative-content { padding-top: 84px; padding-bottom: 84px; }
  .case-narrative h2 { margin-top: 24px; font-size: clamp(34px, 9.5vw, 42px); line-height: 1.2; }
  .case-narrative h2 br { content: " "; }
  .case-narrative h2 br::after { content: " "; }
  .case-narrative-note { width: 100%; margin-top: 34px; padding-top: 24px; }
  .case-narrative-note p { font-size: clamp(16px, 4.4vw, 18px); }
  .case-narrative-single-line { white-space: normal; }
  .case-result { padding-top: 100px; padding-bottom: 110px; }
  .case-result-heading { margin-bottom: 38px; }
  .case-result-media { width: calc(100% + (var(--page) * 2)); min-height: 330px; margin-left: calc(var(--page) * -1); }
  .case-impact { width: auto; margin: 0; display: block; }
  .case-impact-intro { padding: 34px 0; }
  .case-impact-grid { display: block; }
  .case-impact-title { padding: 28px 0; }
  .case-impact-grid > div, .case-impact-grid > div:nth-of-type(2) { min-height: 0; padding: 28px 0; border-left: 0; border-bottom: 1px solid var(--line); }
  .case-delta-grid { min-height: auto; grid-template-columns: 1fr; gap: 58px; padding-top: 100px; padding-bottom: 100px; }
  .case-delta h2 { font-size: clamp(54px, 15vw, 66px); }
  .case-footer { display: block; padding: 26px var(--page); }
  .case-footer p { margin-top: 14px; }
}

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