/* ═══════════════════════════════════════════════════════════════════
 * Ajaia — About · new section styles (Mission/Vision, Ecosystem,
 * Leadership, Impact, Global Reach). Builds on page.css + DS tokens.
 * ═══════════════════════════════════════════════════════════════════ */

/* ── Why We Began · graph header ── */
.why .founder-grid{ margin-top: clamp(40px,5vw,64px); }
.why-graph-head{ max-width: 720px; margin: 0 auto clamp(20px,3vw,36px); text-align:center; }
.why-graph-head h3{ font-family:var(--font-display); font-weight:700; color:var(--ink-900);
  font-size: clamp(22px,2.4vw,32px); letter-spacing:-.02em; line-height:1.18; margin:0; }
.why-graph-head p{ color:var(--ink-muted); font-size: clamp(15px,1.3vw,17px); line-height:1.6; margin:14px auto 0; max-width:60ch; }

/* ═══════════════ 2 · MISSION & VISION (split-screen) ═══════════════ */
.mv{ padding-block: clamp(64px,9vh,120px) 0; overflow:hidden; }
.mv-head{ margin-bottom: clamp(28px,4vw,52px); }
.mv-head h2{ font-family:var(--font-display); font-weight:700; color:#fff; font-size:clamp(26px,3.2vw,42px); line-height:1.12; letter-spacing:-.022em; margin:14px 0 0; max-width:20ch; }
.mv-split{ display:flex; min-height: clamp(440px, 62vh, 640px); border-top:1px solid var(--hair); }
.mv-panel{ position:relative; flex:1 1 0; overflow:hidden; cursor:default; isolation:isolate;
  border-left:1px solid var(--hair); transition: flex-grow .6s var(--ease);
  display:flex; align-items:flex-end; padding: clamp(28px,4vw,64px); }
.mv-panel:first-child{ border-left:none; }
.mv-panel::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(180deg, rgba(2,10,38,0) 0%, rgba(2,10,38,.35) 52%, rgba(2,10,38,.8) 100%); }
.mv-canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:.95; pointer-events:none; transition: opacity .5s var(--ease); }
.mv-body{ position:relative; z-index:2; max-width: 46ch; }
.mv-tag{ display:inline-block; font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color: var(--ink-900); background: var(--sky-400); padding:5px 12px; margin-bottom:18px; }
.mv-panel[data-mv="vision"] .mv-tag{ background: var(--cream-100); }
.mv-body h3{ font-family:var(--font-display); font-weight:700; color:#fff; font-size:clamp(22px,2.4vw,32px);
  line-height:1.16; letter-spacing:-.02em; margin:0; }
.mv-body p{ color: var(--sky-100); font-size:clamp(15px,1.25vw,17px); line-height:1.62; margin:16px 0 0; }
.mv-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;
  max-height:0; opacity:0; overflow:hidden; transition: max-height .55s var(--ease), opacity .4s var(--ease), margin-top .5s var(--ease); }
