/*
 * Premium profile listing cards
 *
 * A late, CSS-only layer for loop-show-profile.php. The template deliberately
 * keeps its existing links, CTA hooks, tracking classes, schema attributes,
 * and AJAX-compatible markup; this file only changes their presentation.
 */

.escort-card {
	--profile-card-ink: #f6f1ee;
	--profile-card-muted: rgba(238, 228, 221, 0.68);
	--profile-card-surface: #121112;
	--profile-card-border: rgba(244, 235, 229, 0.1);
	/* One radius hierarchy: container → action surface → compact utility. */
	--profile-card-radius: 16px;
	--profile-card-control-radius: 12px;
	--profile-card-utility-radius: 8px;
	--profile-card-pill-radius: 999px;
	position: relative;
	isolation: isolate;
	border-color: var(--profile-card-border);
	border-radius: var(--profile-card-radius);
	background: var(--profile-card-surface);
	box-shadow: 0 18px 36px -26px rgba(0, 0, 0, 0.92);
	transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 180ms cubic-bezier(0.22, 1, 0.36, 1), border-color 180ms ease;
}

.escort-card:hover {
	transform: translateY(-2px);
	border-color: rgba(244, 235, 229, 0.19);
	box-shadow: 0 26px 44px -28px rgba(0, 0, 0, 0.98);
}

.escort-card .thumb,
.escort-card .thumb.rad3,
.escort-card .thumb.girlpremium {
	background: transparent;
}

.escort-card .thumbwrapper,
.escort-card__media {
	aspect-ratio: 3 / 4;
}

.escort-card .thumbwrapper {
	background: #191617;
	border-radius: var(--profile-card-radius) var(--profile-card-radius) 0 0;
}

.escort-card__media {
	z-index: 1;
	height: auto;
	border-radius: var(--profile-card-radius) var(--profile-card-radius) 0 0;
	background: #191617;
}

.escort-card .mobile-ready-img {
	height: 100%;
	min-height: 100%;
	object-position: center;
	transition: transform 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

.escort-card:hover .mobile-ready-img {
	transform: scale(1.018);
}

/* The primary photograph remains the focal point; legacy bio hover copy is not. */
.escort-card .girl-overlay {
	display: none !important;
}

.escort-card__media::after {
	height: 58%;
	background: linear-gradient(180deg, rgba(14, 12, 13, 0) 4%, rgba(14, 12, 13, 0.08) 30%, rgba(14, 12, 13, 0.62) 73%, rgba(18, 17, 18, 0.98) 100%);
}

.escort-card__media.has-fallback-image::after {
	left: 10px;
	bottom: 10px;
	height: auto;
	border-radius: var(--profile-card-pill-radius);
	background: rgba(13, 12, 13, 0.78);
}

.escort-card__status-badge {
	top: 11px;
	left: 11px;
	z-index: 4;
	min-height: 22px;
	padding: 0 9px;
	border-radius: var(--profile-card-utility-radius);
	border-color: rgba(248, 239, 233, 0.16);
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.18);
}

/* VIP remains recognisable, without competing with the image for attention. */
.escort-card__status-badge--vip {
	border-color: rgba(190, 75, 91, 0.42);
	background: rgba(103, 18, 31, 0.84);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	color: #fde9e4;
	text-shadow: none;
}

.escort-card__media-badges {
	top: 10px;
	right: 10px;
	z-index: 4;
	gap: 4px;
}

.escort-card__media-badge {
	min-height: 24px;
	padding: 0 7px;
	border-radius: var(--profile-card-utility-radius);
	border-color: rgba(248, 239, 233, 0.09);
	background: rgba(13, 12, 13, 0.66);
	box-shadow: none;
}

/* The save control remains a separately tappable media utility when enabled. */
.escort-card .thumbwrapper > .mx-save {
	position: absolute;
	right: 8px;
	bottom: clamp(52px, 17%, 76px);
	z-index: 5;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(248, 239, 233, 0.14);
	border-radius: var(--profile-card-pill-radius);
	background: rgba(15, 13, 14, 0.76);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.24);
	color: var(--profile-card-ink);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

