/* v2.1 add-on for the Next.js pages: homepage hero slider. Scoped under .km-slider. */

/* Hide the old hero's content until the slider replaces it (no flash). Reveals by itself after 4s if the script fails. */
main > section:first-child:has(> div[style*="trainning.png"]){background:#191146}
main > section:first-child:has(> div[style*="trainning.png"]) > *{visibility:hidden;animation:km-reveal 0s 4s forwards}
@keyframes km-reveal{to{visibility:visible}}

.km-slider{--navy:#191146;--red:#e31e24;--red-d:#c92027;position:relative;background:var(--navy);color:#fff;overflow:hidden;line-height:1.7}
.km-slider *{box-sizing:border-box}
.km-slider .km-in{max-width:1120px;margin:0 auto;padding-inline:24px}
.km-slider .km-slides{display:grid}
.km-slider .km-slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s;position:relative;min-height:560px;display:flex;align-items:center}
.km-slider .km-slide.on{opacity:1;visibility:visible}
.km-slider .km-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.km-slider .km-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(25,17,70,.94) 0%,rgba(25,17,70,.82) 45%,rgba(25,17,70,.35) 100%)}
.km-slider .km-slide > .km-in{position:relative;width:100%;padding-block:72px 104px}
.km-slider .km-lms > .km-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:center}
.km-slider .km-copy{max-width:560px}
.km-slider .km-kick{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#ffd0d1;background:rgba(227,30,36,.18);border:1px solid rgba(255,140,143,.35);border-radius:999px;padding:4px 14px}
.km-slider .km-kick b{background:var(--red);color:#fff;border-radius:999px;padding:0 8px;font-size:12px}
.km-slider .km-t{font-size:clamp(32px,4.6vw,50px);font-weight:700;margin:18px 0 16px;line-height:1.22;color:#fff}
.km-slider .km-t em{font-style:normal;color:#ff6b6f}
.km-slider .km-p{color:#dcd9ef;font-size:18px;margin:0}
.km-slider .km-tags{display:flex;flex-wrap:wrap;gap:8px}
.km-slider .km-tags span{font-size:14px;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:4px 14px;color:#fff}
.km-slider .km-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.km-slider .km-btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:12px 24px;font-weight:600;font-size:15.5px;background:var(--red);color:#fff;text-decoration:none;border:1px solid var(--red);transition:background .2s}
.km-slider .km-btn:hover{background:var(--red-d)}
.km-slider .km-btn.ghost{background:transparent;border-color:rgba(255,255,255,.55)}
.km-slider .km-btn.ghost:hover{background:rgba(255,255,255,.08)}
.km-slider .km-btn svg,.km-slider .km-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block}
.km-slider .km-stack{position:relative;padding:0 0 48px 48px}
.km-slider .km-back{border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.18);box-shadow:0 20px 44px -22px rgba(0,0,0,.6);transform:rotate(.6deg)}
.km-slider .km-back img,.km-slider .km-phone img{display:block;width:100%;height:auto}
.km-slider .km-phone{position:absolute;left:0;bottom:0;width:27%;border:8px solid #15102e;border-radius:30px;overflow:hidden;background:#15102e;box-shadow:0 26px 50px -20px rgba(0,0,0,.6)}
.km-slider .km-phone img{border-radius:22px}
.km-slider .km-ctrl{position:absolute;left:0;right:0;bottom:26px}
.km-slider .km-ctrl .km-in{display:flex;align-items:center;gap:10px}
.km-slider .km-dot{font:inherit;font-size:13.5px;color:#cfcbe6;background:transparent;border:0;border-top:3px solid rgba(255,255,255,.25);padding:8px 0 0;width:150px;text-align:left;cursor:pointer}
.km-slider .km-dot[aria-current="true"]{color:#fff;border-top-color:var(--red)}
.km-slider .km-arrow{margin-left:auto;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;display:grid;place-items:center;cursor:pointer}
.km-slider .km-arrow + .km-arrow{margin-left:0}
.km-slider .km-btn:focus-visible,.km-slider .km-dot:focus-visible,.km-slider .km-arrow:focus-visible{outline:3px solid #ffb3b5;outline-offset:3px}
@media (max-width:900px){
  .km-slider .km-lms > .km-in{grid-template-columns:minmax(0,1fr)}
  .km-slider .km-stack{padding:0 0 36px 28px}
  .km-slider .km-slide{min-height:0}
  .km-slider .km-dot{width:auto;flex:1}
}
@media (max-width:520px){
  .km-slider .km-in{padding-inline:16px}
  .km-slider .km-arrow{display:none}
}
@media (prefers-reduced-motion:reduce){.km-slider .km-slide{transition:none}}