/* ============================================================================
   DR SOPHIA · MOTION.CSS — shared motion layer (Industries + Contact ONLY)
   Motion Charter v2 (2026-07-04). Load AFTER industries.css / contact.css.
   Gating matrix: pointer motion behind (hover:hover) and (pointer:fine);
   loops/sequences behind (prefers-reduced-motion: no-preference) with settled
   end states outside it. Compositor-only: transform / opacity / clip-path.
   Ease: expo-out cubic-bezier(.16,1,.3,1). Never transition box-shadow —
   pre-rendered ::after shadow layers fade via opacity instead.
   ============================================================================ */

/* --- 1 · word reveal (driven by text-reveal.js; .tw-m mask > .tw riser) --- */
.tw-m{ display:inline-block; overflow:clip; vertical-align:bottom;
  padding:0 .08em .12em; margin:0 -.08em -.12em; /* headroom + italic overhang */ }
.tw{ display:inline-block; }
@media (prefers-reduced-motion: no-preference){
  [data-split-done] .tw{ transform:translateY(105%); opacity:0; }
  [data-split-done].tw-go .tw{ transform:translateY(0); opacity:1;
    transition:transform .5s cubic-bezier(.16,1,.3,1) var(--twd,0ms),
               opacity .35s ease-out var(--twd,0ms); }
  /* accent unit: lands last with a slight overshoot */
  [data-split-done].tw-go .tw-a{ transition:none;
    animation:tw-accent .62s cubic-bezier(.16,1,.3,1) var(--twd,0ms) both; }
  /* fling recovery: heading already passed -> instant, no transition */
  [data-split-done].tw-now .tw{ transform:none; opacity:1; transition:none; animation:none; }
  @keyframes tw-accent{
    0%{ transform:translateY(105%); opacity:0; }
    72%{ transform:translateY(-4%); opacity:1; }
    100%{ transform:translateY(0); opacity:1; }
  }
}

/* --- 2 · eyebrow sequence: fades in just after its heading begins --------- */
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact) .section-head .eyebrow{
    transition:opacity .5s ease .12s; }
  :is(.page-industries,.page-contact)
    :is(.section-head.reveal:not(.in), .reveal:not(.in) .section-head) .eyebrow{ opacity:0; }
}

/* --- 3 · icon accent pop: duo-accent parts scale in once per revealed card */
:is(.page-industries,.page-contact) .reveal svg :is(.duo-accent,.duo-accent-line){
  transform-box:fill-box; transform-origin:center; /* Safari-safe SVG child transforms */ }
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact) .reveal svg :is(.duo-accent,.duo-accent-line){
    transition:transform .35s cubic-bezier(.16,1,.3,1) .12s, opacity .3s ease .12s; }
  :is(.page-industries,.page-contact) .reveal:not(.in) svg :is(.duo-accent,.duo-accent-line){
    transform:scale(.4); opacity:0; }
}

/* --- 4 · card micro-interactions ------------------------------------------
   Hover lift uses the standalone `translate`/`scale` properties so it never
   fights the reveal system's `transform` entrance. One transition list owns
   everything; --mo-d staggers ONLY the entrance pair (opacity/transform),
   re-implemented here at charter cadence (70ms, capped at 5 steps). -------- */
:is(.page-industries,.page-contact)
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *){
  touch-action:manipulation; position:relative; }
:is(.page-industries,.page-contact)
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *),
:is(.page-industries,.page-contact) .reveal.in
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):nth-child(n){
  transition:opacity var(--mo-t,.45s) ease,
             transform var(--mo-t,.45s) cubic-bezier(.16,1,.3,1),
             translate .2s cubic-bezier(.16,1,.3,1),
             scale .08s ease-out,
             border-color .25s ease;
  transition-delay:var(--mo-d,0s), var(--mo-d,0s), 0s, 0s, 0s; }