.escort-card .thumbwrapper > .mx-save:hover,
.escort-card .thumbwrapper > .mx-save.is-saved {
	border-color: rgba(230, 196, 106, 0.68);
	background: rgba(54, 40, 18, 0.92);
	color: #f4d77f;
}

.escort-card__body {
	position: relative;
	z-index: 3;
	margin-top: -66px;
	padding: 20px 14px 14px;
	gap: 10px;
	background: linear-gradient(180deg, rgba(18, 17, 18, 0) 0, rgba(18, 17, 18, 0.88) 44px, #121112 72px);
	border: 0;
}

.escort-card__primary-link {
	z-index: 1;
	border-radius: 0 0 var(--profile-card-radius) var(--profile-card-radius);
}

.escort-card__meta,
.escort-card__trust {
	pointer-events: none;
}

.escort-card__meta {
	gap: 5px;
	margin-bottom: 0;
}

.escort-card__name-row {
	gap: 7px;
}

.escort-card__meta .girl-name {
	color: var(--profile-card-ink) !important;
	font-size: 17px;
	font-weight: 750;
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.escort-card__age,
.escort-card__inline-badge {
	min-height: 23px;
	height: 23px;
	border-radius: var(--profile-card-utility-radius);
	background: rgba(15, 13, 14, 0.56);
	border-color: rgba(248, 239, 233, 0.12);
	color: rgba(247, 238, 232, 0.88);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

/* “New” is useful recency context, not a competing promotional badge. */
.escort-card__inline-badge--new {
	min-width: 0;
	min-height: 20px;
	height: 20px;
	padding: 0 6px;
	border-color: rgba(248, 239, 233, 0.1);
	background: rgba(15, 13, 14, 0.32);
	box-shadow: none;
	color: rgba(247, 238, 232, 0.62);
	font-size: 9px;
	font-weight: 650;
	letter-spacing: 0.02em;
	text-transform: none;
}

.escort-card__meta .girl-desc-location {
	color: var(--profile-card-muted) !important;
	font-size: 12px;
	line-height: 1.25;
}

.escort-card__meta .girl-desc-location .icon-location {
	width: 17px;
	height: 17px;
	border: 0;
	border-radius: var(--profile-card-pill-radius);
	background: rgba(247, 238, 232, 0.12);
	color: rgba(247, 238, 232, 0.88);
	box-shadow: none;
}

.escort-card__last-active {
	margin-top: 1px;
	color: rgba(238, 228, 221, 0.54);
	font-size: 10px;
	line-height: 1.3;
}

.escort-card__trust {
	min-height: 0;
}

.escort-card__trust:not(.escort-card__trust--empty) {
	margin-top: -2px;
}

.escort-card__trust .labels {
	gap: 5px;
}

.escort-card__trust .labels .label {
	padding: 3px 7px;
	border-radius: var(--profile-card-pill-radius);
	font-size: 9px;
}

.escort-card .contact-btn {
	z-index: 3;
	min-height: 46px;
	margin-top: 2px !important;
	padding: 9px 13px 9px 11px;
	border-radius: var(--profile-card-control-radius);
	border-color: rgba(248, 239, 233, 0.12);
	background: linear-gradient(180deg, rgba(35, 33, 34, 0.98), rgba(24, 23, 24, 0.98));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
	color: var(--profile-card-ink) !important;
}

.escort-card .contact-btn:hover {
	transform: translateY(-1px);
	border-color: rgba(248, 239, 233, 0.22);
	background: linear-gradient(180deg, rgba(45, 42, 44, 0.98), rgba(28, 26, 27, 0.98));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.escort-card .contact-btn__icon-shell {
	width: 28px;
	height: 28px;
	border-radius: var(--profile-card-pill-radius);
	border-color: rgba(190, 75, 91, 0.34);
	background: rgba(105, 16, 30, 0.36);
	box-shadow: none;
}

.escort-card .contact-btn--profile {
	background: linear-gradient(180deg, rgba(35, 33, 34, 0.98), rgba(24, 23, 24, 0.98));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 10px 18px -18px rgba(0, 0, 0, 0.92);
}

.escort-card .contact-btn--profile:hover {
	background: linear-gradient(180deg, rgba(45, 42, 44, 0.98), rgba(28, 26, 27, 0.98));
}

.escort-card .contact-btn--unlock {
	border-color: rgba(139, 10, 26, 0.5);
	background: linear-gradient(180deg, rgba(64, 24, 31, 0.8), rgba(29, 20, 22, 0.98));
}

/* A desktop reveal is confirmation, not a second primary CTA. */
html.escortwp-contact-reveal .escort-card .contact-btn--call[data-contact-reveal].is-revealed {
	border-color: rgba(190, 75, 91, 0.42);
	background: linear-gradient(180deg, rgba(48, 31, 34, 0.98), rgba(29, 22, 23, 0.98));
}

html.escortwp-contact-reveal .escort-card .contact-btn--call[data-contact-reveal].is-revealed .contact-btn__icon-shell {
	border-color: rgba(190, 75, 91, 0.5);
	background: rgba(105, 16, 30, 0.44);
}

.escort-card :is(.escort-card__media, .escort-card__primary-link, .contact-btn, .mx-save):focus-visible {
	outline: 3px solid #e6c46a;
	outline-offset: -3px;
}

@media screen and (max-width: 640px) {
	.escort-card {
		--profile-card-radius: 14px;
		--profile-card-control-radius: 10px;
		--profile-card-utility-radius: 7px;
	}

	.escort-card .thumbwrapper,
	.escort-card__media {
		border-radius: var(--profile-card-radius) var(--profile-card-radius) 0 0;
	}

	.escort-card__body {
		margin-top: -50px;
		padding: 14px 10px 10px;
		gap: 8px;
		background: linear-gradient(180deg, rgba(18, 17, 18, 0) 0, rgba(18, 17, 18, 0.9) 32px, #121112 56px);
	}

	.escort-card__meta .girl-name {
		font-size: 14px;
	}

	.escort-card__age,
	.escort-card__inline-badge {
		min-height: 22px;
		height: 22px;
		padding-inline: 6px;
		font-size: 10px;
	}

	.escort-card__inline-badge--new {
		min-height: 20px;
		height: 20px;
		padding-inline: 6px;
		font-size: 9px;
	}

	.escort-card__meta .girl-desc-location {
		align-items: flex-start;
		font-size: 11px;
		line-height: 1.3;
	}

	.escort-card__meta .girl-desc-location .icon-location {
		width: 16px;
		height: 16px;
		margin-top: 1px;
	}

	.escort-card__meta .girl-desc-location__text {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		white-space: normal;
	}

	.escort-card .contact-btn {
		/* Keep the action aligned to the card base as optional metadata comes and goes. */
		margin-top: auto !important;
		min-height: 44px;
		padding: 8px 9px;
		gap: 7px;
		font-size: 11px;
	}

	.escort-card .contact-btn__icon-shell {
		width: 27px;
		height: 27px;
	}

	.escort-card .thumbwrapper > .mx-save {
		right: 6px;
		bottom: clamp(44px, 18%, 60px);
	}
}

@media screen and (min-width: 961px) {
	.escort-card__body {
		margin-top: -72px;
		padding: 23px 16px 16px;
	}

	.escort-card .contact-btn {
		min-height: 48px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.escort-card,
	.escort-card .mobile-ready-img,
	.escort-card .contact-btn {
		transition: none;
	}

	.escort-card:hover,
	.escort-card:hover .mobile-ready-img,
	.escort-card .contact-btn:hover {
		transform: none;
	}
}