/* ==========================================================================
   Nostos Hover Card — nostos-hover-card.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   Wrapper
   -------------------------------------------------------------------------- */

.nhc-wrap {
	position: relative;
	overflow: hidden;
	display: block;
	width: 100%;
	cursor: pointer;
	/* height is set via inline style */
}

/* Remove default anchor decoration when wrapper is a link */
a.nhc-wrap,
a.nhc-wrap:hover,
a.nhc-wrap:focus,
a.nhc-wrap:visited {
	text-decoration: none;
	color: inherit;
	outline: none;
}

/* --------------------------------------------------------------------------
   Image
   -------------------------------------------------------------------------- */

.nhc-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.55s ease;
	will-change: transform;
}

.nhc-wrap:hover .nhc-image {
	transform: scale(1.05);
}

/* --------------------------------------------------------------------------
   Overlay — base
   -------------------------------------------------------------------------- */

.nhc-overlay {
	position: absolute;
	inset: 0; /* top:0; right:0; bottom:0; left:0 */
	display: flex;
	align-items: center;
	justify-content: center;
	/* background-color is set via inline style */
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Title
   -------------------------------------------------------------------------- */

.nhc-title {
	font-family: inherit;
	text-align: center;
	text-transform: uppercase;
	line-height: 1.6;
	/* color, font-size, letter-spacing set via inline style */
	padding: 0 1em;
}

/* --------------------------------------------------------------------------
   Animation: fade (default)
   -------------------------------------------------------------------------- */

.nhc-anim-fade .nhc-overlay {
	opacity: 0;
	transition: opacity 0.35s ease;
}

.nhc-anim-fade:hover .nhc-overlay {
	opacity: 1;
}

/* --------------------------------------------------------------------------
   Animation: slide-up
   -------------------------------------------------------------------------- */

.nhc-anim-slide-up .nhc-overlay {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.35s ease, transform 0.35s ease;
}

.nhc-anim-slide-up:hover .nhc-overlay {
	opacity: 1;
	transform: translateY(0);
}

/* --------------------------------------------------------------------------
   Animation: zoom
   -------------------------------------------------------------------------- */

.nhc-anim-zoom .nhc-overlay {
	opacity: 0;
	transform: scale(0.9);
	transition: opacity 0.35s ease, transform 0.35s ease;
}

.nhc-anim-zoom:hover .nhc-overlay {
	opacity: 1;
	transform: scale(1);
}

/* --------------------------------------------------------------------------
   Always-show modifier — overlay visible without hover
   -------------------------------------------------------------------------- */

.nhc-always-show .nhc-overlay {
	opacity: 1 !important;
	transform: none !important;
}

/* Prevent image zoom on always-show variant when not hovered */
.nhc-always-show .nhc-image {
	transform: scale(1);
}

.nhc-always-show:hover .nhc-image {
	transform: scale(1.05);
}

/* --------------------------------------------------------------------------
   Touch-active state (toggled by JS on mobile tap)
   -------------------------------------------------------------------------- */

.nhc-wrap.nhc-touch-active .nhc-overlay {
	opacity: 1 !important;
	transform: none !important;
}