/* Layer Declarations */
@layer bootstrap, utilities, fonts, rs, components, overrides;



/* Bootstrap */
@import url('bootstrap.min.css') layer(bootstrap);



/* Fonts */
@layer fonts {
	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-Thin.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-Thin.woff') format('woff');
		font-weight: 100;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-ThinOblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-ThinOblique.woff') format('woff');
		font-weight: 100;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-ExtraLight.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-ExtraLight.woff') format('woff');
		font-weight: 200;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-ExtraLightOblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-ExtraLightOblique.woff') format('woff');
		font-weight: 200;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTTLight-Oblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTTLight-Oblique.woff') format('woff');
		font-weight: 300;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTTLight.woff2') format('woff2'),
			url('../fonts/CiscoSansTTLight.woff') format('woff');
		font-weight: 300;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT.woff2') format('woff2'),
			url('../fonts/CiscoSansTT.woff') format('woff');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-Oblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-Oblique.woff') format('woff');
		font-weight: normal;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-Bold.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-Bold.woff') format('woff');
		font-weight: bold;
		font-style: normal;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-BoldOblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-BoldOblique.woff') format('woff');
		font-weight: bold;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-HeavyOblique.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-HeavyOblique.woff') format('woff');
		font-weight: 900;
		font-style: italic;
		font-display: swap;
	}

	@font-face {
		font-family: 'CiscoSansTT';
		src: url('../fonts/CiscoSansTT-Heavy.woff2') format('woff2'),
			url('../fonts/CiscoSansTT-Heavy.woff') format('woff');
		font-weight: 900;
		font-style: normal;
		font-display: swap;
	}
}



