/* Landing refinements: live bill, live gold-rate example, 3x3 modules, calmer rhythm. Additive only; every existing section is kept. */
.section-head h2,.aimap .head h2,.faq h2,.cta h2,.workflow h2{text-wrap:balance}
.aimap .head h2{max-width:14ch;margin-left:auto;margin-right:auto;text-align:center}
/* modules: nine cards read as 3 x 3, not 4 + 4 + 1 */
@media(min-width:900px){.module-grid.os-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:560px) and (max-width:899px){.module-grid.os-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* more air between sections on desktop */
@media(min-width:900px){.section,.workflow,.faq{padding-top:104px;padding-bottom:40px}}
/* live bill */
.jbt-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.jbt-copy{display:grid;gap:16px;justify-items:start}
.jbt-copy h2{font-size:clamp(30px,4vw,48px);line-height:1.06;letter-spacing:-.03em;text-wrap:balance;margin:0}
.jbt-copy p{color:var(--mute);font-size:18px;max-width:38ch;margin:0}
.jbt-bill{background:var(--card);border-radius:28px;padding:clamp(22px,3vw,34px);display:grid;gap:18px;min-width:0}
.jbt-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.jbt-head b{font-size:16px}.jbt-head span{font-size:13px;color:var(--mute)}
.jbt-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.jbt-fields label{display:grid;gap:6px;font-size:13px;color:var(--mute)}
.jbt-fields input{width:100%;min-height:48px;border:0;border-radius:14px;background:var(--bg);color:var(--ink);font:600 17px/1 inherit;font-family:inherit;padding:0 12px;font-variant-numeric:tabular-nums}
.jbt-lines{display:grid;gap:10px;font-size:16px;font-variant-numeric:tabular-nums}
.jbt-lines>div{display:flex;justify-content:space-between;gap:12px}
.jbt-lines>div>span:first-child{color:var(--mute)}
.jbt-lines .jbt-total{padding:14px 16px;margin-top:4px;border-radius:14px;background:var(--goldbg);font-weight:700;font-size:22px;letter-spacing:-.02em}
.jbt-lines .jbt-total>span:first-child{color:var(--ink);font-weight:600;font-size:16px;align-self:center}
@media(max-width:860px){.jbt-split{grid-template-columns:1fr;gap:28px}}
@media(max-width:520px){.jbt-fields{grid-template-columns:1fr 1fr}.jbt-fields label:last-child{grid-column:1/-1}}
/* live gold-rate example inside Credit sales */
.jbt-rate{display:grid;gap:10px;padding:18px 0 4px}
.jbt-rate label{font-size:14px;color:var(--mute)}
.jbt-rate input[type=range]{width:100%;accent-color:var(--gold);height:32px}
.jbt-rate small{color:var(--mute);font-size:13px}
/* closing band */
.cta{background:var(--ink);color:#fff}
.cta .eyebrow{color:#e0b25a}
.cta .btn.gold{background:#fff;color:var(--ink);border-color:#fff}
@media(prefers-reduced-motion:reduce){.jbt-bill *{transition:none!important}}

/* at-a-glance row (replaces the separate overview banner) */
.jbt-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:56px var(--px) 0}
.jbt-facts>div{background:var(--card);border-radius:22px;padding:22px 24px;display:grid;gap:4px;align-content:start}
.jbt-facts b{font-size:clamp(22px,2.6vw,30px);letter-spacing:-.03em}
.jbt-facts span{color:var(--mute);font-size:14px}
@media(max-width:860px){.jbt-facts{grid-template-columns:1fr 1fr}}

/* tabs */
.jbt-tabs{padding-bottom:24px}
.jbt-tablist{display:flex;justify-content:center;gap:6px;margin:0 auto 20px;padding:5px;width:max-content;max-width:100%;background:#fff;border-radius:999px;box-shadow:0 0 0 1px var(--line);overflow-x:auto}
.jbt-tablist button{border:0;background:none;font:inherit;font-weight:600;font-size:15px;padding:10px 18px;border-radius:999px;color:var(--mute);cursor:pointer;white-space:nowrap;transition:background .25s,color .25s}
.jbt-tablist button.is-on{background:var(--ink);color:#fff}
.jbt-panels>[data-jbt-panel]{display:none;padding:0!important;margin:0!important}
.jbt-panels>[data-jbt-panel].is-on{display:block;animation:jbtIn .45s cubic-bezier(.2,.7,.2,1)}
.jbt-panels>[data-jbt-panel]>.section-head{display:none}
@keyframes jbtIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* tighter roadmap */
#roadmap{padding-top:56px}
#roadmap .roadmap-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
#roadmap .card{padding:18px}
#roadmap .card p{font-size:14px}
@media(max-width:860px){#roadmap .roadmap-grid{grid-template-columns:1fr 1fr}}
/* animated footer search links */
.jbt-marq{grid-column:1/-1;display:grid!important;gap:10px;overflow:hidden;padding:18px 0 4px;border-top:1px solid var(--line);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.jbt-marq-h{margin:0;text-align:center;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:700}
.jbt-marq-row{overflow:hidden}
.jbt-track{display:flex;gap:10px;width:max-content;animation:jbtMarq 42s linear infinite}
.jbt-rev .jbt-track{animation-direction:reverse;animation-duration:50s}
.jbt-marq-row:hover .jbt-track{animation-play-state:paused}
.jbt-dup{display:flex;gap:10px}
.jbt-marq a{white-space:nowrap;font-size:14px;font-weight:600;padding:9px 16px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line);color:var(--ink);text-decoration:none;transition:transform .25s,background .25s,color .25s}
.jbt-marq a:hover,.jbt-marq a:focus-visible{background:var(--ink);color:#fff;transform:translateY(-2px)}
@keyframes jbtMarq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.jbt-track{animation:none;flex-wrap:wrap;width:auto}.jbt-dup{display:none}.jbt-marq{-webkit-mask-image:none;mask-image:none}}

/* ===== page motion ===== */
html.jbt-m .jbt-a{opacity:0;transform:translate3d(0,34px,0) scale(.97);filter:blur(6px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1),filter .8s;transition-delay:calc(var(--i,0)*90ms);will-change:opacity,transform}
html.jbt-m .jbt-a.jbt-x{transform:translate3d(-40px,0,0)}
html.jbt-m .jbt-a.jbt-y{transform:translate3d(40px,0,0)}
html.jbt-m .jbt-a.jbt-on{opacity:1;transform:none;filter:none}
/* heading gold underline draws in */
.section-head h2{position:relative}
html.jbt-m .section-head h2::after{content:"";display:block;height:3px;width:0;margin:18px auto 0;border-radius:3px;background:linear-gradient(90deg,#d9a441,#9a6b1f);transition:width .9s .25s cubic-bezier(.2,.7,.2,1)}
html.jbt-m .section-head.jbt-on h2::after{width:72px}
/* card tilt + lift */
.module-grid>.card,.price-grid>*,.jbt-facts>div{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
@media(hover:hover){.module-grid>.card:hover,.price-grid>*:hover,.jbt-facts>div:hover{box-shadow:0 22px 50px -22px rgba(60,40,0,.28);transform:perspective(900px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) translateY(-6px)}}
/* floating gold orbs behind the page */
.jbt-orbs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.jbt-orbs i{position:absolute;border-radius:50%;filter:blur(90px);opacity:.12;will-change:transform}
.jbt-orbs i:nth-child(1){width:520px;height:520px;background:#f3d089;left:-140px;top:8%;animation:jbtDrift 22s ease-in-out infinite alternate}
.jbt-orbs i:nth-child(2){width:460px;height:460px;background:#ffe9c2;right:-120px;top:42%;animation:jbtDrift 28s ease-in-out infinite alternate-reverse}
.jbt-orbs i:nth-child(3){width:380px;height:380px;background:#e9c27a;left:35%;bottom:-160px;animation:jbtDrift 34s ease-in-out infinite alternate}
@keyframes jbtDrift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(70px,-50px,0) scale(1.15)}}
/* Ken Burns on the active showcase slide */
.real-showcase-slide.is-active img{animation:jbtKen 12s ease-out both}
@keyframes jbtKen{from{transform:scale(1)}to{transform:scale(1.045)}}
/* live-bill total pulse when numbers change */
.jbt-total.jbt-pulse{animation:jbtPulse .5s}
@keyframes jbtPulse{50%{box-shadow:0 0 0 8px rgba(217,164,65,.25)}}
@media(prefers-reduced-motion:reduce){html.jbt-m .jbt-a{opacity:1;transform:none;filter:none;transition:none}.jbt-orbs i,.real-showcase-slide.is-active img}
@media(max-width:860px){html.jbt-m .jbt-a.jbt-x,html.jbt-m .jbt-a.jbt-y{transform:translate3d(0,34px,0) scale(.97)}html.jbt-m .jbt-a.jbt-on{transform:none}}
html,body{overflow-x:clip}

/* tighter spacing now the page is shorter */
.section,.faq{padding-top:72px}
@media(min-width:900px){.jbt-facts{padding-top:40px}}