/* entrance stagger (entrance pair only, via --mo-d) */
:is(.page-industries,.page-contact) .reveal.in
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):nth-child(2){ --mo-d:.07s; }
:is(.page-industries,.page-contact) .reveal.in
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):nth-child(3){ --mo-d:.14s; }
:is(.page-industries,.page-contact) .reveal.in
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):nth-child(4){ --mo-d:.21s; }
:is(.page-industries,.page-contact) .reveal.in
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):nth-child(n+5){ --mo-d:.28s; }
/* pre-rendered shadow layer (v3-module excluded: its ::after draws corners) */
:is(.page-industries,.page-contact)
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.ct-pilot-grid > *)::after{
  content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  box-shadow:0 16px 34px -20px rgba(10,31,23,.38);
  opacity:0; transition:opacity .25s ease; }
@media (hover:hover) and (pointer:fine){
  :is(.page-industries,.page-contact)
    :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):hover{
    translate:0 -3px; border-color:var(--ds-color-copper-200, rgba(213,105,27,.32)); }
  :is(.page-industries,.page-contact)
    :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.ct-pilot-grid > *):hover::after{ opacity:1; }
}
:is(.page-industries,.page-contact)
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):active{
  scale:.985; }
:is(.page-industries,.page-contact)
  :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):focus-visible{
  outline:2px solid var(--ds-color-copper,#D5691B); outline-offset:3px; }

/* --- 5 · CTA arrow nudge + link underline grow (pointer only) ------------- */
:is(.page-industries,.page-contact) .link-arrow{ position:relative; }
@media (hover:hover) and (pointer:fine){
  :is(.page-industries,.page-contact) :is(.link-arrow,.button) svg{
    transition:transform .25s cubic-bezier(.16,1,.3,1); }
  :is(.page-industries,.page-contact) :is(.link-arrow,.button):hover svg{
    transform:translateX(4px); }
  :is(.page-industries,.page-contact) .link-arrow::after{
    content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
    background:currentColor; transform:scaleX(0); transform-origin:left;
    transition:transform .3s cubic-bezier(.16,1,.3,1); }
  :is(.page-industries,.page-contact) .link-arrow:hover::after{ transform:scaleX(1); }
}

/* --- 6 · stat underline sweep + tabular numerals --------------------------
   Copper rule sweeps under headline counters roughly in sync with the 1.2s
   count-up. Big counters only (never tiny inline figures). ----------------- */
:is(.page-industries,.page-contact) :is(.gv-metric__n,.b-stat .n){ position:relative; }
:is(.page-industries,.page-contact) :is(.gv-metric__n,.b-stat .n)::after{
  content:""; position:absolute; left:0; bottom:-.14em; width:2.2em; height:2px;
  background:var(--ds-color-copper,#D5691B); pointer-events:none;
  transform:scaleX(0); transform-origin:left; }
:is(.page-industries,.page-contact) .reveal.in :is(.gv-metric__n,.b-stat .n)::after{
  transform:scaleX(1); /* settled end state, incl. reduced motion (.in is instant there) */ }
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact) :is(.gv-metric__n,.b-stat .n)::after{
    transition:transform 1.2s cubic-bezier(.16,1,.3,1) .15s; }
}
:is(.page-industries,.page-contact) :is([data-count],.mi-num,.gv-stat__n){
  font-variant-numeric:tabular-nums; }

/* --- 7 · seam draw: rule scales from centre, mark fades in with a turn ----
   Armed by text-reveal.js (.seam-arm); static without JS, end state under
   reduced motion. The rule line lives on .v3-seam__rule::before. ----------- */
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact) .v3-seam.seam-arm .v3-seam__rule::before{
    transform:scaleX(0); transform-origin:center;
    transition:transform .8s cubic-bezier(.16,1,.3,1); }
  :is(.page-industries,.page-contact) .v3-seam.seam-arm .v3-seam__mark{
    opacity:0; transform:rotate(-90deg) scale(.85);
    transition:opacity .45s ease .25s, transform .6s cubic-bezier(.16,1,.3,1) .25s; }
  :is(.page-industries,.page-contact) .v3-seam.seam-arm.in .v3-seam__rule::before{ transform:scaleX(1); }
  :is(.page-industries,.page-contact) .v3-seam.seam-arm.in .v3-seam__mark{ opacity:1; transform:none; }
}

