/* The opening film on the home page: lights down, the myrrh bottle and its ruby stopper (Esther 2:12),
   the name, the mission lit as you scroll, one pillar per screen, the rubies,
   the story so far, and Proverbs 31:10 alone on a dark screen before
   the lights come up on the rest of the site. Every class starts with pf-. */

.pf{--night:#1b0b14;--void:#0d0509;--rose:#d86d9d;--pink:#f9a8c9;--blush:#ffd6e7;--ruby:#9f2852;--gold:#c4a26a;
  position:relative;background:var(--night);color:#fff;overflow:clip}
.pf *{box-sizing:border-box}
.pf-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0;transition:opacity .8s}
body.pgws-dark .pf-canvas{opacity:1}
.pf>section{position:relative;z-index:1}

/* Opening */
.pf-open{min-height:calc(100svh - 110px);display:grid;place-content:center;justify-items:center;text-align:center;gap:12px;padding:56px 20px 80px;overflow:hidden}
.pf-glow{position:absolute;inset:-25%;z-index:-1;background:radial-gradient(34% 30% at 50% 36%,rgba(249,168,201,.42),transparent 70%),radial-gradient(26% 26% at 18% 82%,rgba(179,18,63,.35),transparent 70%),radial-gradient(28% 28% at 84% 70%,rgba(216,109,157,.3),transparent 70%);animation:pfGlow 10s ease-in-out infinite alternate}
.pf-pre{margin:0;font:italic 400 clamp(17px,2.4vw,22px)/1.3 'DM Serif Display',Georgia,serif;color:rgba(255,255,255,.72);animation:pfPre 3.4s ease forwards}
.pf-bottle{position:relative;width:clamp(64px,min(13vw,11vh),132px);margin:4px 0 2px;animation:pfMirror 1.6s cubic-bezier(.2,.7,.2,1) .9s both}
.pf-bottle svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 0 26px rgba(249,168,201,.55))}
.pf-bottle .pf-stopper{position:absolute;left:38%;top:21.5%;width:24%;animation:pfStopper 2.6s cubic-bezier(.3,1.3,.5,1) 1.9s both}
.pf-bottle .pf-stopper svg{filter:drop-shadow(0 6px 14px rgba(179,18,63,.7))}
.pf-wisp{stroke-dasharray:90;stroke-dashoffset:90;opacity:0;transform-box:fill-box;transform-origin:50% 100%;animation:pfWisp 2.2s ease calc(3.4s + var(--w,0) * .35s) forwards,pfDrift 5s ease-in-out calc(5.6s + var(--w,0) * .35s) infinite}
.pf-eyebrow{margin:0;font-size:11px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--pink);animation:pfIn 1s ease 2.2s both}
.pf-title{margin:0;line-height:.9;font-weight:400}
.pf-title .pf-serif{display:block;font:400 clamp(52px,min(12.5vw,14vh),176px)/.88 'DM Serif Display',Georgia,serif;letter-spacing:.02em;text-transform:uppercase}
.pf-title .pf-serif span{display:inline-block;margin:0 .09em;animation:pfWord 1s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(2.4s + var(--i) * .18s)}
.pf-title .pf-script{display:block;margin-top:.08em;font:400 clamp(40px,min(8.4vw,9.5vh),116px)/1.1 Pacifico,cursive;color:var(--pink);text-shadow:0 10px 40px rgba(249,168,201,.45);animation:pfScript 1.4s ease 3s both}
.pf-deck{margin:14px auto 0;max-width:46ch;font-size:clamp(17px,2.2vw,20px);line-height:1.55;color:rgba(255,255,255,.84);animation:pfIn 1s ease 3.6s both}
.pf-tag{margin:0;font:800 12px/1 'DM Sans',sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--blush);animation:pfIn 1s ease 3.8s both}
.pf-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:12px;animation:pfIn 1s ease 4s both}
.pf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 28px;border-radius:999px;background:var(--pink);color:var(--night);font:800 15px/1 'DM Sans',sans-serif;text-decoration:none;transition:transform .2s,box-shadow .2s}
.pf-btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px -12px var(--pink)}
.pf-btn.ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55)}
.pf-scroll{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.55);animation:pfIn 1s ease 4.6s both}

