/* PS Beton – animovaný jeřáb v pozadí úvodní části (v1.16.0)
   Jeden cyklus = 20 s: hák zvedne horní panel ze stohu vlevo, převeze ho a položí na stoh vpravo. */

.psb-home.psb-hero--jerab { position: relative; overflow: hidden; }
.psb-home.psb-hero--jerab .psb-hero__stage { position: relative; }
.psb-home.psb-hero--jerab .psb-hero__grid { position: relative; z-index: 1; padding-bottom: 150px; }
.psb-home.psb-hero--jerab .psb-trust { position: relative; z-index: 1; }

.psb-home .psb-crane {
	--psb-crane-dur: 20s;
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	color: rgba(214, 226, 250, .42);
	pointer-events: none;
	overflow: visible;
}
.psb-home .psb-crane__ground { stroke: rgba(214, 226, 250, .35); }
.psb-home .psb-crane__cab { fill: rgba(214, 226, 250, .18); }
.psb-home .psb-crane__light { fill: #F5B400; stroke: none; animation: psbCrBlink 1.6s steps(1) infinite; }
.psb-home .psb-crane__panels rect,
.psb-home .psb-crane__panel { fill: #F5B400; stroke: #C48F00; stroke-width: 1.5; }
.psb-home .psb-crane__yellow { fill: #F5B400; stroke: none; }
.psb-home .psb-crane__sling { stroke: #F5B400; stroke-width: 1.4; }
.psb-home .psb-crane__cable { fill: rgba(214, 226, 250, .7); stroke: none; }

.psb-home .psb-crane__trolley,
.psb-home .psb-crane__swing,
.psb-home .psb-crane__cable,
.psb-home .psb-crane__hoist { transform-box: view-box; }
.psb-home .psb-crane__trolley { animation: psbCrTrolley var(--psb-crane-dur) ease-in-out infinite; }
.psb-home .psb-crane__swing { transform-origin: 600px 84px; animation: psbCrSwing var(--psb-crane-dur) ease-in-out infinite; }
.psb-home .psb-crane__cable { transform-origin: 600px 84px; animation: psbCrCable var(--psb-crane-dur) ease-in-out infinite; }
.psb-home .psb-crane__hoist { animation: psbCrHoist var(--psb-crane-dur) ease-in-out infinite; }
.psb-home .psb-crane__carried { animation: psbCrCarried var(--psb-crane-dur) linear infinite; }
.psb-home .psb-crane__stacktop { animation: psbCrStackTop var(--psb-crane-dur) linear infinite; }
.psb-home .psb-crane__placed { animation: psbCrPlaced var(--psb-crane-dur) linear infinite; }

@keyframes psbCrTrolley { 0%, 27% { transform: translateX(-380px); } 50%, 73% { transform: translateX(0); } 94%, 100% { transform: translateX(-380px); } }
@keyframes psbCrCable { 0%, 4% { transform: scaleY(4); } 14%, 17% { transform: scaleY(5.52); } 27%, 50% { transform: scaleY(5.12); } 60%, 63% { transform: scaleY(5.52); } 73%, 100% { transform: scaleY(4); } }
@keyframes psbCrHoist { 0%, 4% { transform: translateY(300px); } 14%, 17% { transform: translateY(452px); } 27%, 50% { transform: translateY(412px); } 60%, 63% { transform: translateY(452px); } 73%, 100% { transform: translateY(300px); } }
@keyframes psbCrSwing { 0%, 27% { transform: rotate(0); } 31% { transform: rotate(-1.2deg); } 37% { transform: rotate(1deg); } 43% { transform: rotate(-.6deg); } 49% { transform: rotate(.25deg); } 52%, 73% { transform: rotate(0); } 77% { transform: rotate(1deg); } 83% { transform: rotate(-.7deg); } 89% { transform: rotate(.4deg); } 94%, 100% { transform: rotate(0); } }
@keyframes psbCrCarried { 0%, 15.9% { opacity: 0; } 16%, 61.9% { opacity: 1; } 62%, 100% { opacity: 0; } }
@keyframes psbCrStackTop { 0%, 15.9% { opacity: 1; } 16%, 94% { opacity: 0; } 98%, 100% { opacity: 1; } }
@keyframes psbCrPlaced { 0%, 61.9% { opacity: 0; } 62%, 94% { opacity: 1; } 98%, 100% { opacity: 0; } }
@keyframes psbCrBlink { 0% { opacity: 1; } 50% { opacity: .15; } }

/* Omezený pohyb: jeřáb stojí, panel leží na stohu. */
@media (prefers-reduced-motion: reduce) {
	.psb-home .psb-crane * { animation: none !important; }
	.psb-home .psb-crane__carried,
	.psb-home .psb-crane__placed { opacity: 0; }
}

/* Tablet: menší jeřáb dole; telefon: bez jeřábu (na úzké obrazovce by překážel textu). */
@media (max-width: 1200px) {
	.psb-home .psb-crane { opacity: .7; }
}
@media (max-width: 900px) {
	.psb-home.psb-hero--jerab .psb-hero__grid { padding-bottom: 110px; }
}
@media (max-width: 700px) {
	.psb-home .psb-crane { display: none; }
	.psb-home.psb-hero--jerab .psb-hero__grid { padding-bottom: 40px; }
}
