/* ===== Radiant motion enhancer — layers onto the template's own .rv / .rvh / .in reveal (html.mo gates it) ===== */

/* HEADING clip reveal — wipes up as the template also fades the heading in. Reveals on the template's .in class. */
html.mo .rvh, html.mo .rv h1, html.mo .rv h2{clip-path:inset(0 0 112% 0);transition:clip-path 1s cubic-bezier(.2,.8,.25,1) .1s}
html.mo .rvh.in, html.mo .rv.in h1, html.mo .rv.in h2, html.mo .in .rvh, html.mo .in h1, html.mo .in h2{clip-path:inset(0 0 -14% 0)}

/* IMAGE box-open + settle-from-zoom — layered on revealed figures/images */
html.mo .rv figure img, html.mo figure.rv img, html.mo .rv.pfig img, html.mo .rv img.mo-open{clip-path:inset(0 100% 0 0);transform:scale(1.07);transition:clip-path 1.05s cubic-bezier(.76,0,.24,1) .12s, transform 1.5s cubic-bezier(.2,.8,.25,1) .12s}
html.mo .rv.in figure img, html.mo figure.rv.in img, html.mo .rv.pfig.in img, html.mo .in img.mo-open{clip-path:inset(0 0 0 0);transform:scale(1)}

/* PARALLAX — give the hero image room so translation never reveals an edge (motion.js drives transform) */
html.mo .hero-bg{height:124%!important;top:-12%!important;will-change:transform}
html.mo [data-par]{will-change:transform}

@media (prefers-reduced-motion:reduce){
  html.mo .rvh, html.mo .rv h1, html.mo .rv h2, html.mo .rv figure img, html.mo figure.rv img{clip-path:none!important;transform:none!important;transition:none!important}
  html.mo .hero-bg{height:100%!important;top:0!important}
}

/* ===== VIDEO + IMAGE CARD GRID ===== */
.mcards{padding:clamp(58px,7vw,108px) 0}
.mcards .mc-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:36px}
.mcards .mc-head p{max-width:520px;opacity:.72;font-size:1rem;line-height:1.5}
.mcards-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(12px,1.3vw,18px)}
.mcard{position:relative;overflow:hidden;border-radius:16px;background:#0e0d0b;grid-column:span 6;aspect-ratio:16/10}
.mcard.wide{grid-column:span 8}.mcard.tall{grid-column:span 4;aspect-ratio:3/4}
@media (max-width:760px){.mcard,.mcard.wide,.mcard.tall{grid-column:1/-1;aspect-ratio:16/10}}
.mcard video,.mcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.2,.8,.25,1)}
.mcard:hover video,.mcard:hover img{transform:scale(1.05)}
.mcard::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,7,6,.62),rgba(8,7,6,0) 46%);pointer-events:none}
.mcard figcaption{position:absolute;left:16px;right:16px;bottom:14px;z-index:2;color:#fff;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;display:flex;align-items:center;gap:9px;font-weight:600}
.mcard .cdot{width:7px;height:7px;border-radius:50%;background:#c1922f;flex:0 0 auto;box-shadow:0 0 0 4px rgba(193,146,47,.25)}
.mcard .cbadge{position:absolute;top:14px;left:16px;z-index:2;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(12,11,9,.5);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.2);padding:5px 10px;border-radius:20px}