/* =========================================================
   PARTY BOX — lead-capture popup (email + SMS)
   A poppi-style FULL-SCREEN sunset takeover that invites
   visitors onto the "dream list". Self-contained so it can
   drop onto any storefront page without disturbing it.
   Brand tokens mirror home.css (gold / blush / lavender).
   ========================================================= */
.pb-lead-scrim{
  position:fixed;inset:0;z-index:1000;display:block;padding:0;
  background:rgba(26,16,8,.55);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .35s ease;
}
.pb-lead-scrim.on{opacity:1;pointer-events:auto}

.pb-lead{
  position:relative;width:100%;height:100%;min-height:100dvh;
  overflow:hidden auto;
  /* keep it scrollable on tiny screens but never show the scrollbar chrome */
  scrollbar-width:none;-ms-overflow-style:none;
  border-radius:0;text-align:center;color:#fff;
  /* warm sunset sky — gold → coral → blush → lavender (vertical, sky-to-horizon) */
  background:linear-gradient(180deg,#ffd66b 0%,#ffae57 30%,#ff7eb3 62%,#c98bff 100%);
  font-family:"Nunito",system-ui,sans-serif;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:84px 24px 150px;
  transform:scale(1.015);transition:transform .45s cubic-bezier(.2,.9,.3,1.2);
}
.pb-lead-scrim.on .pb-lead{transform:none}
.pb-lead::-webkit-scrollbar{width:0;height:0;display:none}

/* --- the sunset sky: moon + sparkles ------------------------------------- */
.pb-lead-sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.pb-lead-moon{
  position:absolute;top:8%;right:13%;width:clamp(88px,12vw,138px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,#fffdf4 0%,#ffeebf 58%,#ffd98a 100%);
  box-shadow:
    0 0 0 14px rgba(255,255,255,.08),
    0 0 60px 20px rgba(255,247,214,.55),
    0 0 130px 50px rgba(255,224,158,.35);
}
.pb-lead-moon::after{ /* craters */
  content:"";position:absolute;inset:0;border-radius:50%;
  background:
    radial-gradient(circle at 64% 40%,rgba(206,168,104,.42) 0 9px,transparent 10px),
    radial-gradient(circle at 43% 63%,rgba(206,168,104,.34) 0 12px,transparent 13px),
    radial-gradient(circle at 30% 37%,rgba(206,168,104,.28) 0 6px,transparent 7px);
}
.pb-lead-stars{
  position:absolute;top:16%;left:15%;width:3px;height:3px;border-radius:50%;background:#fff;opacity:.85;
  box-shadow:
    44px 26px 0 -.5px rgba(255,255,255,.85),
    128px 8px 0 -1px rgba(255,255,255,.7),
    210px 56px 0 -.5px #fff,
    272px 20px 0 -1px rgba(255,255,255,.6),
    96px 92px 0 -1px rgba(255,255,255,.65),
    340px 100px 0 -.5px rgba(255,255,255,.7);
}

.pb-lead-x{
  position:absolute;top:18px;right:20px;z-index:5;width:38px;height:38px;border-radius:50%;
  border:0;cursor:pointer;font-size:22px;line-height:1;color:#fff;
  background:rgba(255,255,255,.18);transition:background .15s,transform .15s;
}
.pb-lead-x:hover{background:rgba(255,255,255,.34);transform:rotate(90deg)}

/* --- centred content column ---------------------------------------------- */
.pb-lead-body{position:relative;z-index:2;width:100%;max-width:520px;margin:0 auto}

.pb-lead-kicker{
  font-size:12px;font-weight:800;letter-spacing:.24em;text-transform:uppercase;
  opacity:.92;margin-bottom:10px;
}
.pb-lead h2{
  font-family:"Cormorant Garamond",Georgia,serif;font-weight:700;line-height:1.02;
  margin:0 0 4px;font-size:clamp(40px,8vw,66px);text-shadow:0 2px 18px rgba(120,40,90,.28);
}
.pb-lead h2 .em{display:block;font-style:italic;font-weight:600}
.pb-lead p.pb-lead-sub{
  margin:14px auto 0;max-width:34ch;font-size:clamp(16px,2.2vw,18px);font-weight:600;line-height:1.45;
  color:rgba(255,255,255,.95);
}

/* --- urgency countdown ---------------------------------------------------- */
.pb-lead-timer{
  display:inline-flex;align-items:center;gap:10px;margin:20px auto 2px;
  padding:10px 18px;border-radius:999px;background:rgba(43,18,46,.30);
  box-shadow:0 0 0 1px rgba(255,255,255,.28) inset;backdrop-filter:blur(2px);
  transition:background .3s;
}
.pb-lead-timer .lab{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.92}
.pb-lead-timer .clk{font-variant-numeric:tabular-nums;font-weight:900;font-size:19px;letter-spacing:.04em}
.pb-lead-timer.out{background:rgba(178,12,40,.55)}

.pb-lead-form{display:flex;flex-direction:column;gap:11px;margin:22px auto 4px;max-width:440px;text-align:left}
.pb-lead-field{position:relative}
.pb-lead-form input{
  width:100%;border:0;border-radius:14px;padding:16px 18px;font-size:16px;
  font-family:inherit;font-weight:600;color:#3a2418;background:#fff;
  box-shadow:0 6px 18px rgba(80,30,60,.18);
}
.pb-lead-form input::placeholder{color:#b09a86;font-weight:600}
.pb-lead-form input:focus{outline:3px solid rgba(255,255,255,.7);outline-offset:2px}

.pb-lead-cta{
  border:0;cursor:pointer;border-radius:14px;padding:17px 18px;margin-top:4px;
  font-family:inherit;font-size:16px;font-weight:800;letter-spacing:.02em;
  color:#fff;background:linear-gradient(180deg,#ff3d8b,#e01e6e);
  box-shadow:0 12px 26px rgba(200,20,90,.4);transition:transform .15s,box-shadow .15s,filter .15s;
}
.pb-lead-cta:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 16px 32px rgba(200,20,90,.5)}
.pb-lead-cta:disabled{opacity:.7;cursor:default;transform:none}

.pb-lead-fine{margin:13px auto 0;max-width:440px;font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.85);font-weight:600}
.pb-lead-err{min-height:0;color:#fff;font-weight:800;font-size:13px;
  background:rgba(180,10,40,.5);border-radius:10px;padding:0;margin:0;overflow:hidden;transition:all .2s}
.pb-lead-err.show{padding:9px 12px;margin:2px 0 0;min-height:auto}

/* decorative balloon trio anchored to the bottom edge of the sky */
.pb-lead-art{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:1;
  width:min(420px,82%);display:block;pointer-events:none;
}

/* success state */
.pb-lead-done{position:relative;z-index:2;padding:18px 6px;animation:pbLeadPop .45s cubic-bezier(.2,.9,.3,1.3) both}
.pb-lead-done .pb-lead-burst{font-size:64px;line-height:1;margin-bottom:8px}
.pb-lead-done h2{font-size:clamp(34px,7vw,52px)}
.pb-lead-done p{margin:12px auto 0;max-width:34ch;font-size:17px;font-weight:600;color:rgba(255,255,255,.95)}
@keyframes pbLeadPop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}

@media (max-width:520px){
  .pb-lead{padding:72px 22px 132px}
  .pb-lead-kicker{letter-spacing:.18em}
  .pb-lead-moon{top:6%;right:9%}
  .pb-lead-stars{top:12%;left:10%}
}
@media (prefers-reduced-motion:reduce){
  .pb-lead-scrim,.pb-lead,.pb-lead-cta,.pb-lead-x,.pb-lead-timer{transition:none}
  .pb-lead-done{animation:none}
}
