/* /how-we-work: immersive layer on top of pages.css (hx- components; effects in hw-fx.js).
   Ports of React Bits ideas: Aurora, StarBorder, ShinyText, BlurText, SpotlightCard, MagicBento, DotGrid. */
.page-hx{--hx-navy:#040b1b;--hx-navy-2:#071733;--hx-ink-2:#b8cbe0;--hx-ink-3:#93abc8;--hx-blue:#2f86ff;--hx-sky:#6fb3ff;--hx-ice:#9fd0ff}

/* ---------- hero: a dark stage with an aurora ---------- */
.hx-hero{position:relative;isolation:isolate;overflow:hidden;margin:12px clamp(8px,1.2vw,16px) 0;border-radius:clamp(22px,3vw,36px);color:#fff;
  padding:clamp(56px,8vw,112px) 0 0;
  background:radial-gradient(110% 70% at 75% -10%,#1a4fa8 0%,rgba(26,79,168,0) 55%),radial-gradient(80% 60% at 0% 0%,#0e3478 0%,rgba(14,52,120,0) 60%),linear-gradient(180deg,var(--hx-navy-2),var(--hx-navy) 70%)}
.hx-aurora{position:absolute;inset:0 0 auto;height:78%;z-index:-1;opacity:0;transition:opacity 1.4s ease;mix-blend-mode:screen;pointer-events:none}
.hx-aurora.is-ready{opacity:.95}
.hx-aurora canvas{display:block;width:100%;height:100%}
.hx-hero-grid-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 35%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 35%,#000 20%,transparent 75%)}
.hx-hero-inner{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(32px,5vw,80px);align-items:center}
.hx-badge{display:inline-flex;align-items:center;gap:10px;margin:0;padding:7px 14px 7px 10px;border-radius:999px;font-size:13px;font-weight:500;
  background:rgba(255,255,255,.06);border:1px solid rgba(159,208,255,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.hx-badge-dot{width:8px;height:8px;border-radius:50%;background:#3ddc97;box-shadow:0 0 0 0 rgba(61,220,151,.6);animation:hx-ping 2.4s ease-out infinite}
.hx-shiny{color:var(--hx-ink-2);background:linear-gradient(110deg,var(--hx-ink-2) 40%,#fff 50%,var(--hx-ink-2) 60%);background-size:250% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:hx-shine 4.5s linear infinite}
.hx-hero h1{margin:24px 0 20px;font-size:clamp(40px,5.3vw,78px);line-height:.98;font-weight:600;letter-spacing:-.05em;color:#fff;text-wrap:balance}
.hx-grad{background:linear-gradient(90deg,var(--hx-sky),#d6ebff 55%,var(--hx-sky));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hx-lead{margin:0;max-width:56ch;font-size:clamp(16.5px,1.4vw,19px);line-height:1.6;color:var(--hx-ink-2)}
.hx-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:34px}

/* BlurText: words arrive out of a blur (hw-fx.js splits the heading) */
.is-split .hx-w{display:inline-block;opacity:0;filter:blur(12px);transform:translateY(-.32em);
  transition:opacity .8s var(--mo-ease) calc(var(--i) * 85ms + 120ms),filter .8s var(--mo-ease) calc(var(--i) * 85ms + 120ms),transform 1s var(--mo-ease) calc(var(--i) * 85ms + 120ms)}
.is-split.is-in .hx-w{opacity:1;filter:none;transform:none}
.is-split .hx-grad{background:none;-webkit-text-fill-color:currentColor}
.is-split .hx-grad .hx-w{background:linear-gradient(90deg,var(--hx-sky),#d6ebff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-bottom:.06em}

/* StarBorder primary button */
.hx-star{position:relative;display:inline-flex;border-radius:999px;overflow:hidden;padding:1.5px 0;text-decoration:none;transition:transform .35s var(--mo-ease)}
.hx-star-b,.hx-star-t{position:absolute;width:300%;height:50%;border-radius:50%;opacity:.8;z-index:0;background:radial-gradient(circle,#bfe1ff,transparent 12%);animation:hx-star-b 5s linear infinite alternate}
.hx-star-b{bottom:-11px;right:-250%}
.hx-star-t{top:-11px;left:-250%;animation-name:hx-star-t}
.hx-star-in{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;height:52px;padding:0 7px 0 22px;border-radius:999px;color:#fff;font-size:15px;font-weight:600;
  background:linear-gradient(180deg,#3a8dff,#1169dc);border:1px solid rgba(255,255,255,.2);box-shadow:0 12px 32px -6px rgba(17,105,220,.6),inset 0 1px 0 rgba(255,255,255,.25)}
.hx-star-in i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);transition:transform .3s var(--mo-ease)}
.hx-star-in svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hx-star:hover .hx-star-in i{transform:translateX(3px)}
.hx-star:focus-visible{outline:2px solid #fff;outline-offset:3px}
.hx-ghost{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 20px 0 9px;border-radius:999px;font:inherit;font-size:15px;font-weight:500;color:#fff;cursor:pointer;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);transition:background-color .2s ease,border-color .2s ease}
.hx-ghost img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.hx-ghost:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34)}
.hx-ghost:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* glass bill card */
.hx-bill{position:relative;justify-self:end;width:100%;max-width:440px;padding:22px;border-radius:26px;color:#fff;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.15);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 40px 80px -24px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.14)}
.hx-bill::before{background:radial-gradient(320px circle at var(--mx,50%) var(--my,0%),rgba(159,208,255,.2),transparent 70%)!important}
.hx-bill-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.hx-bill-head > span{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(145deg,#3a8dff,#0b4fb3);box-shadow:0 8px 20px rgba(17,105,220,.45)}
.hx-bill-head > span .pg-icon{width:22px;height:22px;color:#fff}
.hx-bill-head b{display:block;font-size:16px}
.hx-bill-head small{color:var(--hx-ink-3);font-size:13px}
.hx-bill-head em{margin-left:auto;padding:4px 10px;border-radius:999px;font-style:normal;font-size:11.5px;font-weight:600;letter-spacing:.04em;color:var(--hx-ice);border:1px solid rgba(159,208,255,.3)}
.hx-bill-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-top:1px dashed rgba(255,255,255,.13)}
.hx-bill-row > div{flex:1;min-width:0}
.hx-bill-row b{display:block;font-size:14.5px;font-weight:600}
.hx-bill-row small{color:var(--hx-ink-3);font-size:12.5px}
.hx-bill-row i{display:block;height:5px;margin-top:8px;border-radius:5px;width:var(--w);background:linear-gradient(90deg,var(--hx-blue),var(--hx-ice));transform-origin:left;
  box-shadow:0 0 12px rgba(111,179,255,.5)}
.hx-bill-row strong{font-size:15px;font-variant-numeric:tabular-nums}
.hx-bill-total{display:flex;justify-content:space-between;align-items:center;margin-top:8px;padding:14px 16px;border-radius:16px;background:rgba(47,134,255,.16);border:1px solid rgba(111,179,255,.3)}
.hx-bill-total span{font-weight:600}
.hx-bill-total strong{font-size:24px;letter-spacing:-.02em;color:var(--hx-ice);font-variant-numeric:tabular-nums}
.hx-bill-note{margin:10px 2px 0;font-size:12.5px;color:var(--hx-ink-3)}

/* stats strip */
.hx-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(48px,6vw,88px);padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.1)}
.hx-stats li{padding:26px clamp(14px,2vw,28px) 32px;border-left:1px solid rgba(255,255,255,.08)}
.hx-stats li:first-child{border-left:0;padding-left:0}
.hx-stats strong{display:block;font-size:clamp(30px,3.4vw,46px);line-height:1.05;font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,#fff,#b9d6f7);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hx-stats li > span{display:block;margin-top:6px;font-size:14px;line-height:1.45;color:var(--hx-ink-3)}

.page-hx .hw-jump{margin-top:22px}
.hx-head h2{text-wrap:balance}

/* ---------- SpotlightCard ---------- */
[data-spot]{position:relative}
[data-spot] > *{position:relative}
[data-spot]::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s ease;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(47,134,255,.13),transparent 70%)}
[data-spot]:hover::before{opacity:1}

/* ---------- process timeline: the beam fills as you scroll ---------- */
.hx-flow{--p:1;--vertical:0;position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.hx-flow::before,.hx-flow::after{content:"";position:absolute;top:27px;left:calc(100% / 14);right:calc(100% / 14);height:2px;border-radius:2px}
.hx-flow::before{background:#dbe6f4}
.hx-flow::after{background:linear-gradient(90deg,#2f86ff,#6fb3ff);box-shadow:0 0 14px rgba(47,134,255,.55);transform:scaleX(var(--p));transform-origin:left}
.hx-flow li{position:relative;z-index:1;text-align:center;padding:0 4px}
.hx-node{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 18px;border-radius:50%;background:#fff;border:1px solid var(--line);color:#7d93ad;
  transition:background .5s var(--mo-ease),color .5s var(--mo-ease),box-shadow .5s var(--mo-ease),border-color .5s var(--mo-ease),transform .5s var(--mo-ease)}
.hx-node .pg-icon{width:24px;height:24px}
.hx-flow:not(.is-live) .hx-node,.hx-flow li.is-lit .hx-node{color:#fff;border-color:transparent;background:linear-gradient(145deg,#3a8dff,#0b4fb3);box-shadow:0 0 0 6px rgba(47,134,255,.13),0 12px 26px -6px rgba(17,105,220,.55)}
.hx-flow li.is-lit .hx-node{transform:scale(1.04)}
.hx-flow:not(.is-live) li.is-included .hx-node,.hx-flow li.is-included.is-lit .hx-node{background:linear-gradient(145deg,#3ddc97,#13955f);box-shadow:0 0 0 6px rgba(61,220,151,.15),0 12px 26px -6px rgba(19,149,95,.5)}
.hx-flow em{display:block;margin-bottom:6px;font:600 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:#6b819b}
.hx-flow li.is-included em{color:#13955f}
.hx-flow h3{margin:0 0 6px;font-size:16.5px;font-weight:600;line-height:1.25}
.hx-flow p{margin:0;font-size:13.5px;line-height:1.5;color:var(--slate-2)}

/* ---------- rate card ---------- */
.hx-roles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.hx-role{display:flex;flex-direction:column;padding:22px;border-radius:22px;background:#fff;border:1px solid var(--line);
  transition:transform .3s var(--mo-ease),box-shadow .3s var(--mo-ease),border-color .3s var(--mo-ease)}
.hx-role-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;color:var(--blue);background:var(--ice-deep);box-shadow:inset 0 0 0 1px rgba(17,105,220,.12);transition:transform .35s var(--mo-ease)}
.hx-role-ic .pg-icon{width:22px;height:22px}
.hx-role h3{margin:16px 0 6px;font-size:16px;font-weight:600;line-height:1.25}
.hx-role p{margin:0 0 16px;font-size:13.5px;line-height:1.5;color:var(--slate-2)}
.hx-meter{height:4px;margin-top:auto;border-radius:4px;background:#e8f0fa;overflow:hidden}
.hx-meter i{display:block;height:100%;width:var(--r);border-radius:inherit;background:linear-gradient(90deg,#6fb3ff,#1169dc);transform-origin:left;transition:transform 1.1s var(--mo-ease) .2s}
.mo-on .hx-role.mo:not(.is-in) .hx-meter i{transform:scaleX(0)}
.hx-role-foot{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-top:14px}
.hx-role-foot strong{font-size:26px;letter-spacing:-.025em;color:var(--blue);font-variant-numeric:tabular-nums}
.hx-role-foot strong small{font-size:13px;color:var(--hw-muted);font-weight:500}
.hx-role-foot span{font-size:12.5px;color:var(--hw-muted)}
@media (hover:hover){
  .hx-role:hover,.mo-on .hx-role.mo.is-in:hover{transform:translateY(-4px);transition-delay:0ms;border-color:rgba(17,105,220,.32);box-shadow:0 22px 44px -12px rgba(17,105,220,.22)}
  .hx-role:hover .hx-role-ic{transform:scale(1.08) rotate(-4deg)}
}

/* ---------- estimator on a DotGrid ---------- */
.hx-est-band{position:relative;isolation:isolate;overflow:hidden;padding:clamp(12px,2.5vw,32px);border-radius:clamp(24px,3vw,36px);
  background:linear-gradient(180deg,#f4f9ff,#eaf2fd);border:1px solid var(--line)}
.hx-dots{position:absolute;inset:0;z-index:-1;-webkit-mask-image:radial-gradient(ellipse 85% 85% at 50% 50%,#000 40%,transparent 100%);mask-image:radial-gradient(ellipse 85% 85% at 50% 50%,#000 40%,transparent 100%)}
.hx-dots canvas{display:block}
.hx-est-band .hw-est{background:none;border:0;padding:clamp(8px,2vw,20px)}
.hx-est-band .hw-calc{box-shadow:0 30px 70px -20px rgba(17,105,220,.25)}

/* ---------- billing bento with border glow ---------- */
.hx-bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(180px,auto);gap:14px}
.hx-tile{--glow:0;position:relative;isolation:isolate;padding:24px;border-radius:24px;background:#fff;border:1px solid var(--line);overflow:hidden}
.hx-tile::before,.hx-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1}
.hx-tile::before{background:radial-gradient(300px circle at var(--gx,50%) var(--gy,50%),rgba(47,134,255,calc(var(--glow) * .09)),transparent 65%)}
.hx-tile::after{z-index:2;padding:1.5px;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,50%),rgba(47,134,255,calc(var(--glow) * .95)),transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.hx-tile h3{margin:16px 0 6px;font-size:17px;font-weight:600}
.hx-tile p{margin:0;font-size:14.5px;line-height:1.55;color:var(--slate-2)}
.hx-tile--chart{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column;justify-content:space-between;box-shadow:none}
.hx-tile--chart svg{margin:18px 0 14px}

/* ---------- payment milestones ---------- */
.hx-pay{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.hx-pay li{padding:26px;border-radius:24px;background:#fff;border:1px solid var(--line);transition:transform .3s var(--mo-ease),box-shadow .3s var(--mo-ease)}
.hx-pay li::after{content:"";position:absolute;top:-1px;left:26px;right:26px;height:3px;border-radius:0 0 3px 3px;background:#9fc4ff}
.hx-pay li:nth-child(2)::after{background:#2f86ff}
.hx-pay li:nth-child(3)::after{background:#0b4fb3}
.hx-pay-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hx-pay-n{font-size:46px;line-height:1;font-weight:600;letter-spacing:-.04em;background:linear-gradient(180deg,#1169dc,#9fc4ff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hx-pay-when{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--blue);background:var(--ice-deep)}
.hx-pay-when .pg-icon{width:15px;height:15px}
.hx-pay h3{margin:20px 0 8px;font-size:19px;font-weight:600;letter-spacing:-.01em}
.hx-pay p{margin:0;font-size:15px;line-height:1.55;color:var(--slate-2)}
@media (hover:hover){.hx-pay li:hover,.mo-on .hx-pay li.mo.is-in:hover{transform:translateY(-4px);transition-delay:0ms;box-shadow:0 22px 44px -14px rgba(17,105,220,.22)}}

.hw-third > div,.hw-need{overflow:hidden}

/* ---------- support band: slow light rays ---------- */
.hx-support{position:relative;isolation:isolate;overflow:hidden}
.hx-rays{position:absolute;inset:-60% -30% -60% 20%;z-index:-1;pointer-events:none;filter:blur(22px);opacity:.9;transform-origin:70% 0;
  background:conic-gradient(from 190deg at 75% 0%,transparent 0deg,rgba(111,179,255,.22) 10deg,transparent 22deg,rgba(111,179,255,.13) 36deg,transparent 48deg,rgba(111,179,255,.2) 64deg,transparent 80deg);
  animation:hx-rays 16s ease-in-out infinite alternate}

/* ---------- closing CTA ---------- */
.hx-cta{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;
  margin-bottom:clamp(56px,8vw,96px);padding:clamp(32px,5vw,64px);border-radius:clamp(24px,3vw,36px);color:#fff;background:linear-gradient(180deg,var(--hx-navy-2),var(--hx-navy))}
.hx-cta-glow{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(55% 120% at 88% 0%,rgba(47,134,255,.5),transparent 60%),radial-gradient(40% 90% at 0% 100%,rgba(111,179,255,.28),transparent 60%);animation:hx-breathe 9s ease-in-out infinite alternate}
.hx-cta h2{margin:0 0 8px;font-size:clamp(28px,3.6vw,46px);line-height:1.05;font-weight:600;letter-spacing:-.035em}
.hx-cta p{margin:0;max-width:52ch;color:var(--hx-ink-2);font-size:17px;line-height:1.55}
.hx-cta .hx-actions{margin:0}

@keyframes hx-ping{0%{box-shadow:0 0 0 0 rgba(61,220,151,.55)}80%,100%{box-shadow:0 0 0 9px rgba(61,220,151,0)}}
@keyframes hx-shine{from{background-position:150% 0}to{background-position:-100% 0}}
@keyframes hx-star-b{0%{transform:translate(0,0);opacity:1}100%{transform:translate(-100%,0);opacity:0}}
@keyframes hx-star-t{0%{transform:translate(0,0);opacity:1}100%{transform:translate(100%,0);opacity:0}}
@keyframes hx-rays{from{transform:rotate(-7deg)}to{transform:rotate(7deg)}}
@keyframes hx-breathe{from{opacity:.75;transform:scale(1)}to{opacity:1;transform:scale(1.08)}}
@keyframes hx-float{0%,100%{translate:0 0}50%{translate:0 -8px}}
@media (prefers-reduced-motion:no-preference){.hx-bill{animation:hx-float 8s ease-in-out 1.5s infinite}}
@media (prefers-reduced-motion:reduce){
  .hx-badge-dot,.hx-shiny,.hx-star-b,.hx-star-t,.hx-rays,.hx-cta-glow{animation:none}
  .hx-star-b,.hx-star-t{display:none}
}

/* ---------- responsive ---------- */
@media (max-width:1200px){
  .hx-roles{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:1000px){
  .hx-hero-inner{grid-template-columns:1fr}
  .hx-bill{justify-self:start}
  .hx-roles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hx-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hx-flow{--vertical:1;grid-template-columns:1fr;gap:0;max-width:640px}
  .hx-flow::before,.hx-flow::after{top:28px;bottom:28px;left:27px;right:auto;width:2px;height:auto}
  .hx-flow::after{transform:scaleY(var(--p));transform-origin:top}
  .hx-flow li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:18px;text-align:left;padding:0 0 26px}
  .hx-flow li:last-child{padding-bottom:0}
  .hx-node{grid-row:span 3;margin:0}
  .hx-flow em{margin-top:6px}
}
@media (max-width:760px){
  .hx-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hx-stats li:nth-child(3){border-left:0;padding-left:0}
  .hx-stats li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.08)}
  .hx-pay{grid-template-columns:1fr}
}
@media (max-width:680px){
  .hx-roles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hx-role{padding:18px}
  .hx-role-foot{flex-direction:column;gap:2px}
  .hx-bento{grid-template-columns:1fr}
  .hx-tile--chart{grid-column:auto;grid-row:auto}
  .hx-actions > *{flex:1 1 auto;justify-content:center}
  .hx-star-in{width:100%;justify-content:space-between}
  .hx-bill-head em{display:none}
}
@media (max-width:420px){
  .hx-roles{grid-template-columns:1fr}
  .hx-stats strong{font-size:28px}
}

/* ---------- process as a journey: mountains, a winding road, one island per step ---------- */
.jr-scene{position:relative;isolation:isolate;overflow:hidden;padding:clamp(28px,4vw,56px) clamp(16px,3vw,40px) clamp(32px,4vw,52px);border-radius:clamp(24px,3vw,36px);
  background:linear-gradient(180deg,#eef5ff 0%,#f8fbff 48%,#fff 100%);border:1px solid var(--line)}
.jr-mtn{position:absolute;left:0;top:0;width:100%;height:min(470px,62%);z-index:-2;pointer-events:none}
.jr-cloud{position:absolute;z-index:-1;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));filter:blur(2px)}
.jr-cloud.c1{width:340px;height:90px;top:120px;right:8%}
.jr-cloud.c2{width:260px;height:70px;top:60px;right:38%;opacity:.8}
.jr-cloud.c3{width:420px;height:110px;top:230px;right:-4%;opacity:.9}
.jr-head{position:relative;max-width:620px}
.jr-eyebrow{display:flex;align-items:center;gap:12px}
.jr-eyebrow::after{content:"";width:48px;height:1.5px;background:currentColor;opacity:.5}
.jr-head h2{font-size:clamp(32px,4.4vw,58px);line-height:1.04;letter-spacing:-.04em}
.jr-blue{background:linear-gradient(90deg,#1169dc,#4d9bff);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.jr-head p{max-width:54ch}
.jr-track{position:relative;margin-top:clamp(16px,3vw,40px)}
.jr-road{position:absolute;left:0;top:173px;width:100%;height:100px;overflow:visible;pointer-events:none;filter:drop-shadow(0 8px 10px rgba(17,105,220,.10))}
.jr-road-bed{fill:none;stroke:#fff;stroke-width:30;stroke-linecap:round;vector-effect:non-scaling-stroke}
.jr-road-line{fill:none;stroke:#6aa8ff;stroke-width:2;stroke-dasharray:7 9;stroke-linecap:round;vector-effect:non-scaling-stroke}
.jr-steps{--p:1;--vertical:0;position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin:0;padding:0;list-style:none}
.jr-steps li{position:relative;padding:var(--py) 6px 0;text-align:center}
.jr-art{position:relative;height:150px}
.jr-island{position:absolute;left:50%;bottom:-6px;width:min(170px,100%);transform:translateX(-50%);overflow:visible}
.jr-tile{position:absolute;left:50%;bottom:58px;display:grid;place-items:center;width:66px;height:66px;margin-left:-33px;border-radius:20px;color:var(--blue);
  background:linear-gradient(160deg,#fff 0%,#e6f0fd 100%);box-shadow:0 16px 30px -10px rgba(17,105,220,.45),inset 0 1px 0 #fff,0 0 0 1px rgba(17,105,220,.12)}
.jr-tile .pg-icon{width:30px;height:30px;stroke-width:1.9}
.jr-steps li.is-included .jr-tile{color:#13955f;background:linear-gradient(160deg,#fff,#e2f7ec);box-shadow:0 16px 30px -10px rgba(19,149,95,.45),inset 0 1px 0 #fff,0 0 0 1px rgba(19,149,95,.15)}
.jr-tile.has-check::after{content:"";position:absolute;right:-10px;top:-10px;width:26px;height:26px;border-radius:50%;border:2px solid #fff;
  background:#22b36b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/15px no-repeat;
  box-shadow:0 6px 14px rgba(34,179,107,.4)}
.jr-pin{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;margin:0 auto 14px;border-radius:50%;border:3px solid #fff;
  font-size:15px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;background:linear-gradient(145deg,#3a8dff,#0b4fb3);
  box-shadow:0 10px 20px -6px rgba(17,105,220,.6);transition:transform .5s var(--mo-ease),background .5s var(--mo-ease),color .5s var(--mo-ease)}
.jr-steps.is-live li:not(.is-lit) .jr-pin{color:#5f7186;background:#fff;box-shadow:0 0 0 1px var(--line),0 6px 14px -6px rgba(17,105,220,.25)}
.jr-steps li.is-lit .jr-pin{transform:scale(1.06)}
.jr-steps li.is-included .jr-pin{background:linear-gradient(145deg,#3ddc97,#13955f);box-shadow:0 10px 20px -6px rgba(19,149,95,.55)}
.jr-steps h3{margin:0 0 6px;font-size:17px;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.jr-steps p{margin:0;font-size:13.5px;line-height:1.5;color:var(--slate-2)}
.jr-tag{display:inline-block;margin-top:8px;padding:3px 9px;border-radius:999px;font-style:normal;font-size:11.5px;font-weight:600;color:#13955f;background:#e2f7ec}

@media (prefers-reduced-motion:no-preference){
  .jr-tile{animation:jr-bob 5.5s ease-in-out infinite;animation-delay:calc(var(--i) * -.8s)}
  .jr-road-line{animation:jr-dash 1.6s linear infinite}
  .jr-cloud.c1{animation:jr-drift 38s ease-in-out infinite alternate}
  .jr-cloud.c2{animation:jr-drift 46s ease-in-out -12s infinite alternate}
  .jr-cloud.c3{animation:jr-drift 52s ease-in-out -20s infinite alternate}
}
@keyframes jr-bob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes jr-dash{to{stroke-dashoffset:-32}}
@keyframes jr-drift{from{translate:0 0}to{translate:-60px 6px}}

@media (max-width:1000px){
  .jr-road{display:none}
  .jr-mtn{height:300px}
  .jr-steps{--vertical:1;grid-template-columns:1fr;gap:6px;max-width:640px}
  .jr-steps::before{content:"";position:absolute;left:46px;top:40px;bottom:40px;border-left:2px dashed #9fc4ff}
  .jr-steps li{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:16px;align-items:center;padding:6px 0;text-align:left}
  .jr-art{grid-row:span 4;height:96px}
  .jr-island{width:96px;bottom:-4px}
  .jr-tile{width:48px;height:48px;margin-left:-24px;bottom:34px;border-radius:15px}
  .jr-tile .pg-icon{width:24px;height:24px}
  .jr-tile.has-check::after{width:20px;height:20px;right:-8px;top:-8px;background-size:12px}
  .jr-pin{width:30px;height:30px;margin:0 0 6px;font-size:12px;border-width:2px}
  .jr-tag{justify-self:start}
}

/* journey: character scenes are taller than the old icon tiles */
.jr-art{height:178px}
.jr-island{width:min(196px,100%);bottom:-8px}
.jr-road{top:201px}
@media (prefers-reduced-motion:no-preference){
  .jr-rocket{animation:jr-lift 3.2s ease-in-out infinite}
  .jr-float{animation:jr-bob 5s ease-in-out infinite}
  .jr-flag{transform-origin:117px 46px;animation:jr-wave 2.8s ease-in-out infinite}
}
@keyframes jr-lift{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes jr-wave{0%,100%{transform:skewY(0)}50%{transform:skewY(-5deg) scaleX(.94)}}
@media (max-width:1000px){
  .jr-steps li{grid-template-columns:110px minmax(0,1fr)}
  .jr-steps::before{left:55px}
  .jr-art{height:96px}
  .jr-island{width:110px;bottom:-4px}
}

/* ---------- rate card: an illustrated header per role ---------- */
.rc{display:flex;flex-direction:column;border-radius:24px;background:#fff;border:1px solid var(--line);overflow:hidden;
  transition:transform .3s var(--mo-ease),box-shadow .3s var(--mo-ease),border-color .3s var(--mo-ease)}
.rc::before{background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--ac) 14%,transparent),transparent 70%)!important}
.rc-scene{position:relative;display:flex;align-items:flex-end;justify-content:center;height:136px;overflow:hidden;
  background:radial-gradient(120% 90% at 80% 10%,#fff 0%,rgba(255,255,255,0) 60%),linear-gradient(165deg,var(--ac-soft),#fff 95%)}
.rc-scene::after{content:"";position:absolute;right:-30px;top:-40px;width:140px;height:140px;border-radius:50%;background:var(--ac);opacity:.06}
.rc-art{position:relative;z-index:1;display:block;width:100%;max-width:250px;height:auto;transition:transform .5s var(--mo-ease)}
.rc-body{position:relative;display:flex;flex-direction:column;flex:1;margin-top:-10px;padding:18px 20px 20px;border-radius:20px 20px 0 0;background:#fff}
.rc-body h3{margin:0 0 6px;font-size:17px;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.rc-body p{margin:0 0 18px;font-size:13.5px;line-height:1.5;color:var(--slate-2)}
.rc-meter{height:5px;margin-top:auto;border-radius:5px;background:color-mix(in srgb,var(--ac) 14%,#fff);overflow:hidden}
.rc-meter i{display:block;height:100%;width:var(--r);border-radius:inherit;background:var(--ac);transform-origin:left;transition:transform 1.1s var(--mo-ease) .25s}
.mo-on .rc.mo:not(.is-in) .rc-meter i{transform:scaleX(0)}
.rc-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:14px}
.rc-foot strong{font-size:28px;line-height:1;letter-spacing:-.03em;color:var(--blue);font-variant-numeric:tabular-nums}
.rc-foot strong small{font-size:13px;font-weight:500;color:var(--hw-muted);letter-spacing:0}
.rc-foot span{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap;color:var(--hw-muted);background:#f1f5fb}
@media (hover:hover){
  .rc:hover,.mo-on .rc.mo.is-in:hover{transform:translateY(-5px);transition-delay:0ms;border-color:color-mix(in srgb,var(--ac) 35%,transparent);
    box-shadow:0 24px 46px -14px color-mix(in srgb,var(--ac) 40%,transparent)}
  .rc:hover .rc-art{transform:scale(1.04) translateY(-2px)}
}
@media (max-width:1200px){.rc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.rc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){
  .rc-grid{grid-template-columns:1fr}
  .rc-scene{height:150px}
}
@media (min-width:521px) and (max-width:760px){
  .rc-foot{flex-direction:column;align-items:flex-start;gap:8px}
  .rc-body{padding:16px}
}

/* ---------- hero: white card over a background video, floating nav, logo marquee ---------- */
.page-hx{background:#f9fafb}
.vh-wrap{padding:16px clamp(8px,1.2vw,16px) 0}
.vh{position:relative;display:flex;flex-direction:column;width:100%;max-width:1400px;height:600px;margin:0 auto;overflow:hidden;
  border-radius:48px;background:#fff;border:1px solid rgba(226,232,240,.5);box-shadow:0 40px 100px -20px rgba(0,0,0,.03)}
.vh-bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;user-select:none}
.vh-video{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.05);transition:transform 1s}
.vh-content{position:relative;z-index:20;flex:1;display:flex;flex-direction:column;align-items:flex-start;padding:48px 32px 0}
.vh-content h1{margin:0;font-size:42px;line-height:1.08;font-weight:500;letter-spacing:-.035em;color:#0a1b33}
.vh-content p{max-width:440px;margin:16px 0 0;font-size:14px;line-height:1.6;color:#64748b}
.vh-cta{display:inline-flex;align-items:center;height:44px;margin-top:24px;padding:0 22px;border-radius:999px;background:#0a152d;color:#fff;font-size:14px;font-weight:600;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease}
.vh-cta:hover{transform:scale(1.05);box-shadow:0 10px 24px -8px rgba(10,21,45,.45)}
.vh-cta:active{transform:scale(.97)}
.vh-cta:focus-visible,.vh-link:focus-visible,.vh-pill:focus-visible{outline:2px solid #1169dc;outline-offset:3px}
.vh-nav{position:absolute;left:50%;bottom:40px;z-index:30;display:flex;align-items:center;gap:2px;padding:6px;border-radius:999px;transform:translateX(-50%);
  background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);border:1px solid rgba(226,232,240,.4);box-shadow:0 12px 40px rgba(0,0,0,.08)}
.vh-logo{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #f1f5f9;box-shadow:0 1px 2px rgba(0,0,0,.05);color:#0a1b33;font-size:15px}
.vh-link{padding:8px 14px;border-radius:999px;font-size:12px;font-weight:600;color:#64748b;transition:color .2s}
.vh-link:hover{color:#0a1b33}
.vh-pill,.vh-card{background:#fff;border:1px solid rgba(226,232,240,.6);box-shadow:0 1px 2px rgba(0,0,0,.05);transition:all .2s}
.vh-pill{display:inline-flex;align-items:center;gap:4px;padding:8px 20px;border-radius:999px;font-size:12px;font-weight:600;color:#0a1b33}
.vh-pill:hover,.vh-card:hover{border-color:#cbd5e1}
.vh-pill svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
@media (min-width:768px){
  .vh-content{padding:64px 64px 0}
  .vh-content h1{font-size:56px}
  .vh-content p{font-size:15px}
}
@media (prefers-reduced-motion:no-preference){
  .vh-content{animation:vh-in .8s cubic-bezier(.16,1,.3,1) both}
  .vh-nav{animation:vh-nav-in .8s cubic-bezier(.16,1,.3,1) .35s both}
}
@keyframes vh-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes vh-nav-in{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translateX(-50%)}}

/* seamless marquee: the list is rendered twice and slides by half its width */
.vh-marquee{max-width:1400px;margin:40px auto 0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.vh-track{display:flex;gap:16px;width:max-content;padding:4px 0}
@media (prefers-reduced-motion:no-preference){.vh-track{animation:vh-marquee 36s linear infinite}}
.vh-marquee:hover .vh-track{animation-play-state:paused}
@keyframes vh-marquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 8px))}}
.vh-card{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:160px;height:96px;border-radius:999px;overflow:hidden}
.vh-card-bg{position:absolute;inset:0;opacity:0;transform:scale(1.5);transition:opacity .5s ease,transform .5s ease}
.vh-card:hover .vh-card-bg{opacity:1;transform:scale(1)}
.vh-card img{position:relative;width:auto;max-width:96px;height:40px;object-fit:contain;transition:filter .3s ease}
.vh-card:hover img{filter:brightness(0) invert(1)}
@media (max-width:640px){
  .vh{height:560px;border-radius:32px}
  .vh-nav{bottom:24px}
  .vh-link{padding:8px 10px}
}

/* journey: the owner's step illustrations (numbers and road are part of the images), edges faded into the scene */
.jr-steps li{padding:0 2px}
.jr-art{display:flex;align-items:flex-end;justify-content:center;height:236px;margin-bottom:10px}
.jr-art img{display:block;width:100%;max-width:250px;height:auto;max-height:236px;object-fit:contain;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 18%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent),linear-gradient(180deg,transparent,#000 18%);mask-composite:intersect;
  transition:transform .5s var(--mo-ease)}
@media (hover:hover){.jr-steps li:hover .jr-art img{transform:translateY(-4px) scale(1.03)}}
@media (max-width:1000px){
  .jr-steps li{grid-template-columns:120px minmax(0,1fr);padding:4px 0}
  .jr-steps::before{display:none}
  .jr-art{grid-row:span 4;height:auto;margin:0}
  .jr-art img{max-width:120px}
}

/* marquee: compact (owner: it covered too much space) */
.vh-marquee{margin-top:24px}
.vh-track{gap:10px}
.vh-card{width:104px;height:52px}
.vh-card img{max-width:64px;height:24px}
@keyframes vh-marquee{from{transform:translateX(0)}to{transform:translateX(calc(-50% - 5px))}}

/* rate cards: the owner's 3D role illustrations (white backgrounds, so the header is white too) */
.rc-scene{display:block;height:auto;padding:6px 6px 0;background:#fff}
.rc-scene::after{display:none}
.rc-scene img{display:block;width:100%;height:auto;aspect-ratio:420/344;object-fit:cover;border-radius:18px;transition:transform .5s var(--mo-ease)}
@media (hover:hover){.rc:hover .rc-scene img{transform:scale(1.04)}}
@media (max-width:520px){.rc-scene{height:auto}}

/* rate cards as a masonry (React Bits Masonry port in hw-fx.js); a CSS grid without JS */
.rc-scene img{height:var(--h,auto);aspect-ratio:auto;object-position:center}
.rc-grid.is-masonry{display:block;position:relative}
.rc-grid.is-masonry > .rc{position:absolute;top:0;left:0;transition:scale .3s cubic-bezier(.25,.46,.45,.94),box-shadow .3s ease,border-color .3s ease}
.rc-grid.is-masonry:not(.is-shown) > .rc{opacity:0}
.rc-grid.is-moving > .rc{transition:translate .6s cubic-bezier(.215,.61,.355,1),scale .3s ease}
@media (hover:hover){
  .rc-grid.is-masonry > .rc:hover{transform:none;scale:.95}
}
@media (prefers-reduced-motion:reduce){.rc-grid.is-masonry > .rc{transition:none}}

/* ---------- estimate with NOVA (nova-quote.js) ---------- */
.nq-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:start;padding:clamp(8px,2vw,20px)}
.nq-intro h2{margin:0 0 12px;font-size:clamp(28px,3.4vw,42px);line-height:1.08;font-weight:600;letter-spacing:-.03em}
.nq-intro > p{margin:0 0 16px;color:var(--slate-2);line-height:1.65}
.nq-points{display:grid;gap:8px;margin:0 0 18px;padding:0;list-style:none}
.nq-points li{display:flex;align-items:center;gap:10px;font-weight:500}
.nq-points .pg-icon{width:20px;height:20px;padding:3px;border-radius:50%;background:#e8f1ff;color:var(--blue);stroke-width:2.6}
@media (min-width:1001px){.nq-intro{position:sticky;top:96px}}
.nq{display:none}
.nq-on .nq{display:block}
.nq-on:not(.nq-has-plan) .nq-plan{display:none}
.nq-start{display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(28px,4vw,48px) 24px;border-radius:28px;background:#fff;border:1px solid var(--line);
  box-shadow:0 30px 70px -30px rgba(17,105,220,.35)}
.nq-start-orb{position:relative;width:96px;height:96px;margin-bottom:18px;border-radius:50%;padding:4px;background:linear-gradient(145deg,#5aa0ff,#0b4fb3);box-shadow:0 18px 40px -12px rgba(17,105,220,.6)}
.nq-start-orb::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px dashed rgba(17,105,220,.35)}
.nq-start-orb img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.nq-start-title{margin:0 0 6px;font-size:22px;font-weight:700;letter-spacing:-.02em}
.nq-start-sub{max-width:36ch;margin:0 0 22px;color:var(--slate-2);line-height:1.55}
.nq-go{display:inline-flex;align-items:center;gap:12px;height:52px;padding:0 8px 0 22px;border:0;border-radius:999px;background:var(--blue);color:#fff;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;
  box-shadow:0 14px 30px -12px rgba(17,105,220,.7);transition:transform .25s cubic-bezier(.22,1,.36,1),filter .25s ease}
.nq-go i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18)}
.nq-go svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nq-go:hover{transform:translateY(-2px);filter:brightness(1.07)}
.nq-skip{margin-top:12px;padding:6px;border:0;background:none;color:var(--slate-2);font-family:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

.nq-chat{display:flex;flex-direction:column;height:min(640px,78vh);border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(17,105,220,.35);overflow:hidden}
.nq-head{display:flex;align-items:center;gap:10px;padding:14px 16px;background:linear-gradient(180deg,#0b1b33,#14325c);color:#fff}
.nq-head img{width:36px;height:36px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.nq-head b{display:block;font-size:15px}
.nq-head small{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#a9c4e6}
.nq-head small i{width:7px;height:7px;border-radius:50%;background:#3ddc97}
.nq-restart{display:grid;place-items:center;width:34px;height:34px;margin-left:auto;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer}
.nq-restart svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nq-log{flex:1;display:flex;flex-direction:column;gap:10px;padding:18px 16px;overflow-y:auto;background:linear-gradient(180deg,#f4f8ff,#fff)}
.nq-msg{max-width:86%;padding:11px 14px;border-radius:16px;font-size:14.5px;line-height:1.5;animation:nq-pop .4s cubic-bezier(.22,1,.36,1) both}
.nq-bot{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:6px}
.nq-user{align-self:flex-end;background:var(--blue);color:#fff;border-bottom-right-radius:6px}
.nq-msg--wide{max-width:100%;width:100%;padding:0;border:0;background:none}
.nq-typing{display:inline-flex;gap:4px;padding:13px 14px}
.nq-typing i{width:6px;height:6px;border-radius:50%;background:#9db1c8;animation:nq-dot 1s ease-in-out infinite}
.nq-typing i:nth-child(2){animation-delay:.15s}
.nq-typing i:nth-child(3){animation-delay:.3s}
.nq-input{display:flex;flex-direction:column;gap:10px;padding:12px 14px 14px;border-top:1px solid var(--line);background:#fff}
.nq-input:empty{display:none}
.nq-chips{display:flex;flex-wrap:wrap;gap:8px}
.nq-chip{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:7px 14px;border:1px solid rgba(17,105,220,.3);border-radius:999px;background:#f4f8ff;color:var(--ink);
  font-family:inherit;font-size:14px;font-weight:500;line-height:1.25;text-align:left;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.nq-chip:hover{background:#e8f1ff;border-color:var(--blue)}
.nq-tick{display:grid;place-items:center;width:18px;height:18px;border-radius:6px;border:1.5px solid #9db1c8;background:#fff}
.nq-tick svg{width:12px;height:12px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.nq-chip--toggle[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.nq-chip--toggle[aria-pressed="true"] .nq-tick{border-color:#fff;background:rgba(255,255,255,.2)}
.nq-done{align-self:flex-end;height:40px;padding:0 20px;border:0;border-radius:999px;background:var(--blue);color:#fff;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.nq-text{display:flex;gap:8px}
.nq-text input{flex:1;min-width:0;height:44px;padding:0 16px;border:1px solid var(--line);border-radius:999px;font:inherit;font-size:14.5px;background:#f7faff}
.nq-text input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(17,105,220,.15)}
.nq-text button{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--blue);color:#fff;cursor:pointer}
.nq-text button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nq-chip:focus-visible,.nq-done:focus-visible,.nq-text button:focus-visible,.nq-go:focus-visible,.nq-skip:focus-visible,.nq-restart:focus-visible,.nq-btn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

.nq-quote{padding:18px;border-radius:20px;background:#fff;border:1px solid rgba(17,105,220,.25);box-shadow:0 20px 40px -24px rgba(17,105,220,.45)}
.nq-q-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.nq-badge{padding:5px 11px;border-radius:999px;background:var(--blue);color:#fff;font-size:12.5px;font-weight:700}
.nq-q-type{font-weight:600;font-size:14.5px}
.nq-q-desc{margin:10px 0 0;color:var(--slate-2);font-size:14px;font-style:italic}
.nq-q-team{display:grid;gap:4px;margin:14px 0;padding:0;list-style:none}
.nq-q-team li{display:grid;grid-template-columns:minmax(0,1fr) auto 84px;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;background:#f6f9fe;font-size:13.5px}
.nq-q-team li span:nth-child(2){color:var(--hw-muted);font-variant-numeric:tabular-nums}
.nq-q-team li b{text-align:right;font-variant-numeric:tabular-nums}
.nq-q-team em{font-style:normal;font-size:11px;font-weight:600;color:#13955f;background:#e2f7ec;padding:2px 6px;border-radius:999px;margin-left:4px;white-space:nowrap}
.nq-q-sum{display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:8px}
.nq-q-sum div{padding:10px 12px;border-radius:14px;background:#f6f9fe}
.nq-q-sum small{display:block;font-size:11.5px;color:var(--hw-muted)}
.nq-q-sum b{font-size:18px;font-variant-numeric:tabular-nums}
.nq-q-sum .nq-q-total{background:linear-gradient(145deg,#2f86ff,#0b4fb3);color:#fff}
.nq-q-sum .nq-q-total small{color:#d6e7ff}
.nq-q-sum .nq-q-total b{font-size:22px}
.nq-q-range{margin:10px 0 0;font-size:13px;color:var(--slate-2)}
.nq-q-note{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:var(--hw-muted)}
.nq-q-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.nq-btn{height:42px;padding:0 18px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.nq-btn:hover{border-color:var(--blue);color:var(--blue)}
.nq-btn--primary{background:var(--blue);border-color:var(--blue);color:#fff}
.nq-btn--primary:hover{color:#fff;filter:brightness(1.07)}

.nq-plan{margin-top:clamp(20px,3vw,32px);padding:clamp(8px,2vw,20px);scroll-margin-top:84px}
.nq-plan-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}
.nq-plan-head h3{margin:0 0 4px;font-size:22px;font-weight:700;letter-spacing:-.02em}
.nq-plan-head p{margin:0;color:var(--slate-2);font-size:14.5px}
.nq-plan .hw-presets{margin:0}
@keyframes nq-pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes nq-dot{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@media (max-width:1000px){.nq-wrap{grid-template-columns:1fr}.nq-chat{height:min(620px,82vh)}}
@media (max-width:560px){
  .nq-q-sum{grid-template-columns:1fr 1fr}
  .nq-q-sum .nq-q-total{grid-column:1 / -1}
  .nq-q-team li{grid-template-columns:minmax(0,1fr) auto}
  .nq-q-team li span:nth-child(2){grid-column:1}
}
@media (prefers-reduced-motion:reduce){.nq-msg{animation:none}}
.nq-input > .nq-chip{align-self:flex-start}

/* estimate card (fixed project price model, 2026-10-08) */
.nq-q-label{margin:14px 0 8px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--hw-muted)}
.nq-q-roles{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;padding:0;list-style:none}
.nq-q-roles li{padding:6px 11px;border-radius:999px;background:#f1f6fd;font-size:13px;font-weight:500}
.nq-q-roles li.is-added{background:#e2f7ec;color:#0f7a4d}
.nq-q-roles li.is-added::after{content:" · for your needs";font-size:11px;font-weight:600}
.nq-q-sum{grid-template-columns:1.4fr 1fr 1.1fr}
.nq-q-sum b i{font-style:normal;font-size:12px;font-weight:600;opacity:.7}
.nq-adjust{margin-top:12px;border-radius:14px;background:#f6f9fe}
.nq-adjust summary{padding:11px 14px;font-size:14px;font-weight:600;color:var(--blue);cursor:pointer;list-style:none}
.nq-adjust summary::-webkit-details-marker{display:none}
.nq-adjust summary::before{content:"+";display:inline-block;width:16px;font-weight:700}
.nq-adjust[open] summary::before{content:"–"}
.nq-adjust-body{padding:0 14px 14px}
.nq-adjust-body > p{margin:10px 0 6px;font-size:12.5px;font-weight:600;color:var(--hw-muted)}
.nq-seg{display:flex;flex-wrap:wrap;gap:6px}
.nq-seg button{height:36px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-family:inherit;font-size:13.5px;font-weight:500;color:var(--ink);cursor:pointer}
.nq-seg button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.nq-seg button:focus-visible,.nq-adjust summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.nq-quote.is-updated .nq-q-total{animation:nq-flash .6s ease}
@keyframes nq-flash{40%{box-shadow:0 0 0 4px rgba(17,105,220,.25)}}
a.nq-skip{display:inline-block}

/* pricing tiers (billing section) */
.hx-tiers figcaption b{display:block;font-size:17px}
.hx-tiers figcaption small{color:var(--hw-muted);font-size:13px}
.hx-tier-list{display:grid;gap:10px;margin-top:16px}
.hx-tier{display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:2px;align-items:baseline;padding:16px 18px;border-radius:18px;background:#f6f9fe;border:1px solid var(--line)}
.hx-tier.is-pop{background:linear-gradient(160deg,#eef5ff,#fff);border-color:rgba(17,105,220,.35);box-shadow:0 14px 30px -18px rgba(17,105,220,.5)}
.hx-tier-name{grid-row:span 3;align-self:start;min-width:74px;padding:5px 10px;border-radius:999px;background:var(--blue);color:#fff;font-size:12.5px;font-weight:700;text-align:center}
.hx-tier-price{font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.hx-tier small{font-size:13.5px;line-height:1.45;color:var(--slate-2)}
.hx-tier ul{display:flex;flex-wrap:wrap;gap:6px 14px;margin:6px 0 0;padding:0;list-style:none;font-size:12.5px;font-weight:600;color:var(--hw-muted)}
.hx-tier li{display:inline-flex;align-items:center;gap:5px}
.hx-tier .pg-icon{width:14px;height:14px;color:var(--blue)}
@media (max-width:560px){.nq-q-sum{grid-template-columns:1fr 1fr}.nq-q-sum .nq-q-total{grid-column:1 / -1}.hx-tier{grid-template-columns:1fr}.hx-tier-name{grid-row:auto;justify-self:start}}

/* result view: the estimate replaces the chat at full height (no scrolling inside a small box) */
.nq.is-result .nq-chat{display:none}
.nq-result{display:none;border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(17,105,220,.35);overflow:hidden;scroll-margin-top:84px}
.nq.is-result .nq-result{display:block;animation:nq-pop .45s cubic-bezier(.22,1,.36,1) both}
.nq-result-body{padding:16px;background:linear-gradient(180deg,#f4f8ff,#fff 160px)}
.nq-result .nq-quote{box-shadow:none}
.nq-result .nq-quote:focus{outline:none}
.nq-head-btn{margin-left:auto;height:34px;padding:0 14px;border:0;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.nq-head-btn:hover{background:rgba(255,255,255,.24)}
.nq-head-btn + .nq-restart{margin-left:8px}
.nq-head-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:480px){.nq-result-head small{display:none}.nq-head-btn{padding:0 10px;font-size:12px}}