/* 65 · gift: the free bundle as the page's most radiant thing, right under the stack. A milk-white card in both
   themes; behind it an aura of light gushing out in every direction, turning slowly; blood blooms seep into its
   ground and out past its edges, like blood dropped in water taking the water over. "click me!" at its foot.
   Everything that moves moves whole (rotate, scale, opacity), so it can shine forever and cost nothing. */

.rw-gift-wrap{position:relative;isolation:isolate;display:grid;place-items:center;padding:56px 0 40px;margin-top:8px}

/* the aura: rays of milk-white light round the card, fading out with distance, turning; a breathing heart of light */
.rw-gift__aura{position:absolute;left:50%;top:50%;width:min(1180px,210%);aspect-ratio:1;translate:-50% -50%;z-index:-1;pointer-events:none;
  background:repeating-conic-gradient(from 0deg,rgba(255,250,246,.5) 0deg 3deg,transparent 3deg 11deg,rgba(255,214,222,.32) 11deg 13deg,transparent 13deg 22deg);
  -webkit-mask:radial-gradient(closest-side,#000 16%,rgba(0,0,0,.45) 42%,transparent 70%);mask:radial-gradient(closest-side,#000 16%,rgba(0,0,0,.45) 42%,transparent 70%);
  animation:rw-gift-turn calc(var(--rw-beat) * 14) linear infinite;
  /* a hand coming near makes it gush (--near, the page's approach tracker) */
  scale:calc(1 + var(--near,0) * .14);opacity:calc(.8 + var(--near,0) * .2);transition:scale .4s ease-out,opacity .4s ease-out}
.rw-gift__aura::before{content:"";position:absolute;inset:30%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,252,250,.95),rgba(255,236,240,.4) 52%,transparent 76%);
  animation:rw-gift-breathe var(--rw-beat) ease-in-out infinite}
@keyframes rw-gift-turn{to{rotate:360deg}}
@keyframes rw-gift-breathe{0%,100%{opacity:.75;scale:.94}50%{opacity:1;scale:1.06}}

/* the blood: soft blooms seeping out of the card's ground and past its edges, slowly taking a little more */
.rw-gift__stains{position:absolute;left:50%;top:50%;width:min(680px,124%);aspect-ratio:1.25;translate:-50% -50%;z-index:1;pointer-events:none;
  background:
    radial-gradient(18% 14% at 18% 26%,rgba(150,14,34,.30),rgba(150,14,34,.10) 55%,transparent 72%),
    radial-gradient(10% 8% at 12% 34%,rgba(170,20,40,.26),transparent 70%),
    radial-gradient(22% 16% at 84% 72%,rgba(140,12,30,.26),rgba(140,12,30,.08) 58%,transparent 75%),
    radial-gradient(8% 6% at 92% 64%,rgba(170,20,40,.24),transparent 70%),
    radial-gradient(14% 11% at 70% 14%,rgba(160,16,36,.18),transparent 72%),
    radial-gradient(12% 9% at 30% 86%,rgba(150,14,34,.2),transparent 72%);
  animation:rw-gift-seep calc(var(--rw-beat) * 6) ease-in-out infinite alternate}
@keyframes rw-gift-seep{from{scale:1;opacity:.85}to{scale:1.05;opacity:1}}

/* the card: milk white with a warm glow, the words and tiles in the card's ink above the blood */
.rw-gift{position:relative;width:min(540px,100%);display:flex;flex-direction:column;gap:14px;padding:26px 24px 18px;border:0;border-radius:18px;
  text-align:left;color:#2A0F18;background:none;cursor:pointer;transition:translate .3s cubic-bezier(.3,1.5,.5,1)}
.rw-gift::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;
  background:radial-gradient(120% 90% at 50% 40%,#FFFDFB,#F7EFEB 70%,#F0E2DE);
  box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 60px 6px rgba(255,248,244,.45),0 30px 60px -30px rgba(80,10,20,.6)}
.rw-gift>*{position:relative;z-index:2}
.rw-gift:hover,.rw-gift:focus-visible{translate:0 -6px}
.rw-gift__eyebrow{font-family:var(--f-data);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9A1B33}
.rw-gift__title{font-family:var(--f-display);font-weight:700;font-size:clamp(22px,3vw,28px);line-height:1.1}
.rw-gift__items{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.rw-gift__item{display:flex;flex-direction:column;justify-content:space-between;gap:8px;min-height:112px;padding:10px 9px;border-radius:10px;
  background:#FFFFFF;border:1px solid rgba(154,27,51,.18);box-shadow:0 8px 18px -12px rgba(80,10,20,.45)}
/* a PDF is a sheet of paper: a folded corner */
.rw-gift__item--pdf{clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
  background:linear-gradient(225deg,#EBD9D5 0 10px,#FFFFFF 10px)}
.rw-gift__item--free{background:linear-gradient(160deg,#FFF6F7,#FBE3E8)}
.rw-gift__kind{font-family:var(--f-data);font-size:10px;font-weight:700;letter-spacing:.12em;color:#B42F4A}
.rw-gift__name{font-size:12.5px;line-height:1.25;font-weight:600;color:#2A0F18}
/* "click me!": the card's own voice, nodding now and then */
.rw-gift__click{align-self:center;font-family:var(--f-block);font-weight:900;font-size:22px;letter-spacing:-.01em;color:#B42F4A;
  animation:rw-gift-nod calc(var(--rw-beat) * .75) ease-in-out infinite}
@keyframes rw-gift-nod{0%,70%,100%{rotate:0deg;scale:1}78%{rotate:-6deg;scale:1.08}86%{rotate:5deg;scale:1.08}93%{rotate:-2deg;scale:1.02}}
@media (max-width:560px){.rw-gift__items{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* the door: one email, one magic link */
.rw-dialog{border:1px solid var(--rw-engine-edge);border-radius:18px;padding:28px 24px 22px;max-width:min(460px,92vw);width:100%;
  background:var(--rw-engine-bg);color:var(--rw-title-ink);box-shadow:0 30px 80px -30px rgba(0,0,0,.7)}
.rw-dialog::backdrop{background:rgba(12,4,9,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rw-dialog__title{font-family:var(--f-display);font-size:24px;font-weight:700;margin-bottom:6px}
.rw-dialog__lede{color:var(--rw-lede-ink);margin-bottom:14px}
.rw-dialog__close{position:absolute;top:10px;right:12px}   /* its look is the Button type, 06-button.css --close */
.rw-signup--dialog{max-width:none}

@media (prefers-reduced-motion:reduce){.rw-gift__aura,.rw-gift__aura::before,.rw-gift__stains,.rw-gift__click{animation:none}.rw-gift{transition:none}}
