/* ==========================================================================
   Cyara 2026 — event landing page ("Cyara 2026 Event" template)
   Event header / footer (.cy26e) and the event sections (.cy26e-*, patterns
   cy26-event-*). Loads after page.css and reuses its .cy26p-* helpers.
   Design: Lovable route virtual-event. The theme sets html { font-size: 10px }: px only.
   ========================================================================== */

.cy26e,
.cy26-page {
	/* Lucide icons (stroke 2) used as CSS masks: .cy26e-ico--{name}, cards, checklists. */
	--cy26e-i-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4'/%3E%3Cpath d='M16 2v4'/%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E");
	--cy26e-i-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
	--cy26e-i-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
	--cy26e-i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
	--cy26e-i-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
	--cy26e-i-radar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.07 4.93A10 10 0 0 0 6.99 3.34'/%3E%3Cpath d='M4 6h.01'/%3E%3Cpath d='M2.29 9.62A10 10 0 1 0 21.31 8.35'/%3E%3Cpath d='M16.24 7.76A6 6 0 1 0 8.23 16.67'/%3E%3Cpath d='M12 18h.01'/%3E%3Cpath d='M17.99 11.66A6 6 0 0 1 15.77 16.67'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='m13.41 10.59 5.66-5.66'/%3E%3C/svg%3E");
	--cy26e-i-loop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
	--cy26e-i-mic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19v3'/%3E%3Cpath d='M19 10v2a7 7 0 0 1-14 0v-2'/%3E%3Crect x='9' y='2' width='6' height='13' rx='3'/%3E%3C/svg%3E");
	--cy26e-i-video: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5'/%3E%3Crect x='2' y='6' width='14' height='12' rx='2'/%3E%3C/svg%3E");
}

/* ---------- Template scaffolding ----------------------------------------- */
/* The header sits over the hero; the container is its positioning box (keeps it under the admin bar). */
body.cy26-event-template .site-container { position: relative; }
body.cy26-event-template .cy26-page { scroll-behavior: smooth; }
/* Section links land below the fixed bar + header (40 + 76). */
body.cy26-event-template .cy26-page [id] { scroll-margin-top: 128px; }
body.cy26-event-template #register { scroll-margin-top: 128px; }

/* Announcement bar + event header: fixed at the top while scrolling (client, 2026-10-29). Over the hero they stay
   transparent as before; once scrolled (body.cy26e-scrolled, page.js) the header gets the dark navy background.
   The hero keeps its 128px top padding, enough for both (40 + 76). Under the WordPress admin bar when logged in. */
body.cy26-event-template { --cy26e-top: 0px; }
body.cy26-event-template.admin-bar { --cy26e-top: 32px; }
@media (max-width: 782px) {
	body.cy26-event-template.admin-bar { --cy26e-top: 46px; }
}
body.cy26-event-template .cy26.cy26-banner {
	position: fixed;
	top: var(--cy26e-top);
	right: 0;
	left: 0;
	z-index: 30;
	margin-top: 0;
}
body.cy26-event-template .cy26e-header {
	position: fixed;
	top: var(--cy26e-top);
	transition: background-color 0.2s, box-shadow 0.2s;
}
body.cy26e-has-banner .cy26e-header { top: calc(var(--cy26e-top) + var(--cy26-banner-h, 40px)); }
body.cy26e-scrolled .cy26e-header {
	background: #050a20;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 24px rgba(0, 0, 0, 0.25);
}
/* Phones: the admin bar scrolls away there, so keep the old behaviour for logged-in users (visitors are not affected). */
@media (max-width: 600px) {
	body.cy26-event-template.admin-bar .cy26.cy26-banner,
	body.cy26-event-template.admin-bar .cy26e-header { position: absolute; }
	body.cy26-event-template.admin-bar .cy26.cy26-banner { top: 0; }
	body.cy26-event-template.admin-bar.cy26e-has-banner .cy26e-header { top: var(--cy26-banner-h, 40px); }
}

