/* Purple Pie Promos • How To Order page | All selectors scoped to .pporder */
.pporder{--po-purple:#241052;--po-medium:#57318a;--po-magenta:#d80aac;--po-pink:#ff478c;--po-teal:#11cbbb;--po-lavender:#f6f3fa;--po-ink:#271b43;--po-muted:#625b72;--po-line:#e9e4f1;max-width:1240px;margin:0 auto 74px;font:inherit;color:var(--po-ink);line-height:1.65}
.pporder,.pporder *{box-sizing:border-box}
.pporder h1,.pporder h2,.pporder h3,.pporder p{margin:0}
.pporder h1,.pporder h2,.pporder h3{font-weight:800;letter-spacing:-.027em;line-height:1.17;color:var(--po-purple)}
.pporder h1{font-size:clamp(2.25rem,4.2vw,3.9rem)}
.pporder h2{font-size:clamp(1.75rem,2.65vw,2.5rem)}
.pporder h3{font-size:clamp(1.12rem,1.4vw,1.36rem)}
.pporder p+p{margin-top:12px}
.pporder a{color:var(--po-purple);text-underline-offset:4px}
.pporder a:hover{color:var(--po-medium)}
.pporder a:focus-visible,.pporder summary:focus-visible{outline:3px solid #087f78;outline-offset:4px;border-radius:4px}
.pporder .pporder-eyebrow,.pporder .pporder-kicker{font-weight:850;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;line-height:1.4;margin:0 0 14px}
.pporder .pporder-kicker{color:#9c1489}
.pporder .pporder-section{margin-top:clamp(57px,7vw,94px)}
.pporder .pporder-section__heading{max-width:790px;margin:0 0 27px}
.pporder .pporder-section__heading>p:last-child{font-size:1.06rem;color:var(--po-muted);margin-top:11px}
/* The hero uses HTML-only artwork, so no external image is required. */
.pporder .pporder-hero{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(26px,5vw,65px);align-items:center;background:linear-gradient(120deg,#21104c 0%,#33165f 53%,#582980 100%);padding:clamp(30px,5vw,66px);border-radius:14px;min-height:490px;color:#fff}
.pporder .pporder-hero::after{content:"";position:absolute;width:420px;height:420px;right:-175px;top:-170px;border:70px solid rgba(255,76,167,.16);border-radius:50%;z-index:-1}
.pporder .pporder-hero__copy{position:relative;z-index:1}
.pporder .pporder-hero h1{color:#fff;max-width:650px}
.pporder .pporder-hero h1 span{color:#ff8fc3}
.pporder .pporder-hero .pporder-eyebrow{color:#83f3e6}
.pporder .pporder-hero__lead{font-size:clamp(1.2rem,1.6vw,1.55rem);font-weight:760;line-height:1.35;margin:18px 0 13px;color:#fff}
.pporder .pporder-hero__copy>p:not(.pporder-eyebrow):not(.pporder-hero__lead){color:#f0e9fa;max-width:660px}
.pporder .pporder-hero__copy strong{color:#fff}
.pporder .pporder-hero__actions{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:28px}
.pporder a.pporder-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:49px;padding:13px 21px;font-weight:850;font-size:1rem;line-height:1.2;text-align:center;border-radius:7px;text-decoration:none;transition:background .15s,color .15s}
.pporder a.pporder-btn--light{background:#fff;color:var(--po-purple)}
.pporder a.pporder-btn--light:hover{background:#f1e5ff;color:var(--po-purple)}
.pporder a.pporder-btn--dark{background:var(--po-purple);color:#fff}
.pporder a.pporder-btn--dark:hover{background:var(--po-medium);color:#fff}
.pporder a.pporder-hero__link{font-weight:800;color:#fff}
.pporder a.pporder-hero__link:hover{color:#b9fff1}
.pporder .pporder-hero__visual{position:relative;display:grid;place-items:center;min-width:0}
.pporder .pporder-review-card{width:min(100%,480px);position:relative;transform:rotate(1.4deg);background:#fff;color:var(--po-ink);border:1px solid #f8eafa;border-radius:16px;padding:clamp(20px,2.7vw,34px);box-shadow:0 28px 45px rgba(10,4,33,.23)}
.pporder .pporder-review-card__eyebrow{color:#913884;text-transform:uppercase;font-weight:900;letter-spacing:.13em;font-size:.75rem;margin-bottom:12px}
.pporder .pporder-review-card__row{display:flex;align-items:center;gap:13px;padding:14px 0;border-bottom:1px solid var(--po-line)}
.pporder .pporder-review-card__row strong{display:block;color:var(--po-purple);font-weight:840;line-height:1.25}
.pporder .pporder-review-card__row small{display:block;color:var(--po-muted);font-size:.86rem;margin-top:4px;line-height:1.4}
.pporder .pporder-review-card__check{display:grid;place-items:center;flex:none;width:41px;height:41px;font-size:1.1rem;font-weight:900;border-radius:11px}
.pporder .pporder-review-card__check--teal{color:#05665d;background:#d5f9f3}
.pporder .pporder-review-card__check--pink{color:#a51a54;background:#ffe4ef}
.pporder .pporder-review-card__check--purple{color:#4d257f;background:#eae0f6}
.pporder .pporder-review-card__go{margin-top:18px;background:#f2eafa;color:#351561;padding:13px 15px;line-height:1.4;border-radius:8px;font-size:.96rem;font-weight:850}
.pporder .pporder-review-card__go span{color:#00877e;margin-right:8px}
.pporder .pporder-hero__spark{position:absolute;width:13px;height:34px;background:#06d8c4;border-radius:12px;z-index:1;transform:rotate(29deg)}
.pporder .pporder-hero__spark--one{right:-9px;top:-19px}
.pporder .pporder-hero__spark--two{width:10px;height:26px;background:#ff478c;left:1px;bottom:-10px;transform:rotate(-30deg)}
.pporder .pporder-assurance{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,5vw,70px);background:var(--po-lavender);padding:clamp(29px,5vw,59px);border-radius:13px;border-top:4px solid var(--po-teal)}
.pporder .pporder-assurance__copy p{color:#5e5770}
.pporder .pporder-assurance__copy strong{color:var(--po-purple)}
/* Seven visible stages */
.pporder .pporder-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.pporder .pporder-step{--po-accent:var(--po-purple);min-width:0;padding:clamp(23px,3vw,31px);border:1px solid var(--po-line);border-top:4px solid var(--po-accent);background:#fff;border-radius:11px;box-shadow:0 8px 23px rgba(36,16,82,.045)}
.pporder .pporder-step--teal{--po-accent:var(--po-teal)}
.pporder .pporder-step--magenta{--po-accent:var(--po-magenta)}
.pporder .pporder-step--pink{--po-accent:var(--po-pink)}
.pporder .pporder-step--purple{--po-accent:var(--po-purple)}
.pporder .pporder-step__top{display:flex;align-items:center;gap:13px;margin-bottom:17px}
.pporder .pporder-step__number{display:grid;place-items:center;font-weight:900;font-size:1.03rem;color:var(--po-purple);background:color-mix(in srgb,var(--po-accent) 16%,white);border-radius:10px;width:45px;height:45px;flex:none}
.pporder .pporder-step__phase{color:#62556e;font-weight:800;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase}
.pporder .pporder-step h3{margin-bottom:11px}
.pporder .pporder-step p{color:var(--po-muted)}
.pporder .pporder-step--last{grid-column:1/-1;background:linear-gradient(100deg,#fff 65%,#f8f1ff)}
.pporder .pporder-step__last-content{display:flex;align-items:center;justify-content:space-between;gap:20px}
.pporder .pporder-step__last-content>div{max-width:760px}
.pporder .pporder-step__last-mark{display:grid;place-items:center;flex:none;font-size:2.2rem;font-weight:800;width:84px;height:84px;color:#057e73;background:#d8f7f1;border-radius:50%}
/* Three review safeguards */
.pporder .pporder-guardrails__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pporder .pporder-guardrail{--po-accent:var(--po-purple);border:1px solid var(--po-line);border-top:4px solid var(--po-accent);background:#fff;padding:27px 25px;border-radius:10px;min-width:0}
.pporder .pporder-guardrail--teal{--po-accent:var(--po-teal)}
.pporder .pporder-guardrail--magenta{--po-accent:var(--po-magenta)}
.pporder .pporder-guardrail--pink{--po-accent:var(--po-pink)}
.pporder .pporder-guardrail__symbol{display:grid;place-items:center;margin-bottom:14px;width:48px;height:48px;font-weight:900;font-size:1.3rem;border-radius:11px;background:color-mix(in srgb,var(--po-accent) 15%,white);color:var(--po-purple)}
.pporder .pporder-guardrail h3{margin-bottom:9px}
.pporder .pporder-guardrail p{color:var(--po-muted)}
.pporder .pporder-promise{display:grid;grid-template-columns:.97fr 1.03fr;gap:clamp(20px,5vw,70px);background:linear-gradient(110deg,#25104f,#54287d);padding:clamp(32px,5vw,62px);border-radius:12px;color:#fff}
.pporder .pporder-promise h2,.pporder .pporder-promise p{color:#fff}
.pporder .pporder-promise .pporder-eyebrow{color:#83f3e6}
.pporder .pporder-promise>div:nth-child(2){align-self:center;color:#f0eafa}
.pporder .pporder-faq{max-width:950px;margin:auto;border-top:1px solid var(--po-line)}
.pporder .pporder-faq details{border-bottom:1px solid var(--po-line)}
.pporder .pporder-faq summary{position:relative;list-style:none;cursor:pointer;padding:22px 47px 22px 4px;color:var(--po-purple);font-weight:800;font-size:1.05rem;line-height:1.4}
.pporder .pporder-faq summary::-webkit-details-marker{display:none}
.pporder .pporder-faq summary::after{content:'+';position:absolute;right:10px;top:19px;color:#aa188d;font-size:1.35rem;font-weight:800}
.pporder .pporder-faq details[open] summary::after{content:'−'}
.pporder .pporder-faq details>div{padding:0 45px 23px 4px;color:var(--po-muted)}
.pporder .pporder-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:4px solid var(--po-teal);background:var(--po-lavender);border-radius:12px;padding:clamp(30px,5vw,55px)}
.pporder .pporder-cta>div:first-child{max-width:745px}
.pporder .pporder-cta p:last-child{color:var(--po-muted);margin-top:13px}
.pporder .pporder-cta__actions{display:flex;align-items:center;flex-direction:column;gap:15px;flex:none}
.pporder .pporder-cta__text-link{font-weight:850}
@media(max-width:940px){.pporder .pporder-hero,.pporder .pporder-assurance,.pporder .pporder-promise{grid-template-columns:1fr}.pporder .pporder-hero{gap:40px}.pporder .pporder-hero__visual{max-width:550px;width:100%;margin:auto}.pporder .pporder-cta{flex-direction:column;align-items:flex-start}.pporder .pporder-cta__actions{flex-direction:row}}
@media(max-width:680px){.pporder{margin-bottom:44px}.pporder .pporder-hero{padding:30px 22px 38px;border-radius:10px}.pporder .pporder-hero__actions{gap:17px}.pporder .pporder-hero__visual{max-width:440px}.pporder .pporder-review-card{transform:none}.pporder .pporder-assurance{padding:27px 22px}.pporder .pporder-steps,.pporder .pporder-guardrails__grid{grid-template-columns:1fr}.pporder .pporder-step--last{grid-column:auto}.pporder .pporder-step__last-mark{width:55px;height:55px;font-size:1.5rem}.pporder .pporder-promise{padding:32px 24px}.pporder .pporder-cta{padding:27px 23px}.pporder .pporder-cta__actions{flex-direction:column;align-items:stretch;width:100%}.pporder a.pporder-btn{width:100%}}
@media(prefers-reduced-motion:reduce){.pporder a.pporder-btn{transition:none}}