.mv-list li{ position:relative; padding-left:26px; color:#fff; font-size:14.5px; line-height:1.45; }
.mv-list li::before{ content:""; position:absolute; left:0; top:7px; width:9px; height:9px; background: var(--sky-400); }
.mv-panel[data-mv="vision"] .mv-list li::before{ background: var(--cream-100); }
.mv-panel:hover{ flex-grow:1.7; }
.mv-panel:hover .mv-canvas{ opacity:1; }
.mv-panel:hover .mv-list{ max-height:220px; opacity:1; margin-top:22px; }
/* without :hover support (touch) reveal lists by default */
@media (hover:none){ .mv-list{ max-height:220px; opacity:1; margin-top:22px; } }

/* ═══════════════ 4 · ECOSYSTEM (What Makes Us Different) ═══════════════ */
.eco-stage{ position:relative; margin-top: clamp(36px,5vw,64px); height: clamp(440px,52vw,600px);
  border:1px solid var(--card-bd); background:
    radial-gradient(80% 80% at 50% 46%, rgba(151,194,247,.16), transparent 70%), #fff;
  overflow:hidden; }
#ecoCanvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }
.eco-nodes{ position:absolute; inset:0; z-index:2; }
.eco-node{ position:absolute; transform: translate(-50%,-50%); cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.eco-node .bub{ width: var(--sz,62px); height: var(--sz,62px); border-radius:50%;
  background: #fff; border:1.5px solid var(--ink-900); color: var(--ink-900);
  display:grid; place-items:center; box-shadow: var(--shadow-1); transition: transform .3s var(--ease), box-shadow .3s, background .3s, color .3s; }
.eco-node.center .bub{ background: var(--ink-900); color:#fff; border-color: var(--ink-900); --sz:96px; }
.eco-node .bub svg{ width:42%; height:42%; }
.eco-node .bub img{ width:60%; height:60%; object-fit:contain; display:block; }
.eco-node .lab{ font-weight:600; font-size:13.5px; color:var(--ink-900); letter-spacing:-.01em; white-space:nowrap; transition: color .3s; }
.eco-node:hover .bub, .eco-node.active .bub{ transform: scale(1.12); box-shadow: var(--shadow-2);
  background: var(--sky-400); color: var(--ink-900); border-color: var(--sky-400); }
.eco-node.center:hover .bub, .eco-node.center.active .bub{ background: var(--ink-900); color:#fff; transform:scale(1.06); }
.eco-detail{ position:absolute; left: clamp(18px,3vw,32px); bottom: clamp(18px,3vw,32px); z-index:3;
  width: min(340px, 70%); background: rgba(255,255,255,.86); backdrop-filter: blur(10px);
  border:1px solid var(--card-bd); border-left:3px solid var(--sky-400); padding:20px 22px;
  box-shadow: var(--shadow-1); opacity:0; transform: translateY(10px); transition: opacity .35s var(--ease), transform .35s var(--ease); pointer-events:none; }
.eco-detail.show{ opacity:1; transform:none; }
.eco-detail .et{ font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--ink-900); margin:0 0 6px; letter-spacing:-.01em; }
.eco-detail .ed{ font-size:14px; line-height:1.55; color:var(--ink-muted); margin:0; }
.eco-hint{ position:absolute; right: clamp(16px,3vw,28px); top: clamp(16px,3vw,28px); z-index:3;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; color:var(--ink-subtle); display:flex; align-items:center; gap:8px; }
.eco-hint::before{ content:""; width:8px; height:8px; background:var(--sky-400); }

/* ═══════════════ 4 · AI TRANSFORMATION MODEL ═══════════════ */
#transformation.tmpl--classic{ padding:clamp(70px,8vw,118px) 0; background:#fff; color:var(--ink-900); overflow:hidden; scroll-margin-top:92px; }
#transformation .xform{ width:min(1180px, calc(100% - clamp(36px,8vw,96px))); margin:0 auto; }
#transformation .xform__head{ display:grid; justify-items:center; gap:clamp(14px,1.8vw,22px); margin-bottom:clamp(34px,4.8vw,62px); text-align:center; }
#transformation .xform__title{ max-width:980px; margin:0; color:var(--ink-900); font-family:var(--font-display);
  font-size:clamp(32px,4.1vw,56px); line-height:1.06; font-weight:680; letter-spacing:-.02em; }
#transformation .xform__head p{ max-width:990px; margin:0; color:var(--ink-muted); font-family:var(--font-sans);
  font-size:clamp(15px,1.28vw,19px); line-height:1.6; font-weight:400; }
#transformation .xform__body{ display:grid; justify-items:center; align-items:center; }
#transformation .xform__body[data-reveal]{ opacity:1; transform:none; transition:none; }
#transformation .xform-stack{ position:relative; width:min(100%,980px); min-height:clamp(520px,48vw,640px); margin-inline:auto;
  background:
    linear-gradient(rgba(0,29,107,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,29,107,.035) 1px, transparent 1px);
  background-size:56px 56px;
}
#transformation .xform-stack-art{ position:absolute; inset:clamp(22px,3.8vw,46px) 0 auto; width:min(52vw,520px); height:clamp(330px,31vw,400px); left:50%; transform:translateX(-50%); }
#transformation .xform-iso{ --top:#6ea4e6; --side:#2478be; --deep:#00527f; position:absolute; left:50%; top:50%; width:min(76%,390px); height:clamp(96px,8.4vw,122px);
  transform:translate(-50%,-50%); opacity:1; filter:drop-shadow(0 18px 18px rgba(0,29,107,.10)); }
