/* Naxonify cases page styles (from the approved canvas design). */
body{margin:0;background:#FFFFFF}
a{color:#0866F5}a:hover{color:#03142F}
.nx{font-family:'Open Sans',sans-serif;color:#03142F;background:#FFFFFF;-webkit-font-smoothing:antialiased;overflow-x:clip}
.nx *{box-sizing:border-box}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.navy{background:#03142F;color:#FFFFFF}
.grey{background:#EEF1F5}
.label{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#0866F5;margin:0}
.label::before{content:"";width:28px;height:2px;background:currentColor}
.navy .label{color:#7DB4FF}
.disp{font-weight:800;letter-spacing:-.035em;line-height:1;margin:0}
.h2{font-size:56px;font-weight:800;letter-spacing:-.03em;line-height:1.04;margin:18px 0 0}
.p{font-size:19px;line-height:1.6;color:#5B6576;margin:0}
.navy .p{color:#A9B4CC}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 28px;border-radius:999px;font:700 16px 'Open Sans',sans-serif;text-decoration:none;border:0;cursor:pointer;position:relative;overflow:hidden}
.btn span{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.btn:hover::before{transform:scaleX(1)}
.b-blue{background:#0866F5;color:#FFFFFF}.b-blue::before{background:#03142F}.b-blue:hover{color:#FFFFFF}
.b-white{background:#FFFFFF;color:#03142F}.b-white::before{background:#0866F5}.b-white:hover{color:#FFFFFF}
.b-line{background:transparent;color:#FFFFFF;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}.b-line::before{background:#FFFFFF}.b-line:hover{color:#03142F}
.navl{display:flex;gap:34px;margin-left:auto}
.ddt{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:#FFFFFF;text-decoration:none;font-size:15px;font-weight:600}
.ddt:hover{color:#FFFFFF}
.crumb{display:flex;gap:10px;font-size:14px;color:#A9B4CC;flex-wrap:wrap}
.crumb a{color:#FFFFFF;text-decoration:none}
.swoosh path{stroke-dasharray:1600;stroke-dashoffset:1600;animation:draw 2.4s cubic-bezier(.6,0,.2,1) .3s forwards}
.mq{display:flex;width:max-content;animation:mq 50s linear infinite}
.mq span{display:inline-flex;align-items:center;gap:40px;padding-right:40px;white-space:nowrap;font-size:22px;font-weight:700}
.mq b{font-size:40px;font-weight:800;letter-spacing:-.03em;color:#4FA3FF}
.mq i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.3);display:inline-block}
.feat{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);border-radius:36px;overflow:hidden;background:#FFFFFF;box-shadow:0 40px 80px -40px rgba(3,20,47,.35);text-decoration:none;color:#03142F;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.feat:hover{transform:translateY(-8px);color:#03142F}
.feat .l{padding:52px}
.feat .r{background:#052A63;color:#FFFFFF;padding:52px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-content:center;position:relative;overflow:hidden}
.feat .r b{display:block;font-size:56px;font-weight:800;letter-spacing:-.04em;line-height:1}
.feat .r span{display:block;font-size:14px;color:#A9B4CC;margin-top:8px;line-height:1.4}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;background:#EEF1F5;color:#03142F}
.tag.b{background:#0866F5;color:#FFFFFF}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}
.fb{border:1.5px solid #D0D5DD;background:#FFFFFF;color:#03142F;min-height:46px;padding:0 20px;border-radius:999px;font:700 14px 'Open Sans',sans-serif;cursor:pointer;transition:all .25s}
.fb:hover{border-color:#03142F}
.fb.on{background:#03142F;border-color:#03142F;color:#FFFFFF}
.fb small{margin-left:6px;opacity:.6}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.cs{display:flex;flex-direction:column;border-radius:28px;overflow:hidden;background:#FFFFFF;text-decoration:none;color:#03142F;animation:pop .5s cubic-bezier(.2,.8,.2,1) both;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.cs:hover{transform:translateY(-8px);box-shadow:0 30px 60px -30px rgba(3,20,47,.4);color:#03142F}
.cs .top{padding:32px;background:#03142F;color:#FFFFFF;position:relative;overflow:hidden;min-height:190px;display:flex;flex-direction:column;justify-content:flex-end}
.cs .top.d{background:#052A63}
.cs .top.b{background:#0866F5}
.cs .top b{font-size:58px;font-weight:800;letter-spacing:-.045em;line-height:1}
.cs .top span{font-size:15px;font-weight:600;color:#D6DDEB;margin-top:8px}
.cs .top svg{position:absolute;right:-30px;top:-20px;opacity:.5}
.cs .bd{padding:28px 32px 32px;display:flex;flex-direction:column;gap:14px;flex:1}
.cs h3{font-size:21px;font-weight:800;line-height:1.3;margin:0;letter-spacing:-.01em}
.cs .who{font-size:14px;color:#5B6576;font-weight:600;margin:0}
.mini{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:4px}
.mini div{padding:14px;border-radius:14px;background:#F2F4F7}
.mini b{display:block;font-size:20px;font-weight:800;letter-spacing:-.02em}
.mini span{display:block;font-size:12px;color:#5B6576;margin-top:4px;line-height:1.35}
.cs .go{margin-top:auto;padding-top:10px;font-weight:700;color:#0866F5;display:inline-flex;align-items:center;gap:8px}
.cs .go svg{transition:transform .3s}
.cs:hover .go svg{transform:translateX(6px)}
.up{animation:up 1s cubic-bezier(.2,.8,.2,1) both}
.d1{animation-delay:.12s}.d2{animation-delay:.24s}.d3{animation-delay:.36s}
@keyframes up{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes mq{to{transform:translateX(-50%)}}
@keyframes rv{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 25%}}
@media (max-width:1100px){.feat{grid-template-columns:minmax(0,1fr)}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.h2{font-size:44px}.hd{font-size:64px !important}}
@media (max-width:640px){.wrap{padding:0 16px}.navl{display:none}.grid,.feat .r{grid-template-columns:minmax(0,1fr)}.h2{font-size:34px}.hd{font-size:42px !important}.feat .l,.feat .r{padding:28px}.feat .r b{font-size:44px}}
@media (prefers-reduced-motion:reduce){.nx *{animation:none !important}.swoosh path{stroke-dashoffset:0}}
.cs[hidden]{display:none}
