/* Fira Sans weights = 400, 400 italic, 500, 500 italic, 700 */

html { font-size: 10px; scroll-behavior: smooth; }
body { font-family: "Fira Sans", sans-serif!important; font-size: 2rem; line-height: 1.5; text-wrap: pretty; margin: 0; -webkit-font-feature-settings: "liga" 1; -moz-font-feature-settings: "liga" 1; -ms-font-feature-settings: "liga" 1; font-feature-settings: "liga" 1; }
html, body { height: auto; }

a { color: #36c; outline: 0; transition: all .2s linear; }
	a:hover { color: #69f; }
blockquote { background: #f2f2f2; padding: 20px 24px; margin: 40px 0; border-bottom: solid 4px #009e49; border-radius: 14px; }
blockquote:last-child { margin-bottom: 0; }
h1 { all: revert; font-size: 5rem; line-height: 1.125; text-wrap: balance; margin: .25em 0 0; }
h2, h3 { all: revert; font-size: 3rem; line-height: 1.25; margin: 1.25em 0 0; }
h3 { font-size: 2.4rem; }
	h3 span { font-weight: normal; }
h1:first-child, h2:first-child, h3:first-child, p:first-child { margin: 0; }
hr { background: linear-gradient(to right, rgba(0,0,0,0), #000, rgba(0,0,0,0)); max-width: 1200px; height: 1px; margin: 0 auto; border: 0; }
img { display: block; max-width: 100%; }
li { margin: .5em 0 0; }
	li:first-child { margin: 0; }
		li::marker { font-size: 2.4rem; line-height: 1; color: #009e49; }
		ol li::marker { font-size: inherit; font-weight: 500; }
	li li { padding-left: 10px; }
		li li::marker { content: '\BB'; }
ol { padding: 0 0 0 30px; }
p, ul { margin: 1em 0 0; }
ul { padding: 0 0 0 20px; }
ul ul { margin: .5em 0 0; }



.SiteWidth { width: 1200px; padding: 0 20px; margin: auto; }
#description.SiteWidth { width: 100%; padding: 0; }
.container { display: flow-root; max-width: 1200px; padding: 50px; margin: auto; }

.hero { text-wrap: balance;
	.container { display: grid; grid-template-columns: 1fr 428px; padding: 30px 50px; }
	.container.cart { display: block; }
		.logo { margin-left: -30px; }
		h1 { line-height: 1; }
		h2 { font-size: 2.8rem; font-weight: 500; margin: .25em 0 0; }
		.hero-img { grid-column: 2/3; grid-row: 1/3; align-self: center; border: solid 14px rgba(0, 0, 0, .15); border-radius: 50%; }
		.virtual { font-size: 2.6rem; line-height: 1.375; }
		.recorded { background: rgba(255,255,255,.30); width: fit-content; padding: 10px 20px; margin-top: .5em; border-radius: 10px; }
		.cta-container { justify-content: start; }
			.cta { margin-top: 1em; }
}

.date-time { background: #e5e5e5; width: fit-content; padding: 10px 20px; border-radius: 10px; }

.cta-container { display: flex; justify-content: center; gap: 40px; }
	.cta-container .cta { margin-inline: 0; }
.cta { font-size: 2.4rem; line-height: 1.25; font-weight: 500; color: #000; text-decoration: none; display: block; width: fit-content; padding: .5em 2.75em .5em 1em; margin: 2em auto 0; border: 0; border-radius: 100px; position: relative; }
.cta.dark { color: #fff; text-shadow: 2px 2px 3px rgba(0,0,0,.3); }
	.cta span { font-weight: normal; }
	.cta::after { content: '\BB'; font-size: 1.5em; line-height: 1.125em; text-align: center; background: rgba(0,0,0,.15); height: calc(100% - 10px); aspect-ratio: 1 / 1; border-radius: 50%; position: absolute; top: 5px; right: 5px; transition: all .2s linear; }
	.cta.dark::after { background: rgba(0,0,0,.3); }
	.cta:hover { color: #000; }
	.cta.dark:hover { color: #fff; }

.img-container { float: right; margin: 1em 0 1em 2em;
	p { font-size: 1.8rem; text-align: center; margin: 1em 0 0; }
	.offset { margin-right: 16%; }
}
.filter-shad { filter: drop-shadow(3px 3px 6px rgba(0,0,0,.2)); }

.callout { font-size: 2.2rem; font-weight: 500; padding: 20px 28px; margin: 1.5em 0 0; border-radius: 10px; }

.img-float-right { float: right; margin: 0 0 1em 2em; border-radius: 50%; }
.presenters-container { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; margin-top: 1.5em;
	img { margin: auto; border-radius: 50%; }
	h3 { text-align: center; }
}

.agenda { margin: 1em 0 0 40px; position: relative; }
	.agenda::before { content: ''; height: 100%; aspect-ratio: 1 / 1; border-radius: 4px; position: absolute; left: -40px; }
.agenda + p { margin-top: .5em; }
.indent { margin-left: 40px; }

.align-left { text-align: left; margin-left: 0; }
.align-center { text-align: center; margin-inline: auto; }
.semibold { font-weight: 500; }

.credit-cards { margin: 40px auto 0; }

.copyright { font-size: 1.6rem; margin: 2em 0 0; }



/* OVERRIDES */
.dark {
	.hero, footer { color: #fff; text-shadow: 2px 2px 3px rgba(0,0,0,.3); }
	.logo { filter: drop-shadow(2px 2px 3px rgba(0,0,0,.3)); }
	.recorded { background: rgba(0,0,0,.15); }
	.cta { text-shadow: none; }
	.cta.dark { text-shadow: 2px 2px 3px rgba(0,0,0,.3); }
}

.stp {
	.hero, footer { background: linear-gradient(to bottom right, #5ba699, #3f736a); }
	.highlight { color: #ffe580; }
	li::marker { color: #5ba699; }
	.cta { background: #fc0; }
		.cta:hover { background: #ffe580; }
	.callout, .presenter { background: #fff5cc;}
	.agenda::before { background: #a3d9d0; }
}

.sssp {
	.hero, footer { background: linear-gradient(to bottom right, #fd9, #fc6); }
	li::marker, .highlight { color: #d96016; }
	.cta { background: #d96016; }
		.cta:hover { background: #ff6040; }
	.callout, .presenter { background: #fec;}
}

.ai {
	.hero, footer { background: linear-gradient(to bottom right, #3d7a99, #295266); }
	.highlight { color: #b2e5ff; }
	li::marker { color: #3d7a99; }
	.cta { background: #f73; }
		.cta:hover { background: #c40; }
	.date-time, .callout, .presenter { background: #daeaf2;}
	.agenda::before { background: #a1cfe5; }
}