#transformation .xform-iso::before,
#transformation .xform-iso::after{ content:""; position:absolute; inset:0; }
#transformation .xform-iso::before{ clip-path:polygon(50% 0,90% 24%,50% 49%,10% 24%); }
#transformation .xform-iso::before{ background:var(--top); }
#transformation .xform-iso::after{ background:linear-gradient(90deg,var(--deep) 0 50%,var(--side) 50%); clip-path:polygon(10% 24%,50% 49%,90% 24%,90% 44%,50% 72%,10% 44%); z-index:-1; filter:brightness(.94); }
#transformation .xform-iso--org{ --top:var(--sky-300); --side:#7eaae3; --deep:#668fc8; top:10%; z-index:5; }
#transformation .xform-iso--build{ --top:var(--sky-400); --side:#6ea4e6; --deep:#4f83c9; top:28%; z-index:4; }
#transformation .xform-iso--process{ --top:var(--sky-500); --side:#3f83d7; --deep:#236ab7; top:46%; z-index:3; }
#transformation .xform-iso--people{ --top:var(--ink-600); --side:#0b2e8e; --deep:#052782; top:64%; z-index:2; }
#transformation .xform-iso--strategy{ --top:var(--ink-900); --side:#001752; --deep:#000f38; top:82%; z-index:1; }
#transformation .xform__body.in .xform-iso--strategy{ animation:xformStack .52s cubic-bezier(.32,.72,0,1) .02s both; }
#transformation .xform__body.in .xform-iso--people{ animation:xformStack .52s cubic-bezier(.32,.72,0,1) .09s both; }
#transformation .xform__body.in .xform-iso--process{ animation:xformStack .52s cubic-bezier(.32,.72,0,1) .16s both; }
#transformation .xform__body.in .xform-iso--build{ animation:xformStack .52s cubic-bezier(.32,.72,0,1) .23s both; }
#transformation .xform__body.in .xform-iso--org{ animation:xformCap .52s cubic-bezier(.32,.72,0,1) .32s both; }
#transformation .xform-callout{ position:absolute; z-index:8; width:min(260px,28vw); display:grid; gap:5px; color:var(--ink-900); font-size:13px; line-height:1.3; }
#transformation .xform-callout::before{ content:""; position:absolute; top:21px; width:clamp(66px,7vw,108px); height:1px; background:rgba(0,29,107,.32); }
#transformation .xform-callout::after{ content:""; position:absolute; top:15px; width:13px; height:13px; background:var(--ink-900); box-shadow:0 0 0 5px #fff; }
#transformation .xform-callout span{ width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--sky-400); background:#fff; color:var(--ink-900); font-family:var(--font-mono); font-size:11px; letter-spacing:.02em; }
#transformation .xform-callout b{ font-family:var(--font-display); font-size:clamp(15px,1.35vw,19px); line-height:1.1; font-weight:560; letter-spacing:0; }
#transformation .xform-callout small{ color:var(--ink-muted); font-size:12.5px; line-height:1.35; }
#transformation .xform-callout--org{ left:0; top:8%; text-align:right; justify-items:end; }
#transformation .xform-callout--org::before{ left:100%; }
#transformation .xform-callout--org::after{ left:calc(100% + clamp(70px,8vw,120px)); }
#transformation .xform-callout--build{ right:0; top:20%; }
#transformation .xform-callout--build::before{ right:100%; }
#transformation .xform-callout--build::after{ right:calc(100% + clamp(70px,8vw,120px)); }
#transformation .xform-callout--process{ left:0; top:31%; text-align:right; justify-items:end; }
#transformation .xform-callout--process::before{ left:100%; }
#transformation .xform-callout--process::after{ left:calc(100% + clamp(70px,8vw,120px)); }
#transformation .xform-callout--people{ right:0; top:43%; }
#transformation .xform-callout--people::before{ right:100%; }
#transformation .xform-callout--people::after{ right:calc(100% + clamp(70px,8vw,120px)); }
#transformation .xform-callout--strategy{ left:0; top:53%; text-align:right; justify-items:end; }
#transformation .xform-callout--strategy::before{ left:100%; background:rgba(0,29,107,.54); }
#transformation .xform-callout--strategy::after{ left:calc(100% + clamp(70px,8vw,120px)); background:var(--ink-900); }
#transformation .xform-proof{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:clamp(34px,4.8vw,58px); border:1px solid var(--card-bd);
  background:var(--card-bd); box-shadow:var(--shadow-1); }