/* ---------- Event header --------------------------------------------------- */
.cy26e {
	font-family: var(--cy26-font);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.cy26e *,
.cy26e *::before,
.cy26e *::after { box-sizing: border-box; }
.cy26e .cy26e-shell {
	width: min(100% - (var(--cy26-gutter) * 2), var(--cy26-shell));
	margin-inline: auto;
}
.cy26e a { text-decoration: none; }
.cy26e :where(a):focus-visible {
	outline: 2px solid var(--cy26-ring);
	outline-offset: 2px;
	border-radius: 4px;
}
.cy26e .cy26e-logo { display: flex; align-items: center; flex: none; }
.cy26e .cy26-logo__img { display: block; width: auto; height: 28px !important; max-width: none; object-fit: contain; }
.cy26e .cy26-logo__img--invert { filter: invert(1); }

.cy26e-header {
	position: absolute;
	inset: 0 0 auto;
	z-index: 20;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
}
.cy26e-header .cy26e-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-block: 20px;
}
.cy26e-nav {
	display: flex;
	align-items: center;
	gap: 24px;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
}
.cy26e-nav .cy26e-nav__link {
	display: none;
	color: color-mix(in oklab, var(--cy26-white) 85%, transparent);
	transition: color 0.15s;
}
.cy26e-nav .cy26e-nav__link:hover,
.cy26e-nav .cy26e-nav__link:focus { color: var(--cy26-white); }
.cy26e-nav .cy26e-btn.cy26e-nav__demo { display: none; }
@media (min-width: 640px) {
	.cy26e-nav .cy26e-nav__link { display: inline; }
	.cy26e-nav .cy26e-btn.cy26e-nav__demo { display: inline-flex; }
}

.cy26e .cy26e-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 36px;
	padding: 0 12px;
	border: 1px solid transparent;
	border-radius: var(--cy26-radius);
	background: var(--cy26-cta);
	box-shadow: 0 10px 28px color-mix(in oklab, var(--cy26-primary) 25%, transparent);
	color: var(--cy26-on-cta);
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	white-space: nowrap;
	transition: background-color 0.2s, color 0.2s;
}
.cy26e .cy26e-btn:hover,
.cy26e .cy26e-btn:focus { background: var(--cy26-cta-strong); color: var(--cy26-on-cta); }
.cy26e .cy26e-btn--outline {
	border-color: color-mix(in oklab, var(--cy26-white) 70%, transparent);
	background: transparent;
	box-shadow: none;
	color: var(--cy26-white);
}
.cy26e .cy26e-btn--outline:hover,
.cy26e .cy26e-btn--outline:focus { background: color-mix(in oklab, var(--cy26-white) 10%, transparent); color: var(--cy26-white); }

/* ---------- Event footer --------------------------------------------------- */
.cy26e-footer {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--cy26-border);
	background: var(--cy26-bg);
	color: var(--cy26-muted);
	font-size: 14px;
	line-height: 20px;
}
.cy26e-footer .cy26e-footer__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-block: 32px;
	text-align: center;
}
.cy26e-footer p { margin: 0; padding: 0; color: inherit; font-size: inherit; line-height: inherit; }
.cy26e-footer .cy26-logo__img { height: 24px !important; }
@media (min-width: 640px) {
	.cy26e-footer .cy26e-footer__inner { flex-direction: row; text-align: left; }
}

/* ---------- Icons ------------------------------------------------------------ */
.cy26-page .cy26e-ico {
	display: flex;
	align-items: center;
	gap: 8px;
}
.cy26-page .cy26e-ico::before,
.cy26-page .cy26e-checks > li::before,
.cy26-page .cy26e-slot__kind::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: var(--cy26e-i) center / contain no-repeat;
	mask: var(--cy26e-i) center / contain no-repeat;
}
.cy26-page .cy26e-ico--calendar { --cy26e-i: var(--cy26e-i-calendar); }
.cy26-page .cy26e-ico--clock { --cy26e-i: var(--cy26e-i-clock); }
.cy26-page .cy26e-ico--globe { --cy26e-i: var(--cy26e-i-globe); }
.cy26-page .cy26e-ico--video { --cy26e-i: var(--cy26e-i-video); }
.cy26-page .cy26e-ico--mic { --cy26e-i: var(--cy26e-i-mic); }

