body.login {
	background: #f3f5f7;

	#login {
		width: 420px;
		max-width: calc(100% - 40px);
		padding-top: 7vh;
	}

	h1 {
		a {
			width: 180px;
			height: 180px;
			margin-bottom: 25px;
			background-image: url('/wp-content/uploads/2026/06/Circle-Logo.svg');
			background-position: center;
			background-repeat: no-repeat;
			background-size: contain;
		}
	}

	form {
		padding: 32px;
		background: #fff;
		border: 0;
		border-radius: 8px;
		box-shadow: 0 10px 35px rgba(0,0,0,.12);
	}

	label {
		font-size: 14px;
		font-weight: 700;
	}

	input[type="text"],
	input[type="password"] {
		min-height: 48px;
		padding: 8px 12px;
		border: 1px solid #ccd2d8;
		border-radius: 4px;
		box-shadow: none;

		&:focus {
			border-color: #10223f;
			box-shadow: 0 0 0 1px #10223f;
		}
	}

	.button-primary {
		min-height: 44px;
		padding: 0 24px;
		background: #10223f;
		border: 0;
		border-radius: 4px;
		font-weight: 700;
		text-shadow: none;
		box-shadow: none;

		&:hover,
		&:focus {
			background: #1c3964;
		}
	}

	#nav,
	#backtoblog {
		text-align: center;

		a {
			color: #10223f;
			font-weight: 600;

			&:hover {
				color: #1c3964;
			}
		}
	}

	.message,
	.notice,
	.success {
		border-left-color: #10223f;
		border-radius: 4px;
		box-shadow: 0 4px 18px rgba(0,0,0,.08);
	}
}