/*
 * The frame: the legal strip at the foot of the page, and the navigation type in the header.
 *
 * Brief: the legal block is 12-13px / 18-20px in #6E6E73 on #F5F5F7 or #FFFFFF, headings and linked
 * labels in #1D1D1F, and "Do not reduce opacity below accessible contrast and do not hide
 * underwriting information in microtype." So it is small and quiet, and no smaller than that.
 */

.akem-legal {
	background: var(--akem-canvas);
	border-block-start: 1px solid var(--akem-line);
}

.akem-legal__inner {
	max-width: var(--theme-normal-container-max-width);
	margin-inline: auto;
	padding-block: var(--akem-space-4);
	padding-inline: var(--akem-space-3);
}

.akem-legal__line {
	margin: 0 0 var(--akem-space-2);
	font-size: 13px;
	line-height: 20px;
	color: var(--akem-grey);
}

.akem-legal__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--akem-space-1) var(--akem-space-3);
	margin-block-start: var(--akem-space-3);
}

.akem-legal__links a {
	font-size: 13px;
	line-height: 20px;
	color: var(--akem-ink);
	text-decoration: none;
}

.akem-legal__links a:hover {
	color: var(--akem-blue);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.akem-legal__links a:focus-visible {
	outline: 3px solid var(--akem-blue-focus);
	outline-offset: 2px;
}

/* Header navigation. The brief: about 15px / 20px, weight 500, generous horizontal spacing. */

.ct-header [data-id="menu"] .menu > li > a {
	font-size: 15px;
	line-height: 20px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	color: var(--akem-ink);
}

.ct-header [data-id="menu"] .menu > li > a:hover {
	color: var(--akem-blue);
}

/* Header -------------------------------------------------------------------
   Blocksy prints the logo AND the site title, so the brand appeared twice. The logo carries the
   brand name in its alt text, so the text version is the redundant one and it goes. The brief
   wants an 80px desktop header; Blocksy's default padding made it 120. */

.ct-header [data-id="logo"] .site-title,
.ct-header [data-id="logo"] .site-description {
	display: none;
}

.ct-header [data-id="logo"] img {
	width: 58px;
	height: auto;
}

.ct-header [data-row="middle"] > div {
	min-height: 80px;
}

@media (max-width: 999px) {
	.ct-header [data-id="logo"] img {
		width: 52px;
	}

	.ct-header [data-row="middle"] > div {
		min-height: 68px;
	}
}

@media (max-width: 689px) {
	.ct-header [data-id="logo"] img {
		width: 44px;
	}
}

/* Blocksy's own copyright row is hidden, because the copyright is in the legal strip above.
   Its text is not a plain theme mod - it lives inside the footer panel-builder structure, so
   setting the obvious option does nothing and the element keeps falling back to
   "WordPress Theme by" plus the theme author. Hiding it is presentation and it is honest about
   what it is; the fallback string still sits in the HTML source, unseen, until somebody clears
   that element in the customiser. Noted in the spec rather than left as a surprise. */
.ct-footer [data-column="copyright"],
.ct-footer .ct-footer-copyright {
	display: none;
}