/*
 * Sage SEO legal article layout (1.0.0-rc.15). Loaded only on Sage SEO legal
 * articles with the layout on; every rule is scoped to body.sage-seo-legal, so
 * the site's header, navigation, footer and other pages are not affected.
 */

body.sage-seo-legal {
	--sage-legal-width: 960px;
	--sage-legal-accent: #0b4f8a;
	--sage-legal-text: #1d2733;
	--sage-legal-heading: #0f2236;
	--sage-legal-muted: #5b6875;
	--sage-legal-rule: #dde3ea;
	--sage-legal-tint: #f3f6f9;
}

/* ---- One centred column, no sidebar (Divi, then common theme structures). */
body.sage-seo-legal #sidebar,
body.sage-seo-legal #main-content .container::before,
body.sage-seo-legal #secondary,
body.sage-seo-legal aside.widget-area,
body.sage-seo-legal .sidebar,
body.sage-seo-legal .post-sidebar {
	display: none !important;
}

body.sage-seo-legal #main-content #left-area,
body.sage-seo-legal #primary,
body.sage-seo-legal .content-area,
body.sage-seo-legal main .site-main {
	float: none !important;
	width: 100% !important;
	max-width: var(--sage-legal-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.sage-seo-legal #main-content .container {
	padding-top: 48px;
}

/* ---- The theme's post details, featured image (shown by the article), sharing, navigation and comments. */
body.sage-seo-legal .et_post_meta_wrapper .post-meta,
body.sage-seo-legal .et_post_meta_wrapper > img,
body.sage-seo-legal .et_post_meta_wrapper .et_post_meta_wrapper_image,
body.sage-seo-legal article .entry-meta,
body.sage-seo-legal article .entry-footer,
body.sage-seo-legal article .post-meta,
body.sage-seo-legal article .byline,
body.sage-seo-legal article .author-info,
body.sage-seo-legal .author-box,
body.sage-seo-legal .post-navigation,
body.sage-seo-legal .nav-single,
body.sage-seo-legal #comment-wrap,
body.sage-seo-legal #comments,
body.sage-seo-legal .comments-area,
body.sage-seo-legal .comment-respond,
body.sage-seo-legal .et_social_inline,
body.sage-seo-legal .sharedaddy {
	display: none !important;
}

/* ---- Title (the theme's own heading). */
body.sage-seo-legal .et_post_meta_wrapper h1.entry-title,
body.sage-seo-legal article h1.entry-title {
	color: var(--sage-legal-heading);
	font-size: clamp(1.85rem, 1.3rem + 2vw, 2.6rem);
	line-height: 1.2;
	font-weight: 700;
	margin: 0 0 0.4em;
	padding: 0;
	letter-spacing: -0.01em;
}

/* ---- The article. */
body.sage-seo-legal .sage-seo-legal-article {
	color: var(--sage-legal-text);
	font-size: 18px;
	line-height: 1.7;
	max-width: var(--sage-legal-width);
	margin: 0 auto;
}

body.sage-seo-legal .sage-seo-legal-article p,
body.sage-seo-legal .sage-seo-legal-article li {
	color: var(--sage-legal-text);
	font-size: 1em;
	line-height: 1.7;
}

body.sage-seo-legal .sage-seo-legal-article p {
	margin: 0 0 1.05em;
	padding: 0;
}

body.sage-seo-legal .sage-seo-legal-body > p:first-of-type,
body.sage-seo-legal .sage-seo-legal-body > .sage-seo-legal-jurisdiction + p {
	font-size: 1.12em;
	line-height: 1.6;
}

body.sage-seo-legal .sage-seo-legal-article h2,
body.sage-seo-legal .sage-seo-legal-article h3 {
	color: var(--sage-legal-heading);
	font-weight: 700;
	line-height: 1.3;
	padding: 0;
}

body.sage-seo-legal .sage-seo-legal-article h2 {
	font-size: 1.5em;
	margin: 1.9em 0 0.55em;
}

body.sage-seo-legal .sage-seo-legal-article h3 {
	font-size: 1.15em;
	margin: 1.5em 0 0.4em;
}

body.sage-seo-legal .sage-seo-legal-article ul,
body.sage-seo-legal .sage-seo-legal-article ol {
	margin: 0 0 1.2em 1.25em;
	padding: 0;
	list-style-position: outside;
}

body.sage-seo-legal .sage-seo-legal-article ul { list-style-type: disc; }

body.sage-seo-legal .sage-seo-legal-article li {
	margin: 0 0 0.45em;
	padding: 0;
}

body.sage-seo-legal .sage-seo-legal-article a {
	color: var(--sage-legal-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ---- Details line. */
body.sage-seo-legal .sage-seo-legal-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	font-size: 0.85em;
	color: var(--sage-legal-muted);
	margin: 0 0 1.6em;
}

body.sage-seo-legal .sage-seo-legal-meta span,
body.sage-seo-legal .sage-seo-legal-meta time {
	color: var(--sage-legal-muted);
}

body.sage-seo-legal .sage-seo-legal-meta .sage-seo-legal-area {
	display: inline-block;
	background: var(--sage-legal-tint);
	color: var(--sage-legal-accent);
	border: 1px solid var(--sage-legal-rule);
	border-radius: 999px;
	padding: 2px 12px;
	font-weight: 600;
}

body.sage-seo-legal .sage-seo-legal-sep { color: #a3adb7; }

/* ---- Featured image. */
body.sage-seo-legal .sage-seo-legal-hero {
	margin: 0 0 2em;
}

body.sage-seo-legal .sage-seo-legal-hero img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 460px;
	object-fit: cover;
	border-radius: 10px;
}

body.sage-seo-legal .sage-seo-legal-hero figcaption,
body.sage-seo-legal .sage-seo-legal-article figcaption {
	font-size: 0.78em;
	color: var(--sage-legal-muted);
	margin-top: 6px;
}

body.sage-seo-legal .sage-seo-legal-article figure img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

/* ---- Jurisdiction note (articles from earlier versions). */
body.sage-seo-legal .sage-seo-legal-jurisdiction {
	font-size: 0.9em !important;
	color: var(--sage-legal-muted) !important;
	border-left: 3px solid var(--sage-legal-rule);
	padding-left: 12px !important;
}

/* ---- Rights, conditions and time limits. */
body.sage-seo-legal .sage-seo-keypoints {
	background: var(--sage-legal-tint);
	border-left: 4px solid var(--sage-legal-accent);
	border-radius: 0 8px 8px 0;
	padding: 18px 22px 8px;
	margin: 1.8em 0;
}

body.sage-seo-legal .sage-seo-keypoints h2 {
	font-size: 1.15em;
	margin: 0 0 0.5em;
}

/* ---- Find a solicitor. */
body.sage-seo-legal .sage-seo-legal-cta {
	background: var(--sage-legal-accent);
	color: #fff;
	border-radius: 12px;
	padding: 30px 32px;
	margin: 2.4em 0 2em;
}

body.sage-seo-legal .sage-seo-legal-cta .sage-seo-legal-cta__heading {
	color: #fff;
	font-size: 1.4em;
	margin: 0 0 0.4em;
}

body.sage-seo-legal .sage-seo-legal-cta .sage-seo-legal-cta__text {
	color: #eef4fa;
	margin: 0 0 1.1em;
	max-width: 46em;
}

body.sage-seo-legal .sage-seo-legal-cta__action { margin: 0 !important; }

body.sage-seo-legal .sage-seo-legal-cta a.sage-seo-legal-cta__button {
	display: inline-block;
	background: #fff;
	color: var(--sage-legal-accent);
	font-weight: 700;
	text-decoration: none;
	border-radius: 8px;
	padding: 13px 26px;
	line-height: 1.3;
}

body.sage-seo-legal .sage-seo-legal-cta a.sage-seo-legal-cta__button:hover,
body.sage-seo-legal .sage-seo-legal-cta a.sage-seo-legal-cta__button:focus {
	background: #e8f0f8;
	text-decoration: underline;
}

body.sage-seo-legal .sage-seo-legal-cta a.sage-seo-legal-cta__button:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 3px;
}

/* ---- Sources and disclaimer. */
body.sage-seo-legal .sage-seo-legal-end {
	border-top: 1px solid var(--sage-legal-rule);
	margin-top: 2em;
	padding-top: 0.6em;
	font-size: 0.86em;
}

body.sage-seo-legal .sage-seo-legal-end h2 {
	font-size: 1.05em;
	margin: 1em 0 0.5em;
}

body.sage-seo-legal .sage-seo-legal-end p,
body.sage-seo-legal .sage-seo-legal-end li {
	color: var(--sage-legal-muted);
	font-size: 1em;
	line-height: 1.55;
}

body.sage-seo-legal .sage-seo-legal-end li { margin-bottom: 0.3em; }

/* ---- Related articles. */
body.sage-seo-legal .sage-seo-legal-related {
	margin-top: 2.4em;
	border-top: 1px solid var(--sage-legal-rule);
	padding-top: 1.2em;
}

/* ---- Phones. */
@media (max-width: 767px) {
	body.sage-seo-legal #main-content .container { padding-top: 24px; width: 90% !important; }
	body.sage-seo-legal .sage-seo-legal-article { font-size: 17px; }
	body.sage-seo-legal .sage-seo-legal-article h2 { font-size: 1.32em; }
	body.sage-seo-legal .sage-seo-legal-cta { padding: 22px 20px; }
	body.sage-seo-legal .sage-seo-legal-cta a.sage-seo-legal-cta__button { display: block; text-align: center; }
	body.sage-seo-legal .sage-seo-legal-hero img { max-height: 260px; }
}

body.sage-seo-legal .sage-seo-legal-related .sage-seo-legal-related__title {
	font-size: 1.15em;
	margin: 0 0 0.6em;
}

body.sage-seo-legal .sage-seo-legal-related .sage-seo-legal-related__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

body.sage-seo-legal .sage-seo-legal-related .sage-seo-legal-related__list li {
	padding: 10px 0;
	border-bottom: 1px solid var(--sage-legal-rule);
	margin: 0;
}

body.sage-seo-legal .sage-seo-legal-related .sage-seo-legal-related__list a {
	font-weight: 600;
	text-decoration: none;
}
