/* هيرو الطيّ */
.fold-host { position: relative; width: 100%; height: 100%; }
.fold-scene { position: absolute; inset: 0; perspective: 1700px; perspective-origin: 50% 38%; display: grid; place-items: center; }
.fold-net { position: relative; width: 0; height: 0; transform-style: preserve-3d; will-change: transform; --fill: 0; --out: 1; --hinge: 1; }
.fp { position: absolute; transform-style: preserve-3d; }
.fp-f, .fp-b { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; }
.fp-f { opacity: var(--fill); background: linear-gradient(135deg, #dcbc8f, #c39a69); }
.fp-f::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(110, 72, 34, .13) 0 2px, transparent 2px 7px); }
.fp-f::after { content: ''; position: absolute; opacity: var(--hinge); border: 0 dashed rgba(255, 255, 255, .85); }
.fp-front .fp-f::after { left: 0; right: 0; top: 0; border-top-width: 2px; } .fp-back .fp-f::after { left: 0; right: 0; bottom: 0; border-bottom-width: 2px; }
.fp-left .fp-f::after { top: 0; bottom: 0; right: 0; border-right-width: 2px; } .fp-right .fp-f::after { top: 0; bottom: 0; left: 0; border-left-width: 2px; }
.fp-lid .fp-f::after { left: 0; right: 0; bottom: 0; border-bottom-width: 2px; } .fp-tuck .fp-f::after { left: 0; right: 0; bottom: 0; border-bottom-width: 2px; }
.fp-b { transform: rotateY(180deg); background: #0d0d0f; display: grid; place-items: center; }
.fp-b::before { content: ''; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(255, 255, 255, .07), transparent 45%, rgba(255, 255, 255, .05) 80%); }
.pr-front .pr-logo, .fp-b .pr-logo { width: 74%; height: auto; position: relative; }
.pr-mark { width: 38%; height: auto; position: relative; filter: none; } .pr-mark.s { width: 32%; }
.pr-lid { background: var(--red, #ed1c24) !important; } .pr-lid .pr-mark { filter: brightness(0) invert(1); width: 30%; }
.pr-back .pr-stripe { position: absolute; left: 0; right: 0; top: 40%; height: 18%; background: var(--red, #ed1c24); }
.pr-tuck { background: #151517 !important; }
.fold-outline { position: absolute; transform: translateZ(2px); pointer-events: none; opacity: var(--out); overflow: visible; }
.fold-outline .cut path { fill: none; stroke: var(--red, #ed1c24); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 0 6px rgba(237, 28, 36, .7)); }
.fold-outline .crease path { fill: none; stroke: rgba(255, 255, 255, .8); stroke-width: 1.4; stroke-dasharray: 7 6; }
.fold-outline .hd-a { fill: var(--red, #ed1c24); } .fold-outline .hd-b { stroke: var(--red, #ed1c24); stroke-width: 1.4; fill: none; }

.pr-in { position: relative; width: 100%; height: 100%; display: grid; place-items: center; transform: scaleX(-1); }
.pr-front .pr-in { transform: scale(-1, -1); } .pr-lid .pr-in { transform: scale(-1, -1); }
.fp-b::after { content: ''; position: absolute; inset: 0; pointer-events: none; }
.pr-front::after { background: linear-gradient(0deg, rgba(0,0,0,.35), rgba(0,0,0,0) 60%); } .pr-side::after { background: linear-gradient(90deg, rgba(0,0,0,.45), rgba(0,0,0,.1)); }
.pr-back::after { background: rgba(0,0,0,.2); } .pr-lid::after { background: linear-gradient(135deg, rgba(255,255,255,.22), rgba(0,0,0,.18)); }
.fold-outline { max-width: none; }