/*
Theme Name: Tiller Digital - 2025
Author: Tiller Digital
Version: 1.1.2
License: GNU General Public License v3 or later
*/



/* REM SCALING */
/* scroll-padding-top can not be set as a variable */

html {font-size: 1px; scroll-padding-top: 128px;}

@media screen and (max-width: 1520px) {html{font-size: 1.000px;}}
@media screen and (max-width: 1480px) {html{font-size: 0.975px;}}
@media screen and (max-width: 1440px) {html{font-size: 0.950px;}}
@media screen and (max-width: 1400px) {html{font-size: 0.925px;}}
@media screen and (max-width: 1360px) {html{font-size: 0.900px;}}
@media screen and (max-width: 1320px) {html{font-size: 0.875px;}}
@media screen and (max-width: 1280px) {html{font-size: 0.850px;}}
@media screen and (max-width: 1240px) {html{font-size: 0.825px;}}
@media screen and (max-width: 1200px) {html{font-size: 0.800px;}}
@media screen and (max-width: 1160px) {html{font-size: 0.775px;}}
@media screen and (max-width: 1120px) {html{font-size: 0.750px;}}
@media screen and (max-width: 1080px) {html{font-size: 0.725px;}}
@media screen and (max-width: 1040px) {html{font-size: 0.700px;}}
@media screen and (max-width: 1000px) {html{font-size: 0.675px;}}

@media screen and (max-width: 960px)  {html{font-size: 1.000px;}}



/* VARIABLES */

html {

	/* colors */

	--white: #fff;
	--black: #000;

	--light-grey: #ccc;
	--dark-grey: #666;

	--blue: #006FF6;
	--yellow: #FFA100;
	--red: #F43D00;



	/* spacing */

	--ps: 0.875em;

	--s1: 8rem;
	--s2: 12rem;
	--s3: 16rem;
	--s4: 24rem;
	--s5: 32rem;
	--s6: 48rem;
	--s7: 64rem;
	--s8: 96rem;
	--s9: 128rem;
	--s10: 192rem;
	--s11: 256rem;
	--s12: 384rem;

	--ns1: -8rem;
	--ns2: -12rem;
	--ns3: -16rem;
	--ns4: -24rem;
	--ns5: -32rem;
	--ns6: -48rem;
	--ns7: -64rem;
	--ns8: -96rem;
	--ns9: -128rem;
	--ns10: -192rem;
	--ns11: -256rem;
	--ns12: -384rem;

	--col-1: 96rem;
	--col-2: 208rem;
	--col-3: 320rem;
	--col-4: 432rem;
	--col-5: 544rem;
	--col-6: 656rem;
	--col-7: 768rem;
	--col-8: 880rem;
	--col-9: 992rem;
	--col-10: 1104rem;
	--col-11: 1216rem;
	--col-12: 1328rem;

	--frame-width: 1328rem;
	--page-head-height: var(--s8);
	--page-head-height-compressed: var(--s8);
	--scrollbar-width: 0px;
	--page-width: calc(100vw - var(--scrollbar-width));
	--notification-height: var(--s6);
}

@media screen and (max-width: 960px) {
	html {
		--frame-width: 448rem;
		--page-head-height: var(--s7);
		--page-head-height-compressed: var(--s7);
	}
}



/* TEXT */

html {
	scroll-behavior: smooth;
	overflow-y: scroll;
	text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: transparent;
}

body {
	margin: 0;
	font-family: 'bassen', sans-serif;
	font-size: 18rem;
	line-height: 1.75;
	font-weight: 400;
	color: var(--white);
	background: var(--black);
	word-wrap: break-word;
}

h1, h2, h3, h4, h5, h6,
.b-h1, .b-h2, .b-h3, .b-h4, .b-h5, .b-h6 {
	margin: 1.25em 0 0.5em 0;
	font-family: 'tiempos', serif;
	line-height: 1.25;
	font-weight: 400;
	letter-spacing: 0.03em;
	text-wrap: balance;
}

h1, .b-h1 {font-size: 88rem;}
h2, .b-h2 {font-size: 62rem;}
.b-h2-small {font-size: 48rem;}
h3, .b-h3 {font-size: 36rem;}
h4, .b-h4 {font-size: 32rem;}
h5, .b-h5 {font-size: 20rem; line-height: 1.75;}
h6, .b-h6 {font-size: 18rem; line-height: 1.75;}

