/* DXV Interviews Popup 1.4 - flat editorial */
.dxv-wrap {
	--dxv-accent: var(--e-global-color-accent, #7e7e66);
	--dxv-radius: 2px;
	--dxv-gap: 26px;
	font-family: inherit;
	width: 100%;
	box-sizing: border-box;
	background: var(--dxv-bg, transparent);
	color: var(--dxv-text);
}
.dxv-wrap *, .dxv-wrap *::before, .dxv-wrap *::after { box-sizing: border-box; }

.dxv-theme-clear { --dxv-text: #1b1b1b; --dxv-muted: #6d6d6d; --dxv-line: #e4e4e4; }
.dxv-theme-light { --dxv-bg: #fff; --dxv-text: #1b1b1b; --dxv-muted: #6d6d6d; --dxv-line: #e4e4e4; padding: 22px 20px; border: 1px solid #e4e4e4; }
.dxv-theme-dark  { --dxv-bg: #17191d; --dxv-text: #f2f2f2; --dxv-muted: #a8a8a8; --dxv-line: rgba(255, 255, 255, .14); padding: 22px 20px; }

/* Heading: bold text, thick bar under the text, hairline across */
.dxv-wrap .dxv-heading {
	margin: 0 0 24px;
	padding: 0;
	font-family: inherit;
	font-size: 24px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--dxv-text);
	border-bottom: 1px solid var(--dxv-line);
	overflow: visible;
}
.dxv-heading__text { position: relative; display: inline-block; padding-bottom: 14px; }
.dxv-heading__text::after {
	content: "";
	position: absolute; left: 0; right: 0; bottom: -1px;
	height: 6px;
	background: var(--dxv-accent);
}

.dxv-list { display: flex; flex-direction: column; }

/* Card (shared) */
.dxv-card {
	display: block;
	color: inherit;
	text-decoration: none;
	border: 0; box-shadow: none;
}
.dxv-card:focus-visible { outline: 2px solid var(--dxv-accent); outline-offset: 3px; }

.dxv-thumb {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--dxv-radius);
	background: #2a2d33;
}
.dxv-thumb img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	display: block; margin: 0;
}
.dxv-thumb__empty { position: absolute; inset: 0; background: #2a2d33; }

/* Play icon: thin white ring + triangle */
.dxv-play {
	position: absolute;
	top: 50%; left: 50%;
	width: 62px; height: 62px;
	margin: -31px 0 0 -31px;
	border-radius: 50%;
	border: 3px solid rgba(255, 255, 255, .88);
	background: rgba(0, 0, 0, .15);
}
.dxv-play::after {
	content: "";
	position: absolute; top: 50%; left: 50%;
	width: 20px; height: 22px;
	margin: -11px 0 0 -7px;
	background: rgba(255, 255, 255, .92);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.dxv-card:hover .dxv-play { background: rgba(0, 0, 0, .4); }

/* Text */
.dxv-title {
	display: block;
	font-size: 20px;
	line-height: 1.2;
	font-weight: 700;
	color: var(--dxv-text);
}
.dxv-card:hover .dxv-title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.dxv-meta {
	display: block;
	margin-top: 6px;
	font-size: 16px;
	line-height: 1.35;
	color: var(--dxv-muted);
}
.dxv-excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 8px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--dxv-muted);
}

/* Layout: cards (big thumbnail on top, title below) */
.dxv-layout-cards .dxv-list { gap: var(--dxv-gap); }
.dxv-layout-cards .dxv-thumb { aspect-ratio: 16 / 9; }
.dxv-layout-cards .dxv-body { display: block; padding-top: 10px; }

/* Layout: list (thumbnail left, text + button right) */
.dxv-layout-list .dxv-card {
	display: grid;
	grid-template-columns: 38% minmax(0, 1fr);
	gap: 18px;
	align-items: start;
	padding: var(--dxv-gap) 0;
	border-bottom: 1px solid var(--dxv-line);
}
.dxv-layout-list .dxv-card:first-child { padding-top: 4px; }
.dxv-layout-list .dxv-card:last-child { border-bottom: 0; padding-bottom: 4px; }
.dxv-layout-list .dxv-thumb { aspect-ratio: 4 / 5; }
.dxv-layout-list .dxv-body { display: block; padding-top: 2px; }
.dxv-layout-list .dxv-play { width: 42px; height: 42px; margin: -21px 0 0 -21px; border-width: 2px; }
.dxv-layout-list .dxv-play::after { width: 14px; height: 15px; margin: -7px 0 0 -5px; }

/* Watch button (inside the card) */
.dxv-watch {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	margin-top: 14px;
	padding: 12px 14px;
	border-radius: 3px;
	background: var(--dxv-btn, var(--dxv-accent));
	color: var(--dxv-btn-text, #fff);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.1;
	text-align: center;
}
.dxv-watch__ico {
	display: inline-block;
	width: 11px; height: 13px;
	background: currentColor;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.dxv-card:hover .dxv-watch { filter: brightness(.93); }

/* View All */
.dxv-more { margin-top: 28px; text-align: center; }
.dxv-wrap .dxv-btn {
	display: inline-block;
	padding: 14px 40px;
	border-radius: 3px;
	background: var(--dxv-btn, var(--dxv-accent));
	color: var(--dxv-btn-text, #fff);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.1;
	text-decoration: none;
}
.dxv-wrap .dxv-btn:hover { filter: brightness(.93); color: var(--dxv-btn-text, #fff); }
.dxv-wrap .dxv-btn:focus-visible { outline: 2px solid var(--dxv-text); outline-offset: 3px; }
.dxv-empty { margin: 0; padding: 14px; border: 1px dashed var(--dxv-line); font-size: 14px; }

/* ------------------------------------------------------------
 * Popup (plain)
 * ------------------------------------------------------------ */
body.dxv-lock { overflow: hidden; }

.dxv-modal {
	--dxv-accent: var(--e-global-color-accent, #7e7e66);
	position: fixed; inset: 0;
	z-index: 2147483000;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 56px 16px 16px;
	background: rgba(10, 10, 10, .9);
	overflow: hidden;
	font-family: inherit;
}
.dxv-modal.is-open { display: flex; animation: dxv-fade .18s ease; }

.dxv-modal__dialog { position: relative; display: flex; flex-direction: column; gap: 14px; }

.dxv-modal__box { position: relative; margin: 0 auto; background: #000; border-radius: 3px; }
.dxv-modal__box.is-horizontal { width: min(94vw, 920px, calc((100vh - 230px) * 16 / 9)); aspect-ratio: 16 / 9; }
.dxv-modal__box.is-vertical { height: min(calc(100vh - 230px), 680px); aspect-ratio: 9 / 16; max-width: 94vw; min-height: 400px; }
.dxv-modal__box.is-embed { width: min(94vw, 400px); height: min(calc(100vh - 230px), 720px); }

.dxv-modal__stage { position: absolute; inset: 0; border-radius: 3px; overflow: hidden; background: #000; }
.dxv-modal__stage iframe, .dxv-modal__stage video { width: 100%; height: 100%; border: 0; display: block; background: #000; }

/* Instagram reel crop (hides the embed header and footer).
   Raise --dxv-ig-top if a sliver of the header shows; lower it if the top of the video is cut. */
.dxv-modal__stage.is-ig { --dxv-ig-top: 74px; }
.dxv-modal__stage.is-ig iframe {
	position: absolute;
	top: calc(var(--dxv-ig-top) * -1);
	left: -21.1%;
	width: 142.2%;
	max-width: none;
	height: calc(100% + var(--dxv-ig-top) + 460px);
}

.dxv-modal__close {
	position: absolute;
	top: -44px; right: 0;
	width: 36px; height: 36px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 50%;
	background: transparent;
	color: #fff;
	font-size: 22px; line-height: 33px;
	cursor: pointer;
}
.dxv-modal__close:hover { background: #fff; color: #111; }

/* Caption under the video */
.dxv-modal__panel {
	width: 0; min-width: 100%;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	color: #fff;
}
.dxv-modal__info { flex: 1; min-width: 0; text-align: left; }
.dxv-modal__title { display: block; font-size: 18px; line-height: 1.25; font-weight: 700; }
.dxv-modal__meta { display: flex; flex-wrap: wrap; margin-top: 4px; font-size: 14px; color: rgba(255, 255, 255, .68); }
.dxv-modal__meta span:not(:empty) + span:not(:empty)::before { content: "\00b7"; margin: 0 7px; }
.dxv-modal__desc {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	margin: 6px 0 0; font-size: 14px; line-height: 1.45; color: rgba(255, 255, 255, .8);
}
.dxv-modal__desc:empty { display: none; }
.dxv-modal__link {
	display: inline-block; margin-top: 8px;
	font-size: 14px; font-weight: 600;
	color: #fff; text-decoration: underline; text-underline-offset: 3px;
}
.dxv-modal__nav {
	flex: none;
	width: 36px; height: 36px;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .5);
	border-radius: 3px;
	background: transparent;
	color: #fff;
	font-size: 22px; line-height: 32px;
	cursor: pointer;
}
.dxv-modal__nav:hover { background: #fff; color: #111; }
.dxv-modal.is-single .dxv-modal__nav { display: none; }
.dxv-modal button:focus-visible, .dxv-modal a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

@keyframes dxv-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .dxv-modal.is-open { animation: none; } }
@media (max-width: 520px) {
	.dxv-wrap .dxv-heading { font-size: 22px; }
	.dxv-title { font-size: 19px; }
	.dxv-modal { padding: 52px 10px 10px; }
	.dxv-modal__box.is-horizontal { width: 94vw; }
	.dxv-modal__box.is-vertical { height: min(calc(100vh - 215px), 680px); }
}