/* Pinned scenes */
.pf [data-pf-scrub]{position:relative}
.pf-sticky{position:sticky;top:0;min-height:100svh;display:grid;place-content:center;padding:100px clamp(20px,6vw,80px) 60px}
.pf-kicker{margin:0 0 18px;font-size:11px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--pink)}
.pf-mission{height:260svh}
.pf-lit{margin:0;max-width:22ch;font:400 clamp(30px,4.8vw,60px)/1.18 'DM Serif Display',Georgia,serif}
.pf-lit span{opacity:calc(.16 + .84 * clamp(0, (var(--p, 0) * 1.25 - var(--w)) * 12, 1));transition:opacity .2s}
.pf-lit em{font-style:italic;color:var(--pink)}

/* Opening photograph: the lights go down on real PGWS women */
.pf-open{isolation:isolate}
.pf-openphoto{position:absolute;inset:0;z-index:-2;overflow:hidden}
.pf-openphoto img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;opacity:0;transform:scale(1.18);animation:pfKen 14s cubic-bezier(.2,.6,.2,1) .4s forwards}
.pf-openphoto:after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 50%,rgba(27,11,20,.38),rgba(27,11,20,.86) 80%),linear-gradient(180deg,rgba(27,11,20,.7),rgba(27,11,20,.25) 40%,rgba(27,11,20,.95))}
.pf-open .pf-glow{z-index:-1;mix-blend-mode:screen;opacity:.7}
.pf-letterbox{position:absolute;left:0;right:0;height:9vh;background:#000;z-index:2;pointer-events:none;animation:pfBars 2.6s cubic-bezier(.7,0,.2,1) 3.4s forwards}
.pf-letterbox.top{top:0}.pf-letterbox.bot{bottom:0}
.pf-title .pf-serif{text-shadow:0 18px 60px rgba(0,0,0,.55)}

/* The member journey: seven stages, one per screen */
.pf-journey{height:calc(100svh * 7.6)}
.pf-journey .pf-sticky{grid-template-columns:minmax(0,1fr);place-content:center;overflow:hidden}
.pf-jphoto{position:absolute;inset:0;z-index:-1}
.pf-jphoto img{width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(calc(1.15 - var(--p, 0) * .15))}
.pf-jphoto:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(27,11,20,.94) 0%,rgba(27,11,20,.7) 45%,rgba(27,11,20,.35) 100%)}
.pf-jhead{margin:0 0 6px;font-size:11px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--pink)}
.pf-jtitle{margin:0 0 34px;font:400 clamp(30px,4vw,52px)/1.05 'DM Serif Display',Georgia,serif;max-width:16ch}
.pf-jtitle em{font:400 .85em/1.1 Pacifico,cursive;color:var(--pink)}
.pf-stages{list-style:none;margin:0;padding:0;display:grid;min-height:clamp(220px,34vh,320px)}
.pf-stages li{grid-area:1/1;align-self:start;display:grid;gap:4px;opacity:0;transform:translateY(40px);filter:blur(6px);transition:opacity .7s,transform .7s,filter .7s}
.pf-stages li.on{opacity:1;transform:none;filter:none}
.pf-stages i{font:400 clamp(90px,15vw,200px)/.8 'DM Serif Display',Georgia,serif;font-style:normal;color:transparent;-webkit-text-stroke:1.5px rgba(249,168,201,.75)}
.pf-stages small{font-size:13px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.pf-stages b{font:400 clamp(44px,7.5vw,104px)/1 Pacifico,cursive;color:#fff;text-shadow:0 14px 50px rgba(249,168,201,.45);padding-right:.1em}
.pf-jbar{display:flex;gap:6px;margin-top:30px}
.pf-jbar i{width:28px;height:3px;border-radius:3px;background:rgba(255,255,255,.25);transition:background .4s}
.pf-jbar i.on{background:var(--pink)}

/* The founder */
.pf-founder{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(34px,6vw,90px);align-items:center;max-width:1180px;margin:0 auto;padding:clamp(90px,12vw,160px) clamp(22px,5vw,50px)}
.pf-arch{position:relative;margin:0;max-width:440px;justify-self:center;width:100%}
.pf-arch:before{content:"";position:absolute;inset:16px -16px -16px 16px;border:1.5px solid var(--gold);border-radius:240px 240px 26px 26px}
.pf-arch img{position:relative;display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 30%;border-radius:240px 240px 26px 26px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.pf-founder blockquote{margin:0;font:italic 400 clamp(30px,4.2vw,54px)/1.2 'DM Serif Display',Georgia,serif}
.pf-founder blockquote em{font-style:normal;color:var(--pink)}
.pf-founder cite{display:block;margin-top:26px;font:800 12px/1.5 'DM Sans',sans-serif;font-style:normal;letter-spacing:.24em;text-transform:uppercase;color:var(--pink)}
.pf-founder cite span{display:block;color:rgba(255,255,255,.6);letter-spacing:.14em}
.pf-founder p{margin:22px 0 0;max-width:52ch;color:rgba(255,255,255,.76);font-size:17px;line-height:1.7}
@media(max-width:700px){.pf-jphoto:after{background:linear-gradient(180deg,rgba(27,11,20,.72) 0%,rgba(27,11,20,.62) 45%,rgba(27,11,20,.9) 100%)}}
@media(max-width:800px){.pf-founder{grid-template-columns:1fr}.pf-arch{max-width:320px}}

/* Full-bleed photographs of PGWS women, graded under rose-night */
.pf-photo{position:relative;min-height:110svh;display:grid;align-items:end;overflow:hidden}
.pf-photo img{position:absolute;inset:-12% 0;width:100%;height:124%;object-fit:cover;object-position:center 30%;transform:translateY(calc((var(--p, .5) - .5) * -12%));will-change:transform}
.pf-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,11,20,.85) 0%,rgba(27,11,20,.15) 32%,rgba(27,11,20,.25) 55%,rgba(27,11,20,.94) 100%)}
.pf-photo figcaption{position:relative;z-index:1;padding:0 clamp(22px,6vw,90px) clamp(60px,10vh,110px);max-width:900px}
.pf-photo figcaption span{display:block;margin-bottom:12px;font-size:11px;font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:var(--pink)}
.pf-photo figcaption strong{display:block;font:400 clamp(40px,7vw,96px)/1 'DM Serif Display',Georgia,serif;text-shadow:0 10px 40px rgba(0,0,0,.45)}
.pf-photo figcaption strong em{font:400 .82em/1.1 Pacifico,cursive;color:var(--pink)}

