/* The existing .tri-video wrappers and SVG clip paths define the geometry.
   These transforms align the already masked exports inside those wrappers.
   Dimensions are the original MOV canvas, restored before the transform so
   WebM resolution and sample aspect ratio cannot change the composition.
   The small bleed leaves final antialiasing to the original SVG mask. */
.hero-videos .tri-video video[data-hero-fit] {
    position: absolute;
    left: 0;
    top: 0;
    width: var(--hero-media-width);
    height: var(--hero-media-height);
    max-width: none;
    object-fit: fill;
    transform: var(--hero-media-transform);
    transform-origin: 0 0;
}

.hero-videos .tri-video video[data-hero-fit="1"] {
    --hero-media-width: 730px;
    --hero-media-height: 636px;
    --hero-media-transform: matrix(1.001668945, 0.0, 0.000796707, 1.002308264, -3.812219677, -4.050788126);
}

.hero-videos .tri-video video[data-hero-fit="2"] {
    --hero-media-width: 746px;
    --hero-media-height: 612px;
    --hero-media-transform: matrix(0.400248429, -0.0, -0.002314656, 0.421810959, -2.126224698, -2.111852876);
}

/* Exports 3, 7 and 11 are clipped at the original page edge. */

.hero-videos .tri-video video[data-hero-fit="3"] {
    --hero-media-width: 1490px;
    --hero-media-height: 1690px;
    --hero-media-transform: matrix(0.361121002, 0.0, 0.0, 0.361197479, -3.183612342, -2.811110729);
}

.hero-videos .tri-video video[data-hero-fit="4"] {
    --hero-media-width: 920px;
    --hero-media-height: 800px;
    --hero-media-transform: matrix(0.764076787, -0.0, -0.000483031, 0.764299332, -2.881826693, -5.831743325);
}

.hero-videos .tri-video video[data-hero-fit="5"] {
    --hero-media-width: 618px;
    --hero-media-height: 750px;
    --hero-media-transform: matrix(0.813830246, -0.001091505, -0.000736909, 0.812603736, -4.538337505, -2.667689552);
}

.hero-videos .tri-video video[data-hero-fit="6"] {
    --hero-media-width: 1194px;
    --hero-media-height: 1038px;
    --hero-media-transform: matrix(0.247837064, -0.0, 0.000120915, 0.248003528, -1.600212549, -1.838434111);
}

.hero-videos .tri-video video[data-hero-fit="7"] {
    --hero-media-width: 248px;
    --hero-media-height: 778px;
    --hero-media-transform: matrix(0.830681926, 0.0, 0.0, 0.830712092, -3.077859852, -4.650804277);
}

.hero-videos .tri-video video[data-hero-fit="8"] {
    --hero-media-width: 994px;
    --hero-media-height: 1054px;
    --hero-media-transform: matrix(0.593970206, 0.048965205, 0.020630234, 0.601593872, -25.950352541, -23.790095836);
}

.hero-videos .tri-video video[data-hero-fit="9"] {
    --hero-media-width: 1630px;
    --hero-media-height: 1410px;
    --hero-media-transform: matrix(0.208699627, -0.0, -7.4124e-05, 0.208618919, -1.467424843, -1.110558423);
}

/* Export 10 contains both shapes 10 and 13 on one canvas. */

.hero-videos .tri-video video[data-hero-fit="10"] {
    --hero-media-width: 542px;
    --hero-media-height: 736px;
    --hero-media-transform: matrix(0.755243498, -0.0, 0.001357085, 0.754751398, -2.500008335, -2.96268086);
}

.hero-videos .tri-video video[data-hero-fit="11"] {
    --hero-media-width: 780px;
    --hero-media-height: 1288px;
    --hero-media-transform: matrix(0.363946615, 0.0, 0.0, 0.364084805, -2.073226563, -1.865104414);
}

.hero-videos .tri-video video[data-hero-fit="12"] {
    --hero-media-width: 1816px;
    --hero-media-height: 1058px;
    --hero-media-transform: matrix(0.288993822, 0.000408759, -0.000922009, 0.287982582, -1.838791374, -1.159662682);
}

.hero-videos .tri-video video[data-hero-fit="13"] {
    --hero-media-width: 542px;
    --hero-media-height: 736px;
    --hero-media-transform: matrix(0.754504258, 0.0, 0.0, 0.758210059, -248.763984576, -347.132830375);
}
