.colorway-custom {
    --color-colorway: var(--color-brand-red);
}

.colorway-custom {
    --color-colorway-alt: var(--color-white);
}
.straplines-layout, .straplines-layout .carousel-item {
    background-color: var(--color-colorway);
    color: var(--color-colorway-alt);
}

.background-container {
	position: relative;
	width: 100%;
	max-width: 1725px;
	overflow: hidden;
	margin: 0 auto;
}

.bk01 {
	position: absolute;
	left: -350px;
	width: 4142px;
	min-width: 4142px;
	max-width: 4142px;
	height: 600px;
	background-color: rgb(146, 101, 182);
	margin-bottom: 60px;
}
.bk02 {
	position: absolute;
	width: 4142px;
	min-width: 4142px;
	max-width: 4142px;
	height: 880px;
	background-color: rgba(105, 63, 137, 1.0);
	transform: rotate(-7.5deg);
	top: 112px;
	left: -350px;
	z-index: 1;
}
.bk03 {
	position: absolute;
	background-image: url(/wp-content/uploads/2026/10/bk_01.jpg);
	background-position: center center;
	z-index: 0;
	width: 3555px;
	height: 1700px;
	left: calc(50% - 1750px);
	transform: scale(0.5);
	top: 545px;
}
.bk04 {
	position: absolute;
	background-color: #F1F0EE;
	width: 4142px;
	min-width: 4142px;
	max-width: 4142px;
	height: 600px;
	left: -350px;
	top: 1790px;
	transform: rotate(8deg);
}
.bk05 {
	position: absolute;
	background-color: #E0E0DA;
	top: 1880px;
	width: 4142px;
	min-width: 4142px;
	max-width: 4142px;
	height: 1200px;
	transform: rotate(-8.8deg);
	left: -350px;
}
.bk06 {
	position: absolute;
	top: 3085px;
	width: 4142px;
	min-width: 4142px;
	max-width: 4142px;
	height: 1000px;
	background-color: rgb(146, 101, 182);
	transform: rotate(-8.8deg);
	left: -350px;
}
.bk07 {
	position: absolute;
	top: 3780px;
	width: 100%;
	height: 180px;
	background-color: #E0E0DA;
}
.bk08 {
	position: absolute;
	top: 3960px;
	width: 100%;
	height: 200px;
	background-color: #FFFFFF;
}

.guide-section {
	width: 1110px;
	min-width: 1110px;
	max-width: 1110px;
	margin: 0 auto 0 auto;
	font-size: 1rem;
	z-index: 2;
}

.section02 p, .section03 p, .section04 p, .section04 p {
	text-align: center;
}

.section02 h2, .section03 h2, .section04 h2, .section04 h2 {
	text-align: center;
}

.section01 {
	color: #FFFFFF;
	margin-top: 3rem;
	position: relative;
	/*background: #693F89;*/
}

	.section01 .asterix {
		position: absolute;
		left: -110px;
		top: -10px
	}

.section01 .free-guide {
	margin: 0;
}

	.section01 h1 {
		font-size: 4rem;
		font-weight: bold;
		margin-bottom: 2rem;
	}

	.section01 h2 {
		font-size: 1.5rem;
		padding: 0.8rem 1rem ;
		background-color: #F9B227;
		width: 450px;
		line-height: 1.8rem;
		word-spacing: 0.4rem;
		margin-bottom: 1.5rem;
	}

	.section01 .brochure-image {
		position: absolute;
		left: 530px;
		top: 120px;
	}

	.section01 p {
		margin-bottom: 1.3rem;
	}

	.section02 {
		/*background: #693F89;*/
		position: relative;
	}

		.section02 h2 {
			margin-top: 5rem;
			font-size: 1.5rem;
			color: #F9B227;
		}

		.section02 .DTSF {
			margin: 2.5rem 0;
			display: flex;
			flex-direction:row;
			justify-content: space-between;
		}

		.section02 .DTSF .card {
			color: #FFFFFF;
			width: 120px;
			font-size: 0.7rem;
		}

		.section02 .DTSF img {
			height: 80px;
			margin: 1rem auto;
		}

		.section02 .DTSF-p {
			font-weight: bold;
			text-align: center;
			width: 450px;
			margin: 0 auto;
			color: #FFFFFF;
		}

		.section02 .quote {
			background-color: #73C09D;
			border-radius: 100%;
			width: 250px;
			height: 250px;
			position: absolute;
			color: #FFFFFF;
			display: flex;
			flex-direction:column;
			justify-content: center;
			align-items: center;
			padding:2rem;
			font-size: 0.9rem;
		}

			.section02 .quote p {
				line-height: 1.2rem;
				margin: 0 0 0.5rem;
			}

