/*<meta />*/

/*===========================================================================================================================================================

Hello! If this is your first time looking at a stylesheet within the text editor view, what you are reading right now is a "comment". Comments are added throughout this stylesheet with the purpose of making the source code easier to understand, comments will not be interpreted during the compile process. Since comments are not interpreted during the compile process, feel free to add or remove any comments.
nav
For help with MadCap Flare go to Help Ribbon > Topics Section > Open Help. Alternatively visit the Flare Online Help at help.madcapsoftware.com

If you have any questions regarding how to work with this stylesheet or template project, please contact MadCap Technical Support. 
https://www.madcapsoftware.com/support/contact-options.aspx

===========================================================================================================================================================*/

/* Home Page General Styles */

/*.nav-search-wrapper 
{
     display: none;
	}*/

.title-bar-container	/* added by elipl (adds fixed box shadow to header */
{
	position: fixed;
	top: 0;
	/* always stay at the top of viewport */
	left: 0;
	/* align to the left edge */
	width: 100%;
	/* full width of viewport */
	box-shadow: 0px 1px 13px 0px #898D8D;
	z-index: 1000;
	/* ensure it's above other content */
	background-color: white;
	/* ensure background is solid */
}

.modal
{
	display: none;
	position: fixed;
	z-index: 1000;
	/* Above other elements */
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	/* Fallback color */
	background-color: rgba(0,0,0,0.4);
	/* Black w/ opacity */
}

.modal-content
{
	position: relative;
	background-color: #fefefe;
	margin: 10% auto;
	padding: 20px;
	border: 1px solid #888;
	width: 500px;
	height: auto;
}

.modal-content-fb
{
	position: relative;
	background-color: #fefefe;
	margin: 10% auto;
	padding: 20px;
	border: 1px solid #888;
	width: 600px;
	height: 700px;
}

#feedbackButton
{
	position: fixed;
	bottom: 20px;
	right: 20px;
	background-color: #004C97;
	color: white;
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	z-index: 1001;
	/* Above the modal */
}

.close
{
	color: #aaa;
	position: absolute;
	top: 10px;
	right: 25px;
	font-size: 35px;
	font-weight: bold;
}

.close:hover,
.close:focus
{
	color: black;
	text-decoration: none;
	cursor: pointer;
}

iframe
{
	display: block;
	/* To remove any default margin or padding */
	border: none;
	/* To remove any default border */
	width: 100%;
	/* To occupy full width of .modal-content */
	height: 100%;
	/* To occupy full height of .modal-content */
}

.sidenav-wrapper
{
	display: none;
}

.main-section > .outer-row
{
	background-color: #ffffff;
}

.body-container
{
	padding-top: 0em;
	margin-top: 80px;
	padding-left: 0;
	padding-right: 0;
}

/***** Filter Nav bar *****/

div.thc-home-filter	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
	color: #ffffff;
	text-transform: uppercase;
	font-size: 16px;
	display: flex;
	justify-content: space-between;
}

/*
div.thc-home-filter::before
{
	content: ' ';
	display: table;
}

div.thc-home-filter::after
{
	content: ' ';
	display: table;
	clear: both;
}
*/

div.thc-home-filter > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: auto !important;
	cursor: pointer;
}

div.thc-home-filter > div:nth-child(1)
{
	width: 16.667%;
	margin-left: 0%;
}

div.thc-home-filter > div:nth-child(2)
{
	width: 16.667%;
	margin-left: 0%;
}

div.thc-home-filter > div:nth-child(3)
{
	width: 16.667%;
	margin-left: 0%;
}

div.thc-home-filter > div:nth-child(4)
{
	width: 16.667%;
	margin-left: 0%;
}

div.thc-home-filter > div:nth-child(5)
{
	width: 16.667%;
	margin-left: 0%;
}

div.thc-home-filter > div:nth-child(6)
{
	width: 16.667%;
	margin-left: 0%;
}

/***** Hero *****/

div.thc-home-bg-tricentisblue
{
	background-color: #004c97;
}

/***** Tricentis Products *****/

div.thc-home-products	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	width: 100%;
	max-width: 1514px;
	display: inline-grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	padding-left: 3%;
	padding-right: 3%;
	overflow: visible;
	align-items: start;
	/* Prevent tiles from stretching to match tallest item */
}

/*
div.thc-home-products::before
{
	content: ' ';
	display: table;
}
*/

div.thc-home-products::after
{
	content: ' ';
	display: table;
	clear: both;
}

