/* Home hero visual: three slides with dots (markup in template-parts/hero-slides.php). */
.hs{--ink:#0b0b0c;--line:rgba(255,255,255,.14);--mute:rgba(255,255,255,.66);--faint:rgba(255,255,255,.42);
  --ok:#3ddc84;--bad:#ff3d4f;--amber:#ffb31a;--pink:#ff5fa2;
  --ring:linear-gradient(135deg,#ffc21a 0%,#ff5a1a 45%,#ff1f7a 100%);
  container:hs/inline-size;position:relative;width:100%;max-width:clamp(588px,88%,720px);margin-inline:auto;color:#fff;-webkit-font-smoothing:antialiased}
.hs *{box-sizing:border-box}
.hs svg.i{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.hs :where(a){color:inherit;text-decoration:none}
.hs a:focus-visible,.hs button:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:8px}
.hero-both .hero-art:has(> .hs){width:100%}

/* slides share one cell, so the hero keeps the height of the tallest */
.hs-slides{display:grid}
.hs-slide{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .5s,transform .5s,visibility 0s .5s}
.hs-slide.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .5s,transform .5s}
.hs-head{margin:0 0 2.6cqw;text-align:center;display:grid;gap:.5cqw}
.hs-eyebrow{font-size:clamp(11px,1.9cqw,13px);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ffb36b}
.hs-head b{font-size:clamp(19px,4.3cqw,26px);font-weight:800;letter-spacing:-.01em;line-height:1.15}

/* dots */
.hs-dots{display:flex;justify-content:center;align-items:center;gap:4px;margin-top:2.6cqw}
.hs-dots button{border:0;background:none;padding:8px 5px;cursor:pointer;line-height:0}
.hs-dots i{display:block;position:relative;overflow:hidden;width:9px;height:9px;border-radius:99px;background:rgba(255,255,255,.3);transition:width .35s,background .35s}
.hs-dots [aria-current=true] i{width:34px;background:rgba(255,255,255,.3)}
.hs-dots [aria-current=true] i::after{content:'';position:absolute;inset:0;background:var(--ring);transform-origin:left}
.hs.is-auto .hs-dots [aria-current=true] i::after{transform:scaleX(0);animation:hs-tick var(--dur,9s) linear forwards}
.hs.is-auto.is-held .hs-dots [aria-current=true] i::after{animation-play-state:paused}
@keyframes hs-tick{to{transform:scaleX(1)}}
.hs-dots .hs-play{margin-left:6px;color:var(--mute);font-size:14px;line-height:1;padding:6px}
.hs-dots .hs-play:hover{color:#fff}
.hs-play .r{display:none}
.hs-play.is-paused .p{display:none}
.hs-play.is-paused .r{display:block}

/* ---------- 1. without / with ---------- */
.hs-a-toggle{display:flex;justify-content:center;gap:4px;margin:0 auto 2.6cqw;padding:4px;border-radius:99px;background:rgba(0,0,0,.4);border:1px solid var(--line);width:max-content}
.hs-a-toggle button{font:inherit;font-size:clamp(12px,2cqw,13.5px);font-weight:700;padding:7px 15px;border-radius:99px;border:0;background:none;color:var(--mute);cursor:pointer}
.hs-a-toggle button[aria-pressed=true]{background:#fff;color:#141414}
.hs-a-toggle .hs-a-with[aria-pressed=true]{background:var(--ring)}
.hs-a-stage{position:relative;aspect-ratio:560/330;max-width:100%}
.hs-a-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hs-a-wires path{fill:none;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:opacity .6s}
.hs-a-messy path{stroke-width:2}
.hs-a-messy .m-off{stroke:#7b8098;stroke-dasharray:3 7;opacity:.6}
.hs-a-messy .m-rekey{stroke:var(--pink);opacity:.8}
.hs-a-messy .m-error{stroke:var(--bad);stroke-dasharray:60 18 4 18;opacity:.9}
.hs-a-messy .m-wait{stroke:var(--amber);stroke-dasharray:2 6;opacity:.85}
.hs-a-messy .m-dead{stroke:#5b6075;stroke-dasharray:14 12;opacity:.45}
.hs-a-messy .m-manual{stroke:#ff8a1a;opacity:.75}
.hs-a-tidy path{stroke:url(#hs-a-g);stroke-width:2.5;opacity:0}
.hs-a-tidy .trunk{stroke-width:7}
.hs-a-tidy .flow{stroke:#fff;stroke-width:2.5;stroke-dasharray:4 10;animation:hs-flow 1.1s linear infinite}
@keyframes hs-flow{to{stroke-dashoffset:-28}}
.hs-a-stage.is-with .hs-a-messy path{opacity:0}
.hs-a-stage.is-with .hs-a-tidy path{opacity:1}
.hs-a-stage.is-with .hs-a-tidy .flow{opacity:.75}

/* trading partner tiles: each broken its own way without SPICE™, all neat with it */
.hs-a-tp{position:absolute;left:0;width:22.9%;height:13%;display:flex;align-items:center;gap:5%;padding:0 3.5%;border-radius:1.8cqw;background:#fff;color:#141b33;
  font-size:2.55cqw;font-weight:700;line-height:1.1;box-shadow:0 .5cqw 1.6cqw rgba(0,0,0,.3);border:2px solid transparent;
  transition:transform .6s cubic-bezier(.2,.7,.2,1),background .5s,color .5s,border-color .5s,opacity .5s,filter .5s}
.hs-a-tp svg.i{font-size:3.4cqw;color:#ff5a1a;transition:color .5s}
.hs-a-tp span{min-width:0}
.hs-a-tp small{display:block;font-weight:600;font-size:2.05cqw;color:#6b7290}
.hs-a-tp em{position:absolute;right:-1.2cqw;top:-1.1cqw;font-style:normal;font-size:1.85cqw;font-weight:800;letter-spacing:.02em;text-transform:uppercase;padding:.35cqw .9cqw;border-radius:99px;white-space:nowrap;transition:opacity .4s,transform .4s}
.hs-a-tp .good{display:grid;place-items:center;width:3.2cqw;height:3.2cqw;padding:0;right:-1cqw;top:-1cqw;background:var(--ok);color:#06210f;opacity:0;transform:scale(.5)}
.hs-a-tp .good svg.i{font-size:2cqw;stroke-width:3.2}
.hs-a-tp:hover{transform:translateX(.6cqw) rotate(0)}
.s-off{background:#2b3046;color:#9aa0b6;border:2px dashed #6b7290;opacity:.75}
.s-off svg.i,.s-off small{color:#7b8098}
.s-off .bad{background:#4a4f66;color:#d5d8e5}
.s-rekey{background:#ffe1ee;transform:rotate(-2.5deg) translateX(.8cqw)}
.s-rekey .bad{background:var(--pink);color:#fff}
.s-error{border-color:var(--bad);box-shadow:0 0 1.6cqw rgba(255,61,79,.45)}
.s-error svg.i{color:var(--bad)}
.s-error .bad{background:var(--bad);color:#fff}
.s-wait{background:#fff4d9;transform:rotate(1.8deg) translateX(1.6cqw)}
.s-wait .bad{background:var(--amber);color:#2a1700}
.s-dead{background:#3a3f52;color:#7b8098;filter:grayscale(1);opacity:.6}
.s-dead svg.i,.s-dead small{color:#646a80}
.s-dead .bad{background:#23273a;color:#9aa0b6;border:1px solid #4a4f66}
.s-manual{transform:rotate(2deg) translateX(-.6cqw)}
.s-manual .bad{background:#ff8a1a;color:#2a1200}
.hs-a-stage.is-with .hs-a-tp{background:#fff;color:#141b33;border-color:transparent;opacity:1;filter:none;transform:none;box-shadow:0 .5cqw 1.6cqw rgba(0,0,0,.3)}
.hs-a-stage.is-with .hs-a-tp svg.i{color:#ff5a1a}
.hs-a-stage.is-with .hs-a-tp small{color:#6b7290}
.hs-a-stage.is-with .hs-a-tp .bad{opacity:0;transform:scale(.6)}
.hs-a-stage.is-with .hs-a-tp .good{opacity:1;transform:none}
.hs-a-stage.is-with .hs-a-tp:nth-of-type(2) .good{transition-delay:.08s}
.hs-a-stage.is-with .hs-a-tp:nth-of-type(3) .good{transition-delay:.16s}
.hs-a-stage.is-with .hs-a-tp:nth-of-type(4) .good{transition-delay:.24s}
.hs-a-stage.is-with .hs-a-tp:nth-of-type(5) .good{transition-delay:.32s}
.hs-a-stage.is-with .hs-a-tp:nth-of-type(6) .good{transition-delay:.4s}

.hs-a-hub{position:absolute;left:41.4%;top:32%;width:23.2%;height:36%;display:grid;place-items:center;align-content:center;gap:6%;border-radius:2.6cqw;
  background:linear-gradient(var(--ink),var(--ink)) padding-box,var(--ring) border-box;border:.55cqw solid transparent;
  box-shadow:0 0 2cqw rgba(255,110,30,.55),0 0 5cqw rgba(255,40,120,.3);opacity:0;transform:scale(.8);transition:opacity .6s,transform .6s cubic-bezier(.2,.7,.2,1)}
.hs-a-hub .hs-logo{width:72%;height:auto;display:block}
.hs-a-hub small{font-size:1.6cqw;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.hs-a-stage.is-with .hs-a-hub{opacity:1;transform:none}
.hs-a-erp{position:absolute;left:79.6%;top:35%;width:20.4%;height:30%;display:grid;place-items:center;align-content:center;gap:5%;border-radius:2.2cqw;background:#fff;color:#141b33;font-weight:800;font-size:3.1cqw;box-shadow:0 .6cqw 2cqw rgba(0,0,0,.35)}
.hs-a-erp svg.i{font-size:5.4cqw;color:#2f5aa8}
.hs-a-count{position:absolute;left:61%;bottom:-2%;transform:translateX(-50%);font-size:2.3cqw;font-weight:700;white-space:nowrap;padding:.7cqw 1.8cqw;border-radius:99px;background:#3a1219;color:#ff8a95;transition:background .4s,color .4s}
.hs-a-count .good{display:none}
.hs-a-stage.is-with .hs-a-count{background:rgba(61,220,132,.14);color:var(--ok)}
.hs-a-stage.is-with .hs-a-count .bad{display:none}
.hs-a-stage.is-with .hs-a-count .good{display:inline}

/* ---------- 2. anything in, clean data out ---------- */
.hs-b-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1.05fr) auto minmax(0,1.1fr);align-items:center;gap:1.6cqw}
.hs-b-label{display:block;margin-bottom:1.4cqw;font-size:clamp(10px,1.8cqw,11.5px);font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#ff9a4a}
.hs-b-in{list-style:none;margin:0;padding:0;display:grid;gap:1.2cqw}
.hs-b-in button{width:100%;display:flex;align-items:center;gap:1.6cqw;padding:1.5cqw 1.6cqw;border-radius:1.8cqw;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;
  font:inherit;font-size:clamp(11px,2.1cqw,13px);font-weight:600;text-align:left;line-height:1.2;cursor:pointer;transition:background .25s,border-color .25s,transform .25s,color .25s}
.hs-b-in button svg.i{font-size:clamp(14px,2.9cqw,17px);color:#ffb36b}
.hs-b-in button small{display:block;font-size:clamp(9.5px,1.75cqw,11px);font-weight:500;color:var(--faint)}
.hs-b-in button[aria-pressed=true]{background:#fff;color:#141b33;border-color:#fff;transform:translateX(.8cqw)}
.hs-b-in button[aria-pressed=true] small{color:#6b7290}
.hs-b-arrow{display:grid;place-items:center;color:#ff5a3d;font-size:clamp(16px,3.6cqw,22px)}
.hs-b-arrow svg.i{stroke-width:2.6}
.hs-b-core{display:block;padding:2.4cqw 2.2cqw 2cqw;border-radius:2.6cqw;background:linear-gradient(var(--ink),var(--ink)) padding-box,var(--ring) border-box;border:3px solid transparent;box-shadow:0 0 18px rgba(255,110,30,.4),0 0 44px rgba(255,40,120,.2)}
.hs-b-core .hs-logo{display:block;width:62%;height:auto;margin:0 auto 1.8cqw}
.hs-b-steps{list-style:none;margin:0;padding:0;display:grid;gap:1.2cqw}
.hs-b-steps li{display:flex;align-items:center;gap:1.4cqw;font-size:clamp(11px,2.1cqw,13px);line-height:1.25;color:var(--faint);transition:color .3s}
.hs-b-steps i{flex:none;display:grid;place-items:center;width:clamp(16px,3.3cqw,20px);height:clamp(16px,3.3cqw,20px);border-radius:50%;border:2px solid rgba(255,255,255,.25);font-style:normal;transition:background .3s,border-color .3s}
.hs-b-steps i svg.i{font-size:11px;opacity:0;stroke-width:3.2;color:#06210f}
.hs-b-steps li.on{color:#fff}
.hs-b-steps li.on i{background:var(--ok);border-color:var(--ok)}
.hs-b-steps li.on i svg.i{opacity:1}
.hs-b-out{display:grid;gap:.7cqw;padding:2cqw 2.2cqw;border-radius:2.2cqw;background:#fff;color:#141b33;box-shadow:0 8px 24px rgba(0,0,0,.35);transition:opacity .35s,transform .35s}
.hs-b-out.wait{opacity:.35;transform:scale(.97)}
.hs-b-out-head{display:flex;justify-content:space-between;align-items:center;gap:1cqw;margin-bottom:.6cqw}
.hs-b-out-head b{font-size:clamp(11.5px,2.2cqw,13.5px)}
.hs-b-out-head em{display:inline-flex;align-items:center;gap:4px;font-style:normal;font-size:clamp(9.5px,1.7cqw,11px);font-weight:800;text-transform:uppercase;padding:3px 8px;border-radius:99px;background:#e3f8ec;color:#137a43}
.hs-b-row{display:flex;justify-content:space-between;gap:1cqw;font-size:clamp(10.5px,1.95cqw,12px)}
.hs-b-row span{color:#6b7290}
.hs-b-src{margin-top:.6cqw;font-size:clamp(9.5px,1.8cqw,11px);color:#6b7290}
.hs-b-src b{color:#141b33}

/* ---------- 3. both sides ---------- */
.hs-c-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(12px,.1fr) minmax(0,.72fr) minmax(12px,.1fr) minmax(0,1.12fr);align-items:center}
.hs-c-side{position:relative;display:grid;justify-items:start;gap:.8cqw;padding:3cqw 2.8cqw;border-radius:2.8cqw;background:linear-gradient(160deg,rgba(255,154,26,.22),rgba(255,154,26,.06) 55%) ,#171d38;border:1.5px solid rgba(255,154,26,.6);box-shadow:0 0 2.4cqw rgba(255,130,30,.22),inset 0 1px 0 rgba(255,255,255,.08);transition:transform .25s,box-shadow .25s}
.hs-c-sell{background:linear-gradient(200deg,rgba(255,31,143,.22),rgba(255,31,143,.06) 55%),#171d38;border-color:rgba(255,31,143,.6);box-shadow:0 0 2.4cqw rgba(255,31,143,.22),inset 0 1px 0 rgba(255,255,255,.08)}
.hs-c-side:hover,.hs-c-side:focus-visible{transform:translateY(-3px);box-shadow:0 0 4cqw rgba(255,90,40,.4),inset 0 1px 0 rgba(255,255,255,.1)}
.hs-c-ico{display:grid;place-items:center;width:clamp(30px,6.4cqw,42px);height:clamp(30px,6.4cqw,42px);border-radius:1.8cqw;background:linear-gradient(160deg,#ffb02e,#ff6a00);font-size:clamp(15px,3.2cqw,20px);margin-bottom:.4cqw}
.hs-c-sell .hs-c-ico{background:linear-gradient(160deg,#ff4a8a,#d3105f)}
.hs-c-side b{font-size:clamp(14px,2.9cqw,19px);font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.hs-c-proc{font-size:clamp(10.5px,1.95cqw,12.5px);color:var(--mute)}
.hs-c-docs{display:grid;gap:.8cqw;width:100%;margin-top:.8cqw}
.hs-c-docs>span{font-size:clamp(10.5px,2.05cqw,12.5px);font-weight:600;padding:1cqw 1.4cqw;border-radius:1.2cqw;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}
.hs-c-docs i{font-style:normal;color:#ff9a4a;font-weight:800}
.hs-c-sell .hs-c-docs i{color:#ff6fae}
.hs-c-side em{margin-top:.6cqw;font-style:normal;font-size:clamp(10px,1.85cqw,12px);font-weight:700;color:#ffb36b}
.hs-c-sell em{color:#ff8cc4}
.hs-c-wire{display:block;width:100%;height:40px;overflow:visible}
.hs-c-wire path{fill:none;stroke:#ff9a1a;stroke-width:2;vector-effect:non-scaling-stroke;opacity:.6}
.hs-c-flip path{stroke:#ff1f8f}
.hs-c-wire .p{stroke:#fff;opacity:.9;stroke-dasharray:6 54;animation:hs-flow 1.4s linear infinite}
.hs-c-flip .p{animation-direction:reverse}
.hs-c-mid{align-self:stretch;display:flex;flex-direction:column;align-items:center}
.hs-c-brand{display:grid;justify-items:center;gap:1cqw;width:100%}
.hs-c-hub{display:grid;justify-items:center;gap:1.6cqw;width:100%;padding:3cqw 1.6cqw 2cqw;border-radius:2.8cqw;background:linear-gradient(var(--ink),var(--ink)) padding-box,var(--ring) border-box;border:.5cqw solid transparent;box-shadow:0 0 2cqw rgba(255,110,30,.5),0 0 5cqw rgba(255,40,120,.25)}
.hs-c-hub .hs-logo{width:86%;height:auto;display:block}
.hs-c-hub small{font-size:clamp(9px,1.6cqw,11px);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.hs-c-down{width:2px;height:2.2cqw;background:linear-gradient(#2f5aa8,#ff5a3d)}
.hs-c-up{flex:1;min-height:2cqw;width:2px;margin-bottom:-2.6cqw;background:linear-gradient(#ff5a3d,rgba(255,90,60,.6))}
.hs-c-erp{display:inline-flex;align-items:center;gap:1cqw;padding:1.1cqw 2cqw;border-radius:99px;background:#fff;color:#141b33;font-weight:800;font-size:clamp(11px,2.1cqw,13px)}
.hs-c-erp svg.i{color:#2f5aa8;font-size:1.2em}
  background:linear-gradient(90deg,rgba(255,154,26,.14),rgba(255,31,143,.14));border:1px solid rgba(255,120,80,.35);font-size:clamp(10.5px,2cqw,13px);transition:background .25s}

/* narrow columns: stack the flows */
@container hs (max-width:520px){
  .hs-b-flow{grid-template-columns:1fr}
  .hs-b-arrow{transform:rotate(90deg);height:20px}
  .hs-b-in{grid-template-columns:1fr 1fr}
  .hs-b-in li:last-child{grid-column:1/-1}
  .hs-b-core .hs-logo{width:40%}
  .hs-c-grid{grid-template-columns:1fr 1fr;gap:12px}
  .hs-c-wire{display:none}
  .hs-c-mid{grid-column:1/-1;grid-row:1}
  .hs-c-hub{max-width:190px;padding:14px 12px 12px}
  .hs-c-hub .hs-logo{width:72%}
  .hs-a-tp em.bad{font-size:2.2cqw}
}
@media (prefers-reduced-motion:reduce){.hs *,.hs *::after{animation:none!important;transition:none!important}}

/* SpicY™ AI: tagged where it does the work (reading PDFs, email and spreadsheets) and built into the platform */
.hs-b-ai{display:flex;width:max-content;visibility:hidden;align-items:center;gap:4px;margin:-.6cqw auto 1.6cqw;padding:3px 9px;border-radius:99px;font-size:clamp(9px,1.6cqw,10.5px);font-weight:800;letter-spacing:.03em;white-space:nowrap;background:linear-gradient(90deg,#ff9a1a,#ff1f8f);color:#141414}
.hs-b-ai svg.i{font-size:1.1em;stroke-width:2.4}
.hs-b-core.is-ai .hs-b-ai{visibility:visible}
.hs-c-ai{display:inline-flex;align-items:center;gap:.8cqw;padding:.7cqw 1.4cqw;border-radius:99px;font-size:clamp(9px,1.65cqw,11px);font-weight:700;white-space:nowrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,140,80,.45);color:#ffd0a8;transition:background .2s}
.hs-c-ai svg.i{font-size:1.15em;color:#ff9a4a}
.hs-c-ai:hover{background:rgba(255,140,80,.2)}

/* Slide 1 countdown: "SPICE™ in 3, 2, 1", then SPICE™ switches on, so the broken view reads as the before picture */
.hs-a-cd{position:absolute;right:0;top:4%;display:flex;align-items:center;gap:1.4cqw;padding:.9cqw .9cqw .9cqw 2cqw;border-radius:99px;
  background:rgba(11,11,12,.85);border:1px solid rgba(255,140,80,.55);box-shadow:0 0 2.4cqw rgba(255,90,40,.35);
  font-size:clamp(12px,2.6cqw,16px);font-weight:700;color:#ffd0a8;white-space:nowrap;opacity:0;transform:translateY(-6px);transition:opacity .35s,transform .35s;pointer-events:none}
.hs-a-cd.is-on{opacity:1;transform:none}
.hs-a-cd b{display:grid;place-items:center;width:clamp(30px,6.4cqw,44px);height:clamp(30px,6.4cqw,44px);border-radius:50%;background:var(--ring);color:#141414;font-size:1.25em;font-weight:800}
.hs-a-cd b.pop{animation:hs-pop .45s cubic-bezier(.2,.7,.2,1)}
@keyframes hs-pop{0%{transform:scale(1.6);opacity:0}100%{transform:none;opacity:1}}
.hs-a-stage.is-with .hs-a-cd{opacity:0}

/* Slide 3 logistics: a band under both sides, joined up to SPICE™ (Jeffrey, 2026-10-24).
   Inbound freight sits under buying, outbound freight under selling. */
.hs-c-log{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);align-items:stretch;margin-top:2.6cqw;border-radius:99px;
  background:linear-gradient(90deg,rgba(255,154,26,.22),rgba(255,90,60,.1) 50%,rgba(255,31,143,.22)),#171d38;border:1.5px solid rgba(255,120,80,.55);box-shadow:0 0 2.4cqw rgba(255,90,60,.2)}
.hs-c-log::before,.hs-c-log::after{content:'';position:absolute;bottom:100%;width:2px;height:2.6cqw;background:#ff9a1a}
.hs-c-log::before{left:17.7%}
.hs-c-log::after{left:82.3%;background:#ff1f8f}
.hs-c-freight,.hs-c-logmain{display:flex;align-items:center;gap:1.2cqw;padding:1.3cqw 1.8cqw;font-size:clamp(9.5px,1.8cqw,12px);line-height:1.25;color:var(--mute);transition:background .2s}
.hs-c-freight b,.hs-c-logmain b{display:block;color:#fff;font-size:clamp(10.5px,2cqw,13px);font-weight:800}
.hs-c-freight i{font-style:normal;font-weight:800;font-size:1.3em;color:#ff9a4a}
.hs-c-out{justify-content:flex-end;text-align:right}
.hs-c-out i{color:#ff6fae}
.hs-c-in{border-radius:99px 0 0 99px}
.hs-c-out{border-radius:0 99px 99px 0}
.hs-c-logmain{justify-content:center;border-inline:1px solid rgba(255,255,255,.14);text-align:left}
.hs-c-logmain svg.i{font-size:clamp(16px,3.2cqw,22px);color:#ff9a4a}
.hs-c-logmain b{text-transform:uppercase;letter-spacing:.06em}
.hs-c-logmain em{display:block;margin-top:.3cqw;font-style:normal;font-weight:700;color:#ffb36b;white-space:nowrap}
.hs-c-freight:hover,.hs-c-logmain:hover,.hs-c-freight:focus-visible,.hs-c-logmain:focus-visible{background:rgba(255,255,255,.08)}
@container hs (max-width:520px){
  .hs-c-up{display:none}
  .hs-c-log{grid-template-columns:1fr;border-radius:16px;margin-top:14px}
  .hs-c-log::before,.hs-c-log::after{display:none}
  .hs-c-in,.hs-c-out{border-radius:0}
  .hs-c-logmain{border-inline:0;border-block:1px solid rgba(255,255,255,.14);flex-wrap:wrap}
  .hs-c-out{justify-content:flex-start;text-align:left}
}

/* 0.25 (Spice, 2026-10-27): SpicY™ inside the SPICE™ box on every slide */
.hs-a-ai{display:inline-flex;align-items:center;justify-content:center;gap:.6cqw;max-width:100%;padding:.6cqw 1.1cqw;border-radius:99px;font-size:clamp(8px,1.4cqw,10.5px);font-weight:700;line-height:1.15;text-align:center;white-space:nowrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,140,80,.5);color:#ffd0a8;transition:background .2s}
.hs-a-ai svg.i{font-size:1.2em;color:#ff9a4a}
.hs-a-ai:hover{background:rgba(255,140,80,.22)}
/* slide 2: SpicY™ always shown in the box; "Read by SpicY™ AI" when a document is being read */
.hs-b-ai{visibility:visible}
.hs-b-ai-read{display:none}
.hs-b-core.is-ai .hs-b-ai-on{display:none}
.hs-b-core.is-ai .hs-b-ai-read{display:inline}
@container hs (max-width:519px){.hs-b-ai{width:auto;max-width:100%;white-space:normal;text-align:center;justify-content:center;line-height:1.2;font-size:8.5px;padding:3px 6px}}
/* SPICE™ box contents as one centred stack (Sean, 2026-10-27): logo, PLATFORM, then the SpicY™ pill, with even
   spacing and the pill always inside the box. Padding is in cqw: a % here would be measured from the whole visual. */
.hs-a-hub{top:26%;height:48%;grid-template-columns:minmax(0,1fr);justify-items:center;align-content:center;gap:1.3cqw;padding:1.2cqw 1.4cqw}
.hs-a-brand{display:grid;justify-items:center;gap:.5cqw;width:100%}
.hs-a-hub .hs-logo{width:74%;margin-inline:auto}
.hs-c-hub{grid-template-columns:minmax(0,1fr);justify-items:center;padding-inline:1.6cqw}
.hs-c-brand .hs-logo,.hs-c-hub .hs-logo{margin-inline:auto}
.hs-a-ai,.hs-c-ai{justify-self:center;max-width:100%}
.hs-c-ai{font-size:clamp(8px,1.5cqw,11px)}
/* phones: the pill keeps to "SpicY™ AI" (and may wrap) so it never reaches the box edge */
@container hs (max-width:519px){
  .hs-ai-more{display:none}
  .hs-a-hub{gap:1.6cqw;padding:1.6cqw 1.2cqw}
  .hs-a-ai,.hs-c-ai{white-space:normal;font-size:8px;padding:2px 6px;gap:3px;line-height:1.1}
  .hs-a-ai svg.i{display:none}
}
/* letter-spaced labels carry trailing space after the last letter; balance it so PLATFORM reads centred */
.hs-a-hub small{padding-left:.14em}
.hs-c-hub small{padding-left:.16em}
/* slide 3: even space above and below the stack; on phones the box is ~74px wide, so keep the pill to one line */
.hs-c-hub{padding-block:2.4cqw}
@container hs (max-width:519px){
  .hs-c-hub{padding:8px 5px}
  .hs-c-ai{white-space:nowrap;padding:2px 5px}
  .hs-c-ai svg.i{display:none}
  .hs-c-hub small{font-size:7.5px;letter-spacing:.1em;padding-left:.1em}
}