#transformation .xform-proof div{ display:grid; gap:8px; align-content:start; min-height:150px; padding:clamp(20px,2.6vw,30px); background:#fff; }
#transformation .xform-proof b{ color:var(--ink-900); font-family:var(--font-display); font-size:clamp(17px,1.35vw,21px); line-height:1.16; font-weight:650; }
#transformation .xform-proof span{ color:var(--ink-muted); font-size:14px; line-height:1.52; }
@keyframes xformStack{ 0%{ opacity:0; transform:translate(-50%,-32%) scale(.94); } 100%{ opacity:1; transform:translate(-50%,-50%) scale(1); } }
@keyframes xformCap{ 0%{ opacity:0; transform:translate(-50%,-68%) scale(.94); } 100%{ opacity:1; transform:translate(-50%,-50%) scale(1); } }

/* ═══════════════ 5 · LEADERSHIP / TEAM ═══════════════ */
.team-head{ max-width: 760px; margin: 26px 0 clamp(36px,5vw,56px); }
.team-head h2{ font-family:var(--font-display); font-weight:700; color:#fff; font-size:clamp(26px,3.2vw,42px); line-height:1.14; letter-spacing:-.022em; margin:0; }
.team-head .lead{ color: var(--sky-100); margin-top:18px; }
.team-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:18px; }
.tm-card{ position:relative; overflow:hidden; padding:24px 22px 26px; border:1px solid rgba(255,255,255,.12);
  background: rgba(151,194,247,.06); backdrop-filter: blur(8px); transition: transform .4s var(--ease), border-color .4s, background .4s; }
.tm-card::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0; transition:opacity .4s var(--ease);
  background: radial-gradient(180px 180px at var(--mx,50%) var(--my,30%), rgba(151,194,247,.22), transparent 70%); }
.tm-card:hover{ transform: translateY(-6px); border-color: rgba(151,194,247,.4); background: rgba(151,194,247,.1); }
.tm-card:hover::before{ opacity:1; }
.tm-card > *{ position:relative; z-index:1; }
.tm-portrait{ position:relative; aspect-ratio:1/1; margin-bottom:18px; border:1px solid rgba(151,194,247,.2);
  background: radial-gradient(120% 100% at 50% 0%, rgba(151,194,247,.14), rgba(2,12,46,.4)); overflow:hidden; }
.tm-portrait canvas{ position:absolute; inset:0; width:100%; height:100%; }
.tm-portrait .ini{ position:absolute; inset:0; display:grid; place-items:center; font-family:var(--font-display);
  font-weight:700; font-size:42px; color: rgba(255,255,255,.92); letter-spacing:-.02em; z-index:2; }