:is(h1, h2, h3, h4, h5, h6) b,
:is(h1, h2, h3, h4, h5, h6) strong {font-weight: 400;}
:is(h1, h2, h3, h4, h5, h6) a {font-weight: 400;}
:is(h1, h2, h3, h4, h5, h6) a:not(:hover) {text-decoration-color: transparent;}

.b-text-large {font-size: 22rem;}
.b-text-small {font-size: 16rem;}

.b-eyebrow {
	font-family: 'bassen', sans-serif;
	font-size: 18rem;
	line-height: 1.75;
	letter-spacing: 0;
	margin: 0;
	font-weight: 600;
}
.b-eyebrow + * {margin-top: var(--ps);}

[data-inverted] {color: var(--black);}

@media screen and (max-width: 960px) {
	html {scroll-padding-top: 96px;}
	body {font-size: 16rem;}

	h1, .b-h1 {font-size: 40rem;}
	h2, .b-h2, .b-h2-small {font-size: 32rem;}
	h3, .b-h3 {font-size: 24rem;}
	h4, .b-h4 {font-size: 20rem;}
	h5, .b-h5 {font-size: 18rem;}
	h6, .b-h6 {font-size: 16rem;}

	.b-text-large {font-size: 18rem;}
	.b-text-small {font-size: 14rem;}
	.b-eyebrow {font-size: 16rem;}

	.b-body h1 br,
	.b-body h2 br,
	.b-body h3 br,
	.b-body h4 br,
	.b-body h5 br,
	.b-body h6 br {display: none;}
}



/* BASIC TAGS */

p {
	margin: var(--ps) 0;
}

ul, ol {
	margin: var(--ps) 0;
	padding: 0 0 0 var(--s6);

}

li {
	margin: calc(var(--ps) / 2) 0;
}

li > ul,
li > ol {
	margin-top: calc(var(--ps) / 2) !important;
}

strong, b {
	font-weight: 600;
}

em, i {
	font-style: italic;
}

img, svg {
	display: block;
	max-width: 100%;
	height: auto;
	border: none;
	object-fit: cover;
}

blockquote {
	position: relative;
	margin: var(--s7) 0 var(--s7) calc(var(--col-1) + var(--s3));
}

hr {
	margin: var(--s7) 0;
	padding: 0;
	background: none;
	border: none;
	border-bottom: 1rem solid var(--dark-grey);
}

table {
	margin: var(--s7) 0;
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
}

table td,
table th {
	text-align: left;
	padding: var(--s5) 0;
	border: 1rem solid currentColor;
	border-width: 1rem 0;
	vertical-align: top;
}

table td:not(:first-child),
table th:not(:first-child) {
	padding-left: var(--s5);
}

table ul,
table ol {
	padding-left: 1em;
}

iframe {
	width: 100%;
	border: none;
	overflow: auto;
}

iframe[data-src] {
	background: #000;
}

nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

article,
aside,
footer,
header,
main,
section {
	display: block;
}

strong.alt-label {
	font-weight: 500;
	font-size: 80%;
	font-style: normal;
	text-transform: uppercase;
}

blockquote.alt-framed {
	margin: var(--s7) 0;
	padding: var(--s6);
	background: rgba(255,255,255,0.1);
}

[data-inverted] blockquote.alt-framed {background: rgba(0,0,0,0.1);}

@media screen and (max-width: 960px) {
	ul, ol {padding-left: var(--s5);}
	blockquote {margin: var(--s6) 0 var(--s6) var(--s5);}
	hr {margin: var(--s6) 0;}
	table {margin: var(--s6) 0; font-size: 14rem;}
	table td,
	table th {padding: var(--s3) 0;}
	table td:not(:first-child),
	table th:not(:first-child) {padding-left: var(--s3);}

	blockquote.alt-framed {margin: var(--s6) 0; padding: var(--s5);}
}



/* LINKS */

a {
	color: var(--white);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 0.3em;
	text-decoration-thickness: 2rem;
	text-decoration-color: currentColor;
	transition: text-decoration 0.25s;
}

a:hover {
	text-decoration-color: var(--blue);
}

a svg, button svg {
	fill: currentColor;
}

[data-inverted] a {color: var(--black);}



/* BUTTON */

