/* FollowMaths motion and trust layer (added 2026-11-10) */
:root{--ease:cubic-bezier(.2,.7,.2,1);--teal:#0e9f84}
::selection{background:var(--brand);color:#fff}
#sp{position:fixed;top:0;left:0;height:3px;width:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--brand),var(--teal));z-index:200;pointer-events:none}
header.site{transition:box-shadow .25s}
header.site.scrolled{box-shadow:0 8px 24px -16px rgba(11,11,22,.55)}
@media(hover:hover) and (min-width:900px){nav.main a:not(.nav-cta){position:relative}nav.main a:not(.nav-cta)::before{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transform-origin:0 50%;transition:transform .25s var(--ease)}nav.main a:not(.nav-cta):hover::before{transform:scaleX(1)}}
.card,.gcard,.kpi,.cat,.chip,.pill,.steps3 li,.why div{transition:transform .25s var(--ease),box-shadow .25s,border-color .25s,background .25s}
.card .ic{transition:transform .25s var(--ease),background .25s,color .25s}
.cat li a,aside li a,.toc a{transition:color .15s,padding-left .2s var(--ease)}
main table td{transition:background .15s}
summary{transition:color .15s}
.btn:active{transform:translateY(0) scale(.97)}
@media(hover:hover){
.card:hover,.gcard:hover{transform:translateY(-5px);box-shadow:0 18px 40px -22px rgba(54,40,160,.55)}
.card:hover .ic{transform:scale(1.08) rotate(-4deg);background:var(--brand);color:#fff}
.kpi:hover{transform:translateY(-4px) scale(1.02)}
.cat:hover{transform:translateY(-3px);box-shadow:var(--sh2)}
.cat li a:hover,aside li a:hover,.toc a:hover{padding-left:6px;color:var(--brand)}
.chip:hover,.pill:hover{transform:translateY(-2px)}
.steps3 li:hover,.why div:hover{transform:translateY(-3px)}
main table tr:hover td{background:var(--tint)}
summary:hover{color:var(--brand)}
.tool:hover{border-color:var(--brand)}
.field:hover{border-color:var(--brand)}
.field select:hover{color:var(--brand)}
}
.tool{transition:border-color .3s,box-shadow .3s}
.tool::before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--brand),var(--teal))}
.field select{cursor:pointer;appearance:none;-webkit-appearance:none;border:0;border-radius:12px;font-weight:600;padding-right:40px;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239a9aae' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;transition:color .15s}
.field select:focus{outline:none}
.field select option{background:var(--bg);color:var(--ink);font-weight:500}
#result .main{display:inline-block;background:linear-gradient(90deg,var(--brand),var(--teal));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
#result.pop .main{animation:fm-pop .45s var(--ease)}
#result.pop .badge{animation:fm-fade .45s .08s both}
@keyframes fm-pop{0%{transform:scale(.93);opacity:.45}60%{transform:scale(1.04)}100%{transform:scale(1);opacity:1}}
@keyframes fm-fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@keyframes fm-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.hero .lead{animation:fm-up .6s var(--ease) .05s both}
.hero .ctas{animation:fm-up .6s var(--ease) .15s both}
.preview{animation:fm-up .7s var(--ease) .2s both}
.tool .trust{display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none;margin:0;padding:14px 26px;border-top:1px solid var(--line);background:var(--paper);font-size:.82rem;line-height:1.4;color:var(--ink2)}
.tool .trust li{display:inline-flex;align-items:center;gap:7px;margin:0;padding:0}
.tool .trust svg{color:var(--teal);flex:none}
.tool .trust li>a{display:inline;min-height:0;color:inherit}
@media(max-width:600px){.tool .trust{padding:12px 16px}}
.rv{opacity:0;transform:translateY(20px)}
.rv.in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms)}
@media print{.rv{opacity:1;transform:none}#sp{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{opacity:1!important;transform:none!important}#sp{display:none}}