/* Checklist (hero aside, register copy) */
.cy26-page .cy26e-checks {
	display: grid;
	gap: 12px;
	font-size: 14px;
	line-height: 20px;
	color: color-mix(in oklab, var(--cy26-white) 80%, transparent);
}
.cy26-page .cy26e-checks > li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	--cy26e-i: var(--cy26e-i-check);
}
.cy26-page .cy26e-checks > li::before { margin-top: 2px; color: var(--cy26-mint); }

/* ---------- Hero --------------------------------------------------------- */
.cy26-page .cy26e-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: center;
	min-height: 672px;
	overflow: hidden;
	background: var(--cy26-navy);
	color: var(--cy26-white);
}
.cy26-page .cy26e-hero .cy26p-bgimg { z-index: -2; }
.cy26-page .cy26e-hero::before,
.cy26-page .cy26e-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
}
.cy26-page .cy26e-hero::before {
	background: linear-gradient(to right,
		color-mix(in oklab, var(--cy26-navy) 95%, transparent),
		color-mix(in oklab, var(--cy26-navy) 60%, transparent),
		color-mix(in oklab, var(--cy26-navy) 20%, transparent));
}
.cy26-page .cy26e-hero::after {
	background: linear-gradient(to top,
		color-mix(in oklab, var(--cy26-navy) 80%, transparent),
		transparent,
		color-mix(in oklab, var(--cy26-navy) 40%, transparent));
}
.cy26-page .cy26e-hero__inner {
	position: relative;
	display: grid;
	gap: 48px;
	padding-block: 128px;
}
@media (min-width: 1024px) {
	.cy26-page .cy26e-hero__inner {
		grid-template-columns: minmax(0, 1.5fr) minmax(288px, 0.6fr);
		align-items: end;
	}
}
.cy26-page .cy26e-hero__pill {
	width: fit-content;
	padding: 8px 12px;
	border: 1px solid color-mix(in oklab, var(--cy26-white) 30%, transparent);
	border-radius: 4px;
	background: color-mix(in oklab, var(--cy26-navy) 35%, transparent);
	color: var(--cy26-mint);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.cy26-page .cy26e-hero__title {
	max-width: 768px;
	margin-top: 28px;
	font-size: 36px;
	line-height: 1.04;
	text-wrap: balance;
}
.cy26-page .cy26e-hero__lead {
	max-width: 672px;
	margin-top: 24px;
	color: color-mix(in oklab, var(--cy26-white) 80%, transparent);
	font-size: 16px;
	line-height: 28px;
}
@media (min-width: 768px) {
	.cy26-page .cy26e-hero__title { font-size: 60px; }
	.cy26-page .cy26e-hero__lead { font-size: 18px; }
}
.cy26-page .cy26e-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	margin-top: 32px;
	color: color-mix(in oklab, var(--cy26-white) 85%, transparent);
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
}
.cy26-page .cy26e-meta .cy26e-ico::before { color: var(--cy26-mint); }
/* Time on two lines (PT / ET, Pastel #272): icon beside the first line. */
.cy26-page .cy26e-meta { align-items: flex-start; }
.cy26-page .cy26e-meta .cy26e-ico--clock { align-items: flex-start; }
.cy26-page .cy26e-meta .cy26e-ico--clock::before { margin-top: 2px; }
.cy26-page .wp-block-buttons.cy26e-hero__actions { align-items: stretch; margin-top: 36px; }
@media (min-width: 640px) {
	.cy26-page .wp-block-buttons.cy26e-hero__actions { align-items: center; }
}
.cy26-page .cy26e-hero__aside {
	padding-top: 24px;
	border-top: 1px solid color-mix(in oklab, var(--cy26-white) 30%, transparent);
}
.cy26-page .cy26e-hero__aside .cy26e-checks { margin-top: 20px; }
/* Keynote speaker card in "Save your seat" (design: virtual-event, updated 2026-10-28, Pastel #362). */
.cy26-page .cy26e-keynote {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin-top: 20px;
	padding: 14px;
	overflow: hidden;
	border: 1px solid color-mix(in oklab, var(--cy26-mint) 40%, transparent);
	border-radius: 10px;
	background: linear-gradient(to right, color-mix(in oklab, var(--cy26-mint) 15%, transparent), color-mix(in oklab, var(--cy26-navy-soft) 70%, transparent), color-mix(in oklab, var(--cy26-navy-soft) 40%, transparent));
}
.cy26-page .cy26e-keynote__img { flex: none; margin: 0; }
/* Taller headshot (Sidney, 2026-10-29): a portrait crop instead of the small square. */
.cy26-page .cy26e-keynote__img img { display: block; width: 72px; height: 96px; object-fit: cover; object-position: center top; border-radius: 6px; }
.cy26-page .cy26e-keynote__body { min-width: 0; }
.cy26-page .cy26e-keynote__label { gap: 6px; font-size: 10px; font-weight: 700; line-height: 16px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--cy26-mint); }
.cy26-page .cy26e-keynote__label::before { width: 11px; height: 11px; }
.cy26-page .cy26e-keynote__name { margin-top: 4px; font-size: 16px; font-weight: 700; line-height: 20px; color: var(--cy26-white); }
.cy26-page .cy26e-keynote__bio { margin-top: 6px; font-size: 11px; line-height: 16px; color: color-mix(in oklab, var(--cy26-white) 70%, transparent); }
@media (min-width: 768px) {
	.cy26-page .cy26e-keynote__img img { width: 88px; height: 116px; }
	.cy26-page .cy26e-keynote__bio { font-size: 12px; line-height: 20px; }
}
@media (min-width: 1024px) {
	.cy26-page .cy26e-hero__aside {
		padding: 0 0 0 32px;
		border-top: 0;
		border-left: 1px solid color-mix(in oklab, var(--cy26-white) 30%, transparent);
	}
}

