/* Start custom CSS */.elementor-element-244e14ff, .elementor-element-1cbba84b, .elementor-element-293c1cd5, .elementor-element-1a380fd6, .elementor-element-49472726, .elementor-element-319a4c5b { transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.4s ease; will-change: transform; }
.elementor-element-244e14ff:hover, .elementor-element-1cbba84b:hover, .elementor-element-293c1cd5:hover, .elementor-element-1a380fd6:hover, .elementor-element-49472726:hover, .elementor-element-319a4c5b:hover { box-shadow: 0 16px 32px rgba(8, 16, 32, 0.25); }
/* make every card fully clickable via its link */
.hn-card { position: relative; cursor: pointer; }
.elementor .hn-card-body { position: static !important; }
.elementor-element-21c78366, .elementor-element-47787d75, .elementor-element-516fbdc5, .elementor-element-1165701f, .elementor-element-3f6d3a14, .elementor-element-75192eae { position: relative; cursor: pointer; }
.hn-more::after, .hn-card a.e-button-base::after { content: ""; position: absolute; inset: 0; z-index: 2; }
/* video marquee: slides left to right, pauses on hover */
.hn-marquee { width: 100%; overflow: hidden; padding: 16px 0 34px; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
.hn-marquee-track { display: flex; width: max-content; animation: hn-marquee-ltr 100s linear infinite; }
.hn-marquee:hover .hn-marquee-track { animation-play-state: paused; }
.hn-vid { position: relative; flex: 0 0 auto; width: 500px; aspect-ratio: 16 / 9; margin-right: 26px; border-radius: 16px; overflow: hidden; box-shadow: 0 12px 28px rgba(8, 16, 32, 0.2); transition: transform 0.35s ease, box-shadow 0.35s ease; }
.hn-vid:hover { transform: translateY(-6px); box-shadow: 0 20px 38px rgba(8, 16, 32, 0.3); }
.hn-vid img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hn-vid::before { content: ""; position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 50%; background: rgba(13, 27, 51, 0.62); border: 2px solid rgba(255, 255, 255, 0.85); z-index: 1; }
.hn-vid::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -11px 0 0 -7px; border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent #fff; z-index: 2; }
@keyframes hn-marquee-ltr { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@media (max-width: 1024px) { .hn-vid { width: 400px; } }
@media (max-width: 767px) { .hn-vid { width: 290px; margin-right: 18px; } .hn-vid::before { width: 56px; height: 56px; margin: -28px 0 0 -28px; } .hn-vid::after { margin: -9px 0 0 -6px; border-width: 9px 0 9px 15px; } }
@media (prefers-reduced-motion: reduce) { .hn-marquee-track { animation: none; } .hn-marquee { overflow-x: auto; } }/* End custom CSS */