.b-button {
	cursor: pointer;
	max-width: 100%;
	vertical-align: middle;
	display: inline-block;
	box-sizing: border-box;
	font-family: inherit;
	font-weight: 600;
	font-size: 16rem;
	line-height: 1.25;
	width: auto;
	padding: 14rem 20rem;
	margin: 0;
	border: none;
	border-radius: 0;
	text-align: center;
	color: var(--black);
	background: var(--yellow);
	appearance: none;
	text-decoration-line: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	transition: color 0.25s, background 0.25s, box-shadow 0.25s, text-decoration 0.25s !important;
}

.b-button:hover {
	color: var(--white);
	background: var(--blue);
}

[data-inverted] .b-button {color: var(--white); background: var(--blue);}
[data-inverted] .b-button:hover {color: var(--white); background: var(--black);}

/* alternative */

.b-button.alt-alternative {color: var(--white); background: var(--blue);}
.b-button.alt-alternative:hover {color: var(--black); background: var(--white);}

[data-inverted] .b-button.alt-alternative {color: var(--white); background: var(--blue);}
[data-inverted] .b-button.alt-alternative:hover {color: var(--white); background: var(--black);}

/* secondary */

.b-button.alt-secondary {color: var(--white); background: transparent; box-shadow: inset 0 0 0 2rem var(--white);}
.b-button.alt-secondary:hover {color: var(--whtie); background: var(--blue); box-shadow: inset 0 0 0 2rem var(--blue);}

[data-inverted] .b-button.alt-secondary {color: var(--black); background: transparent; box-shadow: inset 0 0 0 2rem var(--black);}
[data-inverted] .b-button.alt-secondary:hover {color: var(--white); background: var(--blue); box-shadow: inset 0 0 0 2rem var(--blue);}

/* text */

.b-button.alt-tertiary {background: transparent; color: var(--white);
	text-align: left; font-size: 18rem; padding: 0; text-decoration: underline; text-decoration-thickness: 2rem;}
.b-button.alt-tertiary:hover {background: transparent; color: var(--white); text-decoration-color: var(--blue);}

[data-inverted] .b-button.alt-tertiary {background: transparent; color: var(--black);}
[data-inverted] .b-button.alt-tertiary:hover {background: transparent; color: var(--black);}

/* active */

.b-button.alt-active {background: var(--green);}

/* icon */

.b-button.alt-icon {
	display: inline-flex;
	align-items: stretch;
	padding: 0;
}

.b-button.alt-icon .text {
	padding: 14rem 20rem;
}

.b-button.alt-icon .icon {
	position: relative;
	background: var(--black);
	color: var(--white);
	width: calc(var(--s6) - 4rem);
	min-height: calc(var(--s6) - 4rem);
	margin: 2rem 2rem 2rem 0;
	flex: 0 0 auto;
	overflow: hidden;
}

.b-button.alt-icon .icon svg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: color 0.25s;
}

.b-button.alt-icon .icon span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	transition: transform 0.25s;
}

[data-inverted] .b-button.alt-icon .icon {
	background: var(--white);
	color: var(--black);
}

/* icon - secondary */

.b-button.alt-secondary.alt-icon .text {border-right: 2rem solid currentColor; transition: border-color 0.25s;}
.b-button.alt-secondary.alt-icon .icon {color: currentColor !important;}
.b-button.alt-secondary.alt-icon:hover .text {border-color: var(--blue) !important;}

/* icon - tertiary */

.b-button.alt-tertiary.alt-icon .text {padding: 0;}
.b-button.alt-tertiary.alt-icon .icon {margin: var(--ns1) 0; background: transparent;}
.b-button.alt-tertiary.alt-icon:hover .icon {color: var(--blue);}

/* icon - arrow */

.b-button.alt-icon .icon.alt-arrow span:last-child {top: -100%; left: -100%;}
.b-button.alt-icon:hover .icon.alt-arrow span {transform: translate(100%, 0);}

/* icon - external */

.b-button.alt-icon .icon.alt-external span:last-child {top: 0; left: -100%;}
.b-button.alt-icon:hover .icon.alt-external span {transform: translate(100%, -100%);}

/* icon - external */

.b-button.alt-icon .icon.alt-download span:last-child {top: -200%; left: 0;}
.b-button.alt-icon:hover .icon.alt-download span {transform: translate(0, 100%);}

