/* ── Client Testimonial Widget ────────────────────────────────────────────── */
.sea-testimonial {
	--sea-tper:     1.55;
	--sea-tgap:     24px;
	--sea-tinactive: 0.35;
}

.sea-testimonial__viewport {
	overflow: hidden;
}

.sea-testimonial__track {
	display: flex;
	gap: var(--sea-tgap, 24px);
	will-change: transform;
}

/* ─ Card ─ */
.sea-tcard {
	flex: 0 0 calc(
		(100% - (var(--sea-tper, 1.55) - 1) * var(--sea-tgap, 24px))
		/ var(--sea-tper, 1.55)
	);
	min-width: 0;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 4px;
	overflow: hidden;
	opacity: var(--sea-tinactive, 0.35);
	transition: opacity 0.4s ease;
}

.sea-tcard.is-active {
	opacity: 1;
}

/* ─ Body ─ */
.sea-tcard__body {
	padding: 28px 28px 24px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

/* Top meta row: avatar + counter */
.sea-tcard__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 24px;
}

.sea-tcard__avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.sea-tcard__counter {
	font-size: 0.8rem;
	color: #94a3b8;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.04em;
}

/* Quote mark */
.sea-tcard__quote-mark {
	font-size: 2rem;
	line-height: 1;
	color: #1e293b;
	margin: 0 0 12px;
	letter-spacing: -0.04em;
}

/* Quote text */
.sea-tcard__quote {
	font-size: 1.1rem;
	font-weight: 500;
	color: #0f172a;
	line-height: 1.55;
	margin: 0 0 auto;
	padding: 0;
	border: none;
}

/* Author section */
.sea-tcard__author {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 28px;
}

.sea-tcard__logo {
	height: 24px;
	width: auto;
	display: block;
	object-fit: contain;
	flex-shrink: 0;
}

.sea-tcard__author-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.sea-tcard__name {
	font-size: 0.9rem;
	font-weight: 600;
	color: #0f172a;
	display: block;
}

.sea-tcard__role {
	font-size: 0.8rem;
	color: #64748b;
	display: block;
}

/* ─ Footer ─ */
.sea-tcard__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 28px;
	border-top: 1px solid #e2e8f0;
	flex-shrink: 0;
}

.sea-tcard__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.875rem;
	color: #475569;
	text-decoration: none !important;
	transition: color 0.15s ease;
}

.sea-tcard__cta:hover {
	color: #0f172a;
}

