:root {
	--blue: #2476c5;
	--blue-deep: #12355b;
	--blue-pale: #edf6ff;
	--red: #c62828;
	--red-pale: #fff1f0;
	--ink: #26364a;
	--muted: #5d6b7b;
	--paper: #fff;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body {
	margin: 0 !important;
	width: 100% !important;
	min-height: 100vh;
	background: linear-gradient(145deg, #fff7f6 0%, #eef6ff 56%, #f8fbff 100%) fixed !important;
	color: var(--ink) !important;
	font: 16px/1.75 -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

#logo-wrap, #logo, #bgcol {
	width: 100% !important;
	background: #12355b !important;
}
#logo-wrap { padding: 0; }
#logo, #bgcol { min-height: 0; }
.site-banner {
	display: block;
	width: 100%;
	height: auto;
	min-height: 160px;
	max-height: none;
	object-fit: cover;
	object-position: center;
}

#header, #menu { width: 100% !important; background: var(--blue-deep) !important; }
#menu ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100% !important;
	max-width: 1120px !important;
	margin: 0 auto;
	padding: 0 18px !important;
	list-style: none;
	border: 0 !important;
	border-bottom: 4px solid var(--red) !important;
	box-shadow: 0 8px 20px rgba(18, 53, 91, .13) !important;
}
#menu li { margin: 0; padding: 0; }
#menu a, #menu a:visited {
	display: block;
	padding: 14px 19px;
	color: #fff !important;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .09em;
	text-decoration: none;
	transition: background .18s ease;
}
#menu a:hover, #menu a:focus { background: var(--red) !important; color: #fff !important; }

#page {
	width: min(1120px, calc(100% - 40px)) !important;
	max-width: 1120px !important;
	margin: 36px auto 52px !important;
	padding: 0 !important;
	background: transparent !important;
}
#content { float: none !important; width: 100% !important; max-width: none !important; margin: 0 !important; }
#content .post {
	margin: 0 0 24px !important;
	padding: clamp(22px, 4vw, 42px) !important;
	background: var(--paper) !important;
	border: 0 !important;
	border-top: 4px solid var(--blue) !important;
	border-radius: 18px !important;
	box-shadow: 0 12px 38px rgba(38, 54, 74, .08) !important;
	overflow: hidden;
}
#content .post:nth-child(even) { border-top-color: var(--red) !important; }
#content h1.title, #content h2.title, #content .title {
	margin: 0 0 20px !important;
	color: var(--blue-deep) !important;
	font-size: clamp(25px, 4vw, 34px) !important;
	font-weight: 750 !important;
	line-height: 1.25 !important;
}
#content h2.title { font-size: clamp(20px, 3vw, 25px) !important; }
#content .entry { color: var(--ink); font-size: 16px; }
#content .entry p { margin: 0 0 17px; }
#content .entry p:last-child { margin-bottom: 0; }
#content .entry img {
	max-width: 100%;
	height: auto;
	padding: 5px;
	background: #fff;
	border: 1px solid #e6edf5;
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(18, 53, 91, .12);
}
#content .entry img.left { float: left; margin: 4px 22px 14px 0; }
#content .entry img.right { float: right; margin: 4px 0 14px 22px; }
#content table { border-collapse: separate; border-spacing: 12px; }
#content td { vertical-align: middle; }
#content td img { display: block; width: min(100%, 260px); height: 190px !important; object-fit: cover; }
#content ol, #content ul { padding-left: 24px; }
#content li { margin-bottom: 7px; }
.style1, .style2 { color: var(--red) !important; font-weight: 700; }
a, a:visited { color: #ad2020 !important; }
a:hover, a:focus { color: var(--blue-deep) !important; }

#footer {
	width: 100% !important;
	padding: 18px 20px;
	background: var(--blue-deep) !important;
	border-top: 4px solid var(--red) !important;
	color: #fff !important;
}
#footer-wrap { width: min(1120px, 100%) !important; margin: auto; background: transparent !important; }
#legal { margin: 0; color: #e7eff8; font-size: 13px; text-align: center; }

@media (max-width: 640px) {
	.site-banner { min-height: 110px; }
	#menu ul { padding: 0 8px !important; }
	#menu a, #menu a:visited { padding: 12px 10px; font-size: 11px; }
	#page { width: calc(100% - 24px) !important; margin: 22px auto 32px !important; }
	#content .post { padding: 22px 19px !important; border-radius: 14px !important; }
	#content .entry img.left, #content .entry img.right { float: none; display: block; margin: 0 auto 18px; }
	#content table, #content tbody, #content tr, #content td { display: block; width: 100% !important; }
	#content td img { margin: 0 auto; }
}