/* made by dsclusv */
:root{--navy:#0b1730;--navy2:#13264a;--blue:#1f6fd6;--blue-l:#e8f0fc;--bg:#f5f8fd;--text:#0e1a33;--mut:#5b6b86;--line:#e2e9f4;--wa:#25d366;--r:16px;--e:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font-family:Manrope,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.5;padding-bottom:110px;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.i{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* header */
.top{background:var(--navy);position:sticky;top:0;z-index:50;box-shadow:0 2px 20px #0b173033}
.top .wrap{display:flex;align-items:center;gap:14px;height:66px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:40px;width:auto}
.logo-t{color:#fff;font-weight:800;font-size:18px;letter-spacing:.01em;white-space:nowrap}
.logo-t b{color:#4d9bff;font-weight:800}
.main{display:flex;gap:4px;margin-left:auto}
.main a,.lang a{color:#b9c7e6;text-decoration:none;padding:8px 12px;border-radius:10px;font-weight:600;font-size:14px;transition:.2s}
.main a:hover,.lang a:hover{color:#fff}
.main a.on,.lang a.on{color:#fff;background:#ffffff1c}
.lang{display:flex;gap:2px}
.lang a{padding:8px 9px;font-size:13px}
.top .tel{color:#fff;font-weight:800;text-decoration:none;white-space:nowrap;font-size:15px}

/* hero */
.hero{position:relative;overflow:hidden;background:#eef3fb;min-height:430px}
.hero::before{content:"";position:absolute;inset:0;background:var(--img) right center/cover no-repeat;animation:zoom 20s var(--e) both}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f7faff 0%,#f7faffee 36%,#f7faff66 62%,#f7faff00 82%)}
.hero .wrap{position:relative;z-index:1;padding-top:68px;padding-bottom:56px}
.hero .wrap>*{animation:fadeup .8s var(--e) both}
.hero .wrap>*:nth-child(2){animation-delay:.08s}.hero .wrap>*:nth-child(3){animation-delay:.16s}
.hero .wrap>*:nth-child(4){animation-delay:.24s}.hero .wrap>*:nth-child(5){animation-delay:.32s}.hero .wrap>*:nth-child(6){animation-delay:.4s}
.tag{display:inline-block;background:var(--blue-l);color:var(--blue);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:6px 12px;border-radius:999px}
h1{font-size:clamp(30px,5vw,50px);line-height:1.08;margin:16px 0 14px;letter-spacing:-.025em;max-width:640px}
.lead{max-width:500px;color:var(--mut);font-size:17px}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none;transition:.25s var(--e)}
.btn .i{width:20px;height:20px}
.pri{background:var(--blue);color:#fff;box-shadow:0 8px 24px #1f6fd655;animation:pulse 2.6s infinite}
.pri:hover{transform:translateY(-2px);background:#1a5fba}
.sec{background:#fff;color:var(--text);border:1px solid var(--line)}
.sec .i{color:var(--wa)}
.sec:hover{transform:translateY(-2px);border-color:var(--wa)}
.wa{background:var(--wa);color:#fff}
.wa:hover{transform:translateY(-2px);filter:brightness(1.05)}
.prices{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:12px 30px}
.prices li{display:flex;gap:10px;align-items:flex-start}
.prices .i{color:var(--blue);margin-top:2px}
.prices b{display:block;font-size:15px}
.prices small{color:var(--mut);font-size:12.5px}
.fine{font-size:12.5px;color:var(--mut);margin-top:16px}

/* sections */
.s{padding:52px 0 4px}
h2{font-size:clamp(22px,3vw,30px);letter-spacing:-.015em;margin-bottom:22px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(3,1fr)}
.card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:22px;transition:.3s var(--e)}
.card:hover{transform:translateY(-5px);box-shadow:0 16px 34px #0b17301a;background:#fff;border-color:#c9d9f2}
.card .i{width:32px;height:32px;color:var(--navy);margin-bottom:14px;transition:.3s}
.card:hover .i{color:var(--blue);transform:scale(1.1)}
.card h3{font-size:16.5px;margin-bottom:6px}
.card p{font-size:14px;color:var(--mut)}
.svc{list-style:none;padding:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:var(--bg);border:1px solid var(--line);border-radius:var(--r)}
.svc li{display:flex;align-items:center;gap:14px;padding:16px;border-radius:12px;font-weight:600;font-size:14.5px;transition:.25s}
.svc li:hover{background:#fff;box-shadow:0 6px 18px #0b173012}
.svc .i{color:var(--blue)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.split img{border-radius:var(--r);box-shadow:0 18px 40px #0b173026;width:100%;object-fit:cover}
.split h2{margin-bottom:12px}
.split p{color:var(--mut);margin-bottom:16px}
.plist{list-style:none;padding:0;display:grid;gap:10px;margin-bottom:14px}
.plist li{display:flex;gap:10px;align-items:center;font-weight:700}
.plist .i{color:var(--blue)}
.muted{font-size:13px;color:var(--mut)}
.brands{list-style:none;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:14px}
.brands li{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 8px;background:var(--bg);border:1px solid var(--line);border-radius:14px;font-size:13px;font-weight:700;color:#33425f;transition:.25s var(--e)}
.brands img{width:48px;height:36px;object-fit:contain;opacity:.55;filter:grayscale(1);transition:.25s}
.brands li:hover{transform:translateY(-4px);background:#fff;border-color:#c9d9f2}
.brands li:hover img{opacity:1}
.two{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.box{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.box h3{font-size:19px;margin-bottom:8px}
.box>p{color:var(--mut);font-size:14px;margin-bottom:12px}
.ticks{list-style:none;padding:0;display:grid;gap:8px;font-size:14.5px}
.ticks li{display:flex;gap:10px;align-items:center}
.ticks .i{width:18px;height:18px;color:var(--blue)}
.box img{border-radius:12px;margin-top:16px}
.lockrow{list-style:none;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.lockrow li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:18px 10px;background:var(--bg);border:1px solid var(--line);border-radius:14px;font-size:13.5px;font-weight:600;transition:.25s}
.lockrow li:hover{transform:translateY(-4px);background:#fff}
.lockrow .i{color:var(--blue);width:28px;height:28px}
.big{font-size:34px;font-weight:800;color:var(--blue);margin:6px 0}
.steps{list-style:none;padding:0;counter-reset:s;display:grid;gap:14px}
.steps li{counter-increment:s;display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start}
.steps li::before{content:counter(s);width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800;display:grid;place-items:center}
.steps b{display:block}
.steps span{font-size:14px;color:var(--mut)}
.note{display:flex;gap:16px;align-items:flex-start;background:var(--blue-l);border:1px solid #cfe0f8;border-radius:var(--r);padding:22px}
.note .i{width:34px;height:34px;color:var(--blue)}
.note b{display:block;margin-bottom:4px}
.note p{font-size:14px;color:#33425f}
.foot{padding:40px 0 20px;color:var(--mut);font-size:13px}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}
.foot a{margin-left:16px;text-decoration:none;font-weight:700;color:var(--navy)}
.foot a:hover{color:var(--blue)}

/* sticky cta */
.cta .btn .i{display:none}
.cta{position:fixed;left:0;right:0;bottom:12px;z-index:60;padding:0 12px;animation:up .7s .5s var(--e) both}
.cta .in{max-width:1120px;margin:0 auto;display:flex;align-items:center;gap:16px;background:linear-gradient(90deg,var(--navy),var(--navy2));color:#fff;border-radius:18px;padding:14px 20px;box-shadow:0 14px 40px #0b173066}
.cta .i{width:34px;height:34px;color:#4d9bff}
.cta div{flex:1;min-width:0}
.cta b{display:block;font-size:16px}
.cta span{font-size:13px;color:#b9c7e6}
.cta .btn{padding:12px 20px}
.cta .tel{font-weight:800;text-decoration:none;white-space:nowrap}

/* animations */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--e),transform .8s var(--e);transition-delay:var(--d,0ms)}
.js .rv.in{opacity:1;transform:none}
@keyframes fadeup{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes up{from{transform:translateY(120%)}to{transform:none}}
@keyframes pulse{0%{box-shadow:0 8px 24px #1f6fd655,0 0 0 0 #1f6fd666}70%{box-shadow:0 8px 24px #1f6fd655,0 0 0 14px #1f6fd600}100%{box-shadow:0 8px 24px #1f6fd655,0 0 0 0 #1f6fd600}}
@media(prefers-reduced-motion:reduce){*,::before,::after{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}}

/* responsive */
@media(max-width:980px){
    .grid,.svc{grid-template-columns:repeat(2,1fr)}
    .lockrow{grid-template-columns:repeat(3,1fr)}.two,.split{grid-template-columns:1fr}.top .tel{display:none} 
    .brands{grid-template-columns:repeat(4,1fr)}
    .two{grid-template-columns:1fr!important}
}
@media(max-width:640px){
 .grid,.svc{grid-template-columns:1fr}.lockrow{grid-template-columns:repeat(2,1fr)}
 .hero::after{background:linear-gradient(180deg,#f7faffee 0%,#f7faffdd 55%,#f7faff99 100%)}
 .hero .wrap{padding-top:40px}
 .top .wrap{gap:6px}.main a{padding:8px 7px;font-size:12.5px}.logo img{height:34px}
 .cta .in{flex-wrap:wrap;gap:10px;padding:12px}.cta .i{display:none}.cta div{flex-basis:100%}.cta .btn{flex:1;justify-content:center}.cta .tel{display:none}
 .brands{grid-template-columns:repeat(3,1fr)}
  .logo-t{display:none}
 body{padding-bottom:150px}
}

body{overflow-x:clip}