.tm-card h4{ font-family:var(--font-display); font-weight:700; font-size:18px; color:#fff; margin:0; letter-spacing:-.01em; }
.tm-card .role{ font-size:13px; color: var(--sky-300); margin:4px 0 12px; }
.tm-card p{ font-size:13.5px; line-height:1.55; color: rgba(225,238,255,.78); margin:0; }

/* ═══════════════ 6 · IMPACT & RESULTS (dashboard) ═══════════════ */
.impact-grid{ display:grid; grid-template-columns: repeat(3, minmax(190px,1fr)); grid-auto-rows: minmax(160px, auto); gap:18px; margin-top: clamp(36px,5vw,56px); }
.metric-tile{ position:relative; overflow:hidden; padding:22px 24px; border:1px solid var(--card-bd); background:#fff;
  box-shadow: var(--shadow-1); display:flex; flex-direction:column; }
.metric-tile.big{ grid-column: span 1; grid-row: span 1; background: var(--ink-900); border-color: var(--ink-900); padding-inline:18px; }
.metric-tile.wide{ grid-column: 2 / -1; grid-row: span 1; min-height:300px; }
.mt-label{ font-size:13px; color: var(--ink-subtle); letter-spacing:.01em; }
.metric-tile.big .mt-label{ color: var(--sky-200); }
.mt-val{ font-family:var(--font-display); font-weight:700; color:var(--ink-900); font-size:clamp(34px,3.6vw,52px); line-height:1; letter-spacing:-.025em; margin-top:10px; }
.metric-tile.big .mt-val{ color:#fff; font-size:clamp(42px,4.3vw,55px); margin-top:14px; text-align:center; white-space:nowrap; letter-spacing:-.045em; }
.mt-foot{ font-size:13px; color:var(--ink-muted); margin-top:auto; padding-top:14px; line-height:1.45; }
.metric-tile.big .mt-foot{ color: var(--sky-100); }
.mt-spark{ width:100%; height:54px; margin-top:16px; }
.mt-chart{ width:100%; height:220px; flex:0 0 220px; min-height:0; margin-top:14px; }
.mt-legend{ display:flex; gap:18px; margin-top:12px; font-size:12.5px; color:var(--ink-muted); }
.mt-legend i{ display:inline-block; width:11px; height:11px; margin-right:6px; vertical-align:-1px; }
.mt-legend i.navy{ background: var(--ink-700); } .mt-legend i.sky{ background: var(--sky-400); }

/* ═══════════════ 7 · GLOBAL REACH ═══════════════ */
.reach-grid{ display:grid; grid-template-columns: 1fr 1.05fr; gap: clamp(32px,5vw,72px); align-items:center; }
.reach-copy h2{ font-family:var(--font-display); font-weight:700; color:#fff; font-size:clamp(26px,3.2vw,42px); line-height:1.14; letter-spacing:-.022em; margin:14px 0 0; max-width:18ch; }
.reach-copy .lead{ color: var(--sky-100); margin-top:18px; max-width:46ch; }
.reach-stats{ list-style:none; margin:32px 0 0; padding:0; display:flex; gap: clamp(20px,3vw,40px); flex-wrap:wrap; }
.reach-stats li{ display:flex; flex-direction:column; gap:4px; }
.reach-stats b{ font-family:var(--font-display); font-weight:700; font-size:clamp(28px,3vw,40px); color: var(--cream-100); letter-spacing:-.02em; line-height:1; }
.reach-stats span{ font-size:13px; color: var(--sky-200); }
.globe-wrap{ position:relative; aspect-ratio:1/1; max-width: 560px; margin-inline:auto; width:100%; }
#globeCanvas{ position:absolute; inset:0; width:100%; height:100%; }
.globe-hq{ position:absolute; left:50%; bottom:2%; transform:translateX(-50%); z-index:2; white-space:nowrap;
  display:flex; align-items:center; gap:8px; font-size:12.5px; color: var(--sky-100);
  background: rgba(4,14,46,.6); border:1px solid rgba(151,194,247,.2); backdrop-filter: blur(8px); padding:7px 14px; }
.globe-hq .sq{ width:9px; height:9px; background: var(--sky-400); box-shadow:0 0 10px var(--sky-400); }

/* ── CTA extra button row ── */
.cta-card .cta-row{ gap:14px; flex-wrap:wrap; }
.cta-card .eyebrow{ margin-bottom:18px; }

/* ═══════════════ Responsive ═══════════════ */
@media (max-width: 1040px){
  .team-grid{ grid-template-columns: repeat(2,1fr); }
  .impact-grid{ grid-template-columns: repeat(2,1fr); }
  .metric-tile.wide{ grid-column: span 2; }
  #transformation .xform{ width:min(100% - 32px, 860px); }
  #transformation .xform-stack{ width:min(100%,760px); }
}
@media (max-width: 900px){
  .mv-split{ flex-direction:column; min-height:0; }
  .mv-panel{ border-left:none; border-top:1px solid var(--hair); min-height: 420px; }
  .mv-panel:first-child{ border-top:none; }
  .mv-list{ max-height:200px; opacity:1; }
  .reach-grid{ grid-template-columns: 1fr; }
  .reach-copy{ text-align:center; } .reach-copy .eyebrow{ justify-content:center; } .reach-copy .lead{ margin-inline:auto; } .reach-stats{ justify-content:center; }
}
@media (max-width: 620px){
  .team-grid{ grid-template-columns: 1fr; }
  .impact-grid{ grid-template-columns: 1fr; }
  .metric-tile.wide, .metric-tile.big{ grid-column: span 1; grid-row: auto; }
  .section-head{ max-width:none; }
  #transformation.tmpl--classic{ padding:56px 0; overflow:visible; }
  #transformation .xform__head{ margin-bottom:24px; }
  #transformation .xform__title{ font-size:clamp(28px,8vw,38px); }
  #transformation .xform__head p{ font-size:14px; }
  #transformation .xform-proof{ grid-template-columns:1fr; }
  #transformation .xform-proof div{ min-height:0; }
  .eco-stage{ height:560px; margin-inline:-18px; border-inline:0; }
  .eco-node .bub{ --sz:48px; }
  .eco-node.center .bub{ --sz:72px; }
  .eco-node .lab{ max-width:92px; white-space:normal; font-size:12px; line-height:1.2; }
  .eco-detail{ left:18px; right:18px; bottom:18px; width:auto; padding:16px; }
  .eco-hint{ display:none; }
  .metric-tile{ padding:20px; min-height:150px; }
  .metric-tile.big .mt-val{ font-size:48px; }
  .mt-chart{ height:180px; flex-basis:180px; min-height:0; }
  .mt-legend{ flex-wrap:wrap; gap:10px 16px; }
}

@media (max-width: 760px){
  #transformation.tmpl--classic{ padding:60px 0; }
  #transformation .xform{ width:min(100% - 32px, 640px); }
  #transformation .xform__head{ gap:12px; margin-bottom:28px; }
  #transformation .xform__title{ font-size:clamp(30px,7vw,44px); line-height:1.08; }
  #transformation .xform__head p{ max-width:38rem; font-size:15px; line-height:1.5; }
  #transformation .xform-stack{ width:100%; min-height:0; display:grid; gap:22px; }
  #transformation .xform-stack-art{ position:relative; inset:auto; left:auto; transform:none; width:min(100%,420px); height:320px; margin-inline:auto; }
  #transformation .xform-callout{ position:relative; inset:auto; width:100%; display:grid; grid-template-columns:34px minmax(0,1fr); align-items:start; gap:4px 12px; text-align:left; justify-items:start; padding:0 0 0 0; }
  #transformation .xform-callout::before,
  #transformation .xform-callout::after{ display:none; }
  #transformation .xform-callout span{ grid-row:1 / span 2; width:30px; height:30px; font-size:11px; border-radius:0; }
  #transformation .xform-callout b{ font-size:18px; }
  #transformation .xform-callout small{ font-size:13px; }
  .impact-grid{ gap:14px; }
  .metric-tile{ min-height:138px; }
}

@media (max-width: 480px){
  #transformation.tmpl--classic{ padding:50px 0; }
  #transformation .xform{ width:min(100% - 28px, 420px); }
  #transformation .xform__title{ font-size:clamp(28px,9vw,36px); }
  #transformation .xform__head p{ font-size:14px; }
  #transformation .xform-stack-art{ height:280px; }
  #transformation .xform-iso{ width:86%; height:92px; }
  #transformation .xform-callout b{ font-size:17px; }
  #transformation .xform-callout small{ font-size:12.5px; }
  .metric-tile{ padding:18px; min-height:128px; }
  .mt-label{ font-size:12.5px; }
  .mt-val{ font-size:clamp(34px,11vw,46px); }
  .metric-tile.big .mt-val{ font-size:clamp(42px,13vw,50px); }
  .mt-foot{ font-size:12.5px; }
}
@media (prefers-reduced-motion: reduce){
  #transformation .xform-iso{ animation:none !important; opacity:1 !important; }
}