/* Kade adaptations of the requested CodeFronts navigation, pricing and chat designs. */
.site > header{position:sticky;top:0;z-index:30;background:#04112d;transition:background .3s ease,box-shadow .3s ease}
.site > header > nav{min-height:84px;padding-top:18px;padding-bottom:18px;background:transparent;transition:min-height .3s ease,padding .3s ease;backdrop-filter:none}
.site > header .brand-wordmark{transition:transform .3s ease;transform-origin:left center}
.site > header.nav-compact{background:rgba(4,17,45,.92);backdrop-filter:blur(18px);box-shadow:0 8px 32px #00122d30}
.site > header.nav-compact > nav{min-height:62px;padding-top:8px;padding-bottom:8px}
.site > header.nav-compact .brand-wordmark{transform:scale(.91)}
.site > header .navlinks>a{border-radius:7px}
.site > header .navlinks>a:not(.button):hover{color:#63d9ff}
.site > header .menu-toggle{width:42px;height:42px;padding:8px;display:none;align-items:center;justify-content:center;border-radius:10px}
.site > header .menu-toggle svg{width:24px;height:24px}
html{scroll-padding-top:150px}
@media(max-width:1100px){
  .site > header > nav{position:relative;min-height:72px;padding:12px 20px}
  .site > header.nav-compact > nav{min-height:60px;padding:8px 20px}
  .site > header .menu-toggle{display:flex}
  .site > header .navlinks{top:100%;left:12px;right:12px;border:1px solid #304362;border-radius:14px;padding:12px;background:#081a3a;max-height:65dvh;overflow:auto;box-shadow:0 18px 40px #0005}
  .site > header .navlinks.open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  .site > header .navlinks>a{padding:12px}
  .site > header .navlinks>.button{grid-column:1/-1}
  .site > header .navlinks>a::after{bottom:5px;left:12px;right:12px}
}

#packages{margin:22px 0;padding:36px 20px 22px;border-radius:24px;background:radial-gradient(ellipse at 50% 0,#182554 0,transparent 65%),#070e20;color:#f0f4ff}
#packages>.eyebrow{color:#98b6ff;margin-bottom:8px}
#packages>h2{color:#f2f5ff;line-height:1.35}
#plans{gap:18px;margin-top:34px;align-items:stretch}
#plans .plan{padding:26px 18px 20px;border:1px solid #ffffff20;border-radius:20px;background:linear-gradient(165deg,#192238,#11182b);box-shadow:0 20px 44px -26px #000c;color:#edf1ff;min-height:342px;isolation:isolate;will-change:auto}
#plans .plan h3{text-align:left;min-height:2.6em;margin:0;font-size:15px;font-weight:600;color:#d9e3ff;letter-spacing:0;line-height:1.35}
#plans .plan .speed{text-align:left;min-height:3em;font-size:12px;color:#a8b8d8;line-height:1.6;margin:0 0 12px}
#plans .plan .price{margin:0 0 4px;white-space:nowrap;font-variant-numeric:tabular-nums}
#plans .plan .price small{font-size:12px;color:#bac7e0;margin-bottom:4px}
#plans .plan .price strong{font-size:clamp(28px,2.8cqw,40px);font-weight:800;color:#fff;background:none;letter-spacing:-1px;line-height:1.2}
#plans .plan .price span{font-size:12px;color:#aebbd4;font-weight:500}
#plans .plan ul{display:flex;flex-direction:column;gap:11px;font-size:12px;margin:20px 0 24px;padding:0;color:#c1cbe0}
#plans .plan li{position:relative;padding-left:16px;line-height:1.5}
#plans .plan li:before{content:'';position:absolute;left:0;top:.7em;width:7px;height:2px;background:#8c9dff;margin:0}
#plans .plan button{position:relative;z-index:2;min-height:42px;padding:10px 7px;border:1px solid #7284ab;border-radius:10px;color:#ecf2ff;background:transparent;font-size:13px;box-shadow:none;transition:background .2s ease,transform .2s ease,border-color .2s ease}
#plans .plan button:hover{background:#ffffff12;border-color:#b7c6e4}
#plans .plan button:focus-visible{outline:3px solid #72d9ff;outline-offset:4px}
#plans .plan.featured{border-color:#8873ff;box-shadow:0 20px 50px -22px #7555edb3;background:linear-gradient(165deg,#222845,#151a30)}
#plans .plan.featured:before{display:none}
#plans .plan .tier-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);padding:6px 12px;border-radius:30px;white-space:nowrap;background:linear-gradient(110deg,#075be8,#9138e4);color:white;font-size:11px;font-weight:600;letter-spacing:.04em;z-index:2}
#plans .plan.featured button{background:linear-gradient(110deg,#075be8,#7839dd);border-color:#8b6eff;color:#fff}
#plans .plan::after{z-index:-1;background:radial-gradient(circle at var(--glow-x,50%) var(--glow-y,35%),#6689ff38,transparent 70%);border-radius:inherit}
#plans .plan.tilting{border-color:#879de5;box-shadow:0 24px 50px -15px #1c3f8e80}
#plans .plan.featured.tilting{box-shadow:0 28px 64px -20px #8855eee0;border-color:#b6a4ff}
#packages .plan-help{background:transparent;color:#b6c7eb;margin-top:24px;padding:8px;line-height:1.5}
#packages .plan-help svg{color:#8db7ff}
@media(max-width:1200px) and (min-width:801px){#plans{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}}
@media(max-width:600px){#packages{padding:28px 12px 16px;border-radius:18px}#plans{gap:26px 12px}#plans .plan{padding:24px 16px 18px}#plans .plan .price strong{font-size:32px}}

/* Only the visitor popup is restyled; support inbox keeps its own layout. */
#kade-support{right:22px;bottom:96px;left:auto;top:auto;width:368px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 116px);border:1px solid #dfe6f0;border-radius:22px;box-shadow:0 34px 80px -30px #09224999,0 2px 8px #09224920;transform-origin:100% 100%;font-size:12px}
#kade-support[open]{animation:chat-panel-in .28s cubic-bezier(.2,1.1,.3,1) both}
@keyframes chat-panel-in{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}
#kade-support .support-shell{height:540px;max-height:calc(100dvh - 116px);font-size:12px}
#kade-support .support-head{padding:18px 16px;background:linear-gradient(130deg,#091f66,#5530ab);gap:11px}
#kade-support .support-head img{width:38px;height:38px;padding:7px;background:#ffffff12;border:1px solid #ffffff26;border-radius:12px}
#kade-support .support-head h2{font-size:16px;letter-spacing:-.2px;margin:0;line-height:1.4}
#kade-support .support-head p{font-size:12px;margin:2px 0 0;line-height:1.5}
#kade-support .support-head button{border-radius:50%;width:34px;height:34px;font-size:22px}
#kade-support .support-notice{padding:10px 16px;font-size:12px;line-height:1.5;background:#f0f4ff;color:#354f7c;border-bottom:1px solid #e7edf5}
#kade-support .support-error{background:#fff3ed;color:#8c301c}
#kade-support .support-intro{padding:22px 18px;background:#fff}
#kade-support .support-intro h3{font-size:15px;margin:0 0 7px;color:#142d57}
#kade-support .support-intro p{font-size:12px;line-height:1.65;margin:0 0 16px}
#kade-support .support-intro label{font-size:12px;margin:14px 0 6px;color:#415675}
#kade-support .support-intro input{font-size:13px;border:1px solid #dbe3ef;border-radius:10px;background:#f8faff;padding:12px;min-height:42px}
#kade-support .support-primary{font-size:12px;background:#075be8;border-radius:10px;min-height:40px}
#kade-support .support-toolbar{padding:10px 14px;gap:8px}
#kade-support .support-toolbar button{font-size:12px;border-radius:10px;background:#f4f7fc;border-color:#dfe6f0;display:flex;align-items:center;justify-content:center;gap:6px}
#kade-support .support-toolbar svg{width:16px;height:16px}
#kade-support .support-messages{background:#f8faff;padding:16px 14px;gap:14px}
#kade-support .support-bubble{border-radius:14px 14px 14px 4px;box-shadow:0 2px 5px #142a4b05;font-size:12px}
#kade-support .mine .support-bubble{border-radius:14px 14px 4px 14px;background:#075be8}
#kade-support .support-compose{padding:12px;background:#fff;gap:8px}
#kade-support .support-compose textarea{border:1px solid #dbe3ef;background:#f7f9fc;border-radius:12px;font-size:13px;height:42px}
#kade-support .support-compose button{width:42px;height:42px;padding:10px;display:grid;place-items:center}
#kade-support .support-compose button svg{width:20px;height:20px}
#kade-support .support-compose button span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#kade-support .support-foot{padding:11px 14px;font-size:12px;background:#fff}
#kade-support .chat-tools{gap:5px;padding:8px 12px}
#kade-support .chat-tools button{border-radius:8px;font-size:12px;padding:6px}
body > #support-launch{position:fixed;right:22px;bottom:22px;top:auto;width:58px;height:58px;margin:0;z-index:1001;border:1px solid #ffffff33;box-shadow:0 12px 30px #10285b40;isolation:isolate}
body > #support-launch[aria-expanded=true]{background:#075be8}
body > #support-launch[aria-expanded=true]::before,body > #support-launch[aria-expanded=true]::after{animation:none;opacity:0}
body > #support-launch .launch-close{display:none}
body > #support-launch[aria-expanded=true] .launch-phone{display:none}
body > #support-launch[aria-expanded=true] .launch-close{display:block}
@media(max-width:600px){#kade-support{right:12px;bottom:86px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 102px)}#kade-support .support-shell{max-height:calc(100dvh - 102px)}body > #support-launch{right:16px;bottom:16px;width:54px;height:54px}#kade-support .support-intro input,#kade-support .support-compose textarea{font-size:16px}}
@media(prefers-reduced-motion:reduce){.site > header,.site > header > nav,.site > header .brand-wordmark{transition:none}#kade-support[open]{animation:none}}