/* Enhanced Home Product Cards with uniform height */

div.thc-home-products > div
{
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 16px;
	border-left: solid 4px var(--Brand5);
	background: var(--White);
	box-shadow: 0 4px 20px rgba(0,0,0,0.08);
	border-radius: 12px;
	width: 100%;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	align-self: start;
	min-height: 210px;
	/* Fixed minimum height for uniformity - accommodates longest content */
}

/* Only Tosca super-tile allows expansion */

div.thc-home-products > div.tosca-super-tile
{
	overflow: visible !important;
	transition: all 0.4s ease;
	min-height: 210px;
	/* Same minimum height as other tiles */
}

div.thc-home-products > div:hover
{
	transform: translateY(-4px);
	box-shadow: 0 12px 40px rgba(0,0,0,0.15);
	border-left-color: var(--Brand4);
}

/***** Learning and training *****/

div.thc-home-2-col	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-wrap: wrap;
}

div.thc-home-2-col::before
{
	content: ' ';
	display: table;
}

div.thc-home-2-col::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.thc-home-2-col > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: 60px;
	display: flex;
}

div.thc-home-2-col > div:nth-child(1)
{
	margin-left: 0%;
	width: 48%;
}

div.thc-home-2-col > div:nth-child(2)
{
	width: 48%;
	margin-left: 4%;
}

div.thc-home-2-col > div:nth-child(3)
{
	margin-left: 0%;
	width: 48%;
}

div.thc-home-2-col > div:nth-child(4)
{
	width: 48%;
	margin-left: 4%;
}

div.thc-home-bg-lightblue
{
	background-color: rgba(96, 146, 219, 0.15);
}

/***** Additional resources *****/

div.thc-home-3-col	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
	display: inline-grid;
	gap: 40px;
	grid-template-columns: repeat(3, 1fr);
}

div.thc-home-3-col::before
{
	content: ' ';
	display: none;
}

div.thc-home-3-col::after
{
	content: ' ';
	clear: both;
	display: none;
}

div.thc-home-3-col > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	margin-bottom: 50px;
	font-size: 16px;
}

div.thc-home-3-col > div:nth-child(1)
{
	
}

div.thc-home-3-col > div:nth-child(2)
{
	
}

div.thc-home-3-col > div:nth-child(3)
{
	
}

div.thc-home-3-col > div > div:nth-child(1)
{
	margin-right: 25px;
	min-width: 56px;
}

/***** Filter nav bar mobile *****/

div.thc-home-filter-mobile
{
	display: none;
	font-size: 16px;
	color: #ffffff;
}

div.thc-home-filter-mobile > div.dropDown
{
	border-bottom: none;
}

/***** Hero *****/

div.thc-home-hero > div > div > h2
{
	font-size: 1.125em;
	font-weight: 400;
	margin: 0;
	color: #1B365D;
}

/***** Tricentis products *****/

div.thc-home-products > div:nth-child(1)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(2)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(3)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(4)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(5)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(6)
{
	margin-left: 0%;
}

div.thc-home-products > div:nth-child(7)
{
	margin-left: 0%;
}

/***** Learning and training *****/

div.thc-home-learning-training > div.thc-home-wrapper
{
	max-width: 1300px;
	padding-left: 3%;
	padding-right: 3%;
}

/***** Hero *****/

div.thc-home-hero::before
{
	position: absolute;
	background-color: #59c8e6;
	transform: rotate(45deg);
	content: '' '';
	width: 2px;
	height: 150px;
	top: -38px;
	left: 38px;
}

div.thc-home-hero::after
{
	display: none;
}

div.thc-home-hero > div
{
	display: flex;
	align-items: center;
}

div.thc-home-3-col > div > div:nth-child(1) > img
{
	width: 100%;
}

div.thc-home-section
{
	display: flex;
	justify-content: center;
	width: 100%;
}

div.thc-home-wrapper
{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	font-size: 16px;
	max-width: 1514px;
	padding-left: 3%;
	padding-right: 3%;
	z-index: 2;
}

/*** Between desktop and tablet media screen size ***/

@media only screen and (max-width: 1640px)
{
	/* Hero - width of copy div */

	div.thc-home-hero > div > div
	{
		width: 50% !important;
	}
}

@media only screen and (max-width: 1500px)
{
	/* Hero - width of copy div */

	div.thc-home-hero > div > div
	{
		width: 45% !important;
	}
}

@media only screen and (max-width: 1325px)
{
	/* Hero - width of copy div */

	div.thc-home-hero > div > div
	{
		width: 40% !important;
	}
}