@media screen and (max-width: 960px) {
	.b-button.alt-tertiary {font-size: 16rem;}
	.b-button.alt-tertiary.alt-icon .icon {margin: -10rem 0;}
}



/* BUTTONS */

.b-buttons {
	display: flex;
	flex-wrap: wrap;
	margin: var(--s5) var(--ns1) var(--ns3);
}

.b-buttons .b-buttons-button {
	padding: 0 var(--s1) var(--s3);
	flex: 0 0 auto;
	max-width: 100%;
	box-sizing: border-box;
}

.b-buttons:first-child {margin-top: 0;}

@media screen and (min-width: 961px) {
	.b-buttons[data-columns] {margin-left: var(--ns1); margin-right: var(--ns1);}
	.b-buttons[data-columns] .b-buttons-button {padding-left: var(--s1); padding-right: var(--s1); width: var(--col-4); box-sizing: content-box;}

	.b-buttons[data-offset] {margin-top: calc(var(--s8) - var(--s3));}
}

@media screen and (max-width: 960px) {
	.b-buttons {margin-top: var(--s5);}
	.b-buttons .b-buttons-button {width: 100%;}
}



/* PAGE */

.b-page {
	border-right: 0 solid var(--white); /* used when scroll is disabled */
	max-width: 100%;
	min-width: 320px;
	max-width: 2560px;
	margin: 0 auto;
	margin-top: var(--notification-height);
	overflow: clip;
}

.b-page-head {
	position: absolute;
	z-index: 2;
	top: var(--notification-height);
	left: 0;
	right: 0;
	max-width: 100%;
	min-width: 320px;
	max-width: 2560px;
	margin: 0 auto;
	height: var(--page-head-height);
	transition: transform 0s, height 0.25s, top 0s;
}

.b-page[data-scroll] .b-page-head {
	position: fixed;
	top: calc(var(--page-head-height-compressed) * -1);
	height: var(--page-head-height-compressed);
	transition: transform 0.25s, height 0.25s, top 0.25s;
}

.b-page[data-scroll="down"] .b-page-head {
	transition: transform 0.25s, height 0s, top 0s;
}

.b-page[data-scroll="up"] .b-page-head {
	transform: translate(0, 100%);
}

.b-page-body {
	position: relative;
	z-index: 1;
}

.b-page-body > .b-section:first-child {
	padding-top: var(--page-head-height);
}

.b-page-body > .b-section:first-child > .b-frame {
	padding-top: var(--s5);
}

.b-page-foot {
	position: relative;
	z-index: 1;
}

#toggle-nav:checked ~ .b-page[data-scroll] .b-page-head {
	transform: translate(0, 100%);
	height: var(--page-head-height);
	top: calc(var(--page-head-height) * -1);
}

.b-page-body > .b-section.alt-bg-offset:first-child {
	padding-top: 0;
	margin-top: var(--page-head-height);
}

.b-body[data-loading] * {
	transition: none !important;
}

@media screen and (max-width: 960px) {
	.b-page-body > .b-section:first-child > .b-frame {padding-top: var(--s3);}
}



/* COLUMNS */

.b-columns {
	display: flex;
	flex-wrap: wrap;
	margin: 0 var(--ns1) var(--ns3);
}

.b-column {
	padding: 0 var(--s1) var(--s3);
	flex: 0 0 auto;
	max-width: 100%;
}

.b-column[data-width*="/"] {box-sizing: border-box;}
.b-column[data-width="auto"] {flex: 1 1 auto;}

.b-column[data-width="1"] {width: var(--col-1);}
.b-column[data-width="2"] {width: var(--col-2);}
.b-column[data-width="3"] {width: var(--col-3);}
.b-column[data-width="4"] {width: var(--col-4);}
.b-column[data-width="5"] {width: var(--col-5);}
.b-column[data-width="6"] {width: var(--col-6);}
.b-column[data-width="7"] {width: var(--col-7);}
.b-column[data-width="8"] {width: var(--col-8);}
.b-column[data-width="9"] {width: var(--col-9);}
.b-column[data-width="10"] {width: var(--col-10);}
.b-column[data-width="11"] {width: var(--col-11);}
.b-column[data-width="12"] {width: var(--col-12);}