/* We are redefining pretty */
.pf-pretty{height:300svh}
.pf-pretty .pf-sticky{justify-items:center;text-align:center}
.pf-pretty h2{margin:0 0 26px;font:400 clamp(40px,6.6vw,88px)/1 'DM Serif Display',Georgia,serif}
.pf-pretty h2 em{font:400 .85em/1.1 Pacifico,cursive;color:var(--pink)}
.pf-not{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;margin:0 0 30px;padding:0;list-style:none;max-width:760px}
.pf-not li{position:relative;font:400 clamp(24px,3.6vw,44px)/1.1 'DM Serif Display',Georgia,serif;color:rgba(255,255,255,.9);transition:color .5s}
.pf-not li:after{content:"";position:absolute;left:-4%;right:-4%;top:54%;height:3px;border-radius:3px;background:var(--pink);transform:scaleX(var(--s,0));transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.pf-not li.gone{color:rgba(255,255,255,.32)}
.pf-not li.gone:after{--s:1}
.pf-is{margin:0;max-width:30ch;font:400 clamp(22px,2.9vw,34px)/1.35 'DM Serif Display',Georgia,serif;opacity:0;transform:translateY(20px);transition:opacity .8s,transform .8s}
.pf-is em{font-style:italic;color:var(--pink)}
.pf-pretty.done .pf-is{opacity:1;transform:none}

/* Rubies (no pearls: Shayna, 30 Sept 2026) */
.pf-gems{min-height:100svh;display:grid;place-content:center;justify-items:center;text-align:center;padding:110px 22px;background:radial-gradient(60% 50% at 50% 45%,rgba(216,109,157,.22),transparent 70%)}
.pf-gemrow{display:flex;align-items:center;gap:clamp(22px,5vw,48px);margin-bottom:34px}
.pf-rubygem{width:clamp(58px,9vw,96px)}
.pf-rubygem svg{display:block;width:100%;height:auto;filter:drop-shadow(0 20px 36px rgba(179,18,63,.6))}
.pf-gems h2{margin:0 0 16px;font:400 clamp(44px,7vw,92px)/1 'DM Serif Display',Georgia,serif}
.pf-gems h2 em{font:400 .8em/1 Pacifico,cursive;color:var(--pink)}
.pf-gems p{margin:0 auto;max-width:50ch;font-size:clamp(17px,2vw,20px);line-height:1.65;color:rgba(255,255,255,.8)}

/* Story */
.pf-story{max-width:1000px;margin:0 auto;padding:clamp(80px,11vw,140px) clamp(20px,5vw,40px)}
.pf-story h2{margin:0;font:400 clamp(40px,6.4vw,84px)/1 'DM Serif Display',Georgia,serif}
.pf-story h2 em{font:400 .8em/1 Pacifico,cursive;color:var(--pink)}
.pf-time{list-style:none;margin:40px 0 0;padding:0 0 0 28px;border-left:2px solid rgba(249,168,201,.3);display:grid;gap:36px}
.pf-time li{position:relative;display:grid;gap:6px;max-width:60ch}
.pf-time li:before{content:"";position:absolute;left:-37px;top:4px;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 32% 28%,#fff,#f2dfe6 55%,#c9a9b6);box-shadow:0 0 0 6px rgba(249,168,201,.15)}
.pf-time time{font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--pink)}
.pf-time b{font:400 clamp(24px,3vw,32px)/1.1 'DM Serif Display',Georgia,serif}
.pf-time p{margin:0;font-size:17px;line-height:1.55;color:rgba(255,255,255,.76)}
.pf-time a{color:var(--pink);font-weight:800;font-size:14px}

/* The verse, alone */
.pf-verse{min-height:100svh;display:grid;place-items:center;padding:90px 22px;background:var(--void);text-align:center;overflow:hidden}
.pf-bloom{position:absolute;left:50%;top:50%;width:72vmin;height:72vmin;margin:-36vmin 0 0 -36vmin;border-radius:50%;background:radial-gradient(circle,rgba(179,18,63,.55),rgba(249,168,201,.12) 45%,transparent 68%);filter:blur(22px);animation:pfBloom 7s ease-in-out infinite alternate}
.pf-verse blockquote{position:relative;margin:0;max-width:20ch;font:italic 400 clamp(32px,5.2vw,60px)/1.25 'DM Serif Display',Georgia,serif}
.pf-verse cite{display:block;margin-top:22px;font:800 12px/1 'DM Sans',sans-serif;font-style:normal;letter-spacing:.26em;text-transform:uppercase;color:var(--pink)}

/* Lights up into the site */
.pf-dawn{height:clamp(160px,26vh,280px);background:linear-gradient(180deg,var(--void) 0%,#5a2340 30%,#f59bc2 65%,#fff6fa 100%)}

.pf-reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i, 0) * .14s)}
.pf-reveal.in{opacity:1;transform:none}