@media only screen and (max-width: 1279px)
{
	div.thc-home-filter > div:nth-child(1)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(2)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(3)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(4)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(5)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(6)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(1)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(2)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(3)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(4)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(5)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(6)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div:nth-child(7)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-products > div
	{
		
	}

	div.thc-home-2-col > div:nth-child(1)
	{
		margin-left: 0;
		width: 48%;
	}

	div.thc-home-2-col > div:nth-child(2)
	{
		width: 48%;
		margin-left: 4%;
	}

	div.thc-home-2-col > div:nth-child(3)
	{
		margin-left: 0%;
		width: 48%;
	}

	div.thc-home-2-col > div:nth-child(4)
	{
		margin-left: 4%;
		width: 48%;
	}

	div.thc-home-bg-lightblue
	{
		
	}

	div.thc-home-2-col > div
	{
		display: block;
	}

	div.thc-home-2-col > div > div:nth-child(1)
	{
		margin-right: 0 !important;
		width: 100% !important;
		height: auto;
	}

	div.thc-home-2-col > div > div:nth-child(2)
	{
		width: 100% !important;
	}

	div.thc-home-2-col > div > div:nth-child(1) > img
	{
		max-width: 100%;
		width: 100%;
	}

	div.thc-home-3-col > div:nth-child(1)
	{
		
	}

	div.thc-home-3-col > div:nth-child(2)
	{
		
	}

	div.thc-home-3-col > div:nth-child(3)
	{
		
	}

	div.thc-home-3-col > div > div:nth-child(1)
	{
		min-width: 48px;
	}

	div.thc-home-filter
	{
		display: flex;
		font-size: 14px;
	}

	div.thc-home-filter-mobile
	{
		display: none;
		font-size: 14px;
	}

	div.thc-home-hero > div > div
	{
		width: 50% !important;
	}

	div.thc-home-hero > div > div .search-bar._Skins_Home_Searchbar.mc-component
	{
		margin-left: 0;
	}

	div.thc-home-wrapper
	{
		max-width: 1514px;
		padding-left: 5%;
		padding-right: 5%;
	}

	div.thc-home-hero > div > div > h2
	{
		font-size: 1em !important;
	}

	div.thc-home-hero
	{
		background-color: #ECF1F4;
		background-image: url('../Images/Portal_HeroHeader_Tablet.png') !important;
		background-position: center center;
	}

	div.thc-home-products
	{
		padding-left: 5%;
		padding-right: 5%;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	div.thc-home-products > div > a
	{
		font-size: 16px;
	}

	div.thc-home-products > div h3
	{
		font-size: 1.5em !important;
	}

	div.thc-home-products > div:nth-child(3) h3::after
	{
		font-size: 14px !important;
	}

	div.thc-home-filter > div:not(:last-child)
	{
		margin-right: 16px !important;
	}

	div.thc-home-3-col
	{
		gap: 20px;
	}

	div.thc-home-wrapper > h2
	{
		font-size: 1.875em !important;
	}

	div.thc-home-learning-training > div.thc-home-wrapper
	{
		max-width: 640px;
		padding-left: 0;
		padding-right: 0;
	}

	div.thc-home-hero::before
	{
		height: 100px;
		left: 25px;
		top: -25px;
	}

	div.thc-home-hero::after
	{
		display: none;
	}

	div.thc-home-products > div h4
	{
		font-size: .75em !important;
	}

	div.thc-home-products > div p
	{
		font-size: .875em !important;
	}

	div.thc-home-hero > div > div > h1
	{
		font-size: 2.125em !important;
	}
}

/*** Between tablet and mobile media screen size ***/

@media only screen and (max-width: 846px)
{
	/* Hero width of copy div */

	div.thc-home-hero > div > div
	{
		width: 40% !important;
	}
}

@media only screen and (max-width: 767px)
{
	div.thc-home-filter > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(3)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(4)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(5)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-filter > div:nth-child(6)
	{
		width: 8.3333%;
		margin-left: 0%;
	}

	div.thc-home-bg-tricentisblue
	{
		
	}

	div.thc-home-products > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(3)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(4)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(5)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(6)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div:nth-child(7)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-products > div
	{
		
	}

	div.thc-home-2-col > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-2-col > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-2-col > div:nth-child(3)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.thc-home-2-col > div:nth-child(4)
	{
		margin-left: 0%;
		width: 100%;
	}

	div.thc-home-2-col > div
	{
		display: block;
		max-width: 400px;
	}

	div.thc-home-2-col > div > div:nth-child(1)
	{
		width: 100% !important;
		margin-right: 0 !important;
		height: auto !important;
	}

	div.thc-home-2-col > div > div:nth-child(2)
	{
		width: 100% !important;
	}

	div.thc-home-2-col > div > div:nth-child(1) > img
	{
		max-width: 400px !important;
		width: 100% !important;
		margin-bottom: 10px !important;
	}

	div.thc-home-3-col > div:nth-child(1)
	{
		
	}

	div.thc-home-3-col > div:nth-child(2)
	{
		
	}

	div.thc-home-3-col > div:nth-child(3)
	{
		
	}

	div.thc-home-3-col > div
	{
		margin-bottom: ;
	}

	div.thc-home-3-col > div > div:nth-child(2) > h3
	{
		margin-bottom: ;
	}

	div.thc-home-3-col > div > div:nth-child(2) > p
	{
		margin-bottom: ;
	}

	div.thc-home-filter
	{
		display: none;
		font-size: 14px;
	}

	div.thc-home-filter-mobile
	{
		display: block;
		font-size: 14px;
	}

	div.thc-home-filter-mobile > div.dropDown
	{
		
	}

	div.thc-home-hero > div > div
	{
		width: 100% !important;
	}

	div.thc-home-hero > div > div .search-bar._Skins_Home_Searchbar.mc-component
	{
		margin-left: 0;
	}

	div.thc-home-hero
	{
		background-color: #ECF1F4 !important;
		background-image: none !important;
		padding-bottom: 10% !important;
		background-position: center center !important;
		padding-top: 10% !important;
		height: auto !important;
	}

	div.thc-home-products
	{
		grid-template-columns: repeat(2, 1fr);
		padding-left: 5%;
		padding-right: 5%;
		gap: 16px;
	}

	div.thc-home-wrapper
	{
		padding-left: 5%;
		padding-right: 5%;
	}

	div.thc-home-hero > div > div > h2
	{
		font-size: 1em;
	}

	div.thc-home-wrapper > h2
	{
		font-size: 1.5em !important;
	}

	div.thc-home-hero > div > div > h1
	{
		font-size: 1.5em !important;
		margin-bottom: 15px !important;
	}

	div.thc-home-products > div > a
	{
		padding-right: 10px !important;
		padding-bottom: 20px !important;
		padding-left: 10px !important;
		padding-top: 20px !important;
		font-size: 16px;
	}

	div.thc-home-products > div h3
	{
		margin-bottom: 20px !important;
		font-size: 1em !important;
	}

	div.thc-home-products > div:nth-child(3) h3::after
	{
		font-size: 12px !important;
		bottom: -12px !important;
	}

	div.thc-home-3-col
	{
		gap: 20px;
		grid-template-columns: 1fr;
	}

	div.thc-home-3-col > div > div:nth-child(1)
	{
		margin-right: 20px;
		min-width: 42px;
	}

	div.thc-home-learning-training h3
	{
		font-size: 1.25em !important;
		margin-bottom: 10px !important;
	}

	div.thc-home-learning-training > div.thc-home-wrapper
	{
		max-width: 100%;
		padding-left: 5%;
		padding-right: 5%;
	}

	div.thc-home-hero::before
	{
		
	}

	div.thc-home-hero::after
	{
		position: absolute;
		right: -55px;
		bottom: -60px;
		height: 100px;
		width: 100px;
		background-color: #F2863B;
		transform: rotate(45deg);
		display: block;
		content: '' '';
	}

	div.thc-home-products > div p
	{
		font-size: .75em !important;
	}

	div.thc-home-products > div h4
	{
		font-size: .625em !important;
	}

	div.thc-home-2-col
	{
		justify-content: center;
	}

	div.thc-home-hero > div
	{
		
	}

	div.thc-home-3-col > div > div:nth-child(1) > img
	{
		
	}
}

/* Enhanced Active Filter Styling */

div.thc-home-filter > div.active
{
	font-weight: 700;
	border-bottom: solid 4px var(--White);
	color: var(--White);
	background: rgba(255, 255, 255, 0.1);
	border-radius: 6px 6px 0 0;
}

/* Compact Enhanced Filter Buttons */

div.thc-home-filter > div
{
	color: rgba(255, 255, 255, 0.8);
	transition: all 0.3s ease;
	padding: 0.6rem 1rem 0.4rem 1rem;
	text-transform: uppercase;
	font-size: 0.875em;
	letter-spacing: 0.5px;
	font-weight: 500;
}

div.thc-home-filter > div:hover
{
	color: var(--White);
}

div.thc-home-filter > div:not(:last-child)
{
	margin-right: 0;
}

div.thc-home-mb40
{
	margin-bottom: 40px;
}

/* Enhanced Home Product Card Links */

div.thc-home-products > div > a
{
	text-decoration: none;
	color: #2b2b2b;
	display: block;
	padding: 2rem;
	font-size: 16px;
	height: 100%;
	transition: all 0.3s ease;
}

div.thc-home-products > div > a:hover
{
	color: #2b2b2b;
	text-decoration: none;
}

/* Enhanced Home Product Card Headers with Icons */

div.thc-home-products > div h3
{
	color: var(--Brand2);
	margin-top: 0;
	line-height: 1.2;
	font-weight: 700;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

div.thc-home-products > div h3::before
{
	content: '';
	width: 32px;
	height: 32px;
	background-color: var(--Brand1);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: 0 2px 8px rgba(0, 76, 151, 0.2);
	transition: all 0.3s ease;
}

div.thc-home-products > div:hover h3::before
{
	transform: scale(1.05);
	box-shadow: 0 4px 15px rgba(0, 76, 151, 0.3);
}

/* Product-specific home page icons based on link targets */

div.thc-home-products > div > a[href*="tosca_op"] ~ div h3::before,
div.thc-home-products > div > a[href*="tosca_op.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/tosca.svg');
}

div.thc-home-products > div > a[href*="tosca_cloud"] ~ div h3::before,
div.thc-home-products > div > a[href*="tosca_cloud.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/tosca.svg');
}

div.thc-home-products > div > a[href*="tosca_op_extensions"] ~ div h3::before,
div.thc-home-products > div > a[href*="tosca_op_extensions.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/tosca_extensions.svg');
}

div.thc-home-products > div > a[href*="qtest_saas"] ~ div h3::before,
div.thc-home-products > div > a[href*="qtest_saas.htm"] h3::before,
div.thc-home-products > div > a[href*="qtest_op"] ~ div h3::before,
div.thc-home-products > div > a[href*="qtest_op.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/qtest.svg');
}

div.thc-home-products > div > a[href*="neoload.htm"] h3::before,
div.thc-home-products > div > a[href*="neoload_web.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/neoload_all_versions.svg');
}

div.thc-home-products > div > a[href*="testim.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/testim.svg');
}

div.thc-home-products > div > a[href*="test_management_for_jira.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/ttm_for_jira.svg');
}

div.thc-home-products > div > a[href*="vera.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/vera.svg');
}

div.thc-home-products > div > a[href*="livecompare.htm"] h3::before
{
	background-image: url('../Images/ProductIcons/livecompare.svg');
}

div.thc-home-products > div > a[href*="sealights.htm"] h3::before
{
	background-color: var(--Brand1);
	font-size: 12px;
	font-weight: 700;
	color: var(--White);
	text-transform: uppercase;
	content: 'SL';
}

div.thc-home-products > div > a[href*="device_cloud.htm"] h3::before
{
	background-color: var(--Brand1);
	font-size: 10px;
	font-weight: 700;
	color: var(--White);
	text-transform: uppercase;
	content: 'DC';
}

/* Specific styling for Tosca super-tile main content */

.tosca-super-tile .main-content h3
{
	color: var(--Brand2);
	margin-top: 0;
	line-height: 1.2;
	font-weight: 700;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

.tosca-super-tile .main-content h3::before
{
	content: '';
	width: 32px;
	height: 32px;
	background-color: var(--Brand1);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: 0 2px 8px rgba(0, 76, 151, 0.2);
	transition: all 0.3s ease;
	background-image: url('../Images/ProductIcons/tosca.svg');
}

div.thc-home-products > div h4
{
	color: #004C97;
	font-size: .875em;
	font-weight: 600;
	margin-top: 0;
	line-height: 1;
	margin-bottom: 4px;
}

/* Enhanced Home Product Card Descriptions */

div.thc-home-products > div p
{
	margin-top: 0;
	margin-bottom: 0;
	font-size: 1em;
	line-height: 1.6;
	color: #5a6c7d;
	font-weight: 400;
}

/* Fix for specific positioning while maintaining flex layout */

div.thc-home-products > div:nth-child(2) h3
{
	display: flex;
	align-items: center;
	gap: 1rem;
	position: relative;
}

div.thc-home-learning-training
{
	font-size: 16px;
	padding-top: 40px;
}

/* Enhanced Learning & Training Section */

div.thc-home-learning-training h2
{
	color: var(--Brand2);
	margin-top: 0;
	font-size: 2.375em;
	text-align: center;
	margin-bottom: 60px;
	font-weight: 700;
}

div.thc-home-2-col > div > div:nth-child(1)
{
	width: 40%;
	margin-right: 5%;
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
}

div.thc-home-2-col > div > div:nth-child(2)
{
	width: 55%;
}

/* Enhanced Learning & Training Card Titles */

div.thc-home-learning-training h3
{
	font-weight: 700;
	color: var(--Brand2);
	margin-top: 0;
	margin-bottom: 20px;
	font-size: 1.5em;
}

div.thc-home-learning-training p
{
	color: #2b2b2b;
	font-weight: 400;
	margin-top: 0;
	margin-bottom: 12px;
	font-size: .875em;
}

/* Enhanced Learning & Training Links */

div.thc-home-learning-training a
{
	font-weight: 600;
	color: var(--Brand1);
	text-decoration: none;
	font-size: .875em;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

div.thc-home-learning-training a:hover
{
	color: var(--Brand2);
	text-decoration: underline;
}

div.thc-home-learning-training a::after
{
	content: '→';
	margin-left: 10px;
}

/* Compact Filter Text - Remove Default P Margins */

div.thc-home-filter > div > p
{
	font-size: .75em;
	line-height: 1.5em;
	margin: 0;
	padding: 0;
}

div.thc-home-2-col > div > div:nth-child(1) > img
{
	max-width: 100%;
	width: 100%;
	margin-bottom: 10px;
	min-width: 100%;
	min-height: 100%;
	object-fit: cover;
}

div.thc-home-3-col > div > div:nth-child(2) > h3
{
	font-size: .875em;
	font-weight: 700;
	line-height: 1.1875em;
	text-transform: uppercase;
	letter-spacing: .52px;
	margin-bottom: 6px;
	margin-top: 0;
}

div.thc-home-3-col > div > div:nth-child(2) > p
{
	font-size: .875em;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
	margin-bottom: 12px;
	margin-top: 20px;
}

div.thc-home-3-col > div > div:nth-child(2) > p > a
{
	color: #004C97;
	font-size: 1em;
	font-weight: 600;
	text-decoration: none;
}

div.thc-home-3-col > div > div:nth-child(2) > p > a::after
{
	margin-left: .625em;
	content: '→';
}

div.thc-home-3-col > div > div:nth-child(2) > p:last-child
{
	margin: 0;
}

div.thc-home-wrapper > h2
{
	color: #1b365d;
	margin-top: 0;
	font-size: 2.375em;
	text-align: center;
	margin-bottom: 60px;
}

/* Enhanced Additional Resources Section */

div.thc-home-additional-resources
{
	padding-top: 40px;
}

div.thc-home-additional-resources h2
{
	color: var(--Brand2);
	text-align: center;
	font-weight: 700;
	font-size: 2.375em;
	margin-bottom: 60px;
}

div.thc-home-additional-resources h3
{
	color: var(--Brand2);
	font-weight: 700;
	text-transform: lowercase;
}

div.thc-home-additional-resources p
{
	color: #5a6c7d;
	line-height: 1.6;
}

div.thc-home-additional-resources a
{
	color: var(--Brand1);
	font-weight: 600;
	text-decoration: none;
	transition: all 0.3s ease;
}

div.thc-home-additional-resources a:hover
{
	color: var(--Brand2);
	text-decoration: underline;
}

/* ===== TOSCA EXPANDABLE SUPER-TILE ===== */
/* Base super-tile styling - inherits home card styles */

.tosca-super-tile
{
	position: relative;
	transition: all 0.4s ease;
	overflow: visible;
	/* Changed to allow expansion */
	cursor: pointer;
	z-index: 1;
}

/* Ensure super-tile gets standard home card styling */

.tosca-super-tile .main-content > a
{
	text-decoration: none;
	color: #2b2b2b;
	display: block;
	padding: 2rem;
	font-size: 16px;
	transition: all 0.3s ease;
}

.tosca-super-tile .main-content
{
	transition: all 0.4s ease;
	min-height: auto;
	/* Allow natural height */
}

/* Flow-based sub-tiles that push other content */

.tosca-super-tile .sub-tiles
{
	background: var(--White);
	border-radius: 0 0 12px 12px;
	box-shadow: 0 4px 15px rgba(0,0,0,0.08);
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s ease, opacity 0.3s ease;
	border: 1px solid rgba(0,0,0,0.08);
	border-top: none;
	margin-top: -8px;
	/* Less negative margin for better height matching */
	opacity: 0;
	width: 100%;
	box-sizing: border-box;
}

/* Expanded state */

.tosca-super-tile.expanded
{
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

/* Expanded state - pushes other tiles down */

.tosca-super-tile.expanded .sub-tiles
{
	max-height: 500px;
	/* Increased to prevent content cutoff */
	opacity: 1;
}

/* Sub-tile styling */

.tosca-sub-tile
{
	padding: 1.5rem;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 1rem;
	text-decoration: none;
	color: inherit;
}

.tosca-sub-tile:last-child
{
	border-bottom: none;
}

.tosca-sub-tile:hover
{
	background: rgba(0, 76, 151, 0.02);
	transform: translateX(4px);
}

.tosca-sub-tile-icon
{
	width: 24px;
	height: 24px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
	border-radius: 4px;
}

.tosca-sub-tile-icon.op
{
	background-image: url('../Images/ProductIcons/tosca.svg');
}

.tosca-sub-tile-icon.cloud
{
	background-image: url('../Images/ProductIcons/tosca.svg');
}

.tosca-sub-tile-icon.extensions
{
	background-image: url('../Images/ProductIcons/tosca_extensions.svg');
}

.tosca-sub-tile-content h4
{
	margin: 0 0 0.25rem 0;
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--Brand2);
}

.tosca-sub-tile-content p
{
	margin: 0;
	font-size: 0.875rem;
	color: #5a6c7d;
	line-height: 1.4;
}

/* ===== QTEST EXPANDABLE SUPER-TILE ===== */
/* Base qTest super-tile styling */

.qtest-super-tile
{
	position: relative;
	transition: all 0.4s ease;
	overflow: visible;
	cursor: pointer;
	z-index: 1;
	min-height: 220px;
}

.qtest-super-tile .main-content > a
{
	text-decoration: none;
	color: #2b2b2b;
	display: block;
	padding: 2rem;
	font-size: 16px;
	transition: all 0.3s ease;
}

.qtest-super-tile .main-content
{
	transition: all 0.4s ease;
	min-height: auto;
}

.qtest-super-tile .main-content h3
{
	color: var(--Brand2);
	margin-top: 0;
	line-height: 1.2;
	font-weight: 700;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

.qtest-super-tile .main-content h3::before
{
	content: '';
	width: 32px;
	height: 32px;
	background-color: var(--Brand1);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: 0 2px 8px rgba(0, 76, 151, 0.2);
	transition: all 0.3s ease;
	background-image: url('../Images/ProductIcons/qtest.svg');
}

/* Flow-based qTest sub-tiles */

.qtest-super-tile .sub-tiles
{
	background: var(--White);
	border-radius: 0 0 12px 12px;
	box-shadow: 0 4px 15px rgba(0,0,0,0.08);
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s ease, opacity 0.3s ease;
	border: 1px solid rgba(0,0,0,0.08);
	border-top: none;
	margin-top: -8px;
	opacity: 0;
	width: 100%;
	box-sizing: border-box;
}

.qtest-super-tile.expanded
{
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

.qtest-super-tile.expanded .sub-tiles
{
	max-height: 400px;
	opacity: 1;
}

.qtest-sub-tile
{
	padding: 1.5rem;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 1rem;
	text-decoration: none;
	color: inherit;
}

.qtest-sub-tile:last-child
{
	border-bottom: none;
}

.qtest-sub-tile:hover
{
	background: rgba(0, 76, 151, 0.02);
	transform: translateX(4px);
}

.qtest-sub-tile-icon
{
	width: 24px;
	height: 24px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
	border-radius: 4px;
	background-image: url('../Images/ProductIcons/qtest.svg');
}

.qtest-sub-tile-content h4
{
	margin: 0 0 0.25rem 0;
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--Brand2);
}

.qtest-sub-tile-content p
{
	margin: 0;
	font-size: 0.875rem;
	color: #5a6c7d;
	line-height: 1.4;
}

/* ===== NEOLOAD EXPANDABLE SUPER-TILE ===== */
/* Base NeoLoad super-tile styling */

.neoload-super-tile
{
	position: relative;
	transition: all 0.4s ease;
	overflow: visible;
	cursor: pointer;
	z-index: 1;
	min-height: 220px;
}

.neoload-super-tile .main-content > a
{
	text-decoration: none;
	color: #2b2b2b;
	display: block;
	padding: 2rem;
	font-size: 16px;
	transition: all 0.3s ease;
}

.neoload-super-tile .main-content
{
	transition: all 0.4s ease;
	min-height: auto;
}

.neoload-super-tile .main-content h3
{
	color: var(--Brand2);
	margin-top: 0;
	line-height: 1.2;
	font-weight: 700;
	font-size: 1.5rem;
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

.neoload-super-tile .main-content h3::before
{
	content: '';
	width: 32px;
	height: 32px;
	background-color: var(--Brand1);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	box-shadow: 0 2px 8px rgba(0, 76, 151, 0.2);
	transition: all 0.3s ease;
	background-image: url('../Images/ProductIcons/neoload_all_versions.svg');
}

/* Flow-based NeoLoad sub-tiles */

.neoload-super-tile .sub-tiles
{
	background: var(--White);
	border-radius: 0 0 12px 12px;
	box-shadow: 0 4px 15px rgba(0,0,0,0.08);
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.4s ease, opacity 0.3s ease;
	border: 1px solid rgba(0,0,0,0.08);
	border-top: none;
	margin-top: -8px;
	opacity: 0;
	width: 100%;
	box-sizing: border-box;
}

.neoload-super-tile.expanded
{
	box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}

.neoload-super-tile.expanded .sub-tiles
{
	max-height: 400px;
	opacity: 1;
}

.neoload-sub-tile
{
	padding: 1.5rem;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	gap: 1rem;
	text-decoration: none;
	color: inherit;
}

.neoload-sub-tile:last-child
{
	border-bottom: none;
}

.neoload-sub-tile:hover
{
	background: rgba(0, 76, 151, 0.02);
	transform: translateX(4px);
}

.neoload-sub-tile-icon
{
	width: 24px;
	height: 24px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
	border-radius: 4px;
	background-image: url('../Images/ProductIcons/neoload_all_versions.svg');
}

.neoload-sub-tile-content h4
{
	margin: 0 0 0.25rem 0;
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--Brand2);
}

.neoload-sub-tile-content p
{
	margin: 0;
	font-size: 0.875rem;
	color: #5a6c7d;
	line-height: 1.4;
}

/* Mobile optimization */

@media (max-width: 768px)
{
	.tosca-super-tile .sub-tiles,
	.qtest-super-tile .sub-tiles,
	.neoload-super-tile .sub-tiles
	{
		position: static;
		opacity: 1;
		transform: none;
		pointer-events: all;
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.4s ease;
	}

	.tosca-super-tile.expanded .sub-tiles,
	.qtest-super-tile.expanded .sub-tiles,
	.neoload-super-tile.expanded .sub-tiles
	{
		max-height: 300px;
	}
}

div.thc-home-filter-mobile > div.dropDown .dropDownHotspot:link
{
	color: #ffffff;
	font-weight: 700;
	font-size: .875em;
	text-transform: uppercase;
}

div.thc-home-filter-mobile > div.dropDown p
{
	font-size: .75em;
	cursor: pointer;
	margin: 0;
	padding-top: 4px;
	padding-bottom: 4px;
	text-transform: uppercase;
}

div.thc-home-filter-mobile .MCDropDown_Closed .MCDropDownHotSpot_.MCHotSpotImage,
div.thc-home-filter-mobile .MCDropDown_Open .MCDropDownHotSpot_.MCHotSpotImage
{
	background-image: url('../Images/FilterOutlined.png');
	background-size: contain;
}

div.thc-home-hero
{
	padding-top: 3%;
	padding-bottom: 3%;
	background-size: cover;
	background-color: #ECF1F4;
	background-image: url('../Images/Portal_HeroHeader_Desktop.png');
	background-repeat: no-repeat;
	background-position: right center;
	position: relative;
	overflow: hidden;
	height: 243px;
}

/* Enhanced Hero Title */

div.thc-home-hero > div > div > h1
{
	color: var(--Brand2);
	margin-top: 0;
	font-size: 2.5em;
	margin-bottom: 15px;
	font-weight: 700;
}

div.thc-home-hero > div > div
{
	width: 60%;
}

div.thc-home-hero > div > div .search-bar._Skins_Home_Searchbar.mc-component
{
	width: 100%;
	margin-left: 0;
	max-width: 500px;
}

div.thc-home-additional-resources > div.thc-home-wrapper
{
	max-width: 1376px;
}

.nav-search-wrapper
{
	display: none;
}