.case-study { overflow: hidden; background: var(--color-paper); }
.case-study__article { overflow: hidden; }
.case-study-hero { padding-block: 72px 128px; }
.case-study-breadcrumb { margin-bottom: 56px; }
.case-study-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; color: var(--color-muted); font: 400 10px/1.5 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.case-study-breadcrumb a { text-decoration: none; transition: color .2s ease; }
.case-study-breadcrumb a:hover { color: var(--color-accent-text); }
.case-study-breadcrumb [aria-current="page"] { color: var(--color-ink); }
.case-study-hero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; align-items: end; }
.case-study-hero__title { grid-column: 1 / span 7; }
.case-study-hero__title h1 { max-width: 760px; font-size: clamp(44px, 5vw, 72px); line-height: 1.05; letter-spacing: -.025em; }
.case-study-hero__lead { grid-column: 9 / span 4; }
.case-study-hero__lead > p { max-width: 48ch; color: var(--color-muted); font-size: 15.2px; line-height: 1.7; }
.case-study-hero__lead .button-row { margin-top: 36px; }
.case-study-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; margin: 64px 0 0; padding: 28px 32px; background: var(--color-night);border-radius: var(--radius-ui); }
.case-study-meta dt { margin-bottom: 12px; color: var(--color-accent-text-dark); font: 400 9px/1.5 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; }
.case-study-meta dd { margin: 0; color: rgb(243 239 231 / .78); font-size: 13px; line-height: 1.7; }
.case-study-hero__media { position: relative; margin-top: 64px; overflow: hidden; background: var(--color-night); }
.case-study-hero__media img { display: block; width: 100%; max-height: 900px; object-fit: cover; }
.case-study-hero__media > span { position: absolute; right: 20px; bottom: 20px; width: 8px; height: 8px; background: var(--color-accent); }
.case-study-section, .case-block { margin: 0; padding-block: 128px; }
.case-study-challenge, .case-study .case-block--solution { padding-top: var(--section-space); }
.case-study-index { margin-bottom: 24px; color: var(--color-accent-text); font: 400 10px/1.5 var(--font-mono); letter-spacing: .18em; text-transform: uppercase; }
.section-dark .case-study-index, .case-block--dark .case-study-index { color: var(--color-accent-text-dark); }
.case-study-split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.case-study-split > :first-child { grid-column: 1 / span 4; }
.case-study-split > :last-child { grid-column: 7 / span 6; }
.case-study-split h2, .case-study-outcome h2 { font-size: clamp(38px, 4vw, 60px); line-height: 1; letter-spacing: -.025em; }
.case-study-prose { color: var(--color-muted); font-size: 16px; line-height: 1.75; }
.case-study-prose > * + * { margin-top: 20px; }
.case-study-prose h3 { color: var(--color-ink); font-size: 22px; }
.case-study-prose ul, .case-study-prose ol { padding-left: 1.25em; }
.case-study-prose a { color: var(--color-accent-text); text-underline-offset: 4px; }
.case-study-approach__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.case-study-approach__grid > .case-study-index { grid-column: 1 / span 3; }
.case-study-approach__copy { grid-column: 5 / span 8; }
.case-study-approach__copy > :first-child { color: rgb(243 239 231 / .92); font: 500 clamp(32px, 4vw, 56px)/1.1 var(--font-display); letter-spacing: -.02em; }
.case-study-approach__copy > * + * { max-width: 64ch; margin-top: 40px; color: rgb(243 239 231 / .55); font-size: 15px; line-height: 1.75; }

