.case-index-main,
.case-study-main {
  padding-top: 118px;
}

.case-loader {
  display: none;
}

.case-motion-enabled .case-loader {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #050e26;
  color: var(--paper);
  transition: visibility 0s linear .8s, opacity .65s cubic-bezier(.7, 0, .2, 1), transform .8s cubic-bezier(.7, 0, .2, 1);
}

.case-loader-inner {
  width: min(520px, calc(100% - 56px));
}

.case-loader-mark {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  font-family: var(--mono);
  font-size: .74rem;
  text-transform: uppercase;
}

.case-loader-mark strong {
  color: var(--acid);
  font-weight: 650;
}

.case-loader-line {
  height: 2px;
  overflow: hidden;
  background: rgba(255, 255, 255, .12);
}

.case-loader-line::after {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--acid), #78dcf2);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  animation: caseLoadLine .9s cubic-bezier(.7, 0, .2, 1) forwards;
}

.case-loaded .case-loader {
  visibility: hidden;
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

.case-intro-lock {
  overflow: hidden;
}

.case-motion-enabled .site-header,
.case-motion-enabled .case-breadcrumbs,
.case-motion-enabled .case-study-hero > *,
.case-motion-enabled .case-index-hero > *,
.case-motion-enabled .case-cover {
  opacity: 0;
  transform: translateY(26px);
}

.case-loaded .site-header,
.case-loaded .case-breadcrumbs,
.case-loaded .case-study-hero > *,
.case-loaded .case-index-hero > *,
.case-loaded .case-cover {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .75s ease, transform .9s cubic-bezier(.2, .8, .2, 1);
}

.case-loaded .site-header { transition-delay: .05s; }
.case-loaded .case-breadcrumbs { transition-delay: .12s; }
.case-loaded .case-study-hero > :nth-child(1),
.case-loaded .case-index-hero > :nth-child(1) { transition-delay: .18s; }
.case-loaded .case-study-hero > :nth-child(2),
.case-loaded .case-index-hero > :nth-child(2) { transition-delay: .27s; }
.case-loaded .case-study-hero > :nth-child(3),
.case-loaded .case-index-hero > :nth-child(3) { transition-delay: .36s; }
.case-loaded .case-study-hero > :nth-child(4) { transition-delay: .44s; }
.case-loaded .case-cover { transition-delay: .52s; }

.case-cover {
  clip-path: inset(0 50% 0 50%);
  transition: clip-path 1.05s cubic-bezier(.2, .8, .2, 1), opacity .75s ease, transform .9s cubic-bezier(.2, .8, .2, 1);
}

.case-loaded .case-cover {
  clip-path: inset(0 0 0 0);
}

.case-cover img {
  will-change: transform;
}

.case-scroll-reveal {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity .7s ease var(--case-delay, 0ms), transform .85s cubic-bezier(.2, .8, .2, 1) var(--case-delay, 0ms);
}

.case-scroll-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.case-flow-section {
  position: relative;
  overflow: hidden;
}

.case-flow-section::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--acid), transparent);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1.2s ease;
}

.case-flow-section:has(.case-flow-head.is-visible)::before {
  transform: scaleX(1);
}

.case-leaving body {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .28s ease, transform .28s ease;
}

@keyframes caseLoadLine {
  0% { transform: scaleX(0); }
  65% { transform: scaleX(.78); }
  100% { transform: scaleX(1); }
}

.case-shell {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.case-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 44px;
  color: var(--paper-soft);
  font-family: var(--mono);
  font-size: .78rem;
}

.case-breadcrumbs a {
  color: inherit;
}

.case-index-hero {
  padding: 70px 0 76px;
  border-bottom: 1px solid var(--line);
}

.case-index-hero h1 {
  max-width: 12ch;
  margin: 14px 0 24px;
  font-size: 5.8rem;
  line-height: .92;
}

.case-index-hero .lead {
  max-width: 760px;
}

.case-list {
  padding: 72px 0 110px;
}

.case-feature {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: #071839;
}

.case-feature + .case-feature {
  margin-top: 56px;
}

.case-feature:nth-child(even) .case-feature-visual {
  order: 2;
}

.case-feature-visual {
  position: relative;
  min-height: 520px;
  overflow: hidden;
  background: #f7fbfd;
}

.case-feature-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .45s ease;
}

.case-feature:hover .case-feature-visual img {
  transform: scale(1.015);
}

.case-feature-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px;
}

.case-feature-copy h2 {
  margin: 10px 0 18px;
  font-size: 3.2rem;
}

.case-feature-copy > p:not(.eyebrow) {
  color: var(--paper-soft);
  line-height: 1.7;
}

.case-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0 30px;
}

