/* ==========================================================================
   Full Signal: styles (2026 redesign)
   Most layout lives in inline styles in the page markup, as designed. This
   file holds the shared classes, the header, and the rules that adapt the
   layout to tablet and phone widths. The phone rules match on the inline
   style values, so if a layout value changes in the markup, check its
   matching rule in the RESPONSIVE section below.
   ========================================================================== */

/* ---- Shared classes ------------------------------------------------------ */
body{margin:0;background:#07080A;color:#F2F5F8;font-family:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:#36C4F0;text-decoration:none}a:hover{color:#8ADDF7}
::selection{background:rgba(54,196,240,.3);color:#fff}
:focus-visible{outline:2px solid #36C4F0;outline-offset:3px}
button{font:inherit;color:inherit}
h1,h2,h3{font-family:'Outfit',ui-sans-serif,system-ui,sans-serif}
.fs-said{font-family:'Inter',sans-serif;font-style:italic;font-weight:400;letter-spacing:-.01em}
.fs-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font-weight:600;font-size:15px;letter-spacing:-.005em;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .3s,background-color .25s,border-color .25s;white-space:nowrap;box-sizing:border-box}
.fs-btn-primary,.fs-btn-primary:hover{color:#031019}
.fs-btn-primary{background:#36C4F0;box-shadow:0 0 0 1px rgba(54,196,240,.5),0 10px 32px -10px rgba(54,196,240,.65)}
.fs-btn-primary:hover{background:#5ED1F4;transform:translateY(-1px);box-shadow:0 0 0 1px rgba(94,209,244,.7),0 16px 44px -10px rgba(54,196,240,.85)}
.fs-btn-ghost,.fs-btn-ghost:hover{color:#F2F5F8}
.fs-btn-ghost{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.02)}
.fs-btn-ghost:hover{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.06)}
.fs-arr{transition:transform .25s}
.fs-btn:hover .fs-arr,.fs-more:hover .fs-arr{transform:translateX(3px)}
.fs-navlink{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:500;color:#9BA5B3;transition:color .2s,background-color .2s}
.fs-navlink:hover{color:#F2F5F8;background:rgba(255,255,255,.05)}
.fs-navlink-on,.fs-navlink-on:hover{color:#F2F5F8;background:rgba(255,255,255,.08)}
.fs-kick{font-family:'Inter',sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.17em;text-transform:uppercase;color:#36C4F0;display:flex;align-items:center;gap:12px;margin:0}
.fs-kick::before{content:"";width:18px;height:1px;background:rgba(54,196,240,.55)}
.fs-lab{font-family:'Inter',sans-serif;font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#79828F}
.fs-rv{animation:fs-rise linear both;animation-timeline:view();animation-range:entry 5% cover 30%}
@keyframes fs-rise{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}
@supports not (animation-timeline:view()){.fs-rv{animation:fs-fade .9s ease both}}
@keyframes fs-fade{from{opacity:0}to{opacity:1}}
@keyframes fs-in{from{opacity:0;transform:translateY(18px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.fs-in{animation:fs-in 1.1s cubic-bezier(.2,.7,.2,1) both}
.fs-d1{animation-delay:.1s}.fs-d2{animation-delay:.22s}.fs-d3{animation-delay:.36s}
@keyframes fs-pulse{0%{box-shadow:0 0 0 0 rgba(54,196,240,.6)}70%{box-shadow:0 0 0 10px rgba(54,196,240,0)}100%{box-shadow:0 0 0 0 rgba(54,196,240,0)}}
.fs-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#36C4F0;animation:fs-pulse 2.4s infinite}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
.fs-count{counter-reset:n var(--n);animation:fs-count 2.4s cubic-bezier(.16,.8,.2,1) .6s both}
.fs-count::before{content:counter(n)}
@keyframes fs-count{from{--n:0}to{--n:var(--to)}}
.fs-c64{--to:64}.fs-c85{--to:85}.fs-c50{--to:50}
.fs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0}
.fs-lever{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.fs-lever:active{cursor:grabbing}
.fs-lever-wrap:focus-within .fs-knob-ring{stroke:#36C4F0;stroke-opacity:1}
@keyframes fs-hint{0%,100%{opacity:0;transform:translateX(-6px)}40%,60%{opacity:1;transform:none}}
.fs-hint{animation:fs-hint 2.2s ease-in-out infinite}
@keyframes fs-stage{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fs-stage{animation:fs-stage .5s cubic-bezier(.2,.7,.2,1) both}
.fs-persona{display:flex;align-items:center;gap:14px;flex:1;min-height:72px;padding:14px 18px;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:#0B0D11;cursor:pointer;text-align:left;font-size:15px;font-weight:600;color:#9BA5B3;transition:border-color .25s,background-color .25s,color .25s;box-sizing:border-box}
.fs-persona:hover{color:#F2F5F8;border-color:rgba(255,255,255,.22)}
.fs-persona-on,.fs-persona-on:hover{color:#F2F5F8;border-color:rgba(54,196,240,.6);background:rgba(54,196,240,.07)}
.fs-pico{flex:none;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.1);color:#79828F;transition:color .25s,border-color .25s,background-color .25s,box-shadow .25s}
.fs-persona-on .fs-pico{color:#031019;background:#36C4F0;border-color:#36C4F0;box-shadow:0 0 24px rgba(54,196,240,.5)}
.fs-sym{display:flex;align-items:flex-start;gap:16px;width:100%;text-align:left;padding:18px 20px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.015);cursor:pointer;font-size:16px;line-height:1.45;color:#C3CBD5;transition:border-color .25s,background-color .25s,color .25s,transform .25s;box-sizing:border-box}
.fs-sym:hover{border-color:rgba(255,255,255,.22);color:#F2F5F8;transform:translateX(3px)}
.fs-sym-on,.fs-sym-on:hover{border-color:rgba(54,196,240,.55);background:rgba(54,196,240,.08);color:#F2F5F8}
.fs-box{flex:none;width:22px;height:22px;border-radius:7px;border:1.5px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;margin-top:1px;transition:background-color .25s,border-color .25s;box-sizing:border-box}
.fs-sym-on .fs-box{background:#36C4F0;border-color:#36C4F0}
.fs-box svg{opacity:0;transform:scale(.5);transition:opacity .25s,transform .25s}
.fs-sym-on .fs-box svg{opacity:1;transform:none}
@keyframes fs-diag{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.fs-diag{animation:fs-diag .55s cubic-bezier(.2,.7,.2,1) both}
.fs-out{display:flex;align-items:center;gap:18px;width:100%;text-align:left;min-height:66px;padding:16px 0;background:none;border:0;border-bottom:1px solid rgba(255,255,255,.08);cursor:pointer;color:#79828F;font-family:'Outfit',sans-serif;font-size:19px;font-weight:500;letter-spacing:-.01em;transition:color .25s}
.fs-out:hover{color:#C3CBD5}
.fs-out-on,.fs-out-on:hover{color:#F2F5F8}
.fs-num{flex:none;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.12em;color:#4E5663;transition:color .25s}
.fs-out-on .fs-num{color:#36C4F0}
.fs-bar{margin-left:auto;flex:none;width:16px;height:1px;background:currentColor;opacity:.4;transition:width .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.fs-out-on .fs-bar{width:44px;opacity:1;background:#36C4F0}
@keyframes fs-panel{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.fs-panel{animation:fs-panel .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes fs-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.fs-prog{transform-origin:left;animation:fs-prog 6s linear both}
.fs-eng{position:relative;display:flex;flex-direction:column;border-radius:22px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,#0F1217 0%,#0A0C10 100%);transition:border-color .35s,transform .35s cubic-bezier(.2,.7,.2,1),opacity .35s,box-shadow .35s;box-sizing:border-box}
.fs-eng:hover{border-color:rgba(255,255,255,.2);transform:translateY(-4px)}
.fs-eng .fs-h3{color:#F2F5F8;transition:color .25s}
.fs-eng:hover{border-color:rgba(54,196,240,.55);box-shadow:0 0 0 1px rgba(54,196,240,.2),0 40px 90px -40px rgba(54,196,240,.5)}
.fs-eng:hover .fs-h3{color:#36C4F0}
.fs-best{display:flex;flex-direction:column;gap:8px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}
.fs-eng:hover .fs-cta{background:#36C4F0;border-color:#36C4F0;color:#031019;box-shadow:0 10px 32px -10px rgba(54,196,240,.65)}
.fs-link{position:absolute;left:100%;margin-left:2px;top:50%;width:20px;height:20px;margin-top:-10px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#07080A;border:1px solid rgba(54,196,240,.45);color:#36C4F0;z-index:2}
.fs-more{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600}
@keyframes fs-spin{to{transform:rotate(360deg)}}
.fs-orbit{transform-box:view-box;transform-origin:320px 260px;animation:fs-spin 80s linear infinite}
@keyframes fs-dash{to{stroke-dashoffset:-56}}
.fs-spoke{stroke-dasharray:3 11;animation:fs-dash 2.6s linear infinite}
.fs-node .fs-halo{transition:r .35s,opacity .35s}
.fs-node:hover .fs-halo{r:22;opacity:.35}
.fs-node text{transition:fill .3s}
.fs-node:hover text{fill:#F2F5F8}
.fs-model{display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.015);font-size:14px;font-weight:500;color:#C3CBD5;cursor:default;transition:border-color .3s,box-shadow .3s,color .3s,background-color .3s}
.fs-model svg{color:#79828F;transition:color .3s,filter .3s}
.fs-model:hover{border-color:rgba(54,196,240,.55);color:#F2F5F8;background:rgba(54,196,240,.06);box-shadow:0 0 0 1px rgba(54,196,240,.15),0 0 28px -4px rgba(54,196,240,.55)}
.fs-model:hover svg{color:#36C4F0;filter:drop-shadow(0 0 6px rgba(54,196,240,.8))}
.fs-tq{transition:border-color .3s,transform .3s cubic-bezier(.2,.7,.2,1)}
.fs-tq:hover{border-color:rgba(54,196,240,.35);transform:translateY(-3px)}
.fs-faq{border-bottom:1px solid rgba(255,255,255,.08)}
.fs-fq{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;min-height:76px;padding:20px 0;background:none;border:0;text-align:left;cursor:pointer;font-family:'Outfit',sans-serif;font-size:20px;font-weight:500;letter-spacing:-.01em;color:#F2F5F8}
.fs-pl{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;color:#9BA5B3;transition:transform .4s cubic-bezier(.2,.7,.2,1),border-color .2s,color .2s;box-sizing:border-box}
.fs-fq:hover .fs-pl{border-color:#36C4F0;color:#36C4F0}
.fs-open .fs-pl{transform:rotate(45deg);border-color:#36C4F0;color:#36C4F0}
.fs-ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.2,.7,.2,1)}
.fs-open .fs-ans{grid-template-rows:1fr}
.fs-ans>div{overflow:hidden}
.fs-ring{position:absolute;left:50%;top:50%;width:900px;height:900px;border:1px solid rgba(54,196,240,.28);border-radius:50%;opacity:0;transform:translate(-50%,-50%) scale(.15);animation:fs-ring 7.5s cubic-bezier(.2,.6,.3,1) infinite;pointer-events:none}
@keyframes fs-ring{0%{transform:translate(-50%,-50%) scale(.12);opacity:0}12%{opacity:1}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}
.fs-r2{animation-delay:2.5s}.fs-r3{animation-delay:5s}
.fs-foot a{color:#9BA5B3}.fs-foot a:hover{color:#F2F5F8}
.fs-opt{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:64px;padding:16px 20px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02);cursor:pointer;text-align:left;font-size:16px;font-weight:500;line-height:1.35;color:#C3CBD5;transition:border-color .2s,background-color .2s,color .2s,transform .2s;box-sizing:border-box}
.fs-opt:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.045);color:#F2F5F8}
.fs-opt .fs-oarr{flex:none;color:#4E5663;transition:transform .25s,color .25s}
.fs-opt:hover .fs-oarr{transform:translateX(3px);color:#36C4F0}
.fs-opt-on,.fs-opt-on:hover{border-color:#36C4F0;background:rgba(54,196,240,.1);color:#F2F5F8;box-shadow:0 0 0 1px rgba(54,196,240,.35),0 0 30px -8px rgba(54,196,240,.6)}
.fs-opt-on .fs-oarr{color:#36C4F0;transform:translateX(3px)}
.fs-back{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0;background:none;border:0;cursor:pointer;font-size:13.5px;font-weight:500;color:#79828F;transition:color .2s}
.fs-back:hover{color:#F2F5F8}
@keyframes fs-qin{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.fs-qin{animation:fs-qin .45s cubic-bezier(.2,.7,.2,1) both}
.fs-dx{margin:0;font-size:16.5px;line-height:1.65;color:#C3CBD5}
.fs-con{display:flex;gap:12px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);font-size:15.5px;line-height:1.5;color:#C3CBD5}
.fs-field{width:100%;box-sizing:border-box;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#07080A;color:#F2F5F8;font:inherit;font-size:15px;transition:border-color .2s,box-shadow .2s}
.fs-field::placeholder{color:#5C6470}
.fs-field:focus{outline:none;border-color:#36C4F0;box-shadow:0 0 0 3px rgba(54,196,240,.18)}
.fs-ans-sum summary{cursor:pointer;font-size:13.5px;font-weight:500;color:#9BA5B3;list-style:none;display:inline-flex;align-items:center;gap:8px;min-height:32px}
.fs-ans-sum summary::-webkit-details-marker{display:none}
.fs-ans-sum summary::before{content:"+";display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1px solid rgba(255,255,255,.2);font-size:12px;line-height:1}
.fs-ans-sum[open] summary::before{content:"\2212"}
.fs-qdot{flex:1;height:4px;border-radius:4px;background:rgba(255,255,255,.08);transition:background-color .4s,box-shadow .4s}
.fs-qdot-on{background:#36C4F0}
.fs-qdot-now{background:rgba(54,196,240,.35);animation:fs-pulse 2.4s infinite}
.fs-qdot-done{background:#B48CFF;box-shadow:0 0 12px rgba(180,140,255,.6)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.fs-count{--n:var(--to)}}

/* ---- Page furniture ------------------------------------------------------ */
html{scroll-padding-top:104px;-webkit-text-size-adjust:100%}
.fs-skip{position:absolute;left:16px;top:-60px;z-index:100;padding:10px 16px;border-radius:999px;background:#36C4F0;color:#031019;font-weight:600;font-size:14px;transition:top .2s}
.fs-skip:focus{top:12px;color:#031019}
.fs-navtoggle{display:none;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.02);color:#F2F5F8;font-size:14px;font-weight:600;cursor:pointer}
.fs-navtoggle:hover{border-color:rgba(255,255,255,.32)}
.fs-navbook{display:none!important}
.fs-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.fs-formerr{margin:0;font-size:14.5px;line-height:1.5;color:#FF9C8A}
.fs-btn[disabled]{opacity:.65;cursor:progress!important;transform:none!important}

/* Touch screens have no hover, so site.js adds .fs-lit to whichever card,
   testimonial, pill or diagram node is crossing the middle of the screen. */
.fs-eng.fs-lit{border-color:rgba(54,196,240,.55);box-shadow:0 0 0 1px rgba(54,196,240,.2),0 40px 90px -40px rgba(54,196,240,.5)}
.fs-eng.fs-lit .fs-h3{color:#36C4F0}
.fs-eng.fs-lit .fs-cta{background:#36C4F0;border-color:#36C4F0;color:#031019;box-shadow:0 10px 32px -10px rgba(54,196,240,.65)}
main .fs-tq.fs-lit{border-color:rgba(54,196,240,.45)!important;box-shadow:0 30px 70px -40px rgba(54,196,240,.55)}
.fs-model.fs-lit{border-color:rgba(54,196,240,.55);color:#F2F5F8;background:rgba(54,196,240,.06);box-shadow:0 0 0 1px rgba(54,196,240,.15),0 0 28px -4px rgba(54,196,240,.55)}
.fs-model.fs-lit svg{color:#36C4F0;filter:drop-shadow(0 0 6px rgba(54,196,240,.8))}
.fs-node.fs-lit .fs-halo{r:22;opacity:.35}
.fs-node.fs-lit text{fill:#F2F5F8}
.fs-cta{transition:background-color .35s,border-color .35s,color .35s,box-shadow .35s}
.fs-anchor{position:absolute;top:0;left:0;width:1px;height:1px}

/* Steps: Diagnostic stages (How it works) */
.fs-steps{list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;counter-reset:fsst}
.fs-steps::before{content:"";position:absolute;left:15px;right:15px;top:15px;height:2px;border-radius:2px;background:linear-gradient(90deg,#2176C0,#36C4F0 60%,#B48CFF);opacity:.6;transform-origin:left;animation:fs-prog linear both;animation-timeline:view();animation-range:entry 15% cover 45%}
@supports not (animation-timeline:view()){.fs-steps::before{animation:fs-prog 1.4s cubic-bezier(.2,.7,.2,1) .2s both}}
.fs-steps li{position:relative;display:flex;flex-direction:column;gap:6px;padding-top:46px}
.fs-steps li::before{counter-increment:fsst;content:counter(fsst,decimal-leading-zero);position:absolute;top:0;left:0;width:32px;height:32px;box-sizing:border-box;border-radius:50%;border:1px solid rgba(54,196,240,.6);background:#0B0D11;color:#36C4F0;font-family:'Inter',sans-serif;font-size:11px;font-weight:600;letter-spacing:.06em;display:flex;align-items:center;justify-content:center;box-shadow:0 0 18px rgba(54,196,240,.3)}
.fs-steps li:last-child::before{background:#36C4F0;border-color:#36C4F0;color:#031019;box-shadow:0 0 26px rgba(54,196,240,.65)}
.fs-steps strong{font-family:'Outfit',sans-serif;font-size:18px;font-weight:600;letter-spacing:-.01em;color:#F2F5F8}
.fs-steps span{font-size:14.5px;line-height:1.5;color:#9BA5B3}
/* Vertical variant, used under the dial */
.fs-steps-v{grid-template-columns:minmax(0,1fr);gap:16px}
@keyframes fs-progy{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.fs-steps-v::before{left:15px;right:auto;top:15px;bottom:15px;width:2px;height:auto;transform-origin:top;animation-name:fs-progy}
.fs-steps-v li{padding:5px 0 0 48px;gap:3px}
.fs-steps-v strong{font-size:16.5px}
.fs-steps-v span{font-size:14px}

/* Time to value (How it works) */
@keyframes fs-drawin{from{stroke-dashoffset:700}to{stroke-dashoffset:0}}
.fs-ttv .fs-draw{stroke-dasharray:700;animation:fs-drawin linear both;animation-timeline:view();animation-range:entry 20% cover 50%}
@supports not (animation-timeline:view()){.fs-ttv .fs-draw{animation:fs-drawin 1.8s cubic-bezier(.2,.7,.2,1) .3s both}}

/* How it works outcomes: on phones the detail opens under the tapped item */
.fs-out-inline{display:none}
.fs-out-dash{flex:none;width:14px;height:1px;margin-top:12px;background:#36C4F0}

.fs-prose{display:flex;flex-direction:column;gap:14px;font-size:16.5px;line-height:1.65;color:#C3CBD5}
.fs-prose p{margin:0}
.fs-prose ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.fs-prose li{position:relative;padding-left:22px}
.fs-prose li::before{content:"";position:absolute;left:0;top:.8em;width:10px;height:1px;background:#36C4F0}
.fs-prose strong{color:#F2F5F8;font-weight:600}

/* ---- RESPONSIVE ------------------------------------------------------------ */
@media (max-width:1100px){
  .fs-nav{padding:0 8px 0 18px!important}
  main h1[style*="font-size: 72px"]{font-size:60px!important}
}
@media (max-width:900px){
  /* Header collapses to a Menu button */
  .fs-nav{position:relative}
  .fs-navlinks{display:none!important}
  .fs-navtoggle{display:inline-flex}
  .fs-navlinks.open{display:flex!important;flex-direction:column;align-items:stretch;gap:2px!important;position:absolute;left:0;right:0;top:calc(100% + 8px);padding:10px;border-radius:24px;border:1px solid rgba(255,255,255,.08);background:rgba(10,12,15,.97);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .fs-navlinks.open .fs-navlink{height:48px;font-size:16px;padding:0 18px}

  /* Two-column layouts stack */
  main [style*="grid-template-columns: minmax(0, 5fr) minmax(0, 6fr)"],
  main [style*="grid-template-columns: minmax(0, 3fr) minmax(0, 9fr)"],
  main [style*="grid-template-columns: minmax(0, 4fr) minmax(0, 8fr)"],
  main [style*="grid-template-columns: minmax(0, 5fr) minmax(0, 7fr)"],
  main [style*="grid-template-columns: minmax(0, 7fr) minmax(0, 5fr)"],
  main [style*="grid-template-columns: minmax(0, 6fr) minmax(0, 5fr)"],
  main [style*="grid-template-columns: minmax(0, 5fr) minmax(0, 5fr)"],
  main [style*="grid-template-columns: minmax(0, 1fr) minmax(0, 1fr)"],
  main [style*="grid-template-columns: minmax(0, 3fr) minmax(0, 2fr)"],
  main [style*="grid-template-columns: repeat(3, minmax(0, 1fr))"]{grid-template-columns:minmax(0,1fr)!important;gap:32px!important}
  main [style*="grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px"]{gap:14px!important}
  main [style*="grid-template-columns: repeat(4, minmax(0, 1fr))"]{grid-template-columns:repeat(2,minmax(0,1fr))!important;row-gap:28px!important}
  main [style*="grid-row: span 2"]{grid-row:auto!important}
  main [style*="position: sticky"]{position:static!important}

  /* Section rhythm */
  main [style*="padding: 160px 24px 0"],
  main [style*="padding: 170px 24px 0"],
  main [style*="padding: 130px 24px 0"]{padding:104px 20px 0!important}
  main [style*="padding: 72px 24px 40px"]{padding:32px 20px 40px!important}
  main [style*="padding: 72px 24px 88px"]{padding:32px 20px 72px!important}
  main [style*="padding: 56px 24px"]{padding:48px 20px!important}
  main [style*="justify-content: space-between; align-items: flex-end"]{flex-wrap:wrap;gap:20px!important}
  .fs-link{display:none}
  main aside svg{max-width:340px;margin:0 auto}

  /* FAQ: the closing call to action follows straight after, so the small
     booking button is dropped once the columns stack */
  #faq>div:first-child a{display:none!important}
  #faq{row-gap:28px!important}

  /* Three flavours: "Compare in detail" moves below the cards */
  #support{display:flex;flex-direction:column}
  #support>div:first-child{display:contents!important}
  #support>div:last-child{order:1;margin-top:40px!important}
  #support .fs-more{order:2;margin:32px 0 0!important;align-self:flex-start}

  /* Why us: the story link moves below the diagram */
  #why>div:first-child{display:contents!important}
  #why{row-gap:22px!important}
  #why .fs-rv{order:1;margin-top:18px}
  #why .fs-rv>svg{transform:translateX(-3.8%)}
  #why>div:first-child>.fs-why-cta{order:2;justify-self:start;margin-top:12px!important}

  /* Visuals */
  .fs-steps{grid-template-columns:minmax(0,1fr);gap:18px}
  .fs-steps::before{left:15px;right:auto;top:15px;bottom:15px;width:2px;height:auto;transform-origin:top;animation:none}
  .fs-steps li{padding:4px 0 0 50px}
  #buying .fs-ttv{max-width:520px}

  /* Outcomes: accordion instead of the side panel */
  main .fs-outpanel{display:none!important}
  main ul.fs-out-inline{display:flex;flex-direction:column;gap:12px;list-style:none;margin:0 0 10px;padding:6px 18px 16px 58px}
  main .fs-out-inline li{display:flex;gap:12px;font-size:16px;line-height:1.5;color:#C3CBD5}
  main .fs-out-open .fs-ochev{transform:rotate(90deg)}

  /* Type scale */
  main h1[style*="font-size: 72px"],
  main h1[style*="font-size: 62px"]{font-size:52px!important}
  main h1[style*="font-size: 92px"]{font-size:68px!important}
  main [style*="padding: 150px 24px 0"]{padding:96px 20px 0!important}
  main [style*="padding: 72px 24px 0"]{padding:32px 20px 0!important}
  main [style*="padding: 96px 24px 0"]{padding:64px 20px 0!important}
  main [style*="padding: 120px 24px 40px"]{padding:72px 20px 40px!important}
  main .fs-prow{gap:14px!important;padding:26px 0!important}
  main figure[style*="padding: 40px 36px"]{padding:32px 28px!important}
  main [style*="position: relative; display: flex; gap: 12px"]{flex-wrap:wrap;justify-content:center}
  main figure:has(img.fs-ken){max-width:300px!important;justify-self:start!important}
  main figcaption[style*="left: -28px"]{left:12px!important;bottom:12px!important}
  main h2[style*="font-size: 72px"]{font-size:48px!important}
  main h2[style*="font-size: 52px"],
  main h2[style*="font-size: 46px"]{font-size:38px!important}
  main [style*="font-size: 54px"]{font-size:46px!important}

  /* Cards */
  main [style*="padding: 120px 48px"],
  main [style*="padding: 110px 48px"]{padding:88px 28px!important}
  main article[style*="padding: 44px"]{padding:32px!important}
  main figure[style*="padding: 56px"]{padding:40px!important}
  main blockquote[style*="font-size: 34px"]{font-size:28px!important}

  /* Footer */
  .fs-foot>div:first-child{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:36px!important}
  .fs-foot>div:first-child>div:first-child{grid-column:1/-1}
}
@media (max-width:600px){
  .fs-header{padding:10px 12px!important}
  .fs-nav{height:56px!important;padding:0 6px 0 14px!important}
  .fs-navcta{display:none!important}
  .fs-navlinks.open .fs-navbook{display:inline-flex!important;color:#36C4F0}

  main h1[style*="font-size: 72px"],
  main h1[style*="font-size: 62px"]{font-size:42px!important;line-height:1.04!important}
  main h1[style*="font-size: 92px"]{font-size:50px!important}
  main [style*="padding: 150px 24px 0"]{padding:80px 16px 0!important}
  main figure:has(img.fs-ken){max-width:250px!important}
  main [style*="padding: 72px 24px 0"]{padding:24px 16px 0!important}
  main [style*="padding: 96px 24px 0"]{padding:48px 16px 0!important}
  main [style*="padding: 120px 24px 40px"]{padding:56px 16px 32px!important}
  main figure[style*="padding: 40px 36px"]{padding:28px 22px!important}
  main blockquote[style*="font-size: 25px"]{font-size:21px!important}
  main svg.fs-rot{width:330px!important;height:330px!important;margin:-165px 0 0 -165px!important}
  main h2[style*="font-size: 44px"]{font-size:32px!important}
  main [style*="font-size: 240px"]{font-size:160px!important}
  main h2[style*="font-size: 72px"]{font-size:38px!important}
  main h2[style*="font-size: 52px"],
  main h2[style*="font-size: 46px"]{font-size:32px!important}
  main h2[style*="font-size: 34px"]{font-size:30px!important}
  main h3[style*="font-size: 30px"]{font-size:23px!important}
  main h3[style*="font-size: 34px"]{font-size:26px!important}
  main [style*="font-size: 54px"]{font-size:40px!important}
  main p[style*="font-size: 19px"]{font-size:17px!important}
  main [style*="padding: 160px 24px 0"],
  main [style*="padding: 170px 24px 0"],
  main [style*="padding: 130px 24px 0"]{padding:88px 16px 0!important}
  main [style*="padding: 72px 24px 40px"]{padding:24px 16px 32px!important}
  main article[style*="padding: 44px"]{padding:24px 20px!important}
  main canvas[style*="height: 420px"]{height:300px!important}
  main .fs-pick{min-height:0;padding:22px;font-size:19px}
  main [style*="padding: 72px 24px 88px"]{padding:24px 16px 64px!important}
  main [style*="padding: 56px 24px"]{padding:44px 16px!important}

  /* Hero lever scales down beside the chart */
  .fs-ttv svg text{font-size:15.5px}
  .fs-ttv svg text[font-size="17"]{font-size:21px}
  main [style*="grid-template-columns: minmax(0, 1fr) 150px"]{grid-template-columns:minmax(0,1fr) 104px!important}
  .fs-lever-wrap{width:104px!important;height:250px!important}
  .fs-lever-wrap svg{width:104px;height:250px}
  main canvas[style*="height: 360px"]{height:250px!important}

  /* Questionnaire and form */
  main [style*="padding: 36px 40px 34px"]{padding:24px 18px 26px!important;min-height:0!important}
  main [style*="grid-template-columns: repeat(2, minmax(0, 1fr))"]{grid-template-columns:minmax(0,1fr)!important}
  main [style*="grid-template-columns: 150px minmax(0, 1fr)"]{grid-template-columns:104px minmax(0,1fr)!important}
  main form[style*="padding: 26px"]{padding:20px 16px!important}
  .fs-opt{min-height:56px;padding:14px 16px}

  /* Cards and quotes */
  main [style*="padding: 120px 48px"],
  main [style*="padding: 110px 48px"]{padding:72px 20px!important}
  main figure[style*="padding: 56px"]{padding:30px 24px!important;gap:32px!important}
  main figure[style*="padding: 36px"]{padding:28px 24px!important}
  main blockquote[style*="font-size: 34px"]{font-size:24px!important}
  main blockquote[style*="font-size: 21px"]{font-size:19px!important}
  .fs-fq{font-size:18px;min-height:68px}
  main p[style*="padding: 0 64px 28px 0"]{padding:0 0 24px!important}
  main [style*="repeat(4, minmax(0, 1fr))"]>div{padding:4px 0 4px 16px!important}
  /* The labels hang further right than left, so nudge the drawing to centre what you see */
  #why .fs-rv>svg{width:80%!important;max-width:380px;margin:0 auto;transform:translateX(-10.8%)}
  .fs-node text{font-size:30px}

  /* Footer */
  .fs-foot{padding:72px 16px 40px!important}
  .fs-foot>div:last-child{flex-direction:column;gap:12px}
}

/* ---- Section bands ------------------------------------------------------------
   Each band is painted by a full-width ::before (and an optional texture
   layer in ::after) behind the section, so the section keeps its 1180px
   content width and every responsive rule above still applies.
   Cyan (#36C4F0) is too pale to read as text on light bands, so light bands
   use deep blue for accents and links and keep cyan only as a fill.

   Light bands read their colours from --l-* variables. The light treatment
   is "Signal": rings radiating from the top-right corner over pale blue. */
html,body{overflow-x:clip}
main section.band{position:relative;isolation:isolate;padding-top:128px!important;padding-bottom:128px!important}
main section.band::before,main section.band::after{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);z-index:-1;pointer-events:none}
main section.band::before{background:#07080A}
main .band-navy::before{background:radial-gradient(70% 90% at 85% 0%,rgba(33,118,192,.16) 0%,rgba(8,17,31,0) 60%),#08111F!important;border-top:1px solid rgba(54,196,240,.10);border-bottom:1px solid rgba(54,196,240,.10)}
main .band-white::before{background:#FFFFFF!important}
main .band-accent::before{background:radial-gradient(60% 90% at 50% 110%,rgba(180,140,255,.30) 0%,rgba(180,140,255,0) 60%),linear-gradient(135deg,#0B3F80 0%,#145EA8 55%,#1C78C8 100%)!important}

/* Light band variables (shared by every treatment) */
.band-light,.band-white{
  --l-ink:#0A1830;--l-body:#3F4D64;--l-muted:#4F5E75;--l-accent:#0F5FA8;--l-accent-2:#1A73C2;
  --l-line:rgba(15,70,130,.14);--l-pill-line:rgba(15,95,168,.25);--l-pill-bg:rgba(26,115,194,.07);
  --l-card:#FFFFFF;--l-card-line:rgba(15,80,150,.14);--l-card-shadow:0 1px 2px rgba(10,30,60,.05),0 22px 44px -26px rgba(12,50,100,.35);
  --l-card-blur:none;--l-field:#FFFFFF;--l-field-line:rgba(15,70,130,.22);
  color:var(--l-ink)}

/* Signal (chosen 19 Oct): concentric rings radiating from the top-right corner */
.band-light{--l-card:rgba(255,255,255,.88);--l-card-line:rgba(15,80,150,.12);--l-card-blur:blur(6px);
  --l-card-shadow:0 1px 2px rgba(10,30,60,.05),0 26px 54px -30px rgba(20,80,160,.45);--l-field:#FFFFFF;--l-field-line:rgba(15,70,130,.22)}
main .band-light::before{background:
  radial-gradient(38% 50% at 100% 0%,rgba(54,196,240,.42) 0%,rgba(54,196,240,0) 70%),
  radial-gradient(40% 55% at 0% 100%,rgba(28,120,200,.18) 0%,rgba(28,120,200,0) 70%),
  linear-gradient(180deg,#E8F1FB 0%,#F4F8FD 100%)!important}
main .band-light::after{background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1600 1600%22%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22110%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.55%22 stroke-width=%221.6%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22205%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.52%22 stroke-width=%221%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22300%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.48%22 stroke-width=%221%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22395%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.45%22 stroke-width=%221.6%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22490%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.41%22 stroke-width=%221%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22585%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.38%22 stroke-width=%221%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22680%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.34%22 stroke-width=%221.6%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22775%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.31%22 stroke-width=%221%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22870%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.27%22 stroke-width=%221%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%22965%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.23%22 stroke-width=%221.6%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%221060%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.20%22 stroke-width=%221%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%221155%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.17%22 stroke-width=%221%22 stroke-dasharray=%223 10%22/%3E%3Ccircle cx=%22800%22 cy=%22800%22 r=%221250%22 fill=%22none%22 stroke=%22%231A73C2%22 stroke-opacity=%220.13%22 stroke-width=%221.6%22/%3E%3Ccircle cx=%22518%22 cy=%22697%22 r=%225%22 fill=%22%231A73C2%22 fill-opacity=%22.55%22/%3E%3Ccircle cx=%22519%22 cy=%22399%22 r=%225%22 fill=%22%231A73C2%22 fill-opacity=%22.55%22/%3E%3Ccircle cx=%22624%22 cy=%22143%22 r=%225%22 fill=%22%231A73C2%22 fill-opacity=%22.55%22/%3E%3Ccircle cx=%2287%22 cy=%22301%22 r=%225%22 fill=%22%231A73C2%22 fill-opacity=%22.55%22/%3E%3Ccircle cx=%22352%22 cy=%22-161%22 r=%225%22 fill=%22%231A73C2%22 fill-opacity=%22.55%22/%3E%3C/svg%3E") no-repeat;background-size:1500px 1500px;background-position:calc(100% + 640px) -760px;-webkit-mask-image:none;mask-image:none}

/* Light bands: shared classes */
main .band-light .fs-kick,main .band-white .fs-kick{color:var(--l-accent)}
main .band-light .fs-kick::before,main .band-white .fs-kick::before{background:var(--l-accent);opacity:.55}
main .band-light h2,main .band-white h2{color:var(--l-ink)}
main .band-light .fs-more,main .band-white .fs-more{color:var(--l-accent)}
main .band-light .fs-more:hover,main .band-white .fs-more:hover{color:#0B3F80}
main .band-light :focus-visible,main .band-white :focus-visible{outline-color:var(--l-accent)}
main .band-light .fs-btn-ghost,main .band-white .fs-btn-ghost{color:var(--l-ink);border-color:rgba(10,20,34,.18);background:#FFFFFF}
main .band-light .fs-btn-ghost:hover,main .band-white .fs-btn-ghost:hover{border-color:rgba(10,20,34,.4)}
.fs-lcard{background:var(--l-card);border:1px solid var(--l-card-line);box-shadow:var(--l-card-shadow);-webkit-backdrop-filter:var(--l-card-blur);backdrop-filter:var(--l-card-blur)}

/* Three flavours on light */
main .band-light .fs-eng{background:var(--l-card);border-color:var(--l-card-line);box-shadow:var(--l-card-shadow);-webkit-backdrop-filter:var(--l-card-blur);backdrop-filter:var(--l-card-blur)}
main .band-light .fs-eng .fs-h3{color:var(--l-ink)}
main .band-light .fs-best{border-top-color:var(--l-line)}
main .band-light .fs-eng{transition:background-color .35s,border-color .35s,transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
main .band-light .fs-eng *{transition:color .3s,border-color .3s,background-color .3s}
/* Hover (or lit on touch): the card turns into the dark brand card, the strongest emphasis on a light section */
main .band-light .fs-eng:hover,main .band-light .fs-eng.fs-lit{
  --l-ink:#F2F5F8;--l-body:#AEB7C3;--l-accent:#36C4F0;--l-line:rgba(255,255,255,.1);--l-pill-line:rgba(54,196,240,.4);--l-pill-bg:rgba(54,196,240,.1);
  background:radial-gradient(100% 70% at 0% 0%,rgba(54,196,240,.16),rgba(7,8,10,0) 60%),#0B0D11;border-color:rgba(54,196,240,.6);
  box-shadow:0 0 0 1px rgba(54,196,240,.25),0 40px 80px -30px rgba(10,60,120,.7);transform:translateY(-8px);-webkit-backdrop-filter:none;backdrop-filter:none}
main .band-light .fs-eng:hover .fs-h3,main .band-light .fs-eng.fs-lit .fs-h3{color:#36C4F0}
main .band-light .fs-eng:hover .fs-cta,main .band-light .fs-eng.fs-lit .fs-cta{background:#36C4F0;border-color:#36C4F0;color:#031019;box-shadow:0 10px 32px -10px rgba(54,196,240,.65)}
main .band-light .fs-link{background:#FFFFFF;border-color:rgba(26,115,194,.45);color:var(--l-accent-2);box-shadow:0 2px 6px rgba(10,20,34,.08)}

/* The record: a stats panel on light */
.fs-rec{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:48px;align-items:center;padding:40px 44px;border-radius:24px;background:var(--l-card);border:1px solid var(--l-card-line);box-shadow:var(--l-card-shadow);-webkit-backdrop-filter:var(--l-card-blur);backdrop-filter:var(--l-card-blur)}
.fs-rec-head{display:flex;flex-direction:column;gap:14px}
.fs-rec-head h2{margin:0;font-size:34px;line-height:1.05;font-weight:700;letter-spacing:-.025em}
.fs-rec-head p:last-child{margin:0;font-size:15px;line-height:1.55;color:var(--l-body)}
.fs-rec-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.fs-stat{padding:8px 24px;border-left:1px solid var(--l-line)}
.fs-stat:last-child{padding-right:0}
.fs-stat-n{font-family:'Outfit',sans-serif;font-size:54px;font-weight:600;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums;color:var(--l-ink)}
.fs-stat-u{color:var(--l-accent-2)}
.fs-stat p{margin:14px 0 0;font-size:14px;line-height:1.5;color:var(--l-body)}
#proof .fs-count{animation:fs-count linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
@supports not (animation-timeline:view()){#proof .fs-count{animation:fs-count 2.4s cubic-bezier(.16,.8,.2,1) .2s both}}

/* Proof: the featured testimonial rotates */
.fs-proof-head{display:flex;flex-direction:column;gap:18px;margin:0 0 40px}
#proof .fs-rec{margin-top:72px}
.fs-proof-head h2{margin:0;font-size:46px;line-height:1.06;font-weight:700;letter-spacing:-.028em}
.fs-tqs{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:1fr 1fr;grid-template-areas:"main a" "main b";gap:20px}
.fs-slot-0{grid-area:main}.fs-slot-1{grid-area:a}.fs-slot-2{grid-area:b}
.fs-tq{margin:0;position:relative;overflow:hidden}
.fs-tq blockquote{margin:0}
.fs-tq figcaption{display:flex;flex-direction:column;gap:4px;font-size:14px}
.fs-tq-name{font-weight:600}
.fs-tq-main{min-height:460px;padding:56px;border-radius:28px;border:1px solid rgba(54,196,240,.28);background:radial-gradient(90% 120% at 0% 0%,rgba(54,196,240,.13) 0%,rgba(7,8,10,0) 60%),#0B0D11;color:#F2F5F8;display:flex;flex-direction:column;gap:36px;box-shadow:0 40px 90px -50px rgba(5,20,45,.7);outline-offset:4px}
.fs-tq-main blockquote{flex:1;font-family:'Outfit',sans-serif;font-size:34px;line-height:1.22;font-weight:500;letter-spacing:-.02em;color:#F2F5F8}
.fs-tq-main figcaption{flex-direction:row;align-items:center;gap:14px;font-size:15px}
.fs-tq-main .fs-tq-role{color:#8C96A3}
.fs-tq-side{padding:32px 34px;border-radius:24px;background:var(--l-card);border:1px solid var(--l-card-line);box-shadow:var(--l-card-shadow);-webkit-backdrop-filter:var(--l-card-blur);backdrop-filter:var(--l-card-blur);display:flex;flex-direction:column;justify-content:space-between;gap:24px;color:var(--l-ink);cursor:pointer;transition:border-color .3s,transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.fs-tq-side blockquote{font-family:'Outfit',sans-serif;font-size:19px;line-height:1.38;font-weight:400;color:var(--l-ink)}
.fs-tq-side .fs-tq-role{color:var(--l-muted)}
.fs-tq-pick{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;z-index:1}
.fs-tq-side{overflow:hidden}
.fs-tq-side:hover{transform:translateY(-3px);border-color:rgba(26,115,194,.45);box-shadow:0 0 0 1px rgba(26,115,194,.14),0 30px 70px -32px rgba(26,115,194,.5)}
@keyframes fs-tq-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes fs-tq-in2{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

/* Closing band: white type on brand blue, cyan button */
main .band-accent .fs-kick::before{background:rgba(207,239,255,.6)}
main .band-accent h2{color:#FFFFFF}
main .band-accent .fs-ring{border-color:rgba(255,255,255,.22)}
main .band-accent .fs-btn-primary{box-shadow:0 0 0 1px rgba(255,255,255,.35),0 14px 40px -12px rgba(3,16,25,.6)}

@media (max-width:900px){
  main section.band{padding-top:96px!important;padding-bottom:96px!important}
  main .band-accent>div{padding:24px 8px!important}
  .fs-rec{grid-template-columns:minmax(0,1fr);gap:28px;padding:32px 28px}
  .fs-rec-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .fs-stat:nth-child(odd){border-left:0;padding-left:0}
  #proof .fs-rec{margin-top:56px}
  .fs-tqs{grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-template-areas:"main" "a" "b"}
  .fs-tq-main{min-height:0;padding:36px 30px}
  .fs-tq-main blockquote{font-size:27px}
}
@media (max-width:600px){
  main section.band{padding-top:72px!important;padding-bottom:72px!important}
  .fs-rec{padding:26px 22px}
  .fs-stat{padding:4px 0 4px 16px}
  .fs-stat:nth-child(odd){padding-left:0}
  .fs-stat-n{font-size:44px}
  .fs-proof-head h2{font-size:34px}
  #proof .fs-rec{margin-top:44px}
  .fs-tq-main{padding:30px 24px;gap:26px}
  .fs-tq-main blockquote{font-size:23px}
  .fs-tq-main figcaption{flex-direction:column;align-items:flex-start;gap:2px}
  .fs-tq-side{padding:26px 24px}
}

/* About: four testimonials on light. The emphasis (the dark brand card) moves
   from card to card on a timer; hovering or tapping a card brings it there.
   The dark layer is a ::before that fades in, so the change is a crossfade. */
.fs-tq4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.fs-tq4 .fs-tq{isolation:isolate;padding:40px 36px;border-radius:24px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;cursor:default;transition:border-color .8s ease,box-shadow .8s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
.fs-tq4 .fs-tq::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(100% 80% at 0% 0%,rgba(54,196,240,.16),rgba(7,8,10,0) 60%),#0B0D11;opacity:0;transition:opacity .8s ease}
.fs-tq4 blockquote{font-family:'Outfit',sans-serif;font-size:23px;line-height:1.32;letter-spacing:-.01em;transition:color .8s ease}
.fs-tq4 .fs-tq-name,.fs-tq4 .fs-tq-role{transition:color .8s ease}
.fs-tq-light{background:var(--l-card);border:1px solid var(--l-card-line);box-shadow:var(--l-card-shadow);-webkit-backdrop-filter:var(--l-card-blur);backdrop-filter:var(--l-card-blur);color:var(--l-ink)}
.fs-tq-light blockquote{font-weight:400;color:var(--l-ink)}
.fs-tq-light .fs-tq-role{color:var(--l-muted)}
.fs-tq4 .fs-tq-spot{border-color:rgba(54,196,240,.4);box-shadow:0 0 0 1px rgba(54,196,240,.15),0 40px 90px -50px rgba(5,20,45,.75)}
.fs-tq4 .fs-tq-spot::before{opacity:1}
.fs-tq4 .fs-tq-spot blockquote,.fs-tq4 .fs-tq-spot .fs-tq-name{color:#F2F5F8}
.fs-tq4 .fs-tq-spot .fs-tq-role{color:#8C96A3}
@media (prefers-reduced-motion:reduce){.fs-tq4 .fs-tq,.fs-tq4 .fs-tq::before,.fs-tq4 blockquote{transition:none}}

/* How it works: "What you're buying" on light */
main .band-light .fs-ttv{box-shadow:0 40px 90px -50px rgba(5,20,45,.7)}
main .band-light .fs-outpanel{box-shadow:0 40px 90px -50px rgba(5,20,45,.7)}
main .band-light .fs-out{color:var(--l-body)}
main .band-light .fs-out:hover{color:var(--l-ink);background:var(--l-card);border-color:var(--l-card-line)}
main .band-light .fs-out-on,main .band-light .fs-out-on:hover{color:var(--l-ink);background:var(--l-card);border-color:rgba(26,115,194,.35);box-shadow:inset 3px 0 0 0 var(--l-accent-2),var(--l-card-shadow)}
main .band-light .fs-onum{color:var(--l-muted)}
main .band-light .fs-out-on .fs-onum,main .band-light .fs-out-on .fs-ochev{color:var(--l-accent)}
main .band-light .fs-ochev{color:var(--l-muted)}
main .band-light .fs-out-inline li{color:var(--l-body)}
main .band-light .fs-out-dash{background:var(--l-accent-2)}

@media (max-width:900px){
  .fs-tq4{grid-template-columns:minmax(0,1fr)}
  .fs-tq4 .fs-tq{padding:30px 26px}
  .fs-tq4 blockquote{font-size:20px}
}
main .band-light .fs-outpanel,main .band-light .fs-ttv,main .band-light .fs-tq-main{color:#F2F5F8}

/* Why us: diagram labels alternate between ecosystem roles and channel models.
   Each label blurs and lifts out as its replacement rises in, travelling round
   the star node by node (--d), and each node sends out a ring as it changes. */
.fs-node .fs-wl{transition:opacity .9s ease var(--d,0s),transform 1s cubic-bezier(.2,.75,.2,1) var(--d,0s),filter .9s ease var(--d,0s),fill .3s;transform-box:fill-box;transform-origin:50% 50%}
.fs-wl-b{opacity:0;transform:translateY(12px) scale(.96);filter:blur(6px)}
.fs-why-b .fs-wl-a{opacity:0;transform:translateY(-12px) scale(.96);filter:blur(6px)}
.fs-why-b .fs-wl-b{opacity:1;transform:none;filter:none}
.fs-pulse{opacity:0;transform-box:fill-box;transform-origin:50% 50%}
.fs-why-go .fs-pulse{animation:fs-pulse-a 1.1s cubic-bezier(.2,.7,.3,1) var(--d,0s) both}
.fs-why-go.fs-why-b .fs-pulse{animation-name:fs-pulse-b}
@keyframes fs-pulse-a{0%{opacity:.85;transform:scale(.6)}100%{opacity:0;transform:scale(3.2)}}
@keyframes fs-pulse-b{0%{opacity:.85;transform:scale(.6)}100%{opacity:0;transform:scale(3.2)}}
#proof .fs-rec:first-child{margin-top:0}
#proof .fs-rec+.fs-proof-head{margin-top:96px}
@media (max-width:900px){#proof .fs-rec+.fs-proof-head{margin-top:64px}}
.fs-tq-side{z-index:1}.fs-tq-main{z-index:2}