.section03 {
	/*background: #F1F0EE;*/
	margin-top: 740px;
}

	.section03 h2 {
		font-size: 1.5rem;
		margin-bottom: 1.3rem;
		font-weight: bold;
	}

	.section03 .CIPD {
		font-weight: bold;
		width: 500px;
		margin:0 auto;
	}
	.section03 .survey-highlights {
		display: flex;
		flex-direction: row;
		justify-content: center;
		margin: 1.5rem;

	}

		.section03 .survey-highlights .card {
			width: 180px;
			height: 180px;
			border-radius: 100%;
			text-align: center;
			padding: 1.5rem;
			display: flex;
			flex-direction: column;
			/*justify-content: center;*/
			align-items: center;
			color: #FFFFFF;
			margin: 0 3rem;
		}
			.section03 .survey-highlights .card:nth-of-type(1) {
				background-color: #EF7D00;
			}
			.section03 .survey-highlights .card:nth-of-type(2) {
				background-color: #73C09D;
			}
			.section03 .survey-highlights .card:nth-of-type(3) {
				background-color: #ED6971;
			}

			.section03 .survey-highlights .card strong {
				font-size: 3rem;
				line-height: 3rem;
				margin-top: 1.2rem;
			}

			.section03 .survey-highlights .card p {
				font-size: 0.7rem;
				margin: 0;
			}

	.section03 .appreciate {
		font-weight: bold;
		width: 650px;
		margin: 0 auto;

	}
	.section04 {
		/*background: #E0E0DA;*/
	}

		.section04 img {
			margin: 0 auto;
			width: 800px;
		}

		.section04 h2 {
			font-size: 1.5rem;
			margin-bottom: 1.3rem;
			font-weight: bold;
		}

		.section04 .guide-covers {
			font-weight: bold;
			width: 550px;
			margin: 0 auto;
		}

		.section04 .guide-details {
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			margin: 2rem 0;
		}

			.section04 .guide-details .card {
				display: flex;
				flex-direction:column;
				align-items: center;
				width: 190px;
				background-color: #FFFFFF;
				padding: 0.5rem 1.3rem;
			}

				.section04 .guide-details .card .number {
					font-size: 4rem;
					line-height: 4.2rem;
					font-weight: bold;
					color: #693F89;
				}

			.section04 .guide-details .card p:first-of-type {
				font-weight: bold;
				min-height:95px;
			}

				.section04 .guide-details .card p:last-of-type {
					font-size: 0.8rem;
					margin-bottom: 0;
				}


		.section04 .download-link {
			text-align:center;
		}

		.section05 {
			margin-top: 180px;
			position: relative;
			color: #FFFFFF;
		}

		.section05 .asterix {
			position: absolute;
			right: 0;
			top: -120px;
		}

			.section05 h2 {
				font-size: 1.5rem;
				margin-bottom: 1.3rem;
				font-weight: bold;
				text-align: center;
				margin-bottom: 0;
			}

			.section05 .how-strait-logics-helps img {
				float: right;
				position: relative;
				top: -40px;
			}

			.section05 .how-strait-logics-helps p:first-of-type {
				margin-top: 2rem;
			}

			.section05 .feature-list {
				display: flex;
				flex-direction: row;
			}

				.section05 .feature-list ul {
					list-style-image: url(/wp-content/uploads/2026/10/check.png);
					margin-right: 3rem;
				}

					.section05 .feature-list ul li {
						margin-left: 1.5rem;
					}

					.section05 .demo-link {
					}

						.section05 .demo-link a {
							width: 200px;
							position:relative;
							left: calc(50% - 100px);
						}

