/* Active Digit — site-wide motion layer for inner pages v20261028 */

/* ---------- Page hero: living background ---------- */
.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero { position: relative; isolation: isolate; overflow: hidden; }
.sv-hero::before, .crm-hero::before, .sg-hero::before, .pr-hero::before, .pg-hero::before, .ct-hero::before, .art-hero::before {
  content: ''; position: absolute; inset: -20%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(38% 45% at 85% 20%, rgba(197,218,44,0.16), transparent 70%),
    radial-gradient(40% 50% at 10% 85%, rgba(27,58,110,0.12), transparent 70%);
  animation: fxDrift 22s ease-in-out infinite alternate;
}
.sv-hero::after, .crm-hero::after, .sg-hero::after, .pr-hero::after, .pg-hero::after, .ct-hero::after, .art-hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(27,58,110,0.13) 1px, transparent 1.4px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(70% 80% at 70% 30%, #000 0%, transparent 75%);
  mask-image: radial-gradient(70% 80% at 70% 30%, #000 0%, transparent 75%);
}
@keyframes fxDrift { from { transform: translate3d(-2%, -1%, 0) scale(1); } to { transform: translate3d(3%, 2%, 0) scale(1.08); } }

/* ---------- Page hero: staggered entrance (CSS-only, no flash) ---------- */
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) :is(.crumb, .sv-badge, .crm-hero__badge, .art-hero__tag, .eyebrow, h1, .h1, .lead, p, ul, .sv-cta, .crm-hero__cta, .art-hero__meta) {
  animation: fxUp 0.85s cubic-bezier(0.16,1,0.3,1) both;
}
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) .crumb { animation-delay: 0.02s; }
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) :is(.sv-badge, .crm-hero__badge, .art-hero__tag, .eyebrow) { animation-delay: 0.1s; }
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) :is(h1, .h1) { animation-delay: 0.18s; }
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) :is(.lead, p) { animation-delay: 0.3s; }
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) ul { animation-delay: 0.4s; }
:is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) :is(.sv-cta, .crm-hero__cta, .art-hero__meta) { animation-delay: 0.5s; }
:is(.sv-hero__mock, .sv-phone, .crm-hero__mock, .sg-hero__visual, .pr-hero__visual) {
  animation: fxRise 1.1s cubic-bezier(0.16,1,0.3,1) 0.35s both, fxFloat 7s ease-in-out 1.6s infinite;
}
@keyframes fxUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes fxRise { from { opacity: 0; transform: translateY(36px) scale(0.96); } to { opacity: 1; transform: none; } }
@keyframes fxFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }

/* ---------- Scroll reveal (classes added by fx.js only to below-the-fold elements) ---------- */
.fx-r { opacity: 0; transform: translateY(26px); transition: opacity 0.7s ease, transform 0.8s cubic-bezier(0.16,1,0.3,1); transition-delay: var(--fx-d, 0s); }
.fx-r.fx-on { opacity: 1; transform: none; }

/* ---------- Hover: cards lift with a lime edge ---------- */
@media (hover: hover) {
  :is(.sv-t, .sv-feat, .sv-type, .sv-step, .sv-tier, .pr-tier, .pr-block, .pfo-card, .crm-mod, .crm-int, .sg-mat, .sg-type, .tstml-card, .why__card) {
    transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), box-shadow 0.4s ease, border-color 0.3s ease;
  }
  :is(.sv-t, .sv-feat, .sv-type, .sv-step, .sv-tier, .pr-tier, .pr-block, .crm-mod, .crm-int, .sg-mat, .sg-type, .tstml-card, .why__card):hover {
    transform: translateY(-5px);
    border-color: rgba(197,218,44,0.7);
    box-shadow: 0 22px 44px -24px rgba(15,23,41,0.35);
  }
  :is(.sv-feat__icn, .sv-type__icn, .crm-int__icn, .sg-type__icn) { transition: transform 0.4s cubic-bezier(0.16,1,0.3,1); }
  :is(.sv-feat, .sv-type, .crm-int, .sg-type):hover :is(.sv-feat__icn, .sv-type__icn, .crm-int__icn, .sg-type__icn) { transform: scale(1.12) rotate(-6deg); }

  /* Button shine sweep */
  .btn { position: relative; overflow: hidden; }
  .btn::after {
    content: ''; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; pointer-events: none;
    background: linear-gradient(105deg, transparent, rgba(255,255,255,0.35), transparent);
    transform: skewX(-18deg); transition: left 0.6s ease;
  }
  .btn:hover::after { left: 130%; }
}

/* ---------- Scroll progress bar ---------- */
.fx-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 999; pointer-events: none;
  background: linear-gradient(90deg, #A8BD22, #C5DA2C);
  box-shadow: 0 0 10px rgba(197,218,44,0.55);
  transform-origin: right center; transform: scaleX(0);
}
[dir="ltr"] .fx-progress { transform-origin: left center; }

@media (prefers-reduced-motion: reduce) {
  .sv-hero::before, .crm-hero::before, .sg-hero::before, .pr-hero::before, .pg-hero::before, .ct-hero::before, .art-hero::before { animation: none; }
  :is(.sv-hero, .crm-hero, .sg-hero, .pr-hero, .pg-hero, .ct-hero, .art-hero) *,
  :is(.sv-hero__mock, .sv-phone, .crm-hero__mock, .sg-hero__visual, .pr-hero__visual) { animation: none !important; }
  .fx-r { opacity: 1; transform: none; transition: none; }
  .fx-progress { display: none; }
}