/* =====================================================================
 * MPT - motion and interaction layer.
 * SOURCE OF TRUTH: build/17-site.css. Deployed to mu-plugins/mpt-assets/site.css.
 * Layout lives in Breakdance selectors; this file only adds motion on top.
 * ===================================================================== */

/* Reveal-from-side animations translate elements past the right edge before they appear;
   clip horizontal overflow at the root (clip, unlike hidden, keeps position: sticky working). */
html, body { overflow-x: clip; }

/* ---------------------------------------------------------------------
 * Hover interactions
 * ------------------------------------------------------------------- */
.blog-ind-card {
  cursor: pointer;
  transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease;
  will-change: transform;
}
.blog-ind-card:hover {
  transform: scale(1.035);
  box-shadow: 0 14px 34px rgba(43, 52, 134, .16);
  z-index: 2;
}
.blog-ind-card .blog-ind-img { transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.blog-ind-card:hover .blog-ind-img { transform: scale(1.06); }
.blog-ind-card .blog-ind-title { transition: color .25s ease; }
.blog-ind-card:hover .blog-ind-title { color: var(--mpt-blue); }
.blog-ind-card .blog-ind-link { transition: color .25s ease; }
.blog-ind-card:hover .blog-ind-link { color: var(--mpt-blue); }
.blog-ind-card .blog-ind-arrow { transition: transform .3s ease; }
.blog-ind-card:hover .blog-ind-arrow { transform: translateX(5px); }
/* Light sweep across the card: a machined-metal glint. */
.blog-ind-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%);
  transform: translateX(-120%);
  transition: transform .9s ease;
}
.blog-ind-card:hover::after { transform: translateX(120%); }

.blog-ind-contact { transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; }
.blog-ind-contact:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(43, 52, 134, .14); }

.blog-btn { transition: background-color .2s ease, transform .25s ease, box-shadow .25s ease; }
.blog-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(43, 52, 134, .28); }
.blog-btn .blog-btn-arrow { transition: transform .3s ease; }
.blog-btn:hover .blog-btn-arrow { transform: translateX(5px); }
.breakdance-form-button__submit { transition: transform .25s ease, box-shadow .25s ease, background-color .2s ease !important; }
.breakdance-form-button__submit:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(43, 52, 134, .28); }

.blog-logo, .blog-logo-hisense { transition: transform .3s ease, filter .3s ease; }
.blog-logo:hover, .blog-logo-hisense:hover { transform: scale(1.08); }

.blog-cert-1, .blog-cert-2 { transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.blog-cert-1:hover, .blog-cert-2:hover { transform: scale(1.06); }

.blog-about-media .swiper-slide { transition: transform .35s ease, box-shadow .35s ease; }
.blog-about-media .swiper-slide-active:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(0,0,0,.22); }

.blog-contact-card { transition: box-shadow .35s ease; }
.blog-contact-card:hover { box-shadow: 0 16px 40px rgba(43, 52, 134, .10); }
.blog-contact-label-row img, .blog-contact-label-row .bde-f-svg-icon2 { transition: transform .3s ease; }
.blog-contact-item:hover .blog-contact-label-row img,
.blog-contact-item:hover .blog-contact-label-row .bde-f-svg-icon2 { transform: translateX(3px) scale(1.1); }

/* ---------------------------------------------------------------------
 * Scroll reveal (classes added by site.js, so nothing is hidden without JS)
 * ------------------------------------------------------------------- */
.mpt-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .75s cubic-bezier(.2,.7,.2,1), transform .75s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--mpt-delay, 0ms);
}
.mpt-reveal.mpt-in { opacity: 1; transform: none; }
.mpt-reveal-left { transform: translateX(-34px); }
.mpt-reveal-right { transform: translateX(34px); }
.mpt-reveal-left.mpt-in, .mpt-reveal-right.mpt-in { transform: none; }
/* Map: reserve its box before the lazy image loads (otherwise height 0 and the reveal never fires). */
.blog-map-img { aspect-ratio: 1536 / 618; }
/* Map: wipes in left to right like a scan. */
.mpt-reveal-wipe {
  opacity: 1;
  transform: none;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.4s cubic-bezier(.65,0,.35,1);
}
.mpt-reveal-wipe.mpt-in { clip-path: inset(0 0 0 0); }
/* Industry cards keep their hover transform once revealed. */
.blog-ind-card.mpt-reveal.mpt-in { transition: opacity .75s cubic-bezier(.2,.7,.2,1), transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s ease; }
.blog-ind-card.mpt-reveal.mpt-in:hover { transform: scale(1.035); }

@media (prefers-reduced-motion: reduce) {
  .mpt-reveal, .mpt-reveal-wipe { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .blog-ind-card::after { display: none; }
}