:root {
  --gift-ink: var(--event-ink, #07172d);
  --gift-muted: var(--event-muted, #5f6f82);
  --gift-blue: var(--event-blue, #5163ec);
  --gift-purple: #b75ee8;
}

.pro-gift-main {
  min-height: 100vh;
  overflow: hidden;
  color: var(--gift-ink);
  background:
    radial-gradient(circle at 91% 5%, rgba(58, 173, 255, 0.3), transparent 30rem),
    radial-gradient(circle at 7% 7%, rgba(183, 94, 232, 0.24), transparent 31rem),
    linear-gradient(180deg, #f9fbff 0%, var(--event-paper, #f5f8fb) 72%, #fff 100%);
}

.pro-gift-hero {
  display: grid;
  width: min(980px, calc(100% - 40px));
  min-height: min(760px, calc(100svh - 76px));
  margin-inline: auto;
  padding: 138px 0 108px;
  place-content: center;
  justify-items: center;
  text-align: center;
}

.pro-gift-kicker {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  margin: 0 0 22px;
  padding: 5px 16px;
  border: 1px solid rgba(119, 74, 221, 0.75);
  border-radius: 999px;
  color: #7750d5;
  background: rgba(255, 255, 255, 0.6);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.pro-gift-hero h1 {
  max-width: 920px;
  margin: 0;
  color: var(--gift-ink);
  font-size: clamp(48px, 6.2vw, 74px);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.052em;
}

.pro-gift-hero h1 span {
  white-space: nowrap;
  color: transparent;
  background: linear-gradient(90deg, var(--gift-purple), #5b66ef 68%, #3aadff);
  background-clip: text;
  -webkit-background-clip: text;
}

.pro-gift-lead {
  max-width: 680px;
  margin: 28px 0 34px;
  color: var(--gift-muted);
  font-size: clamp(16px, 1.7vw, 19px);
  line-height: 1.8;
}

.pro-gift-button {
  appearance: none;
  min-width: 140px;
  min-height: 50px;
  padding: 13px 28px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(90deg, #3aadff, #4351ed);
  box-shadow: 0 13px 30px rgba(52, 69, 199, 0.23);
  cursor: pointer;
  font: inherit;
  font-weight: 650;
  transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.pro-gift-button:hover:not(:disabled) {
  box-shadow: 0 16px 34px rgba(52, 69, 199, 0.3);
  transform: translateY(-2px);
}

.pro-gift-button:disabled {
  cursor: wait;
  opacity: 0.62;
}

.pro-gift-button:focus-visible {
  outline: 3px solid rgba(81, 99, 236, 0.28);
  outline-offset: 4px;
}

@media (max-width: 767px) {
  .pro-gift-hero {
    min-height: min(680px, calc(100svh - 70px));
    padding: 112px 0 84px;
  }
}

@media (max-width: 420px) {
  .pro-gift-hero { width: min(100% - 24px, 980px); }
  .pro-gift-hero h1 { font-size: 34px; }
  .pro-gift-lead { margin-top: 24px; }
  .pro-gift-button { width: 100%; max-width: 220px; }
}

@media (prefers-reduced-motion: reduce) {
  .pro-gift-button { transition: none; }
}