.case-study .case-block h2 { margin: 0; font-size: clamp(38px, 4vw, 60px); line-height: 1.02; letter-spacing: -.025em; }
.case-study .case-block h3 { margin: 0; font-size: 20px; line-height: 1.25; }
.case-study .case-block img { display: block; width: 100%; height: auto; }
.case-study .case-block figcaption { margin-top: 14px; color: var(--color-muted); font: 400 9px/1.5 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; }
.case-study .case-block iframe { display: block; width: 100%; min-height: 520px; border: 0; }
.case-block--neutral, .case-block--solution, .case-block--gallery { background: var(--color-paper-deep); }
.case-block--dark { color: var(--color-paper); background: var(--color-night); }
.case-block--dark .case-study-prose { color: rgb(243 239 231 / .58); }
.case-block--dark .case-block__media figcaption { color: rgb(243 239 231 / .48); }
.case-block__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 48px 16px; align-items: center; }
.case-block__copy { grid-column: 1 / span 5; }
.case-block__copy .case-study-prose { margin-top: 28px; }
.case-block__media { grid-column: 7 / span 6; overflow: hidden; }
.case-block--left .case-block__copy { grid-column: 8 / span 5; }
.case-block--left .case-block__media { grid-column: 1 / span 6; grid-row: 1; }
.case-block--full .case-block__copy { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.case-block--full .case-block__copy .case-study-index, .case-block--full .case-block__copy h2 { grid-column: 1 / span 5; }
.case-block--full .case-block__copy .case-study-prose { grid-column: 8 / span 5; grid-row: 1 / span 2; margin-top: 0; }
.case-block--full .case-block__media { grid-column: 1 / -1; }
.case-block__heading { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0 16px; }
.case-block__heading .case-study-index, .case-block__heading h2 { grid-column: 1 / span 5; }
.case-block__heading > p:not(.case-study-index), .case-block__heading > .case-study-prose { grid-column: 8 / span 5; grid-row: 1 / span 2; color: var(--color-muted); font-size: 15px; line-height: 1.7; }
.case-study .case-block__solution-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 64px 0 0; border-block: 1px solid rgb(22 18 16 / .14); }
.case-study .case-block__solution-grid > div { min-height: 260px; padding: 32px; border-top: 0; border-right: 1px solid rgb(22 18 16 / .14); }
.case-study .case-block__solution-grid > div:first-child { padding-left: 0; }
.case-study .case-block__solution-grid > div:last-child { border-right: 0; padding-right: 0; }
.case-block__solution-grid h3 { margin-bottom: 20px !important; color: var(--color-accent-text); font: 400 10px/1.5 var(--font-mono) !important; letter-spacing: .16em; text-transform: uppercase; }
.case-block__solution-grid .case-study-prose { font-size: 14px; }
.case-block__wide-media { margin-top: 64px; overflow: hidden; }
.case-block__gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 64px; }
.case-block__gallery figure { overflow: hidden; background: rgb(22 18 16 / .05); }
.case-block__gallery--editorial { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.case-block__gallery--editorial figure:nth-child(3n + 1) { grid-column: span 7; }
.case-block__gallery--editorial figure:nth-child(3n + 2) { grid-column: span 5; }
.case-block__gallery--editorial figure:nth-child(3n + 3) { grid-column: 3 / span 8; }
.case-block__gallery--full { grid-template-columns: 1fr; }
.case-block__comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 64px; }
.case-block__comparison figure { position: relative; overflow: hidden; }
.case-block__comparison figcaption { position: absolute; right: 16px; bottom: 16px; margin: 0 !important; padding: 7px 10px; background: var(--color-night); color: var(--color-paper) !important; }
.case-study .case-block--process .case-block__steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0; margin-top: 64px; border: 1px solid rgb(22 18 16 / .14); list-style: none; }
.case-study .case-block--process .case-block__steps > li { position: relative; min-height: 230px; margin: 0; padding: 28px; border-top: 0; border-right: 1px solid rgb(22 18 16 / .14); }
.case-study .case-block--process .case-block__steps > li::before { content: none; }
.case-study .case-block--process .case-block__steps > li:last-child { border-right: 0; }
.case-block__steps li > span { display: flex; width: 32px; height: 32px; align-items: center; justify-content: center; margin-bottom: 32px; background: var(--color-accent); color: #fff; font: 400 10px/1 var(--font-mono); }
.case-block__steps h3 { margin-bottom: 10px !important; font-size: 14px !important; }
.case-block__steps p { color: var(--color-muted); font-size: 13px; line-height: 1.65; }
.case-block__step-image { margin-top: 24px; }

.case-study-outcome__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; }
.case-study-outcome__grid > :first-child { grid-column: 1 / span 5; }
.case-study-outcome__grid > :last-child { grid-column: 8 / span 5; }
.case-study-motto { display: inline-block; margin-top: 48px; padding: 16px 24px; background: var(--color-accent); color: #fff; font: 700 clamp(26px, 3vw, 40px)/1.15 var(--font-display); }
.case-study-content .case-study-prose { max-width: 760px; }
.case-study-content .case-study-prose img { border-radius: var(--radius-ui); }
.case-study-content--before-share, .case-study-outcome--before-share { padding-bottom: 32px; }
.case-study--portfolio-post .case-study-hero { padding-bottom: 64px; }
.case-study--portfolio-post .case-study-content { padding-top: 64px; }
.case-study--portfolio-post .case-study-content .case-study-prose { margin-inline: auto; }
.case-study-share { padding-bottom: 128px; }
.case-study-share__panel { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 32px 16px; align-items: center; padding-block: 32px; border-block: 1px solid var(--color-border); color: var(--color-ink); }
.case-study-share__heading { grid-column: 1 / span 6; }
.case-study-share__heading .case-study-index { margin-bottom: 10px; color: var(--color-accent-text); }
.case-study-share__heading h2 { margin: 0; font-size: clamp(22px, 2vw, 30px); line-height: 1.15; letter-spacing: -.015em; }
.case-study-share__actions { position: relative; grid-column: 8 / -1; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: flex-end; padding-bottom: 24px; }
.case-study-share__icon, .case-study-share__copy { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--color-border); border-radius: var(--radius-ui); background: transparent; color: var(--color-ink); text-decoration: none; transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform .2s ease; }
.case-study-share__icon { width: 44px; border-color: var(--color-accent); background: var(--color-accent); color: #fff; }
.case-study-share__copy { gap: 10px; padding: 0 18px; border-color: var(--color-accent); background: var(--color-accent); color: #fff; font: 600 12px/1 var(--font-sans); cursor: pointer; }
.case-study-share__icon svg, .case-study-share__copy svg { width: 20px; height: 20px; fill: currentColor; }
.case-study-share__icon:hover, .case-study-share__icon:focus-visible { border-color: #a4299b; background: #a4299b; color: #fff; transform: translateY(-2px); }
.case-study-share__copy:hover, .case-study-share__copy:focus-visible, .case-study-share__copy.is-copied { border-color: #a4299b; background: #a4299b; color: #fff; transform: translateY(-2px); }
.case-study-share__status { position: absolute; right: 0; bottom: 0; min-height: 16px; color: var(--color-muted); font: 400 10px/1.5 var(--font-mono); letter-spacing: .04em; }
.case-study-next { padding-block: 96px 128px; background: var(--color-paper-deep); }
.case-study-next__link { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; align-items: center; text-decoration: none; }
.case-study-next__image { grid-column: 1 / span 5; overflow: hidden; background: var(--color-night); }
.case-study-next__image img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; opacity: .76; filter: saturate(.75); transition: opacity .5s ease, filter .5s ease, transform .5s ease; }
.case-study-next__copy { grid-column: 7 / span 6; }
.case-study-next__copy h2 { margin: 18px 0 24px; font-size: clamp(38px, 4vw, 64px); line-height: 1; letter-spacing: -.025em; }
.case-study-next__copy > p:not(.eyebrow) { max-width: 48ch; margin-bottom: 32px; color: var(--color-muted); font-size: 15px; line-height: 1.7; }
.case-study-next__link:hover img { opacity: .92; filter: saturate(1); transform: scale(1.025); }
.case-study-next__link:hover .button { border-color: var(--color-ink); background: var(--color-ink); color: var(--color-paper); }
.case-study-cta { padding-block: 144px; }
.case-study-cta__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; align-items: center; }
.case-study-cta__grid > :first-child { grid-column: 1 / span 8; }
.case-study-cta h2 { max-width: 800px; margin-bottom: 32px; font-size: clamp(40px, 5vw, 64px); line-height: 1.04; letter-spacing: -.025em; }
.case-study-cta p { max-width: 640px; color: var(--color-muted); line-height: 1.7; }
.case-study-cta .button-row { margin-top: 36px; }
.case-study-cta .button { margin-top: 0; }
.case-study-cta .cta-art { grid-column: 10 / span 3; }

@media (prefers-reduced-motion: no-preference) {
  [data-case-intro] { animation: case-intro .65s both cubic-bezier(.2,.7,.2,1); }
  [data-case-intro]:nth-child(2), .case-study-meta[data-case-intro] { animation-delay: .08s; }
  .case-study-hero__media[data-case-intro] { animation-delay: .16s; }
  [data-case-reveal].case-motion-pending { opacity: 0; transform: translateY(28px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
  [data-case-reveal].case-motion-pending.is-visible { opacity: 1; transform: none; }
  .case-block__steps > li.case-step-motion-pending { opacity: 0; transform: translateY(18px); transition: opacity .55s ease var(--case-step-delay, 0ms), transform .55s cubic-bezier(.2,.7,.2,1) var(--case-step-delay, 0ms); }
  .case-block__steps > li.case-step-motion-pending.is-visible { opacity: 1; transform: none; }
  @keyframes case-intro { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
}

@media (max-width: 900px) {
  .case-study-hero__title { grid-column: 1 / span 8; }
  .case-study-hero__lead { grid-column: 9 / span 4; }
  .case-study-meta { gap: 24px; }
  .case-study-split > :first-child, .case-study-outcome__grid > :first-child { grid-column: 1 / span 5; }
  .case-study-split > :last-child, .case-study-outcome__grid > :last-child { grid-column: 7 / span 6; }
}

@media (max-width: 767px) {
  .case-study-hero { padding-block: 48px 96px; }
  .case-study-breadcrumb { margin-bottom: 44px; }
  .case-study-hero__grid, .case-study-split, .case-study-approach__grid, .case-study-outcome__grid, .case-block__inner, .case-block__heading, .case-study-next__link, .case-study-cta__grid { display: block; }
  .case-study-hero__title h1 { font-size: clamp(39px, 11.15vw, 48px); }
  .case-study-hero__lead { margin-top: 32px; }
  .case-study-hero__lead .button-row { flex-direction: column; align-items: stretch; }
  .case-study-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 48px; padding: 24px; }
  .case-study-hero__media { margin-top: 40px; }
  .case-study-section, .case-block { padding-block: 96px; }
  .case-study-content--before-share, .case-study-outcome--before-share { padding-bottom: 24px; }
  .case-study--portfolio-post .case-study-hero { padding-bottom: 48px; }
  .case-study--portfolio-post .case-study-content { padding-top: 48px; }
  .case-study-share { padding-bottom: 96px; }
  .case-study-share__panel { display: block; padding-block: 28px; }
  .case-study-share__actions { justify-content: flex-start; margin-top: 32px; }
  .case-study-share__status { right: auto; left: 0; }
  .case-study-challenge, .case-study .case-block--solution { padding-top: 72px; }
  .case-study-split > :last-child, .case-study-outcome__grid > :last-child, .case-study-approach__copy { margin-top: 40px; }
  .case-study-approach__copy > :first-child { font-size: clamp(30px, 8vw, 42px); }
  .case-study .case-block h2 { font-size: clamp(34px, 9vw, 48px); }
  .case-block__copy .case-study-prose, .case-block--full .case-block__copy .case-study-prose { margin-top: 28px; }
  .case-block__media { margin-top: 48px; }
  .case-study .case-block__solution-grid { grid-template-columns: 1fr; }
  .case-study .case-block__solution-grid > div, .case-study .case-block__solution-grid > div:first-child, .case-study .case-block__solution-grid > div:last-child { min-height: 0; margin-top: 0; padding: 28px 0; border-top: 0; border-right: 0; border-bottom: 1px solid rgb(22 18 16 / .14); }
  .case-study .case-block__solution-grid > div:last-child { border-bottom: 0; }
  .case-block__heading > p:not(.case-study-index), .case-block__heading > .case-study-prose { margin-top: 28px; }
  .case-block__gallery, .case-block__gallery--editorial, .case-block__comparison { grid-template-columns: 1fr; }
  .case-block__gallery--editorial figure:nth-child(n) { grid-column: auto; }
  .case-study .case-block--process .case-block__steps { display: grid; grid-template-columns: 1fr; }
  .case-study .case-block--process .case-block__steps > li { min-height: 0; border-right: 0; border-bottom: 1px solid rgb(22 18 16 / .14); }
  .case-study .case-block--process .case-block__steps > li:last-child { border-bottom: 0; }
  .case-study-next { padding-block: 80px 96px; }
  .case-study-next__copy { margin-top: 36px; }
  .case-study-next__copy h2 { font-size: 42px; }
  .case-study-cta { padding-block: 112px; }
  .case-study-cta .cta-art { display: none; }
}

@media (max-width: 480px) {
  .case-study-meta { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  [data-case-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
}