/* Work listing and case-study convergence. Loaded only by Work templates. */
.work35,
.case35 {
  --work-converge-ease: cubic-bezier(.22, 1, .36, 1);
  --work-converge-line: #d4d2e6;
  --work-converge-muted: #676096;
}

.work35 :is(h1, h2, h3),
.case35 :is(h1, h2, h3) {
  text-wrap: balance;
}

.work35 :is(p, li),
.case35 :is(p, li, dd) {
  text-wrap: pretty;
}

/* Keep the hero decisive without using type as empty space. */
.work35-hero-grid {
  grid-template-columns: minmax(0, .92fr) minmax(390px, 1.08fr);
  gap: clamp(44px, 6vw, 82px);
}

.work35-hero h1 {
  max-width: 10.5ch;
  font-size: clamp(3.5rem, 5.8vw, 5.9rem);
  line-height: .96;
}

.case35-hero-grid {
  grid-template-columns: minmax(0, .92fr) minmax(390px, 1.08fr);
}

.case35-hero h1 {
  max-width: 11ch;
  font-size: clamp(3.4rem, 6vw, 6rem);
  line-height: .94;
}

.work35-hero p:not(.work35-kicker),
.case35-deck {
  max-width: 58ch;
}

/* Project media uses clean framing rather than legacy black shadow pools. */
.work35 .workx-visual,
.case35 .workx-visual {
  border-color: rgba(255, 255, 255, .22);
  background: linear-gradient(145deg, #261c6a, #160e53);
  box-shadow: none;
  transform: none;
  transition: border-color .38s var(--work-converge-ease), transform .55s var(--work-converge-ease);
}

.work35 .workx-browser,
.case35 .workx-browser {
  border-color: rgba(255, 255, 255, .28);
  background: #fff;
  box-shadow: 0 12px 28px rgba(22, 14, 83, .12) !important;
}

.work35 :is(.work35-feature-visual, .work35-card-main):hover .workx-visual,
.case35-hero-media:hover .workx-visual {
  transform: translateY(-3px);
  border-color: rgba(255, 120, 0, .72);
}

.work35 .workx-browser img,
.case35 .workx-browser img {
  filter: saturate(.92) brightness(.88) contrast(1.02);
}

.work35 .workx-visual:hover .workx-browser,
.case35 .workx-visual:hover .workx-browser {
  transform: rotate(0) translateY(-2px);
}

.work35 .workx-system,
.case35 .workx-system {
  background: linear-gradient(135deg, rgba(78, 34, 208, .36), rgba(38, 28, 106, .08));
}

.work35 .workx-system span,
.case35 .workx-system span {
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
}

/* Links read as one restrained, accessible action system. */
.work35-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  align-items: center;
}

.work35-actions a,
.case35-hero-actions a,
.work35-card-live {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  width: max-content;
  color: #160e53;
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

.work35-actions a::after,
.case35-hero-actions a::after,
.work35-card-live::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -.35rem;
  left: 0;
  height: 1px;
  background: #ff7800;
  transform: scaleX(.35);
  transform-origin: left;
  transition: transform .35s var(--work-converge-ease);
}

.work35-actions a:hover::after,
.case35-hero-actions a:hover::after,
.work35-card-live:hover::after {
  transform: scaleX(1);
}

.work35 :is(a, button):focus-visible,
.case35 :is(a, button):focus-visible {
  outline: 3px solid #ff7800;
  outline-offset: 4px;
}

.case35-hero-actions {
  margin-top: 28px;
}

.case35-hero-actions a {
  min-height: 46px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  backdrop-filter: blur(14px);
}

.case35-hero-actions a::after {
  display: none;
}

.case35-hero-actions a:hover {
  border-color: #ff7800;
  background: rgba(255, 120, 0, .16);
}

/* Library cards share a predictable footer zone without nested links. */
.work35-card {
  display: grid;
  grid-template-rows: 1fr auto;
  transition: transform .4s var(--work-converge-ease), box-shadow .4s var(--work-converge-ease), border-color .35s ease;
}

.work35-card-main {
  min-width: 0;
}

.work35-card-copy b {
  display: inline-flex;
  gap: .45rem;
  align-items: center;
  width: max-content;
}

.work35-card-live {
  height: auto;
  margin: 0 28px 26px;
}

.work35-card:hover {
  border-color: rgba(78, 34, 208, .32);
  box-shadow: 0 2px 4px rgba(22, 14, 83, .04), 0 14px 32px rgba(78, 34, 208, .07) !important;
}

.work35-card-copy small,
.work35-card-copy p,
.work35-card-copy > span,
.case35-hero-media figcaption,
.case35-work figcaption {
  opacity: 1;
}

.case35-hero-media figcaption {
  color: #e9e8f3;
}

.case35-work figcaption {
  color: #676096;
}

@media (max-width: 980px) {
  .work35-hero-grid,
  .case35-hero-grid {
    grid-template-columns: 1fr;
  }

  .work35-hero h1,
  .case35-hero h1 {
    max-width: 13ch;
  }
}

@media (max-width: 640px) {
  .work35-hero h1,
  .case35-hero h1 {
    max-width: 100%;
    font-size: clamp(2.75rem, 12.4vw, 3.7rem);
    line-height: .98;
    overflow-wrap: normal;
  }

  .work35-collage {
    min-height: 250px;
  }

  .work35-feature-list {
    gap: 68px;
  }

  .work35-card-copy {
    padding: 24px;
  }

  .work35-card-live {
    min-height: 44px;
    margin: 0 24px 22px;
  }

  .case35-hero-actions a {
    min-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .work35 .workx-visual,
  .work35 .workx-browser,
  .case35 .workx-visual,
  .case35 .workx-browser,
  .work35-card,
  .work35-actions a::after,
  .work35-card-live::after {
    transition: none !important;
  }

  .work35 :is(.work35-feature-visual, .work35-card-main):hover .workx-visual,
  .case35-hero-media:hover .workx-visual,
  .work35-card:hover {
    transform: none !important;
  }
}