/* premium-motion : kinetic typography  (premium-motion 2.0, Phase 2)
   Pair with type.js. All effects are opt-in via class and reduced-motion safe
   (type.js prints final text / final weight when motion is off).
   ============================================================ */

/* --- odometer digit roll (data-odometer) ------------------------------- */
.odm{ display:inline-flex; align-items:flex-start; font-variant-numeric:tabular-nums; line-height:1; }
.odm-d{ display:inline-block; height:1em; overflow:hidden; }
.odm-reel{ display:flex; flex-direction:column; transform:translateY(0);
           transition:transform 1.15s cubic-bezier(.22,.61,.2,1); will-change:transform; }
.odm-reel > span{ height:1em; display:block; }
.odm-sep{ display:inline-block; }

/* --- gradient shimmer sweep on a phrase (.md-shimmer) ------------------ */
/* readable at every tier; the clip/transparent treatment only under full + motion */
.md-shimmer{ color: var(--red,#C8102E); }
@media (prefers-reduced-motion: no-preference){
  :root[data-motion="full"] .md-shimmer{
    background:linear-gradient(100deg, var(--red-dark,#9c0c24) 0 42%, #ff5470 50%, var(--red-dark,#9c0c24) 58% 100%);
    background-size:250% 100%;
    -webkit-background-clip:text; background-clip:text; color:transparent;
    animation: pm-shimmer 5.5s ease-in-out 1.2s infinite;
  }
  @keyframes pm-shimmer{ 0%,100%{background-position:120% 0} 45%,55%{background-position:-20% 0} }
}

/* --- variable-font weight morph on view (.md-weight) ------------------- */
.md-weight{ font-variation-settings:'wght' 340; transition: font-variation-settings .9s cubic-bezier(.22,.61,.2,1); }
.md-weight.in{ font-variation-settings:'wght' 760; }
[data-motion="off"] .md-weight{ font-variation-settings:'wght' 700; transition:none; }

/* --- decode / scramble (.md-decode) ------------------------------------ */
.md-decode{ white-space:pre-wrap; }