/* Tangentek icon set: 32px grid, 1.75 stroke, ink outline + one lime accent, on near-black tiles. Bump ?v= when edited. */
body svg.tk-ic{width:28px;height:28px;display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
body svg.tk-ic .a{fill:var(--ic-a,currentColor);stroke:none}
body svg.tk-ic .af{fill:var(--ic-a,currentColor)}
body svg.tk-ic .as{stroke:var(--ic-a,currentColor)}

/* tiles */
body .svc-icon,body .why-icon-wrap,body .step-icon,body .card-icon,body .signal-icon,body .factor-icon,body .px-ico,body .crm-chan-ico{
  --ic-a:#C8FF2E;display:flex;align-items:center;justify-content:center;
  background:#0B0B0E !important;border:1px solid rgba(200,255,46,.3) !important;
  color:#F5F5F7 !important;-webkit-text-fill-color:#F5F5F7 !important;font-size:0 !important;line-height:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 22px -12px rgba(11,11,14,.55) !important;
  transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s}
body .svc-icon{width:58px;height:58px;border-radius:15px !important;margin-bottom:22px}
body .svc-icon svg.tk-ic{width:32px;height:32px}
body .why-icon-wrap{width:50px;height:50px;border-radius:13px !important}
body .step-icon{width:48px;height:48px;border-radius:13px;margin-bottom:18px}
body .card-icon{width:56px;height:56px;border-radius:15px !important;margin-bottom:22px}
body .card-icon svg.tk-ic{width:30px;height:30px}
body .signal-icon{width:46px;height:46px;border-radius:13px;flex-shrink:0}
body .factor-icon{width:46px;height:46px;border-radius:13px;margin-bottom:14px}
body .px-ico{width:48px;height:48px;border-radius:14px;display:grid;place-items:center}
body .px-ico svg.tk-ic{width:28px;height:28px}
body .crm-chan-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center}
body .crm-chan-ico svg.tk-ic{width:23px;height:23px}
body .px-tile-feature .px-ico,body .px-tile-dark .px-ico{background:#0B0B0E !important;border-color:rgba(200,255,46,.45) !important;color:#F5F5F7 !important}
body .svc-card:hover .svc-icon,body .why-card:hover .why-icon-wrap,body .step-cell:hover .step-icon,body .card:hover .card-icon{
  transform:translateY(-3px) !important;border-color:rgba(200,255,46,.75) !important;
  box-shadow:0 0 0 4px rgba(200,255,46,.16),0 14px 26px -12px rgba(11,11,14,.6) !important}

/* big faint watermark numbers on the home page */
.num-icon{--ic-a:#0D1324;opacity:.09;font-size:0 !important;line-height:0}
.num-icon svg.tk-ic{width:60px;height:60px;color:#0D1324 !important;stroke-width:1.5}
.num-cell:hover .num-icon{opacity:.22;transform:scale(1.1) !important}
@media (max-width:640px){.num-icon svg.tk-ic{width:46px;height:46px}}

/* inline (in buttons, links, headings) */
body svg.tk-ic-inline{display:inline-block;width:1.15em;height:1.15em;vertical-align:-.2em;margin-right:.35em;fill:none !important;stroke:currentColor !important;color:inherit !important;stroke-width:1.75}
body svg.tk-ic-inline .a,body svg.tk-ic-inline .af{fill:currentColor !important}

@media (prefers-reduced-motion:reduce){body .svc-card:hover .svc-icon,body .why-card:hover .why-icon-wrap,body .step-cell:hover .step-icon,body .card:hover .card-icon,.num-cell:hover .num-icon{transform:none !important}}
/* beat page-level variants like .cf .px-tile-feature .px-ico (0,3,0) */
html body .px-ico.px-ico[aria-hidden]{background:#0B0B0E !important;color:#F5F5F7 !important;-webkit-text-fill-color:#F5F5F7 !important;border-color:rgba(200,255,46,.4) !important}
