/* 3D print hero scene (printshop layout). */
.lay-printshop .pp-hero-grid { align-items: center; }
.p3 { --glow: #e6007e; position: relative; width: 100%; max-width: 560px; justify-self: end; user-select: none; }
.p3-world { --rx: 0deg; --ry: 0deg; position: relative; height: 470px; transform-style: preserve-3d; perspective: 1300px;
    transform: rotateX(var(--rx)) rotateY(var(--ry)); transition: transform .5s cubic-bezier(.22, 1, .36, 1); }
.p3-halo { position: absolute; left: 50%; top: 42%; width: 420px; height: 420px; translate: -50% -50%; border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--glow) 30%, transparent) 0, transparent 62%); filter: blur(6px); transition: background .5s; transform: translateZ(-120px); }
/* Turntable */
.p3-table { position: absolute; left: 50%; bottom: 46px; width: 340px; height: 340px; translate: -50% 0; transform: rotateX(78deg); transform-style: preserve-3d; border-radius: 50%;
    background: radial-gradient(circle at 50% 45%, #ffffff 0, #f1f2f6 45%, #d9dce3 70%, #c9ccd5 100%);
    box-shadow: 0 0 0 8px #e6e8ee, 0 0 0 9px #cfd3db, 0 40px 60px rgba(20,24,33,.25); }
.p3-table i { position: absolute; inset: 22px; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--glow) 55%, transparent);
    box-shadow: 0 0 24px color-mix(in srgb, var(--glow) 45%, transparent), inset 0 0 24px color-mix(in srgb, var(--glow) 25%, transparent); animation: p3Ring 3.6s ease-in-out infinite; transition: border-color .5s, box-shadow .5s; }
@keyframes p3Ring { 50% { opacity: .55; transform: scale(.96); } }
/* Product on the turntable */
.p3-product { --spin: 0deg; position: absolute; left: 50%; bottom: 96px; width: 300px; height: 300px; translate: -50% 0; transform-style: preserve-3d;
    transform: translateZ(40px) rotateY(var(--spin)); transition: transform .8s cubic-bezier(.22, 1, .36, 1); cursor: grab; z-index: 3; touch-action: pan-y; }
.is-drag .p3-product { transition: none; cursor: grabbing; }
.p3-art { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transform: translateY(24px) scale(.9); transition: opacity .45s, transform .7s cubic-bezier(.22, 1, .36, 1);
    filter: drop-shadow(0 26px 22px rgba(20,24,33,.28)); pointer-events: none; }
.p3-art.is-on { opacity: 1; transform: none; animation: p3Float 5s ease-in-out infinite; }
@keyframes p3Float { 50% { transform: translateY(-10px); } }
.p3-art [data-p3fill] { transition: fill .4s ease; }
.p3-art [data-p3stroke] { transition: stroke .4s ease; }
.swap .p3-table i { animation: p3Pulse .6s ease; }
@keyframes p3Pulse { 40% { box-shadow: 0 0 60px var(--glow), inset 0 0 40px var(--glow); } }
/* Floating real products at depth */
.p3-float { --d: 80px; position: absolute; margin: 0; width: 112px; padding: 6px 6px 8px; border-radius: 16px; background: #fff; box-shadow: 0 22px 40px -18px rgba(20,24,33,.45);
    transform: translateZ(var(--d)); animation: p3Bob 6s ease-in-out infinite; z-index: 4; }
