/* ============================================================
   JET ATLAS — ht-partners (slanted partner-logo ribbon)
   A faithful clone of the restaurant .re-band: lime strip tilted
   -1.3deg, bleeding off both edges, handing a light section above
   over to the dark section below.
   Logos are supplied as BLACK line art on transparency, so the wall
   reads as one ink family on the lime. Don't add a brightness(0)
   filter: it would flatten any logo carrying its own dark plate
   (a wordmark on a black bar would go black-on-black) — instead the
   artwork itself is prepared mono. They sit slightly muted and lift
   to full strength on hover.
   ============================================================ */

/* Only the DARK half is painted. The upper half stays transparent so the seam
   melts into whatever section sits above instead of stamping a white band. */
.ht-partners { position: relative; background: linear-gradient(180deg, transparent 50%, var(--ht-ink, #0a0a0a) 50%); padding: clamp(15px,1.9vw,21px) 0; overflow: clip; }
/* dark section ABOVE the ribbon → flip the seam (ink on top, light below) */
.ht-partners--flip { background: linear-gradient(180deg, var(--ht-ink, #0a0a0a) 50%, transparent 50%); }

.ht-partners__strip { width: 104%; margin-left: -2%; background: var(--ht-lime, #dcff00); transform: rotate(-1.3deg); box-shadow: 0 24px 60px -30px rgba(220,255,0,.55); overflow: hidden; }

.ht-partners__track { display: inline-flex; align-items: center; white-space: nowrap; padding: clamp(14px,1.8vw,20px) 0; will-change: transform; animation: ht-partners-marq 32s linear infinite; }
.ht-partners:hover .ht-partners__track { animation-play-state: paused; }

.ht-partners__item { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; padding: 0 clamp(16px,2.2vw,32px); text-decoration: none; }

/* height MUST be !important: Elementor ships `.elementor img{height:auto}` (0,1,1),
   which outranks this single-class rule and was forcing logos to natural size. */
.ht-partners__logo { height: clamp(58px,5.6vw,76px) !important; width: auto !important; max-width: none !important; object-fit: contain; display: block;
	opacity: .9;
	transition: opacity .4s var(--ht-ease, cubic-bezier(.22,1,.36,1)), transform .4s var(--ht-ease, cubic-bezier(.22,1,.36,1)); }
a.ht-partners__item:hover .ht-partners__logo,
a.ht-partners__item:focus-visible .ht-partners__logo { opacity: 1; transform: translateY(-2px) scale(1.04); }

/* text fallback when a partner has no logo image (matches .re-band__item) */
.ht-partners__name { font-family: var(--ht-ui); font-weight: 700; font-size: 12px; letter-spacing: 1.7px; text-transform: uppercase; color: var(--ht-ink); opacity: .82; transition: opacity .3s var(--ht-ease, ease); }
a.ht-partners__item:hover .ht-partners__name { opacity: 1; }

.ht-partners__x { color: rgba(10,10,10,.42); font-size: 8.5px; }

a.ht-partners__item:focus-visible { outline: 2px solid var(--ht-ink, #0a0a0a); outline-offset: 3px; border-radius: 3px; }

@keyframes ht-partners-marq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* editor empty-state hint */
.ht-partners--empty { padding: 40px 24px; text-align: center; background: #f5f5f2; color: #50575e; font-family: var(--ht-ui); border: 1px dashed #c9c9c2; }

/* motion off → static, still browsable */
@media (prefers-reduced-motion: reduce) {
	.ht-partners__track { animation: none; }
	.ht-partners__strip { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