.section06 {
	margin-top: 50px;
	position: relative;
}

	.section06 h2 {
		font-size: 1.5rem;
		margin-top: 5rem;
		margin-bottom: 1.3rem;
		font-weight: bold;
		text-align: center;
	}

	.section06 .download-details {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

		.section06 .download-details p {
			width: 700px;
		}

		.section07 {
			margin-top: 4rem;
			margin-bottom: 1.5rem;
		}

			.section07 h2 {
				font-size: 1.5rem;
				margin-bottom: 1.3rem;
				font-weight: bold;
				text-align: center;
			}

			.section07 .clients {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center
			}
				.section07 .clients img {
					margin: 0 1rem;
				}

				.section07 .clients img.rps {
					width: 100px;
					height: 54px;
				}
				.section07 .clients img.amba {
					width: 100px;
					height: 47px;
				}
				.section07 .clients img.acer {
					width: 100px;
					height: 45px;
				}
				.section07 .clients img.savills {
					width: 52px;
					height: 45px;
				}
				.section07 .clients img.kpmg {
					width: 100px;
					height: 46px;
				}
				.section07 .clients img.macmillan {
					width: 120px;
					height: 68px;
				}
				.section07 .clients img.tesco {
					width: 100px;
					height: 27px;
				}

				.small {
					font-size: .6rem;
				}

.h3 {
	font-size: 1.25rem;
}

.inline-form {
	margin-top: 20px;
}

.title {
	font-size: 30px;
}

/* Form Styles  */
.guide-form-container {
	background-color: #FFFFFF;
	color: #1D1D1B;
	margin-left: 5rem;
	padding: 1.5rem;
}

	.guide-form-container input {
		border: 1px solid #1D1D1B;
		border-radius: 0;
		font-size: 0.9rem;
	}

	.guide-form-container p:first-of-type {
		font-size: 0.9rem;
		margin-bottom: 0.5rem;
	}
	.guide-form-container p:last-of-type {
		margin: 0;
	}

.guide-form-container .form-group {
	margin-bottom: 0.8rem;
}

.guide-form-container button {
	width: 100%;
}

.guide-form-container .small {
	font-size: 0.5rem;
}

@media (max-width: 1200px) {

	.bk02 {
		height: 760px;
	}
	.bk03 {
		top: 425px;
	}
	.bk04 {
		top: 1590px;
	}
	.bk05 {
		top: 1640px;
	}
	.bk06 {
		top: 2730px;
		height: 700px;
	}
	.bk07 {
		top: 3435px;
		height: 240px;
	}
	.bk08 {
		top: 3640px;
	}

	.guide-section {
		width: 100%;
		min-width: 100%;
		max-width: 100%;
	}

	.section01 {
		margin: 2rem 1rem 0;
		display: flex;
		flex-direction: row;
	}

	.section01 h1 {
		font-size: calc(1.375rem + 1.5vw);
		margin-bottom: 1.2rem;
	}
		.section01 h2, 
		.section02 h2,
		.section03 h2,
		.section04 h2,
		.section05 h2,
		.section06 h2 {
			font-size: 1.2rem;
			word-spacing: normal;
			width: 100%;
			padding: 0.5rem;
			margin-bottom: 1.2rem;
		}
	

		.section01 #guide-form {
			order: 2;
			margin-left: 1rem;
		}

		.section01 .brochure-image {
			display: none;
		}


		.section02 h2 {
			margin-top: 2rem;
		}

	.section02 .DTSF {
		margin: 2.5rem 1rem;
	}

	.section02 .quote {
		margin-left: 1rem;
	}

		.section03 {
			margin-top: 490px;
		}
			.section03 .survey-highlights .card {
				margin: 0 1rem;
			}
	.section04 .guide-details {
		margin: 2rem 1rem;
	}

		.section04 .guide-details .card {
			width: auto;
			max-width: 200px;
			padding: 0.5rem;
		}

	.section05 {
		top: 95px;
		margin: 0 1rem;
	}
	.section05 .asterix {
		top: -80px;
		right: 10px;
	}

		.section05 .how-strait-logics-helps img {
			width: 280px;
			top: -20px;
		}

		.section06 {
			margin-top: 160px;
		}

			.section06 .download-details {
				flex-direction: column;
				margin: 0 1rem;
			}
				.section06 .download-details p {
					width: 100%;
				}
			.section06 .download-link {
				text-align:center;
			}


			.section07 { 
				margin-top: 3rem;
			}

				.section07 .clients {
					flex-flow: wrap;
				}
}

