/*
 * AH Testimonial Deck: a featured letter that stays in view (photo with a CSS scroll parallax)
 * next to a column of smaller letters that tilt toward the pointer (AH.tilt on .ah-tilt).
 * The reveal sits on a wrapper (.ah-tdeck__cell), so it never fights the tilt transform.
 */
.ah-tdeck,
.ah-tdeck *,
.ah-tdeck *::before,
.ah-tdeck *::after { box-sizing: border-box; }

.ah-tdeck {
	--ah-tdeck-top: 110px;
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	gap: 18px;
	align-items: start;
	color: var(--ah-ink);
	font-family: var(--ah-f-body);
	font-size: 17px;
	line-height: 1.75;
}
.ah-tdeck .ah-tdeck__col { display: grid; gap: 18px; min-width: 0; }
.ah-tdeck.ah-tdeck--grid { grid-template-columns: minmax(0, 1fr); }
.ah-tdeck.ah-tdeck--grid .ah-tdeck__col { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.ah-motion .ah-tdeck .ah-tdeck__cell.ah-rv--up { transition-delay: calc(var(--i, 0) * 90ms); }

/* letter */
.ah-tdeck .ah-tdeck__letter {
	display: grid;
	gap: 14px;
	align-content: start;
	margin: 0;
	padding: 24px 26px;
	border: 1px solid var(--ah-line);
	border-radius: 4px;
	background: var(--ah-paper);
	transition: border-color .35s, box-shadow .45s var(--ah-ease), transform .5s var(--ah-ease), opacity .9s var(--ah-ease);
}
.ah-tdeck .ah-tdeck__letter:hover { border-color: rgba(197, 165, 114, .65); box-shadow: 0 26px 44px -34px rgba(15, 27, 60, .5); }
.ah-tdeck .ah-tdeck__letter.ah-tilt.is-tilting { transition: transform .08s linear, border-color .35s, box-shadow .45s var(--ah-ease); }
.ah-tdeck .ah-tdeck__letter--feat { padding: 38px 38px 32px; rotate: -.4deg; }
.ah-tdeck.ah-tdeck--sticky .ah-tdeck__letter--feat { position: sticky; top: var(--ah-tdeck-top); }

/* photo */
.ah-tdeck .ah-tdeck__photo {
	position: relative;
	display: block;
	height: 240px;
	margin: -38px -38px 4px;
	overflow: hidden;
	border-radius: 4px 4px 0 0;
	background: var(--ah-sand);
	color: inherit;
	text-decoration: none;
}
.ah-tdeck .ah-tdeck__photo img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
	object-position: 50% 72%;
}
.ah-tdeck a.ah-tdeck__photo:focus-visible { outline: 2px solid var(--ah-gold); outline-offset: 3px; }
.ah-tdeck .ah-tdeck__cap {
	position: absolute;
	inset-block-end: 12px;
	inset-inline-start: 12px;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(9, 18, 42, .85);
	color: var(--ah-gold-hi);
	font-family: var(--ah-f-mono);
	font-size: .74rem;
	line-height: 1.6;
	white-space: nowrap;
}

/* quote */
.ah-tdeck .ah-tdeck__q {
	display: block;
	height: 20px;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: 3.2rem;
	line-height: .4;
	text-align: start;
	color: var(--ah-gold);
}
.ah-tdeck .ah-tdeck__quote.ah-tdeck__quote {
	margin: 0;
	padding: 0;
	border: 0;
	quotes: none;
	font-family: var(--ah-f-body);
	font-style: normal;
	font-weight: 400;
	font-size: 1.02rem;
	line-height: 1.85;
	color: var(--ah-ink);
	/* themes style <blockquote> (the old theme paints it black) */
	display: block;
	width: auto;
	background: none;
	box-shadow: none;
	border-radius: 0;
	text-align: start;
}
.ah-tdeck .ah-tdeck__quote p { background: none; padding: 0; }
.ah-tdeck .ah-tdeck__quote::before,
.ah-tdeck .ah-tdeck__quote::after { content: none; }
.ah-tdeck .ah-tdeck__quote p { margin: 0; font: inherit; color: inherit; }
.ah-tdeck .ah-tdeck__quote p + p { margin-top: .6em; }
.ah-tdeck .ah-tdeck__letter--feat .ah-tdeck__quote.ah-tdeck__quote {
	font-family: var(--ah-f-display);
	font-weight: 600;
	font-size: clamp(1.15rem, 1.9vw, 1.4rem);
	line-height: 1.75;
}
.ah-tdeck .ah-tdeck__orig {
	margin: 0;
	padding: 10px 0 0;
	border-top: 1px dashed var(--ah-line);
	font-family: var(--ah-f-en);
	font-size: .84rem;
	line-height: 1.6;
	text-align: left;
	color: var(--ah-soft);
}

/* who */
.ah-tdeck .ah-tdeck__who { display: flex; align-items: center; gap: 12px; margin: 0; }
.ah-tdeck .ah-tdeck__logo {
	flex: none;
	width: 48px;
	max-width: none;
	height: 48px;
	padding: 6px;
	border: 1px solid var(--ah-line);
	border-radius: 50%;
	background: #fff;
	object-fit: contain;
}
.ah-tdeck .ah-tdeck__id { display: grid; min-width: 0; }
.ah-tdeck .ah-tdeck__name { display: block; font-family: var(--ah-f-body); font-weight: 700; font-size: .95rem; line-height: 1.5; color: var(--ah-ink); }
.ah-tdeck .ah-tdeck__name[lang="en"] { font-family: var(--ah-f-en); }
.ah-tdeck .ah-tdeck__role { font-size: .84rem; line-height: 1.6; color: var(--ah-soft); }

.ah-tdeck .ah-tdeck__empty { margin: 0; padding: 18px; border: 1px dashed var(--ah-line); border-radius: 12px; font-size: .9rem; color: var(--ah-soft); }

/* depth inside a tilting letter (mouse only) */
@media (hover: hover) and (pointer: fine) {
	.ah-tdeck .ah-tilt .ah-tdeck__q { transform: translateZ(26px); }
}

/* photo parallax, scroll-driven (no JS); browsers without it keep a still photo */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.ah-tdeck .ah-tdeck__photo img {
			animation: ah-tdeck-par linear both;
			animation-timeline: view();
			animation-range: cover 0% cover 100%;
		}
	}
}
@keyframes ah-tdeck-par {
	from { transform: scale(1.14) translateY(-5%); }
	to { transform: scale(1.14) translateY(5%); }
}

@media (max-width: 1024px) {
	.ah-tdeck { grid-template-columns: minmax(0, 1fr); }
	.ah-tdeck.ah-tdeck--sticky .ah-tdeck__letter--feat { position: relative; top: auto; }
}
@media (max-width: 767px) {
	.ah-tdeck .ah-tdeck__letter { padding: 22px 20px; }
	.ah-tdeck .ah-tdeck__letter--feat { padding: 28px 22px; rotate: none; }
	.ah-tdeck .ah-tdeck__photo { height: 200px; margin: -28px -22px 4px; }
}

@media (prefers-reduced-motion: reduce) {
	.ah-tdeck .ah-tdeck__letter { transition: none; }
}
