/* Dexryn nav v9: Solutions + Resources mega dropdowns (light frosted panels, Lovable-style) and a mobile accordion sheet.
   Shared by the homepage (#nav), the blog, prices, legal, 404 and market pages. No green, no tag chips. */
.mx-t{font:500 12px var(--ui,Inter,system-ui,sans-serif);letter-spacing:.1em;text-transform:uppercase;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;opacity:.9;display:inline-flex;align-items:center;gap:6px;-webkit-tap-highlight-color:transparent;transition:opacity .2s}
.tl .mx-t{opacity:.85}
.mx-t:hover,.mx-t[aria-expanded=true]{opacity:1;text-decoration:underline;text-underline-offset:6px}
.mx-t:focus-visible{outline:2px solid #8db6f5;outline-offset:6px;border-radius:4px}
.mx-t svg{width:9px;height:9px;transition:transform .28s cubic-bezier(.22,1,.36,1)}
.mx-t[aria-expanded=true] svg{transform:rotate(180deg)}
.mx-w{display:inline-flex;align-items:center}
.links .mx-w,.tl .mx-w{align-self:center}
.links{align-items:center}
.tl a,.links a,.mx-t{white-space:nowrap}
.top{position:relative}
.band{overflow:visible}
/* ---------- desktop panels ---------- */
.mx-p{position:absolute;left:50%;top:100%;width:min(900px,calc(100vw - 28px));margin-top:8px;z-index:70;
 transform:translate(-50%,-8px) scale(.972);transform-origin:50% 0;opacity:0;visibility:hidden;pointer-events:none;
 transition:opacity .22s ease,transform .4s cubic-bezier(.22,1,.36,1),visibility 0s linear .4s;
 font-family:var(--ui,Inter,system-ui,sans-serif);color:#0b0c10;text-align:left;text-transform:none;letter-spacing:0}
.mx-p.mx-narrow{width:min(660px,calc(100vw - 28px))}
.mx-p:before{content:"";position:absolute;left:0;right:0;top:-26px;height:26px}
.mx-p.on{transform:translate(-50%,0) scale(1);opacity:1;visibility:visible;pointer-events:auto;transition:opacity .22s ease,transform .4s cubic-bezier(.22,1,.36,1),visibility 0s}
.mx-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 270px;border-radius:28px;overflow:hidden;
 background:rgba(255,255,255,.93);-webkit-backdrop-filter:blur(30px) saturate(1.4);backdrop-filter:blur(30px) saturate(1.4);
 box-shadow:0 0 0 1px rgba(255,255,255,.65) inset,0 0 0 1px rgba(11,12,16,.07),0 44px 90px -30px rgba(12,22,44,.40),0 10px 30px rgba(12,22,44,.08)}
.mx-narrow .mx-card{grid-template-columns:minmax(0,1fr) 250px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.mx-card{background:#fff}}
@supports(corner-shape:squircle){.mx-card{border-radius:44px;corner-shape:squircle}}
.mx-main{padding:16px 14px 10px 16px;min-width:0}
.mx-c{min-width:0}
.mx-2{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,auto);grid-auto-flow:column;gap:0 6px}
.mx-h{font:500 13px var(--ui,Inter,system-ui,sans-serif);letter-spacing:0;text-transform:none;color:#7b7d86;margin:6px 0 8px 12px}
.mx-i{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:14px;text-decoration:none;color:#0b0c10;opacity:0;transform:translateY(7px);
 transition:background .16s,opacity .32s ease,transform .46s cubic-bezier(.22,1,.36,1);transition-delay:0s,calc(var(--i,0)*28ms + 60ms),calc(var(--i,0)*28ms + 60ms)}
.mx-p.on .mx-i{opacity:1;transform:none}
.mx-i:hover,.mx-i:focus-visible{background:rgba(11,12,16,.055);outline:0}
.mx-i:focus-visible{box-shadow:0 0 0 2px #8db6f5}
.mx-tx{min-width:0}
.mx-i b{display:block;font:550 16px/1.25 var(--dx-hf,"Inter Tight",system-ui,sans-serif);letter-spacing:-.01em;color:#0b0c10;text-transform:none;white-space:nowrap}
.mx-i em{display:block;font:400 13px/1.35 var(--ui,Inter,system-ui,sans-serif);font-style:normal;letter-spacing:0;text-transform:none;color:#70727b;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* right column: soft grey, full height (Use cases / Start here) */
.mx-use{background:rgba(238,240,246,.78);padding:16px 14px 14px;box-shadow:inset 1px 0 0 rgba(11,12,16,.05)}
.mx-use .mx-i:hover,.mx-use .mx-i:focus-visible{background:rgba(255,255,255,.9);box-shadow:0 1px 2px rgba(11,12,16,.06)}
.mx-cta b{display:block;margin:4px 12px 0;font:550 19px/1.25 var(--dx-hf,"Inter Tight",system-ui,sans-serif);letter-spacing:-.015em;color:#0b0c10}
.mx-cta em{display:block;margin:6px 12px 0;font:400 13.5px/1.45 var(--ui,Inter,system-ui,sans-serif);font-style:normal;color:#70727b}
.mx-btn{display:inline-flex;align-items:center;justify-content:center;margin:18px 12px 0;height:42px;padding:0 20px;border-radius:999px;background:#0b0c10;color:#fff;text-decoration:none;
 font:500 12px var(--ui,Inter,system-ui,sans-serif);letter-spacing:.08em;text-transform:uppercase;transition:transform .2s,background .2s}
.mx-btn:hover{background:#23242c;transform:translateY(-1px)}
.mx-btn:focus-visible{outline:2px solid #8db6f5;outline-offset:3px}
.mx-all{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:8px 4px 0;padding:12px 8px 4px;border-top:1px solid rgba(11,12,16,.07);font:400 12.5px var(--ui,Inter,system-ui,sans-serif);color:#70727b}
.mx-all a{display:inline-flex;align-items:center;gap:6px;font:600 12.5px var(--ui,Inter,system-ui,sans-serif);color:#0b0c10;text-decoration:none;white-space:nowrap}
.mx-all a svg{width:12px;height:12px;transition:transform .25s cubic-bezier(.22,1,.36,1)}
.mx-all a:hover svg{transform:translateX(3px)}
.mx-all a:hover{text-decoration:underline;text-underline-offset:4px}
/* ---------- burger + sheet: mobile only ---------- */
.mx-burger,.mx-sheet{display:none}
.mx-burger{width:42px;height:42px;border-radius:50%;border:1px solid rgba(11,12,16,.16);background:rgba(11,12,16,.03);padding:0;margin-left:10px;cursor:pointer;position:relative;flex:none;-webkit-tap-highlight-color:transparent;transition:background .2s,border-color .2s}
.mx-burger i{position:absolute;left:12px;right:12px;height:1.6px;border-radius:2px;background:#0b0c10;transition:transform .3s cubic-bezier(.22,1,.36,1),top .3s cubic-bezier(.22,1,.36,1)}
.mx-burger i:nth-child(1){top:16px}.mx-burger i:nth-child(2){top:24px}
.mx-burger[aria-expanded=true]{background:rgba(11,12,16,.07)}
.mx-burger[aria-expanded=true] i:nth-child(1){top:20px;transform:rotate(45deg)}
.mx-burger[aria-expanded=true] i:nth-child(2){top:20px;transform:rotate(-45deg)}
.mx-burger:focus-visible{outline:2px solid #8db6f5;outline-offset:3px}
.lt .mx-burger{border-color:rgba(11,12,16,.16);background:rgba(11,12,16,.03)}.lt .mx-burger i{background:#0b0c10}.lt .mx-burger[aria-expanded=true]{background:rgba(11,12,16,.07)}
/* homepage nav sits on the dark hero: light burger */
nav#nav .mx-burger{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.07)}
nav#nav .mx-burger i{background:#fff}
nav#nav .mx-burger[aria-expanded=true]{background:rgba(255,255,255,.16)}
html.rev nav .mx-burger{animation:dxo .7s ease .45s both!important}
html.ent nav .mx-burger{animation:dxo .45s ease .1s both}
@keyframes dxo{from{opacity:0}to{opacity:1}}
.mx-sheet{position:absolute;left:50%;top:100%;width:calc(100vw - 24px);max-width:520px;max-height:calc(100dvh - 92px);overflow:auto;overscroll-behavior:contain;margin-top:8px;z-index:70;
 border-radius:26px;padding:8px 10px 12px;color:#0b0c10;font-family:var(--ui,Inter,system-ui,sans-serif);text-align:left;text-transform:none;letter-spacing:0;
 background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(26px) saturate(1.4);backdrop-filter:blur(26px) saturate(1.4);
 box-shadow:0 0 0 1px rgba(11,12,16,.07),0 30px 80px -20px rgba(12,22,44,.4),0 6px 20px rgba(12,22,44,.1);
 transform:translate(-50%,-8px) scale(.98);transform-origin:50% 0;opacity:0;visibility:hidden;pointer-events:none;
 transition:opacity .2s ease,transform .34s cubic-bezier(.22,1,.36,1),visibility 0s linear .34s}
@supports(corner-shape:squircle){.mx-sheet{border-radius:40px;corner-shape:squircle}}
.mx-sheet.on{transform:translate(-50%,0) scale(1);opacity:1;visibility:visible;pointer-events:auto;transition:opacity .2s ease,transform .34s cubic-bezier(.22,1,.36,1),visibility 0s}
.mx-row{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 12px;background:none;border:0;border-radius:14px;text-decoration:none;color:#0b0c10;cursor:pointer;
 font:500 13.5px var(--ui,Inter,system-ui,sans-serif);letter-spacing:.1em;text-transform:uppercase;text-align:left;-webkit-tap-highlight-color:transparent}
.mx-row:focus-visible{outline:2px solid #8db6f5;outline-offset:-2px}
.mx-row+.mx-row,.mx-acc+.mx-row,.mx-sub+.mx-row,.mx-sub+.mx-acc{border-top:1px solid rgba(11,12,16,.07)}
.mx-row svg{width:11px;height:11px;transition:transform .28s cubic-bezier(.22,1,.36,1)}
.mx-row[aria-expanded=true] svg{transform:rotate(180deg)}
.mx-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .36s cubic-bezier(.22,1,.36,1)}
.mx-sub.on{grid-template-rows:1fr}
.mx-sub>div{overflow:hidden;min-height:0}
.mx-sub .mx-h{margin:8px 0 4px 10px}
.mx-sub .mx-i{opacity:1;transform:none;padding:9px 10px}
.mx-sub .mx-i b{font-size:16px}
.mx-sub .mx-grp{padding-bottom:6px}
.mx-sub .mx-grp.gr{background:rgba(236,238,244,.7);border-radius:18px;padding:4px 4px 6px;margin-top:4px}
.mx-go{display:flex;align-items:center;justify-content:center;margin:10px 0 0;height:50px;border-radius:999px;background:#0b0c10;color:#fff;text-decoration:none;font:500 12.5px var(--ui,Inter,system-ui,sans-serif);letter-spacing:.08em;text-transform:uppercase}
html.mx-lock,html.mx-lock body{overflow:hidden}
@media(max-width:1060px){.mx-i b,.mx-i em{white-space:normal}.mx-i{padding:10px 8px}.mx-card{grid-template-columns:minmax(0,1fr) 240px}.mx-narrow .mx-card{grid-template-columns:minmax(0,1fr) 230px}}
@media(max-width:980px){
 nav#nav .links,.top .tl{display:none}
 nav#nav .mx-burger,.top .mx-burger{display:block}
 nav#nav .mx-sheet,.top .mx-sheet{display:block}
 nav#nav .mx-p,.top .mx-p{display:none}
 nav#nav .nw .lg,.top .lg{margin-right:auto}
 .top>.btn,nav#nav .nw>.btn{margin-left:auto}
}
@media(max-width:380px){.nw .btn.sm,.top>.btn.sm{padding:10px 13px;letter-spacing:.05em;font-size:11px}.mx-burger{margin-left:8px}}
@media(prefers-reduced-motion:reduce){.mx-p,.mx-sheet,.mx-i,.mx-sub,.mx-t svg{transition-duration:.01s!important;transition-delay:0s!important}}

/* ======================= v10: compact pill header (Lovable-like), every page ======================= */
/* --- homepage: fixed floating glass pill --- */
nav#nav{top:10px;left:0;right:0;padding:0 12px;background:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;pointer-events:none}
nav#nav .nw{position:relative;pointer-events:auto;max-width:1040px;height:50px;padding:0 7px 0 20px;border-radius:999px;
 background:rgba(18,16,46,.52);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.13),inset 0 1px 0 rgba(255,255,255,.14),0 14px 34px -18px rgba(20,16,70,.6);transition:background .3s,box-shadow .3s}
nav#nav.solid .nw{background:rgba(14,13,36,.88)}
nav#nav .lg svg{width:70px;height:auto;display:block}
nav#nav .links{gap:28px}
nav#nav .links a,nav#nav .mx-t{font-size:11px;letter-spacing:.09em}
nav#nav .nw>.btn,nav#nav .btn.sm{padding:9px 16px;font-size:10.5px;letter-spacing:.07em}
/* --- inner pages: slim violet pill --- */
.top{height:50px}
.nb{padding-top:10px;margin-bottom:-60px}
.nb+main>.hero:first-child,.nb+.hero{padding-top:68px}
.nb>.w{padding-left:clamp(10px,2vw,24px);padding-right:clamp(10px,2vw,24px)}
.nb .top.lt{border-radius:999px;corner-shape:round;padding:0 7px 0 clamp(16px,2vw,22px);max-width:1040px;margin:0 auto;
 box-shadow:0 14px 30px -18px rgba(46,50,112,.55),0 2px 6px rgba(46,50,112,.12),inset 0 0 0 1px rgba(255,255,255,.14),inset 0 1px 0 rgba(255,255,255,.18)}
.nb .top.lt:before{background:radial-gradient(34% 240% at 6% 50%,rgba(150,140,255,.34),transparent 72%),radial-gradient(30% 220% at 95% 40%,rgba(167,155,255,.2),transparent 70%),linear-gradient(100deg,#40457e,#383d72 50%,#40467f)}
.top .lg svg{height:25px;width:auto;display:block}
.tl{gap:26px}
.tl a,.mx-t{font-size:11px;letter-spacing:.09em}
.top>.btn.sm,.top .btn.sm{padding:9px 16px;font-size:10.5px;letter-spacing:.07em}
.nb .top>.btn:hover{background:#efecff;box-shadow:0 10px 26px rgba(139,123,255,.3)}
/* panels sit a little closer to the slimmer pill */
.mx-p,.mx-sheet{margin-top:6px}
.mx-sheet{max-height:calc(100dvh - 84px)}
@media(max-width:980px){
 nav#nav{top:8px;padding:0 10px}
 nav#nav .nw{height:46px;padding:0 6px 0 16px}
 nav#nav .lg svg{width:64px}
 .top{height:46px}
 .nb{padding-top:8px;margin-bottom:-54px}
 .nb+main>.hero:first-child,.nb+.hero{padding-top:58px}
 .top .lg svg{height:22px}
 .nb .top.lt{padding:0 6px 0 16px}
 .mx-burger{width:34px;height:34px;margin-left:8px}
 .mx-burger i{left:9px;right:9px}
 .mx-burger i:nth-child(1){top:12.5px}.mx-burger i:nth-child(2){top:19px}
 .mx-burger[aria-expanded=true] i:nth-child(1){top:16px}.mx-burger[aria-expanded=true] i:nth-child(2){top:16px}
 nav#nav .nw>.btn,.top>.btn.sm,.top .btn.sm{padding:8px 13px;font-size:10px}
 .mx-sheet{max-height:calc(100dvh - 72px)}
}