.package-choice { container-type:inline-size; width:min(1320px,100%); margin:auto; color:#f7f9ff; font-family:var(--sans,system-ui,sans-serif); }
.package-choice-heading { margin:0 0 clamp(24px,3cqw,44px); text-align:center; }
.package-choice-heading p { margin:0 0 14px; color:#a8b8d3; font-size:12px; font-weight:700; letter-spacing:.25em; }
.package-choice-heading h1 { margin:0; color:#f7f9ff; font-size:clamp(32px,4.2cqw,58px); font-weight:750; line-height:1.08; letter-spacing:-.045em; }
.package-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(20px,2.5cqw,36px); }
button.package-card { --package-accent:#ee777b; container-type:inline-size; position:relative; display:grid; place-items:center; width:100%; min-width:0; padding:12px 0; text-align:left; color:#f7f9ff; border:1px solid #34475e; border-radius:24px; background:#111b2b; font:inherit; cursor:pointer; box-shadow:0 20px 70px #0003; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
button.package-lead { --package-accent:#76a9ee; }
button.package-card:hover { transform:translateY(-5px); border-color:var(--package-accent); background:#172236; box-shadow:0 24px 75px #0005; }
button.package-card:focus-visible { outline:3px solid var(--package-accent); outline-offset:5px; }
.package-selection-slide { position:fixed; inset:0; z-index:224; overflow:auto; padding:clamp(24px,5vh,64px) clamp(16px,5vw,80px); box-sizing:border-box; background:radial-gradient(ellipse at 15% 20%,#152740 0,transparent 48%),radial-gradient(ellipse at 85% 85%,#241c3b 0,transparent 50%),#080d18; }
.package-selection-slide:not([hidden]) { display:grid; align-items:center; }
.package-selection-slide[hidden] { display:none; }
.package-selection-workspace { margin-top:20px; padding:clamp(16px,4vw,64px); border-radius:24px; background:radial-gradient(ellipse at 15% 20%,#152740 0,transparent 48%),radial-gradient(ellipse at 85% 85%,#241c3b 0,transparent 50%),#080d18; }
.package-selection-back { margin-top:24px; }
.workshop-parcel { position:relative; display:block; flex:none; width:28em; height:31em; font-family:var(--sans,system-ui,sans-serif); font-size:clamp(8px,3.3cqw,16px); text-align:left; letter-spacing:normal; text-transform:none; line-height:normal; }
.workshop-parcel,.workshop-parcel * { box-sizing:border-box; }
/* Smaller versions of the same parcels on the shared thank-you screen. */
.package-journey { width:min(1080px,90vw); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:10px; font-family:var(--sans,system-ui,sans-serif); }
.package-journey-card { position:relative; min-width:0; display:flex; justify-content:center; align-items:center; gap:12px; box-sizing:border-box; padding:8px 20px 8px 8px; border:1px solid #476378; border-radius:20px; background:#0c1423f5; color:#f7f9ff; text-align:left; font:inherit; }
.package-journey .workshop-parcel { font-size:7px; }
.package-journey-status { display:block; color:#8fe4bb; font-size:12px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; line-height:1.5; }
.package-journey-complete .package-journey-status > span { display:grid; place-items:center; width:24px; height:24px; margin-bottom:8px; border-radius:50%; background:#8fe4bb; color:#0c1423; font-size:16px; }
button.package-journey-next { border-color:#76a9ee; cursor:pointer; animation:packageNextGlow 3.2s ease-in-out infinite; }
.package-journey-next .package-journey-status { color:#adcdff; }
.package-journey-arrow { display:block; color:#adcdff; font-size:28px; line-height:1; margin-top:8px; animation:packageNextArrow 3.2s ease-in-out infinite; }
button.package-journey-next:hover { background:#18283e; }
button.package-journey-next:focus-visible { outline:3px solid #adcdff; outline-offset:5px; }
@keyframes packageNextGlow { 0%,100% { box-shadow:0 0 0 1px #76a9ee30,0 0 20px #468cff20; } 50% { box-shadow:0 0 0 3px #76a9ee60,0 0 38px #468cff55; } }
@keyframes packageNextArrow { 0%,100% { transform:translateX(0); } 50% { transform:translateX(5px); } }
@media (max-width:850px) { .package-journey-card { flex-direction:column; gap:0; padding:6px 8px 18px; } .package-journey-status { text-align:center; } .package-journey-complete .package-journey-status > span { display:inline-grid; margin:0 5px 0 0; } .package-journey-arrow { display:inline-block; margin:0 0 0 5px; vertical-align:middle; } }
@media (max-width:680px) { .package-choice-grid { grid-template-columns:1fr; } }
@media (max-width:520px) { .package-journey { grid-template-columns:1fr; gap:14px; } }
@media (prefers-reduced-motion:reduce) { button.package-card { transition:none; } button.package-card:hover { transform:none; } button.package-journey-next,.package-journey-arrow { animation:none; } button.package-journey-next { box-shadow:0 0 0 2px #76a9ee60,0 0 24px #468cff44; } }

/* CSS parcel artwork shared by selection and completion. */
.workshop-parcel.package-red {--front:#cc3e43;--light:#ef6b68;--side:#a62936;--lid:#de4d50;--seam:#942a35;--angle:-8deg;}
.workshop-parcel.package-blue {--front:#3473c8;--light:#6aa0e7;--side:#22539a;--lid:#4387d9;--seam:#1c4785;--angle:7deg;}
.workshop-parcel .ground-shadow {position:absolute;left:3.4em;top:26.3em;width:22.5em;height:2.7em;border-radius:50%;background:#00000065;filter:blur(1.3em);}
.workshop-parcel .parcel {position:absolute;width:28em;height:28em;top:1.2em;left:0;transition:transform 320ms ease;}
.workshop-parcel .box-top {position:absolute;inset:0;background:linear-gradient(130deg,var(--light),var(--lid));clip-path:polygon(2.4em 8.6em,10.3em 3.8em,25.7em 8em,18em 13em);}
.workshop-parcel .box-front {position:absolute;inset:0;background:linear-gradient(115deg,var(--lid),var(--front) 72%);clip-path:polygon(2.4em 8.6em,18em 13em,18em 27.4em,2.4em 22.9em);}
.workshop-parcel .box-side {position:absolute;inset:0;background:linear-gradient(100deg,var(--front),var(--side));clip-path:polygon(18em 13em,25.7em 8em,25.7em 22.4em,18em 27.4em);}
.workshop-parcel .lid-front {position:absolute;inset:0;background:var(--lid);clip-path:polygon(2.2em 8.5em,18em 12.9em,18em 14.7em,2.2em 10.3em);filter:drop-shadow(0 0.2em 0 var(--seam));}
.workshop-parcel .lid-side {position:absolute;inset:0;background:var(--side);clip-path:polygon(18em 12.9em,25.9em 7.8em,25.9em 9.7em,18em 14.7em);}
.workshop-parcel .top-band {position:absolute;inset:0;background:linear-gradient(120deg,#f8ead0,#fff5de);clip-path:polygon(9.1em 10.5em,17em 5.6em,18.8em 6.1em,10.9em 11em);}
.workshop-parcel .front-band {position:absolute;inset:0;background:linear-gradient(90deg,#e9d6b7,#f9eace);clip-path:polygon(9.1em 10.5em,10.9em 11em,10.9em 25.3em,9.1em 24.8em);}
.workshop-parcel .cross-band {position:absolute;inset:0;background:#f5e6c9;clip-path:polygon(5.5em 6.7em,7.1em 5.7em,22.8em 9.9em,21.2em 11em);}
.workshop-parcel .side-band {position:absolute;inset:0;background:linear-gradient(90deg,#dbc5a3,#ead5b4);clip-path:polygon(21.2em 11em,22.8em 9.9em,22.8em 24.3em,21.2em 25.3em);}
.workshop-parcel .tag {position:absolute;left:5.5em;top:14.2em;width:17.2em;min-height:13em;padding:2.6em 1.5em 1.5em;border-radius:0.5em 0.5em 0.9em 0.9em;background:#fffaf0;color:#242937;transform:perspective(65em) rotateX(-12deg) rotate(var(--angle));transform-origin:50% 100%;box-shadow:0.4em 0.5em 0.9em #18283c30,0 0.1em 0.1em #fff8 inset;}
.workshop-parcel .eyelet {position:absolute;top:0.7em;left:8em;width:1em;height:1em;background:var(--front);border:0.2em solid #d8c9ad;border-radius:50%;box-shadow:0 0.1em 0.2em #0002 inset;}
.workshop-parcel .tag-kicker {display:block;font-size:0.8em;letter-spacing:0.15em;font-weight:700;color:#6a6b6b;margin-bottom:0.8em;}
.workshop-parcel strong {display:block;font-size:2.2em;line-height:1.08;letter-spacing:-0.065em;font-weight:750;}
.workshop-parcel .tag-bottom {display:block;font-size:0.9em;margin-top:1em;color:#616675;}
