:root {
  --bonasino-bg-organic: #F4F0EA;
  --bonasino-brand-olive: #3D5A45;
  --bonasino-accent-terracotta: #E07A5F;
  --bonasino-text-body: #2E3830;
}

.thankyou-section {
  background: radial-gradient(circle at top left, rgba(224, 122, 95, 0.06), transparent 55%), radial-gradient(circle at bottom right, rgba(61, 90, 69, 0.06), transparent 55%), var(--bonasino-bg-organic);
  display: flex;
  align-items: center;
}

.thankyou-section .container {
  display: flex;
  justify-content: center;
}

.thankyou-card {
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
  padding: clamp(2rem, 4vw, 2.75rem) clamp(1.75rem, 4vw, 2.5rem);
  border-radius: 1.5rem;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(253, 250, 246, 0.98));
  border: 1px solid rgba(32, 24, 16, 0.06);
  box-shadow: 0 22px 70px rgba(32, 24, 16, 0.12);
  text-align: center;
}

.thankyou-meta {
  margin-bottom: var(--space-sm);
}

.thankyou-title {
  font-size: var(--font-size-3xl);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bonasino-brand-olive);
  margin-bottom: var(--space-md);
}

@media (min-width: 768px) {
  .thankyou-title {
    font-size: var(--font-size-4xl);
  }
}

.thankyou-lede {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--space-md);
}

.thankyou-body {
  max-width: var(--content-max);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--space-lg);
  color: var(--bonasino-text-body);
}

.thankyou-actions {
  justify-content: center;
  margin-bottom: var(--space-md);
}

.thankyou-actions .button {
  min-width: 0;
}

.thankyou-actions .button:first-child {
  background-color: var(--bonasino-accent-terracotta);
  box-shadow: 0 18px 40px rgba(224, 122, 95, 0.45);
}

.thankyou-actions .button:first-child:hover {
  background-color: #d5674b;
  box-shadow: 0 22px 52px rgba(224, 122, 95, 0.6);
}

.thankyou-actions .button-outline {
  background-color: transparent;
}

.thankyou-note {
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
}

.thankyou-note .link-inline {
  color: var(--bonasino-brand-olive);
  border-bottom-color: rgba(61, 90, 69, 0.45);
}

.thankyou-note .link-inline:hover,
.thankyou-note .link-inline:focus-visible {
  border-bottom-color: rgba(61, 90, 69, 0.9);
}

@media (max-width: 599.98px) {
  .thankyou-card {
    padding-inline: 1.5rem;
  }
  .thankyou-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .thankyou-actions .button {
    width: 100%;
    justify-content: center;
  }
}