/* MIKA Logistyka — style strony (wydzielone z index.html). */

/* ---------- Ekran ładowania (#mika-preload) ---------- */
#mika-preload{position:fixed;inset:0;z-index:9999;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .45s ease}
#mika-preload[data-off]{opacity:0;pointer-events:none}
#mika-preload img{width:64px !important;height:64px !important;border-radius:13px;animation:mika-pulse 1.6s ease-in-out infinite}
#mika-preload .pl-word{font-family:Manrope,system-ui,sans-serif;font-weight:600;font-size:11px;letter-spacing:.26em;color:#8A9099}
#mika-preload .pl-bar{width:180px;height:2px;background:#EDEEF0;overflow:hidden;border-radius:2px}
#mika-preload .pl-bar i{display:block;width:40%;height:100%;background:#E01B22;animation:mika-slide 1.25s ease-in-out infinite}
@keyframes mika-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes mika-slide{0%{transform:translateX(-110%)}100%{transform:translateX(260%)}}

/* ---------- Strona ---------- */
html,body{margin:0;padding:0}
body{background:#fff;font-family:Manrope,system-ui,sans-serif;color:#17181A;-webkit-font-smoothing:antialiased;text-wrap:pretty}
*{box-sizing:border-box}
a{color:#E01B22;text-decoration:none}
a:hover{color:#B41217}
input,select,textarea,button{font-family:inherit}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #E01B22;outline-offset:2px}
@media (max-width:980px){[data-desk]{display:none !important}[data-burg]{display:inline-flex !important}}
@media (min-width:981px){[data-mob]{display:none !important}}
@media (max-width:980px){[data-hero]{grid-template-columns:1fr !important}[data-heroart]{order:2}}
[data-grid4]{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1149px){[data-grid4]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){[data-grid4]{grid-template-columns:minmax(0,1fr)}}
[data-facts]{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1080px){[data-facts]{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Podziękowanie po wysłaniu formularza: czerwona zasłona wjeżdża od lewej,
   treść i „ptaszek" pojawiają się po niej, całość znika po 10 sekundach. */
[data-thanks]{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;padding:clamp(20px,4vw,40px);cursor:pointer;animation:mikaThanksOut .7s ease 9.3s both}
[data-thanks-bg]{position:absolute;inset:0;background:linear-gradient(104deg,#E01B22 0%,#C4151C 58%,#A61016 100%);transform:scaleX(0);transform-origin:left center;animation:mikaWipe .62s cubic-bezier(.72,0,.24,1) forwards}
[data-thanks-body]{position:relative;text-align:center;max-width:52ch;opacity:0;animation:mikaThanksIn .5s cubic-bezier(.2,.9,.3,1) .44s forwards}
[data-thanks-ic]{display:inline-flex;align-items:center;justify-content:center;width:68px;height:68px;border-radius:50%;background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.16);animation:mikaThanksPop .52s cubic-bezier(.34,1.45,.6,1) .52s both}
[data-thanks-ic] path{stroke-dasharray:30;stroke-dashoffset:30;animation:mikaThanksDraw .42s ease .82s forwards}
[data-thanks-t]{margin-top:18px;font-weight:800;font-size:clamp(19px,2.2vw,27px);letter-spacing:-.02em;color:#fff}
[data-thanks-d]{margin:10px 0 0;font-size:clamp(14px,1.4vw,15.5px);line-height:1.6;color:rgba(255,255,255,.9)}
@keyframes mikaWipe{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes mikaThanksIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes mikaThanksPop{from{opacity:0;transform:scale(.45)}to{opacity:1;transform:scale(1)}}
@keyframes mikaThanksDraw{to{stroke-dashoffset:0}}
@keyframes mikaThanksOut{from{opacity:1}to{opacity:0}}
@media (prefers-reduced-motion:reduce){
  [data-thanks-bg]{animation:none;transform:scaleX(1)}
  [data-thanks-body]{animation:none;opacity:1}
  [data-thanks-ic]{animation:none}
  [data-thanks-ic] path{animation:none;stroke-dashoffset:0}
  [data-thanks]{animation:mikaThanksOut .3s linear 9.7s both}
}