@media (max-width: 800px) {



		.section02 .DTSF {
			margin: 1.5rem 1rem;
		}

		.section02 .DTSF img {
			height: 60px;
		}

		.section02 .quote {
			margin-top: 1rem;
		}

	.section03 {
		margin-top: 75%;
	}

		.section03 .survey-highlights {
			margin: 1.5rem 0;
		}

		.section03 .appreciate {
			width: 100%;
		}
		.section04 img {
			width: 70%;
		}

	.section04 .guide-details {
		flex-direction: column;
		margin: 0.5rem 1rem;
	}

	.section04 .guide-details .card {
		width: 100%;
		max-width: unset;
		flex-direction: row;
		margin-bottom: 1rem;
	}

		.section04 .guide-details .card .number {
			width: 50px;
			min-width: 50px;
			max-width: 50px;
			margin-right: 2rem;
			display: block;
			text-align: center;
		}

		.section04 .guide-details .card p:first-of-type,
		.section04 .guide-details .card p:last-of-type {
			min-height: unset;
			text-align: left;
		}

	.section04 .guide-covers {
		width: 100%;
		padding: 0 1rem;
	}

	.section05 .how-strait-logics-helps img {
		width: 180px;
	}

	.section06 {
		margin-top: 15%;
	}

}

@media (max-width: 700px) {
	.section04 img {
		width: 80%;
	}

	.section06 {
		margin-top: 17%;
	}
}

@media (max-width: 650px) {


	.bk02 {
		height: 1060px;
	}

	.bk03 {
		top: 725px;
	}

	.bk04 {
		top: 1890px;
	}
	.bk05 {
		top: 1840px;
	}
	.bk06 {
		top: 2930px;
		height: 700px;
	}

	.bk07 {
		top: 3700px;
		height: 220px;
	}

	.bk08 {
		top: 3910px;
	}


	.section01 {
		flex-direction: column;
	}

		.section01 #guide-form {
			margin-left: 0;
		}

	.section02 .quote {
		padding: 1rem;
		font-size: 0.6rem;
		width: 180px;
		height: 180px;
	}

		.section02 .quote p {
			line-height: 0.8rem;
		}


	.section03 .CIPD {
		width: 100%;
	}

	.section03 .survey-highlights {
		flex-flow: wrap;
	}

		.section03 .survey-highlights .card {
			padding: 0.5rem;
			width: 145px;
			height: 145px;
		}

			.section03 .survey-highlights .card strong {
				font-size: 2rem;
				line-height: 2rem;
				margin-top: 1.2rem;
			}

			.section03 .survey-highlights .card p {
				font-size: 0.6rem;
			}

	.section03 .appreciate {
	}


}
	@media (max-width: 580px) {

		.bk07 {
			top: 3790px;
		}

		.bk08 {
			top: 4010px;
		}

	.section04 img {
		width: 90%;
	}

		.section06 {
			margin-top: 20%;
		}
}

@media (max-width: 530px) {

	.bk02 {
		height: 1360px;
	}

	.bk03 {
		top: 1025px;
	}

	.bk04 {
		top: 2190px;
	}

	.bk05 {
		top: 2180px;
	}
	.bk06 {
		top: 3350px;
	}
	.bk07 {
		top: 4190px;
		height: 265px
	}
	.bk08 {
		top: 4455px;
	}

	.section02 .DTSF {
		flex-direction: column;
	}

		.section02 .DTSF .card {
			width: 100%;
			display: flex;
			justify-content: space-evenly;
			align-items: center;
			font-size: 1rem;
		}

		.section02 .DTSF img {
			margin: 0.5rem 1rem 0.5rem 2rem;
		}

		.section02 .DTSF .card p {
			text-align: left;
			width: 65%;
			margin-bottom: 0;
		}

	.section02 .DTSF-p {
		width: 100%;
	}


		.section03 {
			margin: 90% 1rem 0;
		}

		.section04 .guide-details .card p {
			margin-bottom: 0.5rem;
		}

	.section05 .how-strait-logics-helps img {
		width: 30%;
	}
}

@media (max-width: 400px) {

	.bk06 {
		height: 900px;
	}
	.bk07 {
		top: 4300px;
		height: 300px;
	}
	.bk08 {
		top: 4850px;
	}

	.section03 .survey-highlights .card {
		width: 125px;
		height: 125px;
		padding: 0.6rem;
	}
		.section03 .survey-highlights .card strong {
			margin-top: 0.7rem;
		}

		.section05 {
			top: 50px;
		}
			.section05 .asterix {
				width: 60px;
				top: -40px;
			}

			.section05 .feature-list ul {
				margin-right: 1.2rem;
			}

	.section06 {
		margin-top: 25%;
	}

}