/* ---------- Why attend --------------------------------------------------- */
.cy26-page .cy26e-lead {
	margin-top: 24px;
	color: var(--cy26-muted);
	font-size: 18px;
	line-height: 32px;
}
.cy26-page .cy26e-cards {
	display: grid;
	gap: 24px;
	margin-top: 48px;
}
@media (min-width: 768px) {
	.cy26-page .cy26e-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.cy26-page .cy26e-card {
	padding: 28px;
	border: 1px solid var(--cy26-border);
	border-radius: var(--cy26-radius-lg);
	background: var(--cy26-card);
}
/* Icon tile (::before) and icon (::after): the icon is chosen with the card class (cy26e-card--shield | --radar | --loop). */
.cy26-page .cy26e-card { position: relative; }
.cy26-page .cy26e-card::before {
	content: "";
	display: block;
	width: 44px;
	height: 44px;
	border-radius: var(--cy26-radius-lg);
	background: color-mix(in oklab, var(--cy26-primary) 10%, transparent);
}
.cy26-page .cy26e-card::after {
	content: "";
	position: absolute;
	top: 39px;
	left: 39px;
	width: 22px;
	height: 22px;
	background: var(--cy26-primary);
	-webkit-mask: var(--cy26e-i) center / contain no-repeat;
	mask: var(--cy26e-i) center / contain no-repeat;
}
.cy26-page .cy26e-card--shield { --cy26e-i: var(--cy26e-i-shield); }
.cy26-page .cy26e-card--radar { --cy26e-i: var(--cy26e-i-radar); }
.cy26-page .cy26e-card--loop { --cy26e-i: var(--cy26e-i-loop); }
.cy26-page .cy26e-card__title {
	margin-top: 20px;
	font-size: 18px;
	line-height: 1.375;
}
.cy26-page .cy26e-card__text {
	margin-top: 8px;
	color: var(--cy26-muted);
	font-size: 14px;
	line-height: 24px;
}

/* ---------- Speakers ------------------------------------------------------ */
.cy26-page .cy26e-speakers__grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start; /* An incomplete last row starts on the left (Sidney, 2026-10-29). */
	gap: 24px;
	margin-top: 48px;
}
.cy26-page .cy26e-speakers__grid .cy26e-speaker { flex: 0 0 100%; }
@media (min-width: 640px) {
	.cy26-page .cy26e-speakers__grid .cy26e-speaker { flex-basis: calc((100% - 24px) / 2); }
}
@media (min-width: 1024px) {
	/* 4 per row like the design (Sidney, 2026-10-29); 6 speakers = 4 + 2, the last row left-aligned. */
	.cy26-page .cy26e-speakers__grid .cy26e-speaker { flex-basis: calc((100% - 72px) / 4); }
}
.cy26-page .cy26e-speaker {
	overflow: hidden;
	padding-bottom: 20px;
	border: 1px solid var(--cy26-border);
	border-radius: var(--cy26-radius-lg);
	background: var(--cy26-card);
}
.cy26-page .cy26e-speaker__photo {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
}
.cy26-page .cy26e-speaker__photo .wp-block-image,
.cy26-page .cy26e-speaker__photo img {
	width: 100%;
	height: 100%;
}
.cy26-page .cy26e-speaker__photo img {
	object-fit: cover;
	transition: transform 0.5s;
}
.cy26-page .cy26e-speaker:hover .cy26e-speaker__photo img { transform: scale(1.03); }
.cy26-page .cy26e-speaker__badge {
	position: absolute;
	top: 12px;
	left: 12px;
	padding: 4px 10px;
	border-radius: 4px;
	background: var(--cy26-cta);
	color: var(--cy26-on-cta);
	font-size: 10px;
	font-weight: 700;
	line-height: 15px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.cy26-page .cy26e-speaker__name {
	padding: 20px 20px 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 24px;
}
.cy26-page .cy26e-speaker__role {
	margin-top: 4px;
	padding-inline: 20px;
	color: var(--cy26-muted);
	font-size: 14px;
	line-height: 20px;
}
.cy26-page .cy26e-speaker__company {
	margin-top: 2px;
	padding-inline: 20px;
	color: var(--cy26-primary);
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
}

/* ---------- Agenda ----------------------------------------------------- */
.cy26-page .cy26e-agenda .cy26p-intro .cy26p-body { margin-top: 20px; }
.cy26-page .cy26e-slots {
	display: grid;
	gap: 16px;
	margin-top: 48px;
}
.cy26-page .cy26e-slot {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 24px;
	border: 1px solid var(--cy26-border);
	border-radius: var(--cy26-radius-lg);
	background: var(--cy26-card);
}
@media (min-width: 768px) {
	.cy26-page .cy26e-slot {
		flex-direction: row;
		align-items: flex-start;
		gap: 32px;
		padding: 28px;
	}
	.cy26-page .cy26e-slot__when { flex: none; width: 160px; }
}
.cy26-page .cy26e-slot__time {
	color: var(--cy26-primary);
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
}
.cy26-page .cy26e-slot__kind {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	color: var(--cy26-muted);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0.025em;
	text-transform: uppercase;
	--cy26e-i: var(--cy26e-i-video);
}
.cy26-page .cy26e-slot__kind::before { width: 12px; height: 12px; }
.cy26-page .cy26e-slot__title {
	font-size: 18px;
	line-height: 1.375;
}
@media (min-width: 768px) {
	.cy26-page .cy26e-slot__title { font-size: 20px; }
}
.cy26-page .cy26e-slot__text {
	max-width: 672px;
	margin-top: 8px;
	color: var(--cy26-muted);
	font-size: 14px;
	line-height: 24px;
}
.cy26-page .cy26e-slot__speaker {
	margin-top: 12px;
	color: var(--cy26-primary);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
}
/* Keynote row: navy */
.cy26-page .cy26e-slot--keynote {
	border-color: color-mix(in oklab, var(--cy26-cta) 50%, transparent);
	background: var(--cy26-navy);
	box-shadow: 0 10px 15px -3px color-mix(in oklab, var(--cy26-fg) 10%, transparent), 0 4px 6px -4px color-mix(in oklab, var(--cy26-fg) 10%, transparent);
	color: var(--cy26-white);
}
.cy26-page .cy26e-slot--keynote .cy26e-slot__time { color: var(--cy26-mint); }
.cy26-page .cy26e-slot--keynote .cy26e-slot__kind { color: color-mix(in oklab, var(--cy26-white) 60%, transparent); --cy26e-i: var(--cy26e-i-mic); }
.cy26-page .cy26e-slot--keynote .cy26e-slot__text { color: color-mix(in oklab, var(--cy26-white) 70%, transparent); }
.cy26-page .cy26e-slot--keynote .cy26e-slot__speaker { color: color-mix(in oklab, var(--cy26-white) 60%, transparent); }
/* Interactive row: mint border */
.cy26-page .cy26e-slot--interactive { border-color: color-mix(in oklab, var(--cy26-mint) 50%, transparent); }
.cy26-page .cy26e-slot--interactive .cy26e-slot__kind { color: var(--cy26-primary); }

/* "The demo floor is open all event": a banner on the hero's horizon image (Sidney, 2026-10-29).
   Colours in rgba, not color-mix(), so it also reads on older iOS. */
.cy26-page .cy26e-note {
	position: relative;
	isolation: isolate;
	gap: 16px;
	margin-top: 40px;
	padding: 20px;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: var(--cy26-radius-lg);
	background:
		linear-gradient(to right, rgba(5, 10, 32, 0.92), rgba(5, 10, 32, 0.7) 55%, rgba(5, 10, 32, 0.35)),
		#050a20 url("img/home/cx-unplugged-horizon-1024.webp") center 70% / cover no-repeat;
	box-shadow: 0 12px 32px rgba(5, 10, 32, 0.25);
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	line-height: 22px;
}
/* The video icon in a small blue tile (the tile is ::after, the icon ::before above it). */
.cy26-page .cy26e-note::before {
	position: relative;
	z-index: 1;
	width: 20px;
	height: 20px;
	margin: 0 12px;
	color: #9cc9ff;
}
.cy26-page .cy26e-note::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 20px;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	border: 1px solid rgba(0, 119, 225, 0.55);
	border-radius: 8px;
	background: rgba(0, 119, 225, 0.22);
}
@media (min-width: 768px) {
	.cy26-page .cy26e-note { padding: 24px 28px; font-size: 18px; line-height: 26px; }
	.cy26-page .cy26e-note::after { left: 28px; }
}

