/* =========================================================================
 * CCW Deck Showcase — deck box + fanned sample cards (pink + gold).
 * ===================================================================== */

.ccw-dshow { position: relative; width: 100%; overflow: hidden; }
.ccw-dshow::before {
	content: "";
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 1;
	pointer-events: none;
	z-index: 0;
}

.ccw-dshow__inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: var(--ccw-dshow-media-w, 46%) 1fr;
	align-items: center;
	gap: clamp(32px, 5vw, 60px);
	padding-block: var(--ccw-space-8);
}
.ccw-dshow--media-right .ccw-dshow__media { order: 2; }

/* ---- Media (deck + cards) ---- */
.ccw-dshow__media { position: relative; display: flex; align-items: center; justify-content: center; min-height: 320px; }
.ccw-dshow__media--arc::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 86%;
	aspect-ratio: 1 / 1;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	border: 2px solid var(--ccw-gold);
	opacity: 0.6;
	z-index: 0;
	pointer-events: none;
}

.ccw-dshow__deck { position: relative; z-index: 1; width: 300px; max-width: 70%; }
.ccw-dshow__deck img { width: 100%; height: auto; display: block; border-radius: 12px; filter: drop-shadow(0 26px 46px rgba(42, 30, 44, 0.3)); }

/* ---- Fanned cards (default) ---- */
.ccw-dshow__cards { position: absolute; z-index: 2; display: flex; }
.ccw-dshow__card { width: var(--ccw-dshow-card-w, 130px); transition: transform 0.4s var(--ccw-ease-out); }
.ccw-dshow__card img { width: 100%; height: auto; display: block; border-radius: 12px; box-shadow: 0 16px 36px rgba(42, 30, 44, 0.28); border: 3px solid #fff; }

.ccw-dshow--cards-fan .ccw-dshow__cards { right: -8%; bottom: 2%; align-items: flex-end; }
.ccw-dshow--cards-fan .ccw-dshow__card { margin-left: calc(var(--ccw-dshow-card-w, 130px) * -0.45); transform-origin: bottom center; }
.ccw-dshow--cards-fan .ccw-dshow__card:first-child { margin-left: 0; }
.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(1) { transform: rotate(calc(var(--ccw-dshow-fan, 11deg) * -1)) translateY(4px); }
.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(2) { transform: rotate(var(--ccw-dshow-fan, 11deg)); z-index: 2; }
.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(3) { transform: rotate(calc(var(--ccw-dshow-fan, 11deg) * 2)) translateY(8px); }
.ccw-dshow--cards-fan .ccw-dshow__media:hover .ccw-dshow__card:nth-child(1) { transform: rotate(calc(var(--ccw-dshow-fan, 11deg) * -1.6)) translate(-8px, -2px); }
.ccw-dshow--cards-fan .ccw-dshow__media:hover .ccw-dshow__card:nth-child(3) { transform: rotate(calc(var(--ccw-dshow-fan, 11deg) * 2.6)) translate(8px, 2px); }

/* ---- Neat row variant ---- */
.ccw-dshow--cards-row .ccw-dshow__media { flex-direction: column; gap: 22px; }
.ccw-dshow--cards-row .ccw-dshow__cards { position: static; gap: 16px; }
.ccw-dshow--cards-row .ccw-dshow__card { transform: none; }
.ccw-dshow--cards-row .ccw-dshow__card img { border-width: 2px; }

/* ---- Content ---- */
.ccw-dshow__content { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.ccw-dshow__eyebrow { font-family: var(--ccw-font-body); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ccw-rose-deep); }
.ccw-dshow__title { font-family: var(--ccw-font-display); font-size: var(--ccw-fs-h2); line-height: 1.15; color: var(--ccw-heading); margin: 0; }
.ccw-dshow__tagline { font-family: var(--ccw-font-script); font-size: clamp(1.2rem, 2vw, 1.6rem); color: #B8862E; line-height: 1.2; }
.ccw-dshow__desc { font-size: var(--ccw-fs-body); line-height: var(--ccw-lh-body); color: var(--ccw-text); }
.ccw-dshow__desc p { margin: 0; }

.ccw-dshow__btn {
	display: inline-flex; align-items: center; justify-content: center;
	margin-top: 6px; padding: 14px 30px;
	font-family: var(--ccw-font-body); font-size: 0.82rem; font-weight: 700;
	letter-spacing: 0.06em; text-transform: uppercase;
	color: #fff; background: var(--ccw-rose-deep);
	border-radius: var(--ccw-radius-pill); text-decoration: none;
	box-shadow: 0 10px 24px rgba(192, 57, 122, 0.28); transition: var(--ccw-transition);
}
.ccw-dshow__btn:hover { color: #fff; background: var(--ccw-rose-strong); transform: translateY(-2px); }

@media (max-width: 1024px) {
	.ccw-dshow__inner { grid-template-columns: 1fr; justify-items: center; text-align: center; }
	.ccw-dshow--media-right .ccw-dshow__media { order: 0; }
	.ccw-dshow__content { align-items: center; }
	.ccw-dshow__media { min-height: 300px; }
}

/* On phones/tablets: deck box on top, cards in a centered fan BELOW it (tucked
 * under the bottom edge) — never covering the box, never cut off, fully centred. */
@media (max-width: 900px) {
	.ccw-dshow__inner { text-align: center; }
	.ccw-dshow__content { align-items: center; text-align: center; }

	.ccw-dshow--cards-fan .ccw-dshow__media { flex-direction: column; align-items: center; justify-content: center; min-height: 0; }
	.ccw-dshow--cards-fan .ccw-dshow__media--arc::before { display: none; }
	.ccw-dshow--cards-fan .ccw-dshow__deck { width: min(260px, 72%); max-width: none; }
	.ccw-dshow--cards-fan .ccw-dshow__cards { position: static; width: 100%; margin: -36px 0 0; justify-content: center; }
	.ccw-dshow--cards-fan .ccw-dshow__card { width: min(var(--ccw-dshow-card-w, 130px), 33vw); margin-left: calc(min(var(--ccw-dshow-card-w, 130px), 33vw) * -0.22); }
	.ccw-dshow--cards-fan .ccw-dshow__card:first-child { margin-left: 0; }
	.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(1) { transform: rotate(-7deg); }
	.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(2) { transform: rotate(7deg); }
	.ccw-dshow--cards-fan .ccw-dshow__card:nth-child(3) { transform: rotate(15deg); }

	.ccw-dshow--cards-row .ccw-dshow__cards { justify-content: center; }
}