.b-column[data-width="1/1"] {width: 100%;}
.b-column[data-width="1/2"] {width: 50%;}
.b-column[data-width="1/3"] {width: 33.333333%;}
.b-column[data-width="1/4"] {width: 25%;}
.b-column[data-width="1/5"] {width: 20%;}
.b-column[data-width="1/6"] {width: 16.666666%;}
.b-column[data-width="1/7"] {width: 14.285714%;}
.b-column[data-width="1/8"] {width: 12.5%;}
.b-column[data-width="1/9"] {width: 11.111111%;}
.b-column[data-width="1/10"] {width: 10.000%;}
.b-column[data-width="1/11"] {width: 9.090909%;}
.b-column[data-width="1/12"] {width: 8.333333%;}

/* alts */

.b-columns.alt-bottom {margin-bottom: var(--ns8);}
.b-columns.alt-bottom .b-column {padding-bottom: var(--s8);}

.b-columns.alt-center {justify-content: center;}
.b-columns.alt-middle {align-items: center;}

.b-columns.alt-flickity {overflow: hidden; justify-content: flex-start; flex-wrap: nowrap;}
.b-columns.alt-flickity.flickity-enabled {overflow: visible; display: block; margin-top: 0; margin-bottom: 0; padding-bottom: var(--s7);}
.b-columns.alt-flickity.flickity-enabled .b-column {display: block; padding-top: 0; padding-bottom: 0;}
.b-columns.alt-flickity.flickity-enabled.alt-middle .b-column {display: flex; flex-direction: column; justify-content: center;}

@media screen and (max-width: 960px) {
	.b-column[data-width] {width: 100%; box-sizing: border-box;}

	.b-columns.alt-bottom {margin-bottom: var(--ns6);}
	.b-columns.alt-bottom .b-column {padding-bottom: var(--s6);}
}



/* SPACER */

.b-spacer {
	display: block;
	clear: both;
	height: var(--spacer-height, var(--s9));
}

.b-spacer[data-height="xl"] {height: var(--s11);}
.b-spacer[data-height="medium"] {height: var(--s7);}
.b-spacer[data-height="small"] {height: var(--s5);}

@media screen and (max-width: 960px) {
	.b-spacer {height: var(--spacer-height-mobile, var(--s6));}
	.b-spacer[data-height="xl"] {height: var(--s8);}
	.b-spacer[data-height="medium"] {height: var(--s5);}
	.b-spacer[data-height="small"] {height: var(--s3);}
}



/* MARGIN OVERWRITES */

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child,
p:first-child,
ul:first-child,
ol:first-child,
li:first-child,
hr:first-child,
blockquote:first-child,
table:first-child {
	margin-top: 0 !important;
}

h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
p:last-child,
ul:last-child,
ol:last-child,
li:last-child,
hr:last-child,
blockquote:last-child,
table:last-child {
	margin-bottom: 0 !important;
}



/* SKIP LINKS */

.b-skip-links {
	z-index: 3;
	position: absolute;
	top: var(--page-prehead-height);
	left: 0;
	font-size: 14rem;
	padding: var(--s1);
}

.b-skip-links a {
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.25s;
}

.b-skip-links a:focus {opacity: 1;}

@media screen and (max-width: 960px) {
	.b-skip-links {display: none;}
}



/* NOTIFICATION */

.b-notification {
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	right: 0;
	height: var(--notification-height);
	background: var(--dark-grey);
	color: var(--white);
	overflow: hidden;
}

.b-notification .b-frame {
	padding-top: 0;
	padding-bottom: 0;
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
}



/* NAV & MODAL */

.b-nav,
.b-modal {
	display: flex;
	justify-content: center;
	align-items: center;
	pointer-events: none;
	overflow: hidden;
	position: fixed;
	z-index: 4;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	visibility: hidden;
	transition: visibility 0s 0.25s, opacity 0.25s;
}

.b-nav-overlay,
.b-modal-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: var(--black);
	opacity: 0.8;
}

.b-nav-wrapper,
.b-modal-wrapper {
	width: fit-content;
	max-width: var(--frame-width);
	max-height: calc(100% - var(--s7));
	overflow: auto;
	overflow-x: clip;
	scrollbar-width: none;
	transform: translate(0, var(--s5));
	transition: transform 0.25s;
}