/* The header dims with the lights */
body.pgws-dark .site-header{background:rgba(27,11,20,.92);border-bottom-color:rgba(249,168,201,.18)}
body.pgws-dark .site-header nav a,body.pgws-dark .menu{color:rgba(255,255,255,.9)}
body.pgws-dark .site-header nav a:hover{color:var(--pink)}
body.pgws-dark .join-mini{background:var(--pink);color:#1b0b14}
body.pgws-dark .join-mini span{color:#1b0b14}
body.pgws-dark .site-header nav.open{background:#1b0b14}
.site-header,.site-header nav a,.join-mini{transition:background .5s,color .5s,border-color .5s}

@media (min-width:700px) and (max-height:860px){.pf-tag{display:none}.pf-deck{margin-top:4px}.pf-bottle{width:clamp(60px,9vh,132px)}.pf-open{padding-top:40px}}

@keyframes pfKen{0%{opacity:0;transform:scale(1.18)}18%{opacity:1}100%{opacity:1;transform:scale(1.02)}}
@keyframes pfBars{to{height:0}}
@keyframes pfGlow{from{transform:scale(1)}to{transform:scale(1.12) translateY(-3%)}}
@keyframes pfPre{0%{opacity:0}25%{opacity:1}70%{opacity:1}100%{opacity:.4}}
@keyframes pfMirror{from{opacity:0;transform:translateY(24px) scale(.9);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes pfStopper{0%{opacity:0;transform:translateY(-120%) rotate(-14deg)}35%{opacity:1;transform:none}60%{transform:none}100%{opacity:1;transform:translateY(-55%) rotate(-7deg)}}
@keyframes pfWisp{0%{opacity:0}30%{opacity:.9}100%{opacity:.75;stroke-dashoffset:0}}
@keyframes pfDrift{0%,100%{opacity:.75;transform:none}50%{opacity:.35;transform:translateY(-5px) scaleX(1.08)}}
@keyframes pfDrop{from{opacity:0;transform:translateY(-80px) rotate(-20deg)}to{opacity:1;transform:none}}
@keyframes pfWord{from{opacity:0;transform:translateY(.35em);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes pfScript{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes pfIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pfBloom{from{transform:scale(.85);opacity:.7}to{transform:scale(1.1);opacity:1}}

@media (prefers-reduced-motion:reduce){
  .pf *,.pf *:before{animation:none!important;transition:none!important}
  .pf-reveal{opacity:1;transform:none}
  .pf-mission,.pf-pretty{height:auto}
  .pf-sticky{position:static;min-height:0;padding:80px 22px}
  .pf-lit span{opacity:1}
  .pf-openphoto img{opacity:1;transform:none}
  .pf-letterbox{display:none}
  .pf-journey{height:auto}
  .pf-stages{gap:34px}
  .pf-stages li{grid-area:auto;opacity:1;transform:none;filter:none}
  .pf-jbar{display:none}
  .pf-jphoto img{transform:none}
  .pf-dots,.pf-canvas{display:none}
  .pf-is{opacity:1;transform:none}
  .pf-not li{color:rgba(255,255,255,.32)}
  .pf-not li:after{--s:1}
  .pf-photo img{transform:none}
  .pf-wisp{stroke-dashoffset:0;opacity:.7}
  .pf-bottle .pf-stopper{transform:translateY(-55%) rotate(-7deg)}
}

/* PRETTY Ambassadors: the ribbon above the site and its menu tab (Shayna, 30 Sept 2026) */
.topline.pf-amb{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;text-align:center;text-decoration:none;color:#fff;font-weight:700;letter-spacing:.02em;
  background:linear-gradient(90deg,#7d2751,#d86d9d 50%,#9f2852);background-size:200% 100%;animation:pf-amb 8s ease-in-out infinite;padding:10px 16px}
.topline.pf-amb b{transition:transform .3s}
.topline.pf-amb:hover b{transform:translateX(4px)}
.pf-amb-tag{display:inline-block;padding:3px 10px;border-radius:999px;background:#fff;color:#9f2852;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
@keyframes pf-amb{50%{background-position:100% 0}}
.site-header nav a.nav-amb{color:#9f2852;font-weight:800}
body.pgws-dark .site-header nav a.nav-amb{color:#f9a8c9}
@media (max-width:600px){.topline.pf-amb{font-size:13px;gap:6px 8px;padding:8px 12px;line-height:1.3}.pf-amb-tag{font-size:10px;padding:2px 8px}}
@media (prefers-reduced-motion:reduce){.topline.pf-amb{animation:none}}

/* The perfume opening (Shayna, 1 Oct 2026: "a bottle of perfume to actually open up the website").
   The bottle from the PGWS logo rises out of the dark, its ruby stopper lifts off, the fragrance pours out
   and floods the screen in pink, and the site appears through it. Once per visit; never for reduced motion. */
#pp{display:none}
html.pp-on{overflow:hidden}
html.pp-on #pp{display:block;position:fixed;inset:0;z-index:2147483000;background:radial-gradient(70% 60% at 50% 45%,#3a1027 0%,#1b0b14 60%,#0d0509 100%);overflow:hidden;cursor:pointer;animation:ppOut .9s ease 4.6s forwards}
html.pp-on .pf-open,html.pp-on .pf-open *{animation-play-state:paused!important}
#pp .pp-glow{position:absolute;left:50%;top:46%;width:min(120vw,900px);aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(circle,rgba(249,168,201,.38),rgba(216,109,157,.12) 40%,transparent 68%);opacity:0;animation:ppGlow 2.6s ease .3s forwards}
#pp .pp-stage{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;padding:20px;text-align:center;animation:ppDolly 1.3s cubic-bezier(.6,0,.4,1) 3.6s forwards}
#pp .pp-line{margin:0;font:italic 400 clamp(16px,2.4vw,22px)/1.3 'DM Serif Display',Georgia,serif;color:rgba(255,230,240,.8);letter-spacing:.02em;opacity:0;animation:ppIn 1s ease .2s forwards}
#pp .pp-bottle{position:relative;width:min(58vw,40vh,340px);aspect-ratio:1;opacity:0;transform:translateY(60px) scale(.9);filter:drop-shadow(0 30px 60px rgba(0,0,0,.5)) drop-shadow(0 0 50px rgba(249,168,201,.35));animation:ppRise 1.4s cubic-bezier(.2,.8,.2,1) .5s forwards}
#pp .pp-bottle img{position:absolute;display:block}
#pp .pp-body{inset:0;width:100%;height:100%}
#pp .pp-stop{left:41.73%;top:9.42%;width:14.23%;height:14.6%;transform-origin:50% 100%;animation:ppLift 1.5s cubic-bezier(.3,1.4,.5,1) 1.8s forwards;filter:drop-shadow(0 6px 10px rgba(120,10,40,.5))}
#pp .pp-neck{position:absolute;left:48.8%;top:22%;width:0;height:0}
#pp .pp-neck i{position:absolute;left:0;top:0;width:clamp(40px,9vw,90px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,214,231,.85),rgba(249,168,201,.45) 45%,transparent 70%);filter:blur(6px);opacity:0;transform:translate(-50%,-50%) scale(.2);animation:ppMist 2.6s ease-out forwards}
#pp .pp-neck i:nth-child(1){--x:-30px;--y:-120px;animation-delay:2.25s}
#pp .pp-neck i:nth-child(2){--x:40px;--y:-170px;animation-delay:2.4s}
#pp .pp-neck i:nth-child(3){--x:-70px;--y:-210px;animation-delay:2.55s}
#pp .pp-neck i:nth-child(4){--x:90px;--y:-260px;animation-delay:2.7s}
#pp .pp-neck i:nth-child(5){--x:-120px;--y:-300px;animation-delay:2.85s}
#pp .pp-neck i:nth-child(6){--x:20px;--y:-330px;animation-delay:2.95s}
#pp .pp-neck i:nth-child(7){--x:150px;--y:-220px;animation-delay:3.05s}
#pp .pp-neck i:nth-child(8){--x:-170px;--y:-180px;animation-delay:3.15s}
#pp .pp-verse{margin:6px 0 0;font:italic 400 clamp(15px,2vw,19px)/1.4 'DM Serif Display',Georgia,serif;color:#ffd6e7;opacity:0;animation:ppIn 1s ease 2.5s forwards}
#pp .pp-verse small{display:block;margin-top:4px;font:800 10px/1 DM Sans,system-ui,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#f9a8c9;font-style:normal}
#pp .pp-flood{position:absolute;left:50%;top:38%;width:40px;height:40px;border-radius:50%;transform:translate(-50%,-50%) scale(0);background:radial-gradient(circle,#ffe3ee 0%,#f9a8c9 35%,rgba(216,109,157,.85) 60%,rgba(216,109,157,0) 72%);animation:ppFlood 1.6s cubic-bezier(.5,0,.3,1) 3.4s forwards}
#pp .pp-skip{position:absolute;right:16px;bottom:16px;padding:8px 16px;border-radius:999px;border:1px solid rgba(255,214,231,.35);background:rgba(27,11,20,.5);color:#ffd6e7;font:700 12px/1 DM Sans,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
#pp.pp-done{animation:ppOut .5s ease forwards!important}
@keyframes ppIn{to{opacity:1}}
@keyframes ppGlow{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ppRise{to{opacity:1;transform:none}}
@keyframes ppLift{0%{transform:none}55%{transform:translateY(-95%) rotate(-10deg)}100%{transform:translate(-30%,-140%) rotate(-18deg)}}
@keyframes ppMist{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}25%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(3.2)}}
@keyframes ppFlood{to{transform:translate(-50%,-50%) scale(80)}}
@keyframes ppDolly{to{transform:scale(1.6);opacity:0}}
@keyframes ppOut{to{opacity:0;visibility:hidden}}
