/*======================================
=
= QUIZ PAGE
=
======================================*/

.gbk-single-page{

	background:#f5f7fb;

	padding:50px 20px 70px;

}

.gbk-container{

	max-width:900px;

	margin:0 auto;

}


/*======================================
=
= HEADER
=
======================================*/

.gbk-header{

	margin-bottom:45px;

}

.gbk-header h1{

	margin:0 0 15px;

	font-size:42px;

	font-weight:700;

	color:#1f2937;

	line-height:1.3;

}

.gbk-description{

	font-size:18px;

	line-height:1.8;

	color:#6b7280;

}


/*======================================
=
= INSTRUCTION
=
======================================*/

.gbk-instructions{

	margin-bottom:55px;

}

.gbk-instructions h2{

	text-align:center;

	font-size:30px;

	margin-bottom:30px;

	color:#1f2937;

}


/*======================================
=
= INFO BOX
=
======================================*/

.gbk-instructions ul{

	list-style:none;

	padding:30px;

	margin:0;

	display:grid;

	grid-template-columns:repeat(3,1fr);

	gap:20px;

	background:#ffffff;

	border:1px solid #e5e7eb;

	border-radius:12px;

	box-shadow:0 10px 25px rgba(0,0,0,.05);

}

.gbk-instructions li{

	font-size:18px;

	font-weight:600;

	color:#374151;

	line-height:1.7;

}

.gbk-instructions li strong{

	color:#2563eb;

}


/*======================================
=
= START BUTTON
=
======================================*/

.gbk-instructions p{

	text-align:center;

	margin-top:35px;

}

.gbk-start-btn{

	display:inline-block;

	padding:16px 60px;

	background:#2563eb;

	color:#fff !important;

	font-size:18px;

	font-weight:700;

	border-radius:10px;

	text-decoration:none;

	transition:.25s;

}

.gbk-start-btn:hover{

	background:#1d4ed8;

	transform:translateY(-2px);

}


/*======================================
=
= RELATED QUIZ
=
======================================*/

.gbk-related-quiz h2{

	font-size:30px;

	margin-bottom:25px;

	color:#1f2937;

}

.gbk-related-card{

	background:#fff;

	border:1px solid #e5e7eb;

	border-radius:12px;

	padding:22px 26px;

	margin-bottom:18px;

	transition:.25s;

}

.gbk-related-card:hover{

	transform:translateY(-3px);

	box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.gbk-related-card h3{

	margin:0 0 12px;

	font-size:24px;

	font-weight:700;

}

.gbk-related-card h3 a{

	text-decoration:none;

	color:#111827;

}

.gbk-related-card h3 a:hover{

	color:#2563eb;

}

.gbk-related-card p{

	margin:0;

	font-size:16px;

	color:#6b7280;

}


/*======================================
=
= RESPONSIVE
=
======================================*/

@media(max-width:768px){

	.gbk-single-page{

		padding:35px 15px;

	}

	.gbk-header h1{

		font-size:32px;

	}

	.gbk-instructions h2{

		font-size:24px;

	}

	.gbk-instructions ul{

		grid-template-columns:1fr;

		padding:20px;

	}

	.gbk-related-card{

		padding:18px;

	}

	.gbk-related-card h3{

		font-size:20px;

	}

	.gbk-start-btn{

		width:100%;

		padding:16px;

	}

}