/* @META: SOUBOR: css/style-cara.css */
/* @META: ÚČEL: Geometrická synchronizace. Sjednocení na poloměr r=28. Jemný puls 105%. Odstranění mezer. */
.wrapper-animace{position:absolute;top:var(--header-height);bottom:0;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;width:80px;z-index:10;pointer-events:none;}
.cara-start{position:relative;width:0.85px;flex-grow:1;z-index:1;margin-bottom:-12px;}
.cara-end{position:relative;width:0.85px;flex-grow:1;z-index:1;margin-top:-12px;}
.cara-start::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:#ffffff;transform-origin:top;transform:scaleY(0);animation:drawLineY 14.9s linear infinite;}
.cara-end::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:100%;background-color:#ffffff;transform-origin:bottom;transform:scaleY(0);animation:drawLineY 14.9s linear infinite;}
.stred-box{position:relative;width:80px;height:80px;flex-shrink:0;z-index:10;pointer-events:auto;}
.cerny-stred{position:absolute;top:12px;left:12px;width:56px;height:56px;background-color:#000000;border-radius:50%;opacity:0;z-index:1;animation:showBlack 14.9s ease-in-out infinite;}
.stred-box svg{width:100%;height:100%;position:absolute;top:0;left:0;overflow:visible;z-index:2;}
.kruh-p1,.kruh-p2{fill:transparent;stroke:#ffffff;stroke-width:0.85px;stroke-dasharray:1;stroke-dashoffset:1;animation:drawArc 14.9s linear infinite;}
.ikona-obal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0.5);width:100%;height:100%;display:flex;justify-content:center;align-items:center;opacity:0;z-index:3;animation:showHandshake 14.9s cubic-bezier(0.17,0.67,0.83,0.67) infinite;}
.ikona-obal i{font-size:38px!important;width:1.25em!important;height:1.25em!important;line-height:1.25em!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.ikona-obal i::before{color:#ffffff!important;visibility:visible!important;}
@keyframes drawLineY{0%{transform:scaleY(0);}20.1%,88.6%{transform:scaleY(1);}96.6%,100%{transform:scaleY(0);}}
@keyframes drawArc{0%,20.1%{stroke-dashoffset:1;}40.3%,80.5%{stroke-dashoffset:0.555;}88.6%,100%{stroke-dashoffset:1;}}
@keyframes showBlack{0%,40.3%{opacity:0;}43.6%,73.8%{opacity:1;}77.2%,100%{opacity:0;}}
@keyframes showHandshake{0%,43.6%{opacity:0;transform:translate(-50%,-50%) scale(0.4);}50.3%{opacity:1;transform:translate(-50%,-50%) scale(1);}53.7%{opacity:1;transform:translate(-50%,-50%) scale(1.05);}57%{opacity:1;transform:translate(-50%,-50%) scale(1);}60.4%{opacity:1;transform:translate(-50%,-50%) scale(1.05);}63.8%{opacity:1;transform:translate(-50%,-50%) scale(1);}67.1%{opacity:1;transform:translate(-50%,-50%) scale(1.05);}70.5%,73.8%{opacity:1;transform:translate(-50%,-50%) scale(1);}77.2%,100%{opacity:0;transform:translate(-50%,-50%) scale(0.4);}}
@media(max-width:768px){.wrapper-animace{flex-direction:row;top:calc(50% + (var(--header-height)/2));left:0;right:0;bottom:auto;transform:translateY(-50%);width:100%;height:80px;} .cara-start{margin-bottom:0;margin-right:-12px;width:auto;height:0.85px;} .cara-end{margin-top:0;margin-left:-12px;width:auto;height:0.85px;} .cara-start::after{transform-origin:left;transform:scaleX(0);animation-name:drawLineX;} .cara-end::after{transform-origin:right;transform:scaleX(0);animation-name:drawLineX;} .stred-box svg{transform:rotate(-90deg);} @keyframes drawLineX{0%{transform:scaleX(0);}20.1%,88.6%{transform:scaleX(1);}96.6%,100%{transform:scaleX(0);}}}