/* RS */
@layer rs {

	/* Variables
	----------------------------------------------------
	*/

	:root {

		/* - - Fonts - - */

		--cisco: 'CiscoSansTT', Helvetica, Arial, sans-serif;

		--weight-thin: 100;
		--weight-extralight: 200;
		--weight-light: 300;
		--weight-regular: normal;
		--weight-bold: bold;
		--weight-heavy: 900;

		--font-factor: 1;
		--font-scale: 1.125;
		--font-size: 1rem;


		/* - - Colors - - */

		--black-rgb: 27 28 29; /* #1B1C1D */
		--black: rgb(var(--black-rgb) / 100%);

		--white-rgb: 255 255 255; /* #FFF */
		--white: rgb(var(--white-rgb) / 100%);

		--offwhite-rgb: 244 245 246; /* #F4F5F6 */
		--offwhite: rgb(var(--offwhite-rgb) / 100%);

		--grey-rgb: 231 236 240; /* #E7ECF0 */
		--grey: rgb(var(--grey-rgb) / 100%);

		--midnight-rgb: 7 24 45; /* #07182D */
		--midnight: rgb(var(--midnight-rgb) / 100%);
		--dark-blue: #0D274D;

		--cisco-blue-rgb: 2 200 255; /* #02C8FF */
		--cisco-blue: rgb(var(--cisco-blue-rgb) / 100%);

		--medium-blue-rgb: 10 96 255; /* #0A60FF */
		--medium-blue: rgb(var(--medium-blue-rgb) / 100%);

		--green-rgb: 106 190 75; /* #6ABE4B */
		--green: rgb(var(--green-rgb) / 100%);


		/* - - Global Assignments - - */

		--navbar-toggler: var(--midnight);
		--navbar-accent: var(--cisco-blue);

		--placeholder: var(--black);

		--focus: var(--midnight);

		--list-color: var(--cisco-blue);

		--skip-background: var(--white);
		--skip-border: var(--midnight);
		--skip-color: var(--midnight);

		--selection-background: var(--cisco-blue);
		--selection-color: var(--white);

		--header: 6.25rem;
		/* --scroll-header: Xrem; */
		/* --footer: Xrem; */

		--body-color: var(--black);
		--body-font: var(--cisco);
		--body-weight: var(--weight-light);
		--content-margin: 1.5rem;

		--heading-color: var(--black);
		--heading-font: var(--cisco);
		--heading-weight: var(--weight-light);
		--heading-margin: 1rem;

		--spacer: 4rem;
		--gutter: 2rem;

		--row-x: 1.5rem;
		--row-y: 0;

		--transition: .25s all;

		
		/* - - Spacing - - */

		--col-1: 8.3333333333%;
		--col-2: 16.6666666667%;
		--col-3: 25%;
		--col-4: 33.3333333333%;
		--col-5: 41.6666666667%;
		--col-6: 50%;
		--col-7: 58.3333333333%;
		--col-8: 66.6666666667%;
		--col-9: 75%;
		--col-10: 83.3333333333%;
		--col-11: 91.6666666667%;
	
		--container-col-1: calc(var(--container-width) * (1 / 12));
		--container-col-2: calc(var(--container-width) * (2 / 12));
		--container-col-3: calc(var(--container-width) * (3 / 12));
		--container-col-4: calc(var(--container-width) * (4 / 12));
		--container-col-5: calc(var(--container-width) * (5 / 12));
		--container-col-6: calc(var(--container-width) * (6 / 12));
		--container-col-7: calc(var(--container-width) * (7 / 12));
		--container-col-8: calc(var(--container-width) * (8 / 12));
		--container-col-9: calc(var(--container-width) * (9 / 12));
		--container-col-10: calc(var(--container-width) * (10 / 12));
		--container-col-11: calc(var(--container-width) * (11 / 12));
	
		--container-width: 100%;
		--container-padding: 2rem;
	
		--page-gutters: calc(100vw - (var(--container-padding) * 2));
		--single-gutter: var(--container-padding);
		--padded-gutter: var(--container-padding);
	
		--align-items: normal;
		--flex-direction: row;
		--justify-content: normal;

		--negative-spacer: calc(var(--spacer) * -1);

		--subspacer: calc(var(--spacer) / 2);
		--negative-subspacer: calc(var(--subspacer) * -1);

		--negative-gutter: calc(var(--gutter) * -1);

	}

	@media (min-width: 576px) {
		:root {
			--container-padding: calc(var(--row-x) * .5);
			--container-width: 540px;
			
			--page-gutters: calc(100vw - var(--container-width));
			--single-gutter: calc(var(--page-gutters) / 2);
			--padded-gutter: calc(var(--single-gutter) + var(--container-padding));
		}
	}

	@media (min-width: 768px) {
		:root {
			--container-width: 720px;

			--spacer: 5rem;
		}
	}

	@media (min-width: 992px) {
		:root {
			--container-width: 960px;

			--font-scale: 1.25;

			--spacer: 6rem;
		}
	}

	@media (min-width: 1200px) {
		:root {
			--container-width: 1140px;
		}
	}

	@media (min-width: 1400px) {
		:root {
			--container-width: 1320px;

			--font-scale: 1.333;

			--spacer: 7.5rem;
		}
	}

	@media (min-width: 1600px) {
		:root {
			--container-width: 1520px;
		}
	}

	@media (min-width: 1800px) {
		:root {
			--container-width: 1765px;
		}
	}



	/* Icons
	----------------------------------------------------
	*/

	@font-face {
		font-family: 'icons';
		src:	url('icons/icomoon.eot');
		src:	url('icons/icomoon.eot') format('embedded-opentype'),
				url('icons/icomoon.ttf') format('truetype'),
				url('icons/icomoon.woff') format('woff'),
				url('icons/icomoon.svg') format('svg');
		font-display: block;
		font-style: normal;
		font-weight: normal;
	}

	:root {
		--icons: 'icons';

		--arrow-down: "\e900";
		--arrow-left: "\e901";
		--arrow-right: "\e902";
		--arrow-up: "\e903";

		--chevron-down: "\e904";
		--chevron-left: "\e905";
		--chevron-right: "\e906";
		--chevron-up: "\e907";

		--facebook: "\e908";
		--instagram: "\e909";
		--linkedin: "\e90a";
		--pinterest: "\e90f";
		--tiktok: "\e90b";
		--twitter: "\e90c";
		--vimeo: "\e90d";
		--x: "\e910";
		--youtube: "\e90e";
	}

	[class*="icon"] {
		text-decoration: none;
	}

	[class*="icon"]:before {
		font-family: var(--icons);
		font-style: normal;
		font-variant: normal;
		font-weight: normal;
		line-height: 1;
		text-decoration: none;
		text-transform: none;
	}

	.icon.arrow-down:before {
		content: var(--arrow-down);
	}
	.icon.arrow-left:before {
		content: var(--arrow-left);
	}
	.icon.arrow-right:before {
		content: var(--arrow-right);
	}
	.icon.arrow-up:before {
		content: var(--arrow-up);
	}

	.icon.chevron-down:before {
		content: var(--chevron-down);
	}
	.icon.chevron-left:before {
		content: var(--chevron-left);
	}
	.icon.chevron-right:before {
		content: var(--chevron-right);
	}
	.icon.chevron-up:before {
		content: var(--chevron-up);
	}

	.icon.facebook:before {
		content: var(--facebook);
	}
	.icon.instagram:before {
		content: var(--instagram);
	}
	.icon.linkedin:before {
		content: var(--linkedin);
	}
	.icon.pinterest:before {
		content: var(--pinterest);
	}
	.icon.tiktok:before {
		content: var(--tiktok);
	}
	.icon.twitter:before {
		content: var(--twitter);
	}
	.icon.vimeo:before {
		content: var(--vimeo);
	}
	.icon.x:before {
		content: var(--x);
	}
	.icon.youtube:before {
		content: var(--youtube);
	}



	/* Resets & Structure
	----------------------------------------------------
	*/

	*:focus {
		box-shadow: none;
		outline: .125rem solid var(--focus);
		outline-offset: .25rem;
	}

	::selection {
		background: var(--selection-background);
		color: var(--selection-color);
		-webkit-text-fill-color: var(--selection-color);
	}

	.skip-to {
		background-color: var(--skip-background);
		border: .125rem solid var(--skip-border);
		color: var(--skip-color);
		height: 1px;
		inset: auto auto auto -10000px;
		overflow: hidden;
		padding: .5rem 1rem;
		position: absolute;
		text-decoration: none;
		width: 1px;
		z-index: 9999;
	}

	.skip-to:focus {
		height: auto;
		inset: .25rem auto auto .25rem;
		width: auto;
	}

	html {
		scroll-behavior: smooth;
	}

	body {
		color: var(--body-color);
		display: flex;
		font-family: var(--body-font);
		font-size: var(--font-size);
		font-weight: var(--body-weight);
		flex-direction: column;
		line-height: 1.5;
		margin: 0;
		min-height: 100vh;
		text-rendering: optimizeLegibility;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	/*
	@media (min-width: 3840px) {
		body {
			zoom: 2;
		}
	}
	*/
	
	html.open-menu, html.open-menu body {
		min-height: 100vh;
		overflow: hidden;
		position: static !important;
	}

	body > :where(iframe, img) {
		border: 0 !important;
		clip: rect(0,0,0,0) !important;
		height: 1px !important;
		margin: -1px !important;
		overflow: hidden !important;
		padding: 0 !important;
		position: absolute !important;
		white-space: nowrap !important;
		width: 1px !important;
	}

	main {
		position: relative;
	}

	.container {
		max-width: var(--container-width);
		padding-left: var(--container-padding);
		padding-right: var(--container-padding);
	}

	.container-fluid {
		padding-left: var(--container-padding);
		padding-right: var(--container-padding);
	}

	.row {
		align-items: var(--align-items);
		flex-direction: var(--flex-direction);
		justify-content: var(--justify-content);
		margin-left: calc(var(--row-x) / -2);
		margin-right: calc(var(--row-x) / -2);
		margin-top: calc(var(--row-y) * -1);
	}

	.row > * {
		margin-top: var(--row-y);
		padding-left: calc(var(--row-x) / 2);
		padding-right: calc(var(--row-x) / 2);
	}

	.section {
		margin-bottom: var(--spacer);
	}

	.subsection {
		margin-bottom: var(--subspacer);
	}

	.wrapper {
		padding-bottom: var(--spacer);
		padding-top: var(--spacer);
	}

	.wrapper.section + .wrapper {
		margin-top: var(--negative-spacer);
	}

	:where(header, main, footer) img {
		height: auto;
		max-width: 100%;
		object-fit: cover;
		width: 100%;
	}

	iframe {
		aspect-ratio: 16 / 9;
		height: auto;
		position: relative;
		width: 100%;
	}

	.lazy {
		opacity: 0;
		transition: var(--transition);
	}

	.lazy.loaded {
		opacity: 1;
	}

	:where(a, *[class^="btn"], button, input, select, textarea, #navigation),
	:where(a, *[class^="btn"], button, input, select, textarea, #navigation):after,
	:where(a, *[class^="btn"], button, input, select, textarea, #navigation):before {
		transition: var(--transition);
	}

	@media (min-width: 768px) {
		.two-col,
		.three-col {
			column-gap: var(--gutter);
			columns: 2;
		}
		.two-col > *,
		.three-col > * {
			break-inside: avoid;
			page-break-inside: avoid;
		}
	}

	@media (min-width: 992px) {
		.container.inset {
			max-width: var(--container-col-10);
		}
		.three-col {
			columns: 3;
		}
	}

	@media (min-width: 1200px) {
		.container.inset-xl {
			max-width: var(--container-col-10);
		}
	}

	@media (min-width: 1400px) {
		.container.inset-xxl {
			max-width: var(--container-col-10);
		}
	}



	/* Forms
	----------------------------------------------------
	*/
	
	input,
	label,
	select,
	textarea,
	button,
	fieldset,
	legend,
	datalist,
	output,
	option,
	optgroup {
		-webkit-appearance: none;
		-webkit-border-radius: 0;
		appearance: none;
		border: 0;
		border-radius: 0;
		display: block;
		width: 100%;
	}
	
	::-webkit-input-placeholder {
		color: var(--placeholder);
	}
	
	:-ms-input-placeholder {
		color: var(--placeholder);
	}
	
	::placeholder {
		color: var(--placeholder);
	}
	
	.input {
		margin-bottom: var(--gutter);
	}
	
	
	/* Typography
	----------------------------------------------------
	*/
	
	h1, .h1,
	h2, .h2,
	h3, .h3,
	h4, .h4,
	h5, .h5,
	h6, .h6 {
		color: var(--heading-color);
		font-family: var(--heading-font);
		/* font-size: calc(var(--font-size) * pow(var(--font-scale), var(--font-factor))); */
		font-weight: var(--heading-weight);
		line-height: 1.25;
		margin-bottom: var(--heading-margin);
		text-wrap: balance;
	}

	h1, .h1 {
		--font-factor: 6;
		font-size: calc(3rem + 1vw);
		line-height: 1;
	}

	h2, .h2 {
		--font-factor: 5;
		font-size: calc(2rem + 1vw);
	}

	h3, .h3 {
		--font-factor: 4;
		font-size: calc(1.75rem + 1vw);
	}

	h4, .h4 {
		--font-factor: 3;
		font-size: calc(1.5rem + 1vw);
	}

	h5, .h5 {
		--font-factor: 2;
		font-size: calc(1.25rem + 1vw);
	}

	h6, .h6 {
		--font-factor: 1;
		font-size: 1rem;
	}

	@media (min-width: 992px) {
		h1, .h1 {
			font-size: 4rem;
		}
		h2, .h2 {
			font-size: 2rem;
		}
		h3, .h3 {
			font-size: 1.75rem;
		}
		h4, .h4 {
			font-size: 1.25rem;
		}
		h5, .h5 {
			font-size: 1.125rem;
		}
	}

	a {
		color: var(--midnight);
	}

	a:hover {
		color: var(--cisco-blue);
	}
	
	p {
		margin-bottom: var(--content-margin);
	}
	
	ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	ol {
		margin: 0;
		padding: 0 0 0 1.125rem;
	}
	
	main :where(ul, ol) {
		--item-margin: .5rem;
		margin-bottom: var(--content-margin);
	}
	
	main :where(ul, ol) li {
		margin-bottom: var(--item-margin);
		position: relative;
	}

	main ul li {
		background: linear-gradient(to bottom, var(--list-color), var(--list-color)) no-repeat bottom;
		background-position: 0 .625rem;
		background-size: .375rem .375rem;
		padding-left: 1.25rem;
	}
	
	main ol li {
		padding-left: .25rem;
	}

	main ol li::marker {
		color: var(--list-color);
	}
	
	:where(
		h1, .h1,
		h2, .h2,
		h3, .h3,
		h4, .h4,
		h5, .h5,
		h6, .h6,
		ul, ol, li,
		p
	):last-child {
		margin-bottom: 0;
	}
	
	
	
	/* Footer
	----------------------------------------------------
	*/
	
	footer {
		margin-top: auto;
	}

}



/* Main Styles */
@layer components {

	/* Global Styles
	----------------------------------------------------
	*/

	body {
		background-color: var(--offwhite);
		font-size: 1.125rem;
		font-variant-ligatures: none;
	}

	main {
		display: flex;
		flex-grow: 1;
	}

	.disabled {
		pointer-events: none;
		transition: var(--transition);
	}

	.disabled .btn:not(.active) {
		opacity: 50%;
	}

	.btn {
		background: var(--white);
		border: .125rem solid var(--midnight);
		border-radius: 2rem;
		color: var(--midnight);
		display: inline-block;
		font-size: 1.125rem;
		font-weight: var(--weight-bold);
		line-height: 1.25;
		padding: .75rem 2.375rem;
		text-decoration: none;
	}

	.btn:hover,
	.btn.active {
		background-color: var(--midnight);
		color: var(--white);
	}

	.playSVG {
		opacity: 0%;
		width: 100px;
	}

	.playSVG.active {
		opacity: 800%;
		transition: var(--transition);
	}

	#playCir {
		opacity: 30%;
		transition: var(--transition);
	}
	#playCir:hover {
		opacity: 100%;
		fill: #04B7E7;
	}


	/* Navigation
	----------------------------------------------------
	*/

	header {
		background-color: var(--white);
		border-bottom: .0625rem solid rgb(var(--black-rgb) / 15%);
		position: relative;
		z-index: 1;
	}

	header .container-fluid {
		padding: 0 var(--gutter);
	}

	header .navbar {
		padding: 1rem 0;
	}

	header .logo,
	header .logo img {
		display: inline-block;
		height: 100%;
		max-height: 4.25rem;
		width: auto;
	}

	#navigation {
		background-color: var(--white);
		border-top: .0625rem solid var(--grey);
		display: flex;
		flex-direction: column;
		height: 0;
		inset: var(--header) 0 0;
		opacity: 0;
		overflow: scroll;
		padding: var(--gutter) var(--padded-gutter) var(--subspacer);
		position: fixed;
		visibility: hidden;
	}

	#navigation.show {
		height: calc(100% - var(--header));
		opacity: 1;
		visibility: visible;
	}

	#navigation .navbar-nav,
	#navigation .navbar-nav > li {
		width: 100%;
	}

	#navigation .navbar-nav > li:not(:first-child) {
		border-top: .0625rem solid var(--grey);
		margin: var(--gutter) 0 0;
		padding: var(--gutter) 0 0;
	}

	#navigation .sub-menu {
		border-left: .125rem solid var(--grey);
		margin: .5rem 0 0;
		padding: 0 0 0 var(--gutter);
		width: 100%;
	}

	#navigation .sub-menu > li:not(:last-child) {
		margin-bottom: .5rem;
	}

	#navigation a {
		color: var(--black);
		display: inline-block;
		font-size: 1.25rem;
		font-weight: var(--weight-bold);
		text-decoration: none;
	}

	#navigation ul.navbar-nav > li.active:after {
		background-color: var(--cisco-blue);
		content: '';
		height: .1875rem;
		inset: auto 0 0;
		position: absolute;
	}

	#navigation a:hover {
		color: var(--midnight);
	}

	@media (min-width: 992px) {
		header .navbar-toggler {
			display: none;
		}
		header .navbar {
			padding: 0;
		}
		#navigation {
			align-items: flex-end;
			background: 0;
			border: 0;
			height: auto;
			inset: auto;
			margin: 0 0 0 var(--gutter);
			opacity: 1;
			overflow: visible;
			padding: 0;
			position: relative;
			visibility: visible;
		}
		#navigation .navbar-nav {
			border: 0;
			flex: 0 0 auto;
			padding: 0;
		}
		#navigation .navbar-nav,
		#navigation .navbar-nav > li {
			position: relative;
			width: auto;
		}
		#navigation .navbar-nav > li {
			align-items: center;
			display: flex;
			padding: var(--gutter) 0;
		}
		#navigation .navbar-nav > li:not(:first-child) {
			border: 0;
			margin: 0 0 0 1rem;
			padding: var(--gutter) 0;
		}
		#navigation .sub-menu {
			background-color: var(--white);
			border-bottom: .0625rem solid rgb(var(--black-rgb) / 15%);
			border-left: .0625rem solid rgb(var(--black-rgb) / 15%);
			border-right: .0625rem solid rgb(var(--black-rgb) / 15%);
			border-top: .1875rem solid var(--cisco-blue);
			border-radius: 0rem 0rem 0.5rem 0.5rem;
			box-shadow: .25rem .25rem .5rem 0 rgb(var(--black-rgb) / 15%);
			display: inline;
			inset: calc(100% - .1875rem) auto auto 0;
			margin: 0;
			min-width: max(15rem, 100%);
			opacity: 0;
			padding: var(--gutter);
			position: absolute;
			transition: var(--transition);
			visibility: hidden;
			width: auto;
		}
		#navigation .navbar-nav > li:last-child .sub-menu,
		#navigation .navbar-nav > li:nth-last-child(2) .sub-menu {
			inset: calc(100% - .1875rem) 0 auto auto;
		}
		#navigation .navbar-nav > li:hover .sub-menu {
			opacity: 100%;
			visibility: visible;
		}
		#navigation .sub-menu > li:not(:last-child) {
			margin-bottom: .75rem;
		}
		#navigation a {
			font-weight: var(--weight-regular);
		}
		#navigation .active > a {
			font-weight: var(--weight-bold);
		}
		#navigation li:not(.active) > a:hover {
			color: var(--cisco-blue);
		}
		#navigation a,
		#navigation .sub-menu a {
			font-size: 1rem;
		}
		#navigation .sub-menu a {
			white-space: nowrap;
		}
		#navigation .sub-menu a:after {
			color: var(--cisco-blue);
			content: var(--chevron-right);
			font-family: var(--icons);
			font-size: .625rem;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			line-height: 1;
			margin-left: .5rem;
			position: relative;
			text-decoration: none;
			text-transform: none;
		}
	}

	@media (min-width: 1400px) {
		#navigation .navbar-nav > li:not(:first-child) {
			margin: 0 0 0 var(--gutter);
		}
	}

	header .navbar-toggler {
		border: 0;
		border-radius: 0;
		height: 1.5rem;
		padding: 0;
		position: relative;
		transition: var(--transition);
		width: 2rem;
		z-index: 1;
	}
	
	header .navbar-toggler .inner {
		background-color: var(--navbar-toggler);
		border-radius: .25rem;
		height: .25rem;
		inset: auto 0;
		position: absolute;
		transition: var(--transition);
		width: 2rem;
	}
	
	header .navbar-toggler .inner:nth-child(1) {
		animation-duration: .25s;
		animation-fill-mode: forwards;
		animation-name: navbar-toggler-1-close;
		animation-timing-function: linear;
		top: 0;
	}	
	
	header .navbar-toggler .inner:nth-child(2) {
		top: calc(50% - (.125rem / 2));
		transition-delay: .125s;
		transition-duration: 0s;
	}	
	
	header .navbar-toggler .inner:nth-child(3) {
		animation-duration: .25s;
		animation-fill-mode: forwards;
		animation-name: navbar-toggler-3-close;
		animation-timing-function: linear;
		top: calc(100% - .125rem);
	}	
	
	header .navbar-toggler[aria-expanded="true"] .inner {
		background-color: var(--navbar-accent);
		top: calc(50% - (.125rem / 2));
	}	
	
	header .navbar-toggler[aria-expanded="true"] .inner:nth-child(1) {
		animation-name: navbar-toggler-1-open;
	} 
	
	header .navbar-toggler[aria-expanded="true"] .inner:nth-child(2) {
		left: 50%;
		right: 50%;
		width: 0;
	}	
	
	header .navbar-toggler[aria-expanded="true"] .inner:nth-child(3) {
		animation-name: navbar-toggler-3-open;
	}
	
	@keyframes navbar-toggler-1-open {
		0% {
			top: 0;
			transform: rotate(0);
		}
		50% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(0);
		}
		100% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(45deg);
		}
	}	
	
	@keyframes navbar-toggler-1-close {
		0% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(45deg);
		}
		50% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(0);
		}
		100% {
			top: 0;
			transform: rotate(0);
		}
	}	
	
	@keyframes navbar-toggler-3-open {
		0% {
			top: calc(100% - .125rem);
			transform: rotate(0);
		}
		50% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(0);
		}
		100% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(-45deg);
		}
	}	
	
	@keyframes navbar-toggler-3-close {
		0% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(-45deg);
		}
		50% {
			top: calc(50% - (.125rem / 2));
			transform: rotate(0);
		}
		100% {
			top: calc(100% - .125rem);
			transform: rotate(0);
		}
	}



	/* Home
	----------------------------------------------------
	*/

	.home {
		display: flex;
		flex-direction: column;
		justify-content: center;
		min-height: 100vh;
		overflow: hidden;
		padding: var(--spacer) 0;
		width: 100%;
	}

	.home > .subsection:last-child {
		margin-bottom: 0;
	}

	@media (min-width: 1200px) {
		.home {
			padding: var(--gutter) 0 var(--spacer);
		}
	}

	/*
	@media (min-width: 1600px) {
		.home {
			height: 100vh;
		}
	}
	*/

	/* Brand */
	.home .brand .logo {
		display: block;
		margin: 0 auto;
		max-width: 9.375rem;
	}

	/* Intro */
	.intro {
		text-align: center;
	}

	.intro .inner {
		margin: 0 auto;
	}

	@media (min-width: 992px) {
		.intro .inner {
			max-width: var(--col-10);
		}
		.intro h1 {
			font-size: 3.25rem;
		}
	}

	/*
	@media (min-width: 1400px) {
		.intro .inner {
			max-width: var(--col-8);
		}
	}
	*/

	/* Sections */
	.sections {
		position: relative;
	}

	.home-ai-networking { --sections-accent: var(--dark-blue); }
	.home-optics { --sections-accent: var(--medium-blue); }
	.home-agentic-enterprise { --sections-accent: var(--cisco-blue); }

	.sections:after {
		background-color: var(--sections-accent, #00bceb);
		content: '';
		inset: 50% 0 -100vh;
		position: absolute;
	}

	.sections .grid {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: var(--gutter);
		position: relative;
		z-index: 1;
	}

	.sections .grid .item {
		align-items: center;
		background-color: var(--white);
		border-radius: .625rem;
		color: var(--body-color);
		display: flex;
		flex: 0 0 100%;
		flex-direction: column;
		font-size: 1rem;
		padding: 2.125rem;
		text-align: center;
		text-decoration: none;
		transition: var(--transition);
	}

	.sections .grid .item:hover {
		box-shadow: 0 .125rem 1rem 0 rgb(var(--black-rgb) / 15%);
	}

	.sections .grid .item img {
		/* aspect-ratio: 1; */
		height: 9.5rem;
		margin: 0 0 var(--content-margin);
		object-fit: contain;
		width: auto;
	}

	.sections .grid .item .inner {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
	}

	.sections .grid .item h2 {
		font-size: 1.5rem;
	}

	.sections .grid .item h2 br {
		display: block;
	}

	.sections .grid .item .btn {
		margin-top: auto;
		padding: .75rem 1.875rem;
		width: 100%;
	}

	.sections .grid .item:hover .btn {
		background-color: var(--midnight);
		color: var(--white);
	}

	@media (min-width: 576px) and (max-width: 767.98px),
			(min-width: 992px) and (max-width: 1199.98px) {
		.sections .grid .item {
			align-items: center;
			display: flex;
		}
		.sections .grid .item img {
			margin: 0 var(--content-margin) 0 0;
			width: var(--col-4);
		}
	}

	@media (min-width: 768px) {
		.sections .grid .item {
			flex: 0 0 calc(50% - var(--gutter) / 2);
		}
	}

	@media (min-width: 1200px) {
		.sections:after {
			top: 25%;
		}
		.sections .grid .item {
			flex: 0 0 calc(33.333% - var(--gutter) * 2 / 3);
		}
	}

	@media (min-width: 1600px) {
		.sections .grid .item {
			flex: 0 0 calc(16.666% - var(--gutter) * 5 / 6);
		}
	}



	/* Body
	----------------------------------------------------
	*/

	.body {
		display: flex;
		overflow: hidden;
		width: 100%;
	}

	.body .navigation {
		margin-bottom: var(--gutter);
	}

	.body .navigation ul {
		display: flex;
		flex-wrap: wrap;
		gap: 1rem var(--gutter);
		margin: 0;
		padding: var(--gutter) var(--gutter) 0;
		width: 100%;
	}

	.body .navigation ul li {
		background: 0;
		margin: 0;
		padding: 0 0 1rem;
	}

	.body .navigation ul .active {
		border-bottom: .1875rem solid var(--cisco-blue);
	}

	.body .navigation a {
		color: var(--black);
		font-weight: var(--weight-regular);
		text-decoration: none;
	}

	.body.nav-links-compact .navigation a {
		font-size: 1rem;
		transition: none;
	}

	.body .navigation li:not(.active) a:hover {
		color: var(--cisco-blue);
	}

	.body .navigation .active a {
		font-weight: var(--weight-bold);
	}

	.body .navigation .main {
		background-color: rgb(var(--black-rgb) / 2.5%);
		border-bottom: .0625rem solid rgb(var(--black-rgb) / 15%);
	}

	.body .content {
		border-bottom: .0625rem solid rgb(var(--black-rgb) / 15%);
		display: flex;
		flex-direction: column;
	}

	.body .content .inner {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
		padding: 0 var(--gutter) var(--spacer);
		position: relative;
	}

	.body .content .inner:first-child {
		margin-top: var(--gutter);
	}

	.body .content .inner .tab-pane:focus {
		outline: 0;
		outline-offset: 0;
	}

	.body .content .inner .callout {
		--heading-margin: .5rem;
		border: .0625rem solid rgb(var(--black-rgb) / 15%);
		border-left: .1875rem solid var(--cisco-blue);
		border-radius: 0 1.125rem 1.125rem 0;
		margin-top: auto;
		padding: var(--gutter);
	}

	body .svgs {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: var(--spacer) var(--gutter);
	}

	body .svgs .inner {
		aspect-ratio: var(--aspect-ratio);
		position: relative;
		width: 100%;
	}

	body .svgs .riveInner {
		aspect-ratio: var(--aspect-ratio);
		position: relative;
	}

	body .svgs .riveInner .riveCanvas {
		aspect-ratio: var(--aspect-ratio);
		height: 100%;
		inset: 0;
		position: absolute;
		width: 100%;
	}

	body .svgs .inner > :is(svg, object) {
		height: 100%;
		inset: 0;
		position: absolute;
		top: 0;
		width: 100%;
	}

	body .svgs .btn-wrap {
		display: flex;
		flex-wrap: wrap;
		gap: 1rem;
		justify-content: center;
		margin: var(--subspacer) auto 0;
		width: fit-content;
	}

	body .svgs .btn-wrap .btn {
		flex: 0 0 auto;
		width: auto;
	}

	body .btn-pause {
		outline: 0;
		background: 0%;
		width: 100%;
		height: 100%;
		flex: 0 0 auto;
		align-items: center;
		justify-content: center;
		position: absolute;
	}

	.anim-pause-zone {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: min(300px, 100%);
		height: min(300px, 100%);
		cursor: pointer;
		z-index: 99;
	}

	.anim-pause-overlay {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: clamp(48px, 12%, 80px);
		opacity: 0;
		transition: opacity 0.25s;
		pointer-events: none;
		user-select: none;
	}

	.animation-paused .anim-pause-overlay {
		opacity: 1;
	}

	@media (min-width: 1200px) {
		.body .grid {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			width: 100%;
		}
		.body .navigation ul {
			padding: var(--gutter) var(--subspacer) 0;
		}
		.body .navigation .main:after {
			inset: auto var(--negative-subspacer) 0;
		}
		.body .content {
			border-bottom: 0;
			border-right: .0625rem solid rgb(var(--black-rgb) / 15%);
		}
		.body .content .inner {
			font-size: 1.25rem;
			padding: var(--gutter) var(--subspacer);
		}
		.body .content .inner:has(.callout) {
			padding-bottom: var(--spacer);
		}
	}

	@media (min-width: 1600px) {
		.body .svgs {
			padding: var(--gutter) var(--spacer);
		}
		.body .content .inner .callout {
			--gutter: 2.5rem;
		}
	}

	@media (min-width: 3000px) {
		.body .content .inner {
			font-size: 1.375rem;
		}
	}

}



/* Overrides */
@layer overrides {
}


/* Cross-site nav
----------------------------------------------------
*/
.cross-site-nav {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

.cross-site-toggler {
	position: relative;
	width: 44px;
	height: 44px;
	padding: 12px 10px;
	background: transparent;
	border: none;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.cross-site-toggler .inner {
	display: block;
	width: 100%;
	height: 2px;
	background: var(--midnight);
	transition: transform .2s;
}

.cross-site-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: #fff;
	border: 1px solid rgb(var(--midnight-rgb) / 12%);
	border-radius: 0 8px 8px 0;
	min-width: 200px;
	padding: .5rem 0;
	box-shadow: 0 4px 16px rgb(var(--midnight-rgb) / 12%);
}

.cross-site-menu.open {
	display: block;
}

.cross-site-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cross-site-menu li a {
	display: block;
	padding: .6rem 1.2rem;
	color: var(--midnight);
	text-decoration: none;
	font-size: .95rem;
}

.cross-site-menu li a:hover {
	background: rgb(var(--midnight-rgb) / 6%);
	color: var(--midnight);
}

.cross-site-menu li.active a {
	color: var(--cisco-blue);
	font-weight: 600;
}


/* END
----------------------------------------------------
*/