/* Navigation v2: one panel that glides between menus, a feature card in each, an accordion sheet on mobile. */
.nav.nv{--nv-ease:cubic-bezier(.22,.8,.24,1);--nv-red:var(--pop,#c8233b)}
.nav.nv .menu>li{position:relative}
.nav.nv .menu>li>button,.nav.nv .menu>li>a{position:relative;transition:color .2s,background-color .2s}
.nav.nv .menu>li>button .chev{transition:transform .3s var(--nv-ease)}
.nav.nv .menu>li.open>button .chev{transform:rotate(180deg)}
.nav.nv .menu>li>button.nv-cur::after,.nav.nv .menu>li>a[aria-current]::after{content:"";position:absolute;left:50%;bottom:-3px;width:4px;height:4px;margin-left:-2px;border-radius:1px;background:var(--nv-red)}

/* panels */
.nav.nv .mega.m2{border-radius:16px!important;box-shadow:0 0 0 1px rgb(0 0 0 / .06),0 24px 60px -20px rgb(20 20 30 / .28),0 8px 18px -10px rgb(20 20 30 / .12)!important;transform-origin:top left}
.nav.nv .mega.m2-pro{width:1100px!important}
.nav.nv .mega.nv-two{width:600px!important}
.nav.nv .m2-pro .m2-grid{grid-template-columns:292px minmax(0,1fr) 250px}
.nav.nv .nv-two .m2-grid{grid-template-columns:minmax(0,1fr) 250px}
.nav.nv .nv-feat{padding:12px 12px 12px 0;display:flex}
.nav.nv .m2-pro .m2-wf{border-right:0}
.nav.nv .m2 a.it{transition:background-color .18s}
.nav.nv .m2 a.it i{transition:box-shadow .2s,color .2s,background-color .2s}
.nav.nv .m2 a.it:hover i,.nav.nv .m2 a.it:focus-visible i,.nav.nv .m2 a.it[aria-current] i{color:var(--nv-red)!important;background:#fff5f6!important;box-shadow:inset 0 0 0 1px #f3c9d0}
.nav.nv .m2 a.it[aria-current] b::after{content:"";display:inline-block;width:5px;height:5px;margin-left:7px;border-radius:1px;background:var(--nv-red);vertical-align:2px}
.nav.nv .m2-ph a{position:relative;transition:background-color .18s,color .18s,padding .25s var(--nv-ease)}
.nav.nv .m2-ph a::before{content:"";position:absolute;left:10px;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:1px;background:var(--nv-red);opacity:0;transform:scale(.4);transition:opacity .2s,transform .25s var(--nv-ease)}
.nav.nv .m2-ph a:hover,.nav.nv .m2-ph a:focus-visible,.nav.nv .m2-ph a[aria-current]{padding-left:22px}
.nav.nv .m2-ph a:hover::before,.nav.nv .m2-ph a:focus-visible::before,.nav.nv .m2-ph a[aria-current]::before{opacity:1;transform:none}
.nav.nv .m2-ph span,.nav.nv .m2 h6{color:#6e6e6a!important}
.nav.nv .m2 a.it small,.nav.nv .m2-foot>a:first-child span{color:#666662!important}
.nav.nv .m2-all svg,.nav.nv .nv-cta svg,.nav.nv .nv-live-cta svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .25s var(--nv-ease)}
.nav.nv .m2-all:hover svg,.nv-card:hover .nv-cta svg,.nv-live:hover .nv-live-cta svg{transform:translateX(3px)}

/* feature cards */
.nv-card,.nv-live{flex:1;display:flex;flex-direction:column;border-radius:12px;padding:18px 18px 16px;text-decoration:none;transition:transform .3s var(--nv-ease,ease),box-shadow .3s}
.nv-card:hover,.nv-live:hover{transform:translateY(-2px)}
.nv-k{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.01em;color:#5a6150}
.nv-cta,.nv-live-cta{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:14px;font-size:13px;font-weight:500;color:#111}
.nv-story{background:radial-gradient(120% 90% at 100% 0%,#fbe9ec 0%,rgb(251 233 236 / 0) 60%),linear-gradient(160deg,#fbfaf7,#f4f2ee);box-shadow:inset 0 0 0 1px #efe9e3}
.nv-story b{display:block;margin-top:16px;font-size:44px;line-height:1;letter-spacing:-.05em;font-weight:500;color:#111}
.nv-story b+span{display:block;margin-top:8px;font-size:13px;line-height:1.45;color:#4f5547}
.nv-guide{background:linear-gradient(160deg,#f7f6fb,#efeef6);box-shadow:inset 0 0 0 1px #e7e5f0}
.nv-guide strong{display:block;margin-top:14px;font-size:19px;line-height:1.2;letter-spacing:-.025em;font-weight:500;color:#111}
.nv-guide strong+span{display:block;margin-top:8px;font-size:13px;line-height:1.5;color:#4f5547}

/* live agent card */
.nv-live{position:relative;overflow:hidden;color:#e9e9ef;background:radial-gradient(140% 80% at 100% 0%,rgb(200 35 59 / .22),rgb(200 35 59 / 0) 55%),linear-gradient(165deg,#1b1d26,#12131a);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .06)}
.nv-live-top{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:#fff}
.nv-live-top em{margin-left:auto;font-style:normal;font-family:"Geist Mono",ui-monospace,monospace;font-size:10.5px;color:#b9bac6}
.nv-pulse{position:relative;width:7px;height:7px;border-radius:2px;background:var(--nv-red,#c8233b)}
.nv-pulse::after{content:"";position:absolute;inset:-4px;border-radius:4px;border:1px solid var(--nv-red,#c8233b);opacity:0;animation:nvPulse 1.8s ease-out infinite}
@keyframes nvPulse{0%{opacity:.8;transform:scale(.6)}100%{opacity:0;transform:scale(1.6)}}
.nv-tasks{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:9px}
.nv-tasks li{position:relative;padding-left:20px;font-size:12.5px;line-height:1.35;color:#9fa0ad;transition:color .35s}
.nv-tasks li::before{content:"";position:absolute;left:0;top:3px;width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1px #4a4c5a;transition:all .35s}
.nv-tasks li.done{color:#c9cad3}
.nv-tasks li.done::before{background:#3b3d4a;box-shadow:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.6 5.2l1.6 1.5 3.2-3.4' fill='none' stroke='%23fff' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.nv-tasks li.now{color:#fff}
.nv-tasks li.now::before{box-shadow:inset 0 0 0 1.5px var(--nv-red,#c8233b);border-top-color:transparent;animation:nvSpin 1s linear infinite;background:conic-gradient(from 0deg,transparent 0 70%,rgb(200 35 59 / .9) 70% 100%);-webkit-mask:radial-gradient(circle,transparent 3px,#000 3.5px);mask:radial-gradient(circle,transparent 3px,#000 3.5px)}
@keyframes nvSpin{to{transform:rotate(360deg)}}
.nv-bar{display:block;height:3px;margin-top:16px;border-radius:2px;background:rgb(255 255 255 / .08);overflow:hidden}
.nv-bar i{display:block;height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,#c8233b,#ff6a80)}
.nv-live-cta{color:#fff}

/* JS mode: one shared background glides between panels */
.nav.nv.nv-js .menu>li:hover .mega,.nav.nv.nv-js .menu>li:focus-within .mega{opacity:0;visibility:hidden}
.nav.nv.nv-js .mega.m2{background:transparent!important;box-shadow:none!important;transform:translateY(-6px);transition:opacity .22s,transform .38s var(--nv-ease),visibility 0s .38s;z-index:2}
.nav.nv.nv-js .menu>li.open .mega.m2{opacity:1!important;visibility:visible!important;transform:none;transition:opacity .26s .04s,transform .42s var(--nv-ease),visibility 0s}
.nav.nv.nv-js .menu>li.open .mega.m2.nv-from-l{animation:nvInL .42s var(--nv-ease)}
.nav.nv.nv-js .menu>li.open .mega.m2.nv-from-r{animation:nvInR .42s var(--nv-ease)}
@keyframes nvInL{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
@keyframes nvInR{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
.nv-bg{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:16px;background:#fff;pointer-events:none;opacity:0;z-index:1;box-shadow:0 0 0 1px rgb(0 0 0 / .06),0 24px 60px -20px rgb(20 20 30 / .28),0 8px 18px -10px rgb(20 20 30 / .12);transition:opacity .2s,transform .42s var(--nv-ease),width .42s var(--nv-ease),height .42s var(--nv-ease)}
.nv-bg.on{opacity:1}
.nv-bg.snap{transition:opacity .2s}
.nv-bg i{position:absolute;top:-6px;width:12px;height:12px;background:#fff;transform:rotate(45deg);border-radius:3px 0 0 0;box-shadow:-1px -1px 0 0 rgb(0 0 0 / .06);transition:left .42s var(--nv-ease)}
.nv-bg.snap i{transition:none}
.nav.nv.nv-js .m2-foot{background:#fafaf8}
.nv-scrim{position:fixed;inset:0;z-index:15;pointer-events:none;background:rgb(18 18 24 / .1);opacity:0;transition:opacity .3s}
.nv-scrim.on{opacity:1}
@supports (backdrop-filter:blur(2px)){.nv-scrim{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}}

/* burger becomes a close mark */
.nav.nv .burger svg path{transition:transform .32s var(--nv-ease),opacity .2s;transform-box:view-box;transform-origin:10px 10px}
.nav.nv .burger[aria-expanded="true"] .b1{transform:translateY(4px) rotate(45deg)}
.nav.nv .burger[aria-expanded="true"] .b2{opacity:0}
.nav.nv .burger[aria-expanded="true"] .b3{transform:translateY(-4px) rotate(-45deg)}

/* mobile sheet */
.nv-sheet details{border-bottom:1px solid #ececea}
.nv-sheet summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:16px 2px;font-size:19px;font-weight:500;letter-spacing:-.02em;color:#111;cursor:pointer}
.nv-sheet summary::-webkit-details-marker{display:none}
.nv-sheet summary::after{content:"";width:9px;height:9px;margin-right:4px;border-right:1.5px solid #6e6e6a;border-bottom:1.5px solid #6e6e6a;transform:translateY(-3px) rotate(45deg);transition:transform .3s}
.nv-sheet details[open] summary::after{transform:translateY(2px) rotate(225deg)}
.nv-sheet details>div{display:grid;gap:2px;padding:0 0 14px}
.nv-sheet details[open]>div{animation:nvDrop .35s cubic-bezier(.22,.8,.24,1)}
@keyframes nvDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nv-sheet a.nv-si{display:flex!important;align-items:center;gap:12px;padding:9px 4px!important;border-bottom:0!important;border-radius:10px;font-size:16px!important}
.nv-sheet a.nv-si i{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px #e8e8e5;color:#111}
.nv-sheet a.nv-si i svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.nv-sheet a.nv-si b{display:block;font-weight:500;color:#111}
.nv-sheet a.nv-si small{display:block;margin-top:1px;font-size:13px;color:#666662}
.nv-sheet a.nv-si[aria-current] i{color:var(--pop,#c8233b);box-shadow:inset 0 0 0 1px #f3c9d0;background:#fff5f6}
.nv-sheet a.nv-plain{padding:16px 2px!important;font-size:19px!important;font-weight:500;letter-spacing:-.02em;color:#111}
.nv-sheet .nv-story{margin-top:22px;border-bottom:0!important;padding:18px!important}
.nv-sheet .nv-story b{font-size:38px}
.nv-sheet .btn{gap:8px}
.nv-sheet .btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6}
.sheet.nv-sheet.open{animation:nvSheet .35s cubic-bezier(.22,.8,.24,1)}
@keyframes nvSheet{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

@media(max-width:1240px){.nav.nv .mega.m2-pro{width:860px!important}.nav.nv .m2-pro .m2-grid{grid-template-columns:292px minmax(0,1fr)}.nav.nv .m2-pro .nv-feat{display:none}}
@media(prefers-reduced-motion:reduce){.nav.nv *,.nv-bg,.nv-bg i,.nv-scrim,.nv-sheet *{animation:none!important;transition:none!important}}
.nv-bg i{display:none}
.nav.nv .m2-foot .nv-hire{font-style:normal;color:var(--pop,#c8233b)}
/* shared: buttons that carry their own arrow icon do not get a second one */
.btn:has(> svg)::after{display:none!important}

/* brand touch on primary buttons: black at rest; on hover the arrow turns the badge lavender and nudges forward.
   Buttons without an arrow (the nav "Book a demo") grow a small lavender mark before the label instead. */
:root{--zd-red-hi:#B9ADFF}
.btn-p svg{transition:transform .25s cubic-bezier(.22,.8,.24,1),color .2s}
.btn-p::after{transition:transform .25s cubic-bezier(.22,.8,.24,1),background-color .2s!important}
.btn-p:hover svg,.btn-p:focus-visible svg{color:var(--zd-red-hi);transform:translateX(3px)}
.btn-p:hover::after,.btn-p:focus-visible::after{background-color:var(--zd-red-hi)!important;transform:translateX(3px)}
.nav .btn-p:not(:has(svg))::before{content:"";flex:none;width:0;height:6px;margin-right:0;border-radius:2px;background:var(--zd-red-hi);transition:width .22s cubic-bezier(.22,.8,.24,1),margin .22s cubic-bezier(.22,.8,.24,1)}
.nav .btn-p:not(:has(svg)):hover::before,.nav .btn-p:not(:has(svg)):focus-visible::before{width:6px;margin-right:8px}
html body .btn-p:hover,html body .btn-p:focus-visible{background:#2b2a27!important}

/* page transitions: the new page waits hidden until it is at the top, then fades and rises in; links fade the old page out */
html.pt body{opacity:0;animation:ptSafe 0s 1.6s forwards}
@keyframes ptSafe{to{opacity:1}}
html.pt-in body{animation:ptIn .5s cubic-bezier(.22,.8,.24,1) both}
@keyframes ptIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
html.pt-out body{animation:ptOut .18s ease forwards!important}
@keyframes ptOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-6px)}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media(prefers-reduced-motion:reduce){html.pt body,html.pt-in body{animation:none;opacity:1}html.pt-out body{animation:none!important}}