.sea-tcard__cta-icon {
	width: 14px;
	height: 14px;
	flex-shrink: 0;
	fill: none !important;
	stroke: currentColor !important;
	/* Resting state: natural arrow direction */
	transform: rotate(0deg);
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Hover: tilts 45° clockwise */
.sea-tcard__cta:hover .sea-tcard__cta-icon {
	transform: rotate(45deg);
}

/* Navigation buttons — always on the right, only visible on the active card */
.sea-tcard__nav {
	display: flex;
	gap: 8px;
	margin-left: auto;   /* anchors to right whether or not CTA is present */
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s ease;
}

/* Case study progress segments live in the same footer row — same active-only reveal */
.sea-tcard__cs-progress {
	opacity: 0;
	transition: opacity 0.3s ease;
}

.sea-tcard.is-active .sea-tcard__nav,
.sea-tcard.is-active .sea-tcard__cs-progress {
	opacity: 1;
	pointer-events: auto;
}

/* Case study layout: progress + nav live in a shared footer below the carousel
   instead of inside each card, so they're always visible (no .is-active card
   to gate on) and only need to be rendered once. */
.sea-testimonial__footer {
	display: flex;
	align-items: center;
	/* space-around rather than space-between: with two children it leaves a
	   half-share of space at each end, so the dots and the arrows sit inset
	   from the edges instead of hard against them. */
	justify-content: space-around;
	gap: 16px;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid #e2e8f0;
}

.sea-testimonial__footer .sea-tcard__nav,
.sea-testimonial__footer .sea-tcard__cs-progress {
	opacity: 1;
	pointer-events: auto;
}

/* .sea-tcard__nav carries margin-left:auto for the per-card Testimonial footer,
   where it pins the nav right even when there is no CTA beside it. In this
   shared footer that auto margin swallows all the free space, and per the flex
   spec justify-content can only distribute what auto margins leave behind — so
   space-around silently behaved like space-between until this reset it. */
.sea-testimonial__footer .sea-tcard__nav {
	margin-left: 0;
}

/* Clone cards (used for infinite loop) — never interactive */
.sea-tcard--clone {
	pointer-events: none;
}

.sea-tcard__prev,
.sea-tcard__next {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: none;
	background: #1e293b;
	color: #fff !important;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: background-color 0.2s ease, opacity 0.2s ease;
}

.sea-tcard__prev svg,
.sea-tcard__next svg {
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	flex-shrink: 0 !important;
	pointer-events: none;
	fill: none !important;
	stroke: #fff !important;
	display: block !important;
}

.sea-tcard__prev:hover,
.sea-tcard__next:hover {
	background: #334155;
}

.sea-tcard__prev:disabled,
.sea-tcard__next:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

/* ─ Case Study layout ─ */
.sea-tcard--cs {
	flex-direction: row;      /* image left, content right */
	align-items: stretch;
	transform-origin: top center;
	transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Peek cards read as slightly shorter than the active one, top edge aligned */
.sea-tcard--cs:not(.is-active) {
	transform: scaleY(0.94);
}

.sea-tcard--cs .sea-tcard__cs-image {
	position: relative;
	width: 42%;
	flex-shrink: 0;
	overflow: hidden;
}

.sea-tcard__cs-badge {
	position: absolute;
	left: 12px;
	bottom: 12px;
	z-index: 1;
	background: #0f172a;
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 6px 12px;
	border-radius: 999px;
	white-space: nowrap;
}

.sea-tcard--cs .sea-tcard__cs-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Body is a column; content gets padding, footer handles its own via negative margins */
.sea-tcard--cs .sea-tcard__body {
	padding: 28px;
	gap: 0;
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
}

.sea-tcard__cs-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
	gap: 12px;
}

.sea-tcard__cs-tags {
	font-size: 0.78rem;
	color: #64748b;
	line-height: 1.4;
	flex: 1;
	min-width: 0;
}

.sea-tcard__cs-title {
	font-size: 1.35rem;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.3;
	margin: 0 0 16px;
}

.sea-tcard__cs-desc {
	font-size: 0.9rem;
	color: #475569;
	line-height: 1.65;
	margin: 0;
}

/* ─ Quote block (optional, reuses the Quote/Author fields) ─ */
.sea-tcard__cs-quote {
	margin: 20px 0 0;
	padding: 14px 0 14px 16px;
	border-left: 2px solid #e2e8f0;
}

.sea-tcard__cs-quote-text {
	margin: 0 0 10px;
	padding: 0;
	border: none;
	font-size: 0.95rem;
	color: #1e293b;
	line-height: 1.55;
}

.sea-tcard__cs-quote-meta {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 4px 10px;
	font-size: 0.8rem;
	color: #64748b;
}

.sea-tcard__cs-quote-author strong {
	color: #0f172a;
	font-weight: 600;
}

.sea-tcard__cs-quote-src {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: #94a3b8;
}

/* ─ Stats row ─ */
.sea-tcard__cs-stats {
	display: flex;
	align-items: stretch;
	gap: 20px;
	margin-top: 20px;
}

.sea-tcard__cs-stat {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding-right: 20px;
	border-right: 1px solid #e2e8f0;
}

.sea-tcard__cs-stat:last-child {
	padding-right: 0;
	border-right: none;
}

.sea-tcard__cs-stat-value {
	font-size: 1.25rem;
	font-weight: 700;
	color: #0f172a;
	line-height: 1.2;
}

.sea-tcard__cs-stat-label {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #94a3b8;
}

/* ─ Actions row: CTA pill + client line ─ */
.sea-tcard__cs-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px;
}

.sea-tcard__cs-client {
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #94a3b8;
	white-space: nowrap;
}

/* Pill CTA — case study only, overrides the plain text-link style above */
.sea-tcard--cs .sea-tcard__cta--pill {
	background: #f6dfce;
	color: #1e293b;
	padding: 8px 18px 8px 8px;
	border-radius: 999px;
}

.sea-tcard--cs .sea-tcard__cta--pill:hover {
	background: #f0d0b8;
	color: #1e293b;
}

.sea-tcard--cs .sea-tcard__cta--pill .sea-tcard__cta-icon {
	width: 28px;
	height: 28px;
	padding: 7px;
	box-sizing: border-box;
	border-radius: 50%;
	background: #fff;
}

/* ─ Progress segments (replaces the CTA/nav row inside the flush-bottom footer) ─ */
.sea-tcard__cs-progress {
	display: flex;
	align-items: center;
	gap: 6px;
}

.sea-tcard__cs-seg {
	width: 22px;
	height: 3px;
	border-radius: 2px;
	background: #e2e8f0;
	transition: background-color 0.2s ease, width 0.2s ease;
}

.sea-tcard__cs-seg.is-active {
	width: 32px;
	background: #d97b3f;
}