/* ---------- Register ------------------------------------------------------ */
.cy26-page .cy26e-register__grid {
	display: grid;
	gap: 48px;
}
@media (min-width: 1024px) {
	.cy26-page .cy26e-register__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
		align-items: start; /* Copy aligned with the top of the form (Sidney, 2026-10-29). */
	}
}
.cy26-page .cy26e-register__text { max-width: 512px; }
.cy26-page .cy26e-register__copy .cy26e-checks { margin-top: 28px; }
.cy26-page .cy26e-register__card {
	/* backdrop-filter makes the card the containing block of reCAPTCHA's "fixed" (hidden) badge: clip it. */
	overflow: hidden;
	padding: 24px;
	border: 1px solid color-mix(in oklab, var(--cy26-white) 15%, transparent);
	border-radius: var(--cy26-radius-lg);
	background: color-mix(in oklab, var(--cy26-navy-soft) 60%, transparent);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
@media (min-width: 768px) {
	.cy26-page .cy26e-register__card { padding: 32px; }
}
.cy26-page .cy26e-register__legal {
	margin-top: 16px;
	color: color-mix(in oklab, var(--cy26-white) 55%, transparent);
	font-size: 12px;
	line-height: 16px;
	text-align: center;
}
.cy26-page .cy26e-register__legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.cy26-page .cy26e-register__legal a:hover { color: var(--cy26-white); text-decoration: underline; }

/* Thank-you (shown by marketo.js after a successful registration) */
.cy26-page .cy26e-done {
	max-width: 576px;
	text-align: center;
}
.cy26-page .cy26e-done { position: relative; }
.cy26-page .cy26e-done::before {
	content: "";
	display: block;
	width: 64px;
	height: 64px;
	margin: 0 auto 32px;
	border-radius: 999px;
	background: color-mix(in oklab, var(--cy26-mint) 15%, transparent);
}
.cy26-page .cy26e-done::after {
	content: "";
	position: absolute;
	top: 17px;
	left: 50%;
	width: 30px;
	height: 30px;
	transform: translateX(-50%);
	background: var(--cy26-mint);
	-webkit-mask: var(--cy26e-i-check) center / contain no-repeat;
	mask: var(--cy26e-i-check) center / contain no-repeat;
}
.cy26-page .cy26e-done .cy26p-body { margin-top: 20px; }
.cy26-page .cy26e-done .cy26p-actions { margin-top: 32px; }