.case-tags span {
  padding: 8px 10px;
  border: 1px solid var(--line);
  color: var(--paper-soft);
  font-family: var(--mono);
  font-size: .72rem;
  text-transform: uppercase;
}

.case-study-hero {
  padding: 50px 0 68px;
}

.case-study-hero h1 {
  margin: 12px 0 20px;
  font-size: 7rem;
  line-height: .9;
}

.case-hero-statement {
  max-width: 900px;
  margin: 0;
  color: var(--paper);
  font-size: 2rem;
  font-weight: 650;
  line-height: 1.18;
}

.case-hero-intro {
  max-width: 790px;
  margin: 28px 0 0;
  color: var(--paper-soft);
  font-size: 1.08rem;
  line-height: 1.75;
}

.case-cover {
  position: relative;
  width: min(1320px, calc(100% - 40px));
  aspect-ratio: 16 / 8;
  margin: 0 auto;
  overflow: hidden;
  background: #f5fbfd;
}

.case-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.case-cover::after {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(118, 220, 242, .22);
  content: "";
  pointer-events: none;
}

.case-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1px;
  border: 1px solid var(--line);
  background: var(--line);
  gap: 1px;
}

.case-facts div {
  min-height: 132px;
  padding: 26px;
  background: var(--ink);
}

.case-facts span,
.case-section-label {
  display: block;
  margin-bottom: 12px;
  color: var(--acid);
  font-family: var(--mono);
  font-size: .72rem;
  text-transform: uppercase;
}

.case-facts strong {
  display: block;
  font-size: 1.15rem;
  line-height: 1.35;
}

.case-narrative {
  padding: 110px 0;
}

.case-two-column {
  display: grid;
  grid-template-columns: minmax(240px, .75fr) minmax(0, 1.25fr);
  gap: 80px;
  padding: 72px 0;
  border-top: 1px solid var(--line);
}

.case-two-column:first-child {
  padding-top: 0;
  border-top: 0;
}

.case-two-column h2,
.case-flow-section h2,
.case-capabilities h2,
.case-result h2 {
  margin: 0;
  font-size: 3rem;
  line-height: 1.05;
}

.case-copy p {
  margin: 0 0 20px;
  color: var(--paper-soft);
  line-height: 1.78;
}

.case-copy p:last-child {
  margin-bottom: 0;
}

.case-flow-section {
  padding: 88px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.case-flow-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 48px;
}

.case-flow-head p {
  max-width: 500px;
  margin: 0;
  color: var(--paper-soft);
  line-height: 1.7;
}

.case-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
}

.case-flow article {
  position: relative;
  min-height: 210px;
  padding: 26px 22px;
  border-right: 1px solid var(--line);
}

.case-flow article:last-child {
  border-right: 0;
}

.case-flow article::after {
  position: absolute;
  top: 31px;
  right: -9px;
  z-index: 1;
  width: 16px;
  height: 16px;
  border-top: 1px solid var(--acid);
  border-right: 1px solid var(--acid);
  background: var(--ink);
  content: "";
  transform: rotate(45deg);
}

.case-flow article:last-child::after {
  display: none;
}

.case-flow span {
  color: var(--acid);
  font-family: var(--mono);
  font-size: .75rem;
}

.case-flow h3 {
  margin: 30px 0 12px;
  font-size: 1.25rem;
}

.case-flow p {
  margin: 0;
  color: var(--paper-soft);
  font-size: .92rem;
  line-height: 1.6;
}

.case-capabilities {
  padding: 110px 0;
}

.case-capabilities-head {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
  margin-bottom: 54px;
}

.case-capability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.case-capability-grid article {
  min-height: 290px;
  padding: 36px 36px 42px 0;
  border-bottom: 1px solid var(--line);
}

.case-capability-grid article:nth-child(odd) {
  padding-right: 54px;
  border-right: 1px solid var(--line);
}

.case-capability-grid article:nth-child(even) {
  padding-left: 54px;
}

.case-capability-grid .number {
  color: var(--acid);
  font-family: var(--mono);
  font-size: .78rem;
}

.case-capability-grid h3 {
  margin: 30px 0 14px;
  font-size: 1.7rem;
}

.case-capability-grid p,
.case-capability-grid li {
  color: var(--paper-soft);
  line-height: 1.7;
}

.case-capability-grid ul {
  margin: 18px 0 0;
  padding-left: 20px;
}

.case-price-band {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
  padding: 72px;
  border: 1px solid var(--line);
  background: rgba(57, 219, 176, .06);
}

.case-price-band h2 {
  margin: 0;
  font-size: 2.8rem;
}

.case-prices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.case-prices article {
  padding: 28px;
  background: #081632;
}

.case-prices span {
  display: block;
  color: var(--paper-soft);
  font-size: .86rem;
}