.p3-float img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 11px; display: block; }
.p3-float figcaption { margin-top: 6px; font: 600 11.5px/1.2 system-ui, sans-serif; color: #141821; text-align: center; }
.p3-float.f0 { left: -10px; top: 30px; rotate: -8deg; }
.p3-float.f1 { right: -6px; top: 10px; rotate: 7deg; animation-delay: -1.5s; width: 100px; }
.p3-float.f2 { left: 6px; bottom: 70px; rotate: 6deg; animation-delay: -3s; width: 96px; }
.p3-float.f3 { right: 10px; bottom: 120px; rotate: -6deg; animation-delay: -4.5s; width: 96px; }
@keyframes p3Bob { 50% { translate: 0 -12px; } }
/* Chips and live price */
.p3-chip, .p3-price { --d: 90px; position: absolute; z-index: 5; transform: translateZ(var(--d)); background: #fff; border-radius: 999px; box-shadow: 0 16px 30px -16px rgba(20,24,33,.45); }
.p3-chip { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; font: 600 13px/1 system-ui, sans-serif; color: #141821; white-space: nowrap; }
.p3-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--glow); box-shadow: 0 0 0 4px color-mix(in srgb, var(--glow) 22%, transparent); transition: background .4s; }
.p3-chip.c0 { left: 110px; top: 0; }
.p3-chip.c1 { right: 110px; bottom: 16px; }
.p3-price { left: 50%; top: 44px; translate: -50% 0; display: grid; justify-items: center; gap: 2px; padding: 10px 18px; border-radius: 16px; background: #141821; color: #fff; }
.p3-price small { font: 600 11px/1 system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.65); }
.p3-price b { font: 700 15px/1.2 system-ui, sans-serif; }
/* Controls */
.p3-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; margin-top: 8px; }
.p3-seg { display: flex; gap: 4px; padding: 5px; border-radius: 999px; background: #fff; border: 1px solid #e3e6ec; box-shadow: 0 10px 24px -18px rgba(20,24,33,.4); }
.p3-seg button { min-height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: none; font: 600 14px system-ui, sans-serif; color: #4b5160; cursor: pointer; transition: background .2s, color .2s; }
.p3-seg button[aria-pressed="true"] { background: #141821; color: #fff; }
.p3-swatches { display: flex; gap: 8px; padding: 6px 10px; border-radius: 999px; background: #fff; border: 1px solid #e3e6ec; }
.p3-swatches button { width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(0,0,0,.15); background: var(--c); cursor: pointer; transition: transform .2s, box-shadow .2s; }
.p3-swatches button[aria-pressed="true"] { box-shadow: 0 0 0 3px #fff, 0 0 0 5px #141821; transform: scale(1.08); }
.p3-seg button:focus-visible, .p3-swatches button:focus-visible { outline: 3px solid #141821; outline-offset: 2px; }
.p3-hint { width: 100%; text-align: center; font: 600 12px/1 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #8a909c; }
.p3-hint::before { content: "\2194  "; }
@media (max-width: 900px) {
    .p3 { justify-self: center; max-width: 420px; }
    .p3-world { height: 400px; transform: none !important; }
    .p3-product { width: 250px; height: 250px; bottom: 84px; }
    .p3-table { width: 280px; height: 280px; bottom: 40px; }
    .p3-float { width: 84px !important; }
    .p3-float.f3, .p3-chip.c1 { display: none; }
    .p3-chip.c0 { left: auto; right: 0; }
    .p3-swatches button { width: 36px; height: 36px; }
    .p3-seg button { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .p3-art.is-on, .p3-float, .p3-table i { animation: none; } .p3-world { transition: none; } }

/* Turntable drawn as a perspective ellipse (no 3D rotation, so it never cuts through the product) */
.p3-table { transform: translateZ(-20px) !important; width: 360px !important; height: 92px !important; bottom: 66px !important; border-radius: 50% !important;
    background: radial-gradient(ellipse at 50% 35%, #ffffff 0, #f2f3f6 40%, #dcdfe5 72%, #c6cad3 100%) !important;
    box-shadow: 0 6px 0 #d5d8df, 0 7px 0 #c3c7cf, 0 30px 40px -10px rgba(20,24,33,.35) !important; }
.p3-table i { inset: 10px 26px !important; border-width: 2px !important; }
.p3-product { bottom: 100px !important; }
@media (max-width: 900px) { .p3-table { width: 290px !important; height: 74px !important; bottom: 56px !important; } .p3-product { bottom: 84px !important; } }