#toggle-nav:checked ~ .b-nav,
.b-modal-open .b-modal {
	pointer-events: auto;
	opacity: 1;
	visibility: visible;
	transition: visibility 0s 0s, opacity 0.25s;
}

#toggle-nav:checked ~ .b-nav .b-nav-wrapper,
.b-modal-open .b-modal .b-modal-wrapper {
	transform: translate(0, 0);
}

/* nav */

.b-nav {top: var(--page-head-height); display: block;}
.b-nav-overlay {background: var(--black); opacity: 1; pointer-events: none;}
.b-nav-wrapper {width: auto; max-width: 100%; height: calc(100% - var(--s8));}
.b-nav-bottom {height: var(--s8); display: flex; align-items: center; justify-content: center; position: relative;}

.b-page:not([data-scroll]) ~ .b-nav {top: calc(var(--page-head-height) + var(--notification-height));}

/* modal */

.b-modal-close {
	display: block;
	position: sticky;
	top: var(--s3);
	width: var(--s5);
	height: var(--s5);
	text-indent: -9999rem;
	background: url('assets/images/ui-close.svg') no-repeat center / 32rem;
	z-index: 2;
	margin: 0 var(--s3) var(--ns5) auto;
	padding: 0;
	border: none;
	appearance: none;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.b-page [data-modal-id] {display: none;}

@media screen and (max-width: 960px) {
	.b-modal-wrapper {width: calc(100% - var(--s5));}

	#toggle-nav:checked ~ .b-page[data-scroll] ~ .b-nav {transition: visibility 0s 0.1s, opacity 0.25s 0.125s;}
	#toggle-nav:checked ~ .b-page[data-scroll] ~ .b-nav .b-nav-wrapper {transition: transform 0.25s 0.125s;}
}



/* IMAGE */

.b-img {
	position: relative;
	pointer-events: none;
	margin: auto;
	container-type: size;
	container-name: image;
	max-width: 100%;
}

.b-img img {
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: auto;
	object-fit: cover;
	object-position: center;
	max-width: none;
}

.b-img iframe {
	z-index: 2;
}

.b-img button {
	display: block;
	cursor: pointer;
	appearance: none;
	overflow: hidden;
	padding: 0;
	margin: 0;
	width: var(--s5);
	height: var(--s5);
	text-indent: -999rem;
	background: var(--black) url('assets/images/ui-pause.svg') no-repeat center / 32rem;
	border: none;
	font-size: 100%;
	font-family: inherit;
	pointer-events: auto;
	z-index: 2;
	position: absolute;
	bottom: var(--s1);
	left: var(--s1);
	opacity: 0;
	transition: opacity 0.25s;
}

.b-img button:focus,
.b-img:hover button {
	opacity: 1;
}

.b-img button[data-paused] {
	background-image: url('assets/images/ui-play.svg');
}

.b-img-video video,
.b-img-oembed iframe,
.b-img-lottie dotlottie-player,
.b-img-modal video,
.b-img-modal iframe {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	pointer-events: auto;
	object-fit: cover;
	object-position: center;
}

.b-img-lottie,
.b-img-video,
.b-img-oembed {
	width: 100%;
	height: 100%;
	display: none;
}

.b-img-video,
.b-img-oembed {
	background: #000;
}

.b-img-modal {
	width: var(--frame-width);
	max-width: 100%;
}

.b-page .b-img[data-click],
.b-page .b-img[data-modal] {pointer-events: auto; cursor: pointer;}

.b-img-picture {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.b-img-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.b-img-meta {
	z-index: 3;
	position: relative;
	opacity: 0.5;
	width: 0;
	height: 0;
	display: none;
}

.b-img-meta > span {
	display: inline-block;
	vertical-align: top;
	font-size: 14rem;
	margin: 4rem;
	background: var(--black);
	color: var(--white);
	padding: 0 4rem;
	white-space: nowrap;
}

.b-img-caption {
	font-size: 14rem;
	margin-top: 8rem;
	line-height: 1.25;
}

.b-img-container {margin: var(--s7) 0;}
.b-img-container:first-child {margin-top: 0 !important;}
.b-img-container:last-child {margin-bottom: 0 !important;}
.b-img-container + .b-img-container {margin-top: var(--ns5);}

.b-img-picture[style*="%"] img {object-fit: contain;}
.b-img [data-modal-id] {display: none;}

.b-img[data-mobile] ~ .b-img {display: none; width: 100% !important;}

/* sizing options */

.b-img[data-type="fit"] img,
.b-img[data-type="fit"] video,
.b-img[data-type="fit"] iframe,
.b-img[data-type="fit"] dotlottie-player {object-fit: contain;}
.b-img[data-type="fit"] .b-img-overlay {background-size: contain;}

.b-img[data-alignment="top"] img,
.b-img[data-alignment="top"] video,
.b-img[data-alignment="top"] iframe,
.b-img[data-alignment="top"] dotlottie-player {object-position: top;}
.b-img[data-alignment="top"] .b-img-overlay {background-position: top;}

.b-img[data-alignment="right"] img,
.b-img[data-alignment="right"] video,
.b-img[data-alignment="right"] iframe,
.b-img[data-alignment="right"] dotlottie-player {object-position: right;}
.b-img[data-alignment="right"] .b-img-overlay {background-position: right;}

.b-img[data-alignment="bottom"] img,
.b-img[data-alignment="bottom"] video,
.b-img[data-alignment="bottom"] iframe,
.b-img[data-alignment="bottom"] dotlottie-player {object-position: bottom;}
.b-img[data-alignment="bottom"] .b-img-overlay {background-position: bottom;}

.b-img[data-alignment="left"] img,
.b-img[data-alignment="left"] video,
.b-img[data-alignment="left"] iframe,
.b-img[data-alignment="left"] dotlottie-player {object-position: left;}
.b-img[data-alignment="left"] .b-img-overlay {background-position: left;}

.b-img[data-alignment="left"] {margin: 0 auto 0 0;}
.b-img[data-alignment="right"] {margin: 0 0 0 auto;}

@media (width > 960px) {
	.b-body .b-img-lottie {display: block;}
	.b-body .b-img-lottie + .b-img-picture {display: none;}

	.b-body .b-img:not([data-click]) .b-img-video {display: block;}
	.b-body .b-img:not([data-click]) .b-img-video + .b-img-picture {display: none;}

	.b-body .b-img:not([data-click]) .b-img-oembed {display: block;}
	.b-body .b-img:not([data-click]) .b-img-oembed + .b-img-picture {display: none;}
}

@media (width <= 960px) {
	.b-img-container {margin: var(--s5) 0;}

	.b-img[data-mobile] {display: none;}
	.b-img[data-mobile] ~ .b-img {display: block;}
}

/* container queries */

.b-img img[data-size] {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

.b-img img[data-size^="svg"] {
	display: block;
}

@media (resolution < 2dppx) {
	@container image (width <= 288px) {.b-img img[data-size^="xxs"] {display: block;}}
	@container image (width > 288px) and (width <= 576px) {.b-img img[data-size^="xs"] {display: block;}}
	@container image (width > 576px) and (width <= 864px) {.b-img img[data-size^="s"] {display: block;}}
	@container image (width > 864px) and (width <= 1152px) {.b-img img[data-size^="m"] {display: block;}}
	@container image (width > 1152px) and (width <= 1440px) {.b-img img[data-size^="l"] {display: block;}}
	@container image (width > 1440px) and (width <= 1728px) {.b-img img[data-size^="xl"] {display: block;}}
	@container image (width > 1728px) {.b-img img[data-size^="xxl"] {display: block;}}
}

@media (resolution >= 2dppx) {
	@container image (width <= 144px) {.b-img img[data-size^="xxs"] {display: block;}}
	@container image (width > 144px) and (width <= 288px) {.b-img img[data-size^="xs"] {display: block;}}
	@container image (width > 288px) and (width <= 576px) {.b-img img[data-size^="s"] {display: block;}}
	@container image (width > 576px) and (width <= 864px) {.b-img img[data-size^="m"] {display: block;}}
	@container image (width > 864px) and (width <= 1152px) {.b-img img[data-size^="l"] {display: block;}}
	@container image (width > 1152px) and (width <= 1440px) {.b-img img[data-size^="xl"] {display: block;}}
	@container image (width > 1440px) {.b-img img[data-size^="xxl"] {display: block;}}
}


/* custom cursor */

.b-img .cursor {display: none;}

@media (hover: hover) and (pointer: fine) {
	.b-img[data-custom-cursor] .cursor {
		display: block;
		z-index: 999;
		position: fixed;
		width: 128rem;
		height: 128rem;
		margin: -64rem 0 0 -64rem;
		clip-path: polygon(0 0, 100% 50%, 0 100%);
		background: url('assets/images/ui-cursor-play.svg') no-repeat center / 100%;
		text-align: left;
		padding-left: 24rem;
		line-height: 128rem;
		box-sizing: border-box;
		backdrop-filter: blur(4rem);
		pointer-events: none;
		opacity: 0;
		transform: scale(0);
		transition: opacity 0.5s, transform 0.5s;
	}

	.b-img[data-custom-cursor] * {cursor: none;}
	.b-img[data-custom-cursor]:hover .cursor {opacity: 1; transform: scale(1);}
	.b-img[data-custom-cursor] .b-img-oembed:hover ~ .cursor {display: none;}
}



/* UTILITY */

.b-disabled {
	opacity: 0.25 !important;
	pointer-events: none !important;
}

.b-hidden {
	display: none !important;
}

.b-video-opacity-50 video {
	opacity: 0.5 !important;
}

@media screen and (min-width: 961px) {
	.b-desktop-hidden {display: none;}
}

@media screen and (max-width: 960px) {
	.b-mobile-hidden {display: none;}
}



/* SHARE */

.b-share {
	display: inline-flex;
	justify-content: flex-start;
}

.b-share a {
	margin-right: var(--s3);
	transition: color 0.25s;
}

.b-share a:hover {
	color: var(--blue);
}



/* STAT */

.b-stat:not(:last-child) {
	margin-bottom: var(--s5);
}

.b-stat {
	line-height: 1.5;
}

.b-stat > strong {
	display: block;
	font-family: 'tiempos', sans-serif;
	font-size: 96rem;
	line-height: 1;
	font-weight: 400;
	letter-spacing: 0.03em;
	overflow: hidden;
	white-space: nowrap;
	margin: -0.125em 0 0.05em;

}

@media screen and (max-width: 960px) {
	.b-stat:not(:last-child) {margin-bottom: var(--s4);}
	.b-stat > strong {font-size: 54rem;}
}



/* LIST - ARROWS */

ul.alt-arrows {
	padding: 0;
	list-style: none;
}

ul.alt-arrows > li {
	background: no-repeat url('assets/images/ui-arrow.svg') left 5rem / 17rem 16rem;
	padding-left: var(--s5);
	line-height: 1.25;
	margin: 1em 0;
}

@media screen and (max-width: 960px) {
	ul.alt-arrows > li {background-position: left 2rem;}
}



/* MOBILE TABLES */

.b-table-frame {margin: var(--s7) 0;}
.b-table-frame:first-child {margin-top: 0 !important;}
.b-table-frame:last-child {margin-bottom: 0 !important;}

@media screen and (max-width: 960px) {
	.b-table-frame {
		overflow: auto hidden;
		width: var(--page-width);
		max-width: calc(800rem + var(--s5));
		position: relative;
		left: 50%;
		transform: translate(-50%, 0);
		margin: var(--s6) 0;
	}
	.b-table-frame table {width: 800rem; margin: 0 var(--s3);}
}



/* GRID */

.b-grid {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 0;
	z-index: 99;
	pointer-events: none;
	display: none;
}

.b-grid .b-frame {
	padding-top: 0;
	padding-bottom: 0;
}

.b-grid .b-column::after {
	content: '';
	display: block;
	background: red;
	height: 100vh;
	opacity: 0.1;
}

@media (width <= 960px) {
	.b-grid {display: none;}
}



/* DEV-TOOLS */

#wp-admin-bar-dev-tools a::before {content: "\f177";}
.b-body.alt-dev-tools #wp-admin-bar-dev-tools a::before {content: "\f530";}
.b-body.alt-dev-tools .b-grid {display: block;}
.b-body.alt-dev-tools .b-img-meta {display: block;}



/* WORDPRESS */

body#tinymce {
	background: var(--white);
	color: var(--black);
	padding: var(--s2);
}

body#tinymce a {
	color: var(--black);
}

body .acf-fields a {color: #2271b1 !important;}
body .acf-fields a:hover {color: #0a4b78 !important;}

@media screen and (min-width: 961px) {
	body#tinymce {padding: var(--s5);}
}
