/*
 * Event — Speaker Showcase
 * Matches the approved design: 4-column grid, featured card (3 columns) +
 * 1 regular card on the first row, every card 316px wide at a 1312px container.
 * Measurements come from the design file (all values in px @1440 frame).
 */
.cew-ss{
	position:relative;
	width:100%;
	padding:0;
	font-family:"PP Neue Montreal",Arial,sans-serif;
}
.cew-ss *{box-sizing:border-box}

/* ---------- Header / filter ---------- */
.cew-ss-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
	margin-bottom:40px;
}
.cew-ss-label{font-size:14px;line-height:1.2;color:#4a4a4a}
.cew-ss-filter-toggle{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	padding:7px 16px;
	border:1px solid #e8e8e8;
	border-radius:0;
	background:#fff;
	color:#4a4a4a;
	font-family:inherit;
	font-size:14px;
	font-weight:400;
	line-height:16px;
	cursor:pointer;
}
.cew-ss-filter-toggle svg{width:12px;height:12px;flex:0 0 auto;fill:currentColor}
.cew-ss-filter-toggle i{font-size:12px;line-height:1;flex:0 0 auto}
.cew-ss-filter-panel{
	position:absolute;
	top:40px;
	right:0;
	z-index:40;
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	width:min(420px,100%);
	padding:14px;
	background:#fff;
	border:1px solid #e8e8e8;
	box-shadow:0 18px 50px rgba(0,0,0,.12);
}
.cew-ss-filter-panel[hidden]{display:none!important}
.cew-ss-filter-chip{
	padding:8px 11px;
	border:1px solid #e8e8e8;
	border-radius:0;
	background:#f3f3f3;
	color:#4a4a4a;
	font-family:inherit;
	font-size:12px;
	line-height:1;
	cursor:pointer;
}
.cew-ss-filter-chip.is-active{background:#111;color:#fff;border-color:#111}

/* ---------- Grid ---------- */
.cew-ss-grid{
	--cew-ss-columns:4;
	display:grid;
	grid-template-columns:repeat(var(--cew-ss-columns),minmax(0,1fr));
	gap:16px;
	width:100%;
	align-items:start;
}
.cew-ss-layout-reference .cew-ss-grid{
	grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.cew-ss-card{
	position:relative;
	min-width:0;
	overflow:hidden;
	background:transparent;
	transition-property:transform,box-shadow;
	transition-duration:.3s;
	transition-timing-function:ease;
}
.cew-ss-card[hidden]{display:none!important}

/* Featured card: fills the full row height so the session box sits at the bottom */
.cew-ss-card.is-featured{
	--cew-ss-featured-image:32.2%;
	grid-column:span 3!important;
	align-self:stretch;
	display:flex!important;
	align-items:stretch;
	background:#e8e8e8;
}
.cew-ss-layout-full .cew-ss-card.is-featured{grid-column:1/-1!important}
.cew-ss-card.is-featured>.cew-ss-image{
	position:relative;
	flex:0 0 var(--cew-ss-featured-image);
	width:var(--cew-ss-featured-image);
	max-width:var(--cew-ss-featured-image);
}
.cew-ss-card.is-featured>.cew-ss-image img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
}
.cew-ss-image{
	position:relative;
	min-width:0;
	overflow:hidden;
	background:#eee;
}
.cew-ss-card:not(.is-featured) .cew-ss-image{aspect-ratio:1/1}
.cew-ss-image img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	transition-property:transform;
	transition-duration:.3s;
	transition-timing-function:ease;
}
.cew-ss-featured-content{
	display:flex;
	flex-direction:column;
	flex:1 1 auto;
	min-width:0;
	padding:16px;
}

/* ---------- Text blocks ---------- */
.cew-ss-info{position:relative;min-width:0;padding:16px 0}
.cew-ss-card.is-featured .cew-ss-info{
	display:grid;
	grid-template-columns:minmax(0,auto) minmax(180px,1fr);
	align-items:center;
	gap:16px 24px;
	margin-bottom:24px;
	padding:0;
}
.cew-ss-name-row{
	position:relative;
	display:flex;
	align-items:center;
	gap:16px;
	min-width:0;
}
.cew-ss-name{
	min-width:0;
	margin:0;
	color:#000;
	font-size:20px;
	font-weight:400;
	line-height:1.15;
}
.cew-ss-card.is-featured .cew-ss-name{font-size:32px}
.cew-ss-role{
	margin-top:6px;
	color:#4a4a4a;
	font-size:16px;
	line-height:1.25;
}
.cew-ss-card.is-featured .cew-ss-role{
	margin-top:0;
	font-size:18px;
	line-height:1.35;
	text-align:right;
}
.cew-ss-bio{
	margin-top:18px;
	color:#4a4a4a;
	font-size:16px;
	line-height:1.4;
}
.cew-ss-card.is-featured .cew-ss-bio{
	grid-column:1/-1;
	margin-top:0;
}

/* Regular card: name + position stacked on the left, LinkedIn box on the right */
.cew-ss-card:not(.is-featured) .cew-ss-info{
	display:grid;
	grid-template-columns:minmax(0,1fr) auto;
	align-items:start;
}
.cew-ss-card:not(.is-featured) .cew-ss-name-row{display:contents}
.cew-ss-card:not(.is-featured) .cew-ss-name{grid-column:1;grid-row:1}
.cew-ss-card:not(.is-featured) .cew-ss-role{grid-column:1;grid-row:2}
.cew-ss-card:not(.is-featured) .cew-ss-linkedin{grid-column:2;grid-row:1/span 2;margin-left:12px}

/* ---------- Session box (featured) ---------- */
.cew-ss-session{
	position:relative;
	z-index:7;
	margin-top:auto;
	padding:16px;
	background:#fff;
}
.cew-ss-session-title{
	display:block;
	color:#000;
	font-size:20px;
	font-weight:400;
	line-height:1.2;
	text-decoration:underline;
	text-underline-offset:2px;
}
.cew-ss-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cew-ss-tag{
	display:inline-flex;
	align-items:center;
	padding:8px;
	background:#f3f3f3;
	color:#000;
	font-size:12px;
	line-height:1;
}
.cew-ss-tag.is-primary{background:#bbb;color:#000}

/* ---------- LinkedIn ---------- */
.cew-ss-linkedin{
	position:relative;
	z-index:8;
	flex:0 0 auto;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:32px;
	height:32px;
	background:#e8e8e8;
	color:#000;
	font-size:16px;
	line-height:1;
	text-decoration:none;
	transition:background-color .2s ease,color .2s ease;
}
.cew-ss-card.is-featured .cew-ss-linkedin{background:#fff}
.cew-ss-linkedin:hover,
.cew-ss-card.is-featured .cew-ss-linkedin:hover{background:#0a66c2;color:#fff}
.cew-ss-linkedin svg{width:1em;height:1em;fill:currentColor}

/* ---------- Click areas ---------- */
.cew-ss-open{
	position:absolute;
	z-index:5;
	display:block;
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	cursor:pointer;
}
.cew-ss-open-card{inset:0}
.cew-ss-open-image{inset:0}
.cew-ss-open-name{inset:0}

/* ---------- Quick view popup ---------- */
.cew-ss-modal{
	position:fixed;
	inset:0;
	z-index:999999;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:20px;
	background:rgba(0,0,0,.72);
}
.cew-ss-modal[hidden]{display:none!important}
.cew-ss-modal-panel{
	position:relative;
	width:min(920px,100%);
	max-height:calc(100vh - 40px);
	overflow:auto;
	background:#fff;
}
.cew-ss-modal-close{
	position:absolute;
	top:12px;
	right:12px;
	z-index:4;
	display:flex;
	align-items:center;
	justify-content:center;
	width:38px;
	height:38px;
	padding:0;
	border:0;
	background:#111;
	color:#fff;
	font:inherit;
	font-size:26px;
	line-height:1;
	cursor:pointer;
}
.cew-ss-modal-body{padding:24px}
.cew-ss-modal-view{display:grid;grid-template-columns:minmax(220px,36%) minmax(0,1fr)}
.cew-ss-modal-image{min-width:0;background:#eee}
.cew-ss-modal-image img{display:block;width:100%;height:100%;object-fit:cover}
.cew-ss-modal-copy{position:relative;padding:34px;min-width:0}
.cew-ss-modal-copy .cew-ss-linkedin{margin-top:22px}
body.cew-ss-modal-open{overflow:hidden}

/* ---------- Expand-in-card (accordion) ---------- */
.cew-ss-card.cew-ss-expandable:not(.is-ss-expanded) .cew-ss-featured-content{display:contents}
.cew-ss-card.cew-ss-expandable:not(.is-ss-expanded) .cew-ss-bio,
.cew-ss-card.cew-ss-expandable:not(.is-ss-expanded) .cew-ss-session{display:none}

.cew-ss-card.is-ss-expanded{
	--cew-ss-featured-image:32.2%;
	grid-column:1/-1!important;
	align-self:stretch;
	display:flex!important;
	align-items:stretch;
	background:#e8e8e8;
}
.cew-ss-card.is-ss-expanded>.cew-ss-image{
	position:relative;
	flex:0 0 var(--cew-ss-featured-image);
	width:var(--cew-ss-featured-image);
	max-width:var(--cew-ss-featured-image);
	aspect-ratio:auto;
}
.cew-ss-card.is-ss-expanded>.cew-ss-image img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
}
.cew-ss-card.is-ss-expanded .cew-ss-info{
	display:grid;
	grid-template-columns:minmax(0,auto) minmax(180px,1fr);
	align-items:center;
	gap:16px 24px;
	margin-bottom:24px;
	padding:0;
}
.cew-ss-card.is-ss-expanded .cew-ss-name-row{display:flex}
.cew-ss-card.is-ss-expanded .cew-ss-name{font-size:32px;grid-column:auto;grid-row:auto}
.cew-ss-card.is-ss-expanded .cew-ss-role{
	margin-top:0;
	font-size:18px;
	line-height:1.35;
	text-align:right;
	grid-column:auto;
	grid-row:auto;
}
.cew-ss-card.is-ss-expanded .cew-ss-bio{display:block;grid-column:1/-1;margin-top:0}
.cew-ss-card.is-ss-expanded .cew-ss-session{display:block}
.cew-ss-card.is-ss-expanded .cew-ss-linkedin{background:#fff;grid-column:auto;grid-row:auto;margin-left:0}
.cew-ss-card.is-ss-expanded .cew-ss-linkedin:hover{background:#0a66c2;color:#fff}

@media(max-width:767px){
	.cew-ss-card.is-ss-expanded{flex-direction:column}
	.cew-ss-card.is-ss-expanded>.cew-ss-image{flex:0 0 auto;width:100%;max-width:none;aspect-ratio:1/1}
	.cew-ss-card.is-ss-expanded .cew-ss-name{font-size:24px}
	.cew-ss-card.is-ss-expanded .cew-ss-info{grid-template-columns:1fr;gap:6px;align-items:start;margin-bottom:20px}
	.cew-ss-card.is-ss-expanded .cew-ss-role{text-align:left;margin-top:0;font-size:16px}
	.cew-ss-card.is-ss-expanded .cew-ss-bio{grid-column:auto;margin-top:10px}
}

/* ---------- Expand on hover (design: small cards by default, large card on hover) ---------- */
.cew-ss{--cew-ss-open-ms:350ms}
.cew-ss-card.cew-ss-hoverable:not(.is-ss-hover):not(.is-ss-closing):not(.is-ss-expanded):not(.is-ss-down) .cew-ss-featured-content{display:contents}
.cew-ss-card.cew-ss-hoverable:not(.is-ss-hover):not(.is-ss-closing):not(.is-ss-expanded):not(.is-ss-down) .cew-ss-bio,
.cew-ss-card.cew-ss-hoverable:not(.is-ss-hover):not(.is-ss-closing):not(.is-ss-expanded):not(.is-ss-down) .cew-ss-session{display:none}
/* no lift / zoom in hover mode: the large card is the hover effect */
.cew-ss-has-hover .cew-ss-card{transform:none!important;align-self:start}
.cew-ss-has-hover .cew-ss-card:not(.is-ss-hover) .cew-ss-image img{transform:none!important}
.cew-ss-card.cew-ss-hoverable{
	z-index:1;
	transition-property:transform,box-shadow,width,margin-left,background-color,z-index;
	transition-duration:.3s,.3s,var(--cew-ss-open-ms),var(--cew-ss-open-ms),var(--cew-ss-open-ms),0s;
	transition-delay:0s,0s,0s,0s,0s,var(--cew-ss-open-ms);
	transition-timing-function:ease,ease,cubic-bezier(.22,.61,.36,1),cubic-bezier(.22,.61,.36,1),ease,linear;
}
.cew-ss-card.is-ss-hover,.cew-ss-card.is-ss-closing{z-index:20;transition-delay:0s!important}
.cew-ss-card.is-ss-hover{
	width:var(--cew-ss-open-w)!important;
	margin-left:var(--cew-ss-open-x,0px);
	background:#e8e8e8;
}
/* .is-ss-closing keeps the large layout while the card shrinks back, then JS removes it */
.cew-ss-card.is-ss-hover,.cew-ss-card.is-ss-closing{
	max-width:none;
	height:var(--cew-ss-h);
	margin-bottom:var(--cew-ss-mb,0px);
	display:flex!important;
	align-items:stretch;
	transform:none!important;
}
.cew-ss-card.is-ss-hover.is-ss-rev,.cew-ss-card.is-ss-closing.is-ss-rev{flex-direction:row-reverse}
.cew-ss-card.is-ss-hover>.cew-ss-image,.cew-ss-card.is-ss-closing>.cew-ss-image{
	flex:0 0 var(--cew-ss-w);
	width:var(--cew-ss-w);
	max-width:var(--cew-ss-w);
	aspect-ratio:auto!important;
}
.cew-ss-card.is-ss-hover>.cew-ss-image img,.cew-ss-card.is-ss-closing>.cew-ss-image img{position:absolute;inset:0;width:100%;height:100%;transform:none!important}
.cew-ss-card.is-ss-hover .cew-ss-featured-content,.cew-ss-card.is-ss-closing .cew-ss-featured-content{
	display:flex!important;
	flex-direction:column;
	flex:1 1 auto;
	min-width:0;
	padding:16px;
}
.cew-ss-card.is-ss-hover .cew-ss-featured-content{
	animation:cewSsIn var(--cew-ss-open-ms) ease both;
	animation-delay:calc(var(--cew-ss-open-ms) * .35);
}
.cew-ss-card.is-ss-closing .cew-ss-featured-content{opacity:0;transition:opacity .12s ease}
@keyframes cewSsIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.cew-ss-card.is-ss-hover .cew-ss-info,.cew-ss-card.is-ss-closing .cew-ss-info{
	display:grid;
	grid-template-columns:minmax(0,auto) minmax(180px,1fr);
	align-items:center;
	gap:16px 24px;
	margin-bottom:24px;
	padding:0!important;
}
.cew-ss-card.is-ss-hover .cew-ss-name-row,.cew-ss-card.is-ss-closing .cew-ss-name-row{display:flex}
.cew-ss-card.is-ss-hover .cew-ss-name,.cew-ss-card.is-ss-closing .cew-ss-name{font-size:32px;line-height:37px;grid-column:auto;grid-row:auto;white-space:nowrap}
.cew-ss-card.is-ss-hover .cew-ss-role,.cew-ss-card.is-ss-closing .cew-ss-role{margin-top:0;font-size:18px;line-height:24px;color:#4b4b4b;text-align:right;grid-column:auto;grid-row:auto}
.cew-ss-card.is-ss-hover .cew-ss-bio,.cew-ss-card.is-ss-closing .cew-ss-bio{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden;grid-column:1/-1;margin-top:0;font-size:16px;line-height:22px;color:#4b4b4b}
.cew-ss-card.is-ss-hover .cew-ss-session-title{font-size:20px;line-height:24px}
.cew-ss-card.is-ss-hover .cew-ss-tag{height:28px;padding-top:0;padding-bottom:0}
.cew-ss-card.is-ss-hover .cew-ss-linkedin{flex:0 0 auto}
.cew-ss-card.is-ss-hover .cew-ss-session,.cew-ss-card.is-ss-closing .cew-ss-session{display:block}
.cew-ss-card.is-ss-hover .cew-ss-linkedin{background:#fff;grid-column:auto;grid-row:auto;margin-left:0}
.cew-ss-card.is-ss-hover .cew-ss-linkedin:hover{background:#0a66c2;color:#fff}
@media(prefers-reduced-motion:reduce){
	.cew-ss-card.cew-ss-hoverable{transition:none!important}
	.cew-ss-card.is-ss-hover .cew-ss-featured-content{animation:none}
}

/* ---------- Mobile / touch: card opens downwards (full row, photo on top, grey panel under it) ---------- */
.cew-ss-card.is-ss-down{
	grid-column:1/-1!important;
	display:flex!important;
	flex-direction:column;
	align-self:start;
	background:#e8e8e8;
}
.cew-ss-card.is-ss-down>.cew-ss-image{
	position:relative;
	flex:0 0 auto;
	width:100%;
	max-width:none;
	aspect-ratio:var(--cew-ss-ratio,1/1)!important;
}
.cew-ss-card.is-ss-down>.cew-ss-image img{position:absolute;inset:0;width:100%;height:100%;transform:none!important}
.cew-ss-card.is-ss-down .cew-ss-featured-content{display:flex!important;flex-direction:column;padding:16px}
.cew-ss-card.is-ss-down .cew-ss-info{padding:0!important;margin:0 0 16px}
.cew-ss-card.is-ss-down .cew-ss-bio{display:block;grid-column:1/-1;grid-row:3;margin-top:12px;font-size:16px;line-height:22px;color:#4b4b4b}
.cew-ss-card.is-ss-down .cew-ss-session{display:block;margin-top:0}
.cew-ss-card.is-ss-down .cew-ss-session-title{font-size:18px;line-height:22px}
.cew-ss-card.is-ss-down .cew-ss-tags{margin-top:12px}
.cew-ss-card.is-ss-down .cew-ss-linkedin{background:#fff}
.cew-ss-card.is-ss-down .cew-ss-featured-content{animation:cewSsIn var(--cew-ss-open-ms) ease both}

/* ---------- Responsive ---------- */
@media(max-width:1024px){
	.cew-ss-grid{--cew-ss-columns:2}
	.cew-ss-layout-reference .cew-ss-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
	.cew-ss-card.is-featured{grid-column:1/-1!important;--cew-ss-featured-image:40%}
}
@media(max-width:767px){
	.cew-ss-grid{--cew-ss-columns:1}
	.cew-ss-layout-reference .cew-ss-grid{grid-template-columns:1fr!important}
	.cew-ss-card.is-featured{
		grid-column:1/-1!important;
		flex-direction:column;
	}
	.cew-ss-card.is-featured>.cew-ss-image{
		flex:0 0 auto;
		width:100%;
		max-width:none;
	}
	.cew-ss-card.is-featured .cew-ss-image{aspect-ratio:1/1}
	.cew-ss-card.is-featured .cew-ss-name{font-size:24px}
	.cew-ss-card.is-featured .cew-ss-info{grid-template-columns:1fr;gap:6px;align-items:start;margin-bottom:20px}
	.cew-ss-card.is-featured .cew-ss-role{text-align:left;margin-top:0;font-size:16px}
	.cew-ss-card.is-featured .cew-ss-bio{grid-column:auto;margin-top:10px}
	.cew-ss-featured-content{padding:16px}
	.cew-ss-session-title{font-size:18px}
	.cew-ss-filter-panel{position:relative;top:auto;right:auto;width:100%;margin-bottom:16px}
	.cew-ss-modal{padding:12px}
	.cew-ss-modal-view{grid-template-columns:1fr}
	.cew-ss-modal-image{aspect-ratio:4/3}
	.cew-ss-modal-copy{padding:24px 18px}
}

@media(prefers-reduced-motion:reduce){
	.cew-ss-card,.cew-ss-image img,.cew-ss-linkedin{transition:none!important}
}