/* --- 8 · gv-chips pop stagger when their .reveal lands --------------------- */
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact)
    :is(.reveal:not(.in) .gv-chips, .gv-chips.reveal:not(.in)) > li{
    opacity:0; transform:translateY(8px) scale(.95); }
  :is(.page-industries,.page-contact) .gv-chips > li{
    transition:opacity .35s ease, transform .45s cubic-bezier(.16,1,.3,1); }
  :is(.page-industries,.page-contact) .gv-chips > li:nth-child(2){ transition-delay:.07s; }
  :is(.page-industries,.page-contact) .gv-chips > li:nth-child(3){ transition-delay:.14s; }
  :is(.page-industries,.page-contact) .gv-chips > li:nth-child(4){ transition-delay:.21s; }
  :is(.page-industries,.page-contact) .gv-chips > li:nth-child(n+5){ transition-delay:.28s; }
}

/* --- 9 · mobile tuning: shorter travel (12px) + 400ms reveals ------------- */
@media (max-width:719px){
  .page-industries, .page-contact{ --mo-t:.4s; } /* card entrance duration */
  .page-industries .reveal, .page-contact .reveal{ transition-duration:.4s; }
  .page-industries .reveal:not(.in), .page-contact .reveal:not(.in){ transform:translateY(12px); }
  .page-industries .reveal:not(.in)
    :is(.ind-jtbd,.pf-tile,.gv-metric,.v3-module,.gv-scard,.iw-row,.b-cell),
  .page-contact .reveal:not(.in)
    :is(.gv-scard,.pp-item,.gv-lane2,.pstep,.gv-stat){ transform:translateY(12px); }
}

/* fling recovery: reveal.js flags already-passed elements for 150ms */
:is(.page-industries,.page-contact) .in-instant,
:is(.page-industries,.page-contact) .in-instant *{transition:none !important}

/* --- 10 · entrance cadence for non-interactive cells -----------------------
   Same rhythm as the card system (one cadence site-wide), no hover layer.
   Replaces the legacy per-cell stagger blocks removed from the page sheets. */
@media (prefers-reduced-motion: no-preference){
  :is(.page-industries,.page-contact) .reveal
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat){
    transition:opacity var(--mo-t,.45s) ease var(--mo-d,0s),
               transform var(--mo-t,.45s) cubic-bezier(.16,1,.3,1) var(--mo-d,0s); }
  :is(.page-industries,.page-contact) .reveal:not(.in)
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat){
    opacity:0; transform:translateY(14px); }
  :is(.page-industries,.page-contact) .reveal.in
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat){ opacity:1; transform:none; }
  :is(.page-industries,.page-contact) .reveal.in
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat):nth-child(2){ --mo-d:.07s; }
  :is(.page-industries,.page-contact) .reveal.in
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat):nth-child(3){ --mo-d:.14s; }
  :is(.page-industries,.page-contact) .reveal.in
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat):nth-child(4){ --mo-d:.21s; }
  :is(.page-industries,.page-contact) .reveal.in
    :is(.ind-jtbd,.gv-metric,.iw-row,.pstep,.gv-stat):nth-child(n+5){ --mo-d:.28s; }
}

/* --- 11 · hover-ON fast (research addendum: instant in, eased out) --------- */
@media (hover:hover) and (pointer:fine){
  :is(.page-industries,.page-contact)
    :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.v3-module,.ct-pilot-grid > *):hover{
    transition-duration:var(--mo-t,.45s), var(--mo-t,.45s), .09s, .08s, .09s; }
  :is(.page-industries,.page-contact)
    :is(.b-cell,.gv-scard,article.gv-lane2,.pp-item,.pf-tile,.ct-pilot-grid > *):hover::after{
    transition-duration:.09s; }
  :is(.page-industries,.page-contact) :is(.link-arrow,.button):hover svg{
    transition-duration:.09s; }
  :is(.page-industries,.page-contact) .link-arrow:hover::after{
    transition-duration:.12s; }
}