.case-prices strong {
  display: block;
  margin: 8px 0;
  font-size: 2.2rem;
}

.case-prices small {
  color: var(--acid);
  font-family: var(--mono);
}

.case-result {
  padding: 110px 0 120px;
  text-align: center;
}

.case-result h2 {
  max-width: 900px;
  margin: 0 auto 24px;
}

.case-result p {
  max-width: 760px;
  margin: 0 auto 32px;
  color: var(--paper-soft);
  font-size: 1.08rem;
  line-height: 1.75;
}

.home-case-study {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.home-case-study-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 36px;
}

.home-case-study-head h2 {
  max-width: 780px;
  margin: 0;
}

.home-case-study-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  min-height: 520px;
  border: 1px solid var(--line);
}

.home-case-study-grid + .home-case-study-grid {
  margin-top: 56px;
}

.home-case-study-grid-alt .home-case-study-visual {
  order: 2;
}

.home-case-study-grid-alt .home-case-study-copy {
  border-right: 1px solid var(--line);
  border-left: 0;
}

.home-case-study-visual {
  overflow: hidden;
  background: #f5fbfd;
}

.home-case-study-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-case-study-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px;
  border-left: 1px solid var(--line);
}

.home-case-study-copy h3 {
  margin: 12px 0 18px;
  font-size: 3.2rem;
}

.home-case-study-copy > p:not(.eyebrow) {
  color: var(--paper-soft);
  line-height: 1.72;
}

@media (max-width: 900px) {
  .case-index-hero h1 { font-size: 4rem; }
  .case-study-hero h1 { font-size: 5rem; }
  .case-feature,
  .home-case-study-grid,
  .case-price-band { grid-template-columns: 1fr; }
  .case-feature-visual,
  .home-case-study-grid { min-height: auto; }
  .case-feature-visual { aspect-ratio: 16 / 10; }
  .case-feature:nth-child(even) .case-feature-visual,
  .home-case-study-grid-alt .home-case-study-visual { order: 0; }
  .home-case-study-visual { aspect-ratio: 16 / 9; }
  .home-case-study-copy,
  .home-case-study-grid-alt .home-case-study-copy { border-top: 1px solid var(--line); border-right: 0; border-left: 0; }
  .case-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-flow { grid-template-columns: 1fr; }
  .case-flow article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .case-flow article:last-child { border-bottom: 0; }
  .case-flow article::after { display: none; }
}

@media (max-width: 680px) {
  .case-index-main,
  .case-study-main { padding-top: 92px; }
  .case-shell,
  .case-cover { width: min(100% - 28px, 1180px); }
  .case-breadcrumbs { margin-bottom: 24px; }
  .case-index-hero { padding: 38px 0 52px; }
  .case-index-hero h1 { font-size: 3rem; }
  .case-study-hero { padding: 30px 0 48px; }
  .case-study-hero h1 { font-size: 4rem; }
  .case-hero-statement { font-size: 1.45rem; }
  .case-cover { aspect-ratio: 4 / 3; }
  .case-cover img { object-position: center; }
  .case-facts { grid-template-columns: 1fr; }
  .case-facts div { min-height: 0; }
  .case-narrative,
  .case-capabilities,
  .case-result { padding: 72px 0; }
  .case-two-column,
  .case-capabilities-head { grid-template-columns: 1fr; gap: 28px; }
  .case-two-column h2,
  .case-flow-section h2,
  .case-capabilities h2,
  .case-result h2 { font-size: 2.2rem; }
  .case-flow-head,
  .home-case-study-head { align-items: flex-start; flex-direction: column; }
  .case-capability-grid { grid-template-columns: 1fr; }
  .case-capability-grid article,
  .case-capability-grid article:nth-child(odd),
  .case-capability-grid article:nth-child(even) { min-height: 0; padding: 30px 0; border-right: 0; }
  .case-price-band { gap: 32px; padding: 30px 20px; }
  .case-price-band h2 { font-size: 2.2rem; }
  .case-prices { grid-template-columns: 1fr; }
  .case-feature-copy,
  .home-case-study-copy { padding: 30px 24px; }
  .case-feature + .case-feature,
  .home-case-study-grid + .home-case-study-grid { margin-top: 28px; }
  .case-feature-copy h2,
  .home-case-study-copy h3 { font-size: 2.3rem; }
}

@media (prefers-reduced-motion: reduce) {
  .case-loader { display: none !important; }
  .case-motion-enabled .site-header,
  .case-motion-enabled .case-breadcrumbs,
  .case-motion-enabled .case-study-hero > *,
  .case-motion-enabled .case-index-hero > *,
  .case-motion-enabled .case-cover,
  .case-scroll-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .case-cover { clip-path: none; }
  .case-cover img { transform: none !important; }
}