/* Canada Play Grid acknowledgement page */
* { box-sizing: border-box; }

body {
  margin: 0;
  background: #fff8f3;
  color: #20202b;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.6;
}

[data-homepage-region="01-primary-site-header"] {
  position: absolute;
  inset: 0 0 auto;
  z-index: 20;
  width: 100%;
  min-height: 88px;
  background: #fff8f3;
  box-shadow: 0 1px 0 rgba(34, 9, 137, .1);
}

.success-page {
  --ink: #20202b;
  --muted: #666577;
  --violet: #302084;
  --mint: #d9f1e5;
  --paper: #fffdfb;
  width: min(100% - 40px, 1040px);
  margin: 0 auto;
  padding: 132px 0 92px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
  color: var(--ink);
}

.success-page section {
  min-width: 0;
  border: 1px solid rgba(48, 32, 132, .1);
  border-radius: 24px;
  background: var(--paper);
  box-shadow: 0 12px 36px rgba(36, 24, 91, .055);
  padding: clamp(20px, 3vw, 32px);
}

.success-page h1,
.success-page h2,
.success-page p { margin-top: 0; }

.success-page h1 {
  max-width: 680px;
  margin-bottom: 14px;
  color: var(--violet);
  font-size: clamp(2.3rem, 5.6vw, 4.5rem);
  font-weight: 750;
  letter-spacing: -.055em;
  line-height: 1.04;
}

.success-page h2 {
  margin-bottom: 9px;
  color: var(--violet);
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  letter-spacing: -.025em;
  line-height: 1.2;
}

.success-page p { color: var(--muted); }
.success-page__intro { grid-column: 1 / -1; position: relative; overflow: hidden; padding: clamp(32px, 7vw, 76px) !important; background: linear-gradient(135deg, #fffdfb 8%, #fff0ed 62%, #f1ebff 100%) !important; }
.success-page__mark { display: grid; width: 54px; height: 54px; place-items: center; margin: 0 0 24px; border-radius: 17px; background: #175844; color: #fff; font-size: 1.7rem; font-weight: 700; }
.success-page__eyebrow { margin-bottom: 12px; color: #715dba !important; font-size: .78rem; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.success-page__lead { max-width: 610px; margin-bottom: 0; font-size: clamp(1.04rem, 2vw, 1.23rem); }
.success-page__receipt { grid-column: span 6; background: #f3faf6 !important; }
.success-page__receipt p, .success-page__acknowledgement p, .success-page__brand p, .success-page__close p { margin-bottom: 0; }
.success-page__status { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; border-radius: 999px; background: #d9f1e5; color: #175844; padding: 7px 13px; font-size: .86rem; font-weight: 700; }
.success-page__status::before { width: 8px; height: 8px; border-radius: 50%; background: #218052; content: ""; }
.success-page__acknowledgement { grid-column: span 6; }
.success-page__brand { grid-column: span 4; display: flex; min-height: 140px; flex-direction: column; justify-content: center; background: #f1ebff !important; }
.success-page__return { grid-column: span 8; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: #fff0ed !important; }
.success-page__return h2 { margin: 0; }
.success-page__button {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 15px;
  min-height: 52px;
  border: 2px solid #175844;
  border-radius: 999px;
  background-color: #175844;
  color: #fff;
  padding: 0 22px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, transform .18s ease;
}
.success-page__button:hover { background-color: #fff; color: #175844; transform: translateY(-2px); }
.success-page__button:focus-visible { outline: 3px solid #302084; outline-offset: 4px; }
.success-page__close { grid-column: 1 / -1; border-color: transparent !important; background: transparent !important; box-shadow: none !important; padding: 6px 12px !important; text-align: center; }
.success-page__close h2 { margin-bottom: 3px; font-size: .9rem; }
.success-page__close p { font-size: .85rem; }

/* Retired concept: a static celebration badge may be reintroduced after motion testing.
.success-page__celebration { animation: soft-orbit 2.4s ease-in-out infinite; }
@keyframes soft-orbit {
  0%, 100% { transform: rotate(-2deg) translateY(0); }
  50% { transform: rotate(2deg) translateY(-5px); }
}
*/

.success-page.has-reveal [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .42s ease var(--reveal-delay, 0ms), transform .42s ease var(--reveal-delay, 0ms); }
.success-page.has-reveal [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 700px) {
  [data-homepage-region="01-primary-site-header"] { min-height: 76px; }
  .success-page { width: min(100% - 28px, 560px); grid-template-columns: 1fr; gap: 12px; padding: 112px 0 64px; }
  .success-page section, .success-page__intro, .success-page__receipt, .success-page__acknowledgement, .success-page__brand, .success-page__return, .success-page__close { grid-column: 1; }
  .success-page__intro { padding: 32px 24px !important; }
  .success-page__return { align-items: flex-start; flex-direction: column; }
  .success-page__button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .success-page__button { transition: none; }
  .success-page.has-reveal [data-reveal], .success-page.has-reveal [data-reveal].is-visible { opacity: 1; transform: none; transition: none; }
}