.dannymarron-case {
  --dannymarron-copper: #b2764f;
  --dannymarron-amber: #d09a62;
  --terracotta: var(--dannymarron-copper);
  --accent: var(--dannymarron-copper);
}

.dannymarron-case .case-hero {
  background-color: #100b08;
  background-image: url("../assets/images/projects/dannymarron/fon-dennymarron.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.dannymarron-case .case-hero h1 {
  color: var(--brand-paper);
  font-size: clamp(48px, 6.4vw, 94px);
}

.dannymarron-case .case-label,
.dannymarron-case .case-section-heading > p,
.dannymarron-case .case-next > p,
.dannymarron-case .case-service-link__arrow {
  color: var(--dannymarron-copper);
}

.dannymarron-case .case-story__lead,
.dannymarron-case .case-story__copy {
  border-color: rgba(178, 118, 79, .4);
  background: rgba(178, 118, 79, .035);
}

.dannymarron-case .case-story__copy {
  border-color: rgba(178, 118, 79, .48);
  background: rgba(178, 118, 79, .05);
}

.dannymarron-case .case-story__copy p + p {
  border-color: rgba(178, 118, 79, .2);
}

.dannymarron-case .case-story__lead::before,
.dannymarron-case .case-story__lead::after {
  color: rgba(208, 154, 98, .38);
}

.dannymarron-case .case-route::before {
  background: rgba(178, 118, 79, .72);
}

.dannymarron-case .case-route li::before {
  background: var(--dannymarron-copper);
  box-shadow: 0 0 0 1px var(--dannymarron-amber);
}

.dannymarron-case .case-structure::after,
.dannymarron-case .case-showcase::before {
  background: repeating-linear-gradient(
    104deg,
    transparent 0 30px,
    rgba(178, 118, 79, .16) 31px 48px,
    rgba(92, 52, 30, .07) 49px 72px
  );
}

.dannymarron-case .case-services {
  --case-service-border: rgba(178, 118, 79, .31);
  --case-service-border-hover: rgba(208, 154, 98, .54);
}

@media (hover: hover) and (pointer: fine) {
  .dannymarron-case .case-service-link:hover,
  .dannymarron-case .case-service-link:focus-visible {
    background: rgba(178, 118, 79, .075);
  }
}

@media (max-width: 767px) {
  .dannymarron-case .case-hero h1 {
    font-size: clamp(37px, 11.8vw, 51px);
  }
}
