/* /preise/ shell and stay cards (homepage benefit chrome). */

.df-prices {
  max-width: var(--maxw, 1180px);
  margin: 0 auto;
}

body.dunkelretreat-landing.dr-subpage.df-prices-page {
  background: var(--bg, #0c0b11);
  color: var(--text, #ece6da);
}

body.df-prices-page .dr-subpage-section {
  padding-top: clamp(48px, 7vw, 96px);
  padding-bottom: clamp(64px, 9vw, 132px);
}

body.dr-subpage .dr-subpage-prose .df-prices {
  color: var(--text);
}

body.dr-subpage .dr-subpage-prose .df-prices .shead h2 {
  margin: 0;
  color: var(--text);
  font-family: var(--font-heading);
  font-size: clamp(30px, 4.2vw, 50px);
  font-weight: 400;
  letter-spacing: 0;
}

body.dr-subpage .dr-subpage-prose .df-prices .lede {
  color: var(--text-dim);
  font-size: clamp(18px, 2.1vw, 21px);
}

body.dr-subpage .dr-subpage-prose .df-prices .benefit {
  color: var(--text);
}

body.dr-subpage .dr-subpage-prose .df-prices .benefit h3 {
  margin: 0 0 12px;
  color: var(--text);
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.25;
}

body.dr-subpage .dr-subpage-prose .df-prices .benefit p {
  margin: 0;
  color: var(--text-dim);
  font-size: 16.5px;
  line-height: 1.6;
}

.df-prices .benefit-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.df-prices .benefit.df-prices__card--photo {
  padding-top: 0;
}

.df-prices__photo {
  display: block;
  width: calc(100% + 64px);
  max-width: none;
  height: 168px;
  margin: 0 -32px 24px;
  object-fit: cover;
}

body.dr-subpage .dr-subpage-prose .df-prices .benefit .df-prices__rate {
  margin: 0 0 22px;
  color: var(--accent, #e3b15a);
  font-family: var(--font-display, inherit);
  font-size: 28px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.df-prices__block {
  margin-top: 0;
}

.df-prices__block + .df-prices__block {
  margin-top: clamp(56px, 7vw, 88px);
}

.df-prices__close {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: clamp(56px, 7vw, 88px);
  text-align: center;
}

.df-prices__close .lede {
  margin-bottom: 28px;
}

.df-prices .btn-gold,
.df-prices .btn-gold:hover,
body.dr-subpage .dr-subpage-prose .df-prices .btn-gold,
body.dr-subpage .dr-subpage-prose .df-prices .btn-gold:hover {
  color: #2a2113;
}
