/* JSPA Law theme styles. Values come from the rendered 2024 site (.context/visual-reference/)
   and Elementor kit 51 (post-51.css). Component styles live in header.css, footer.css, and patterns.css. */

body { margin: 0; overflow-x: hidden; }

/* In-page links (the "FREE CASE EVALUATION" buttons jump to the footer form) scroll smoothly,
   unless the visitor asks for reduced motion. */
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
#consultation { scroll-margin-top: 20px; }
.site-main { margin-block-start: 0; }
.site-main > .wp-block-post-content { margin-block-start: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* Text: Montserrat for running copy, as rendered. */
.site-main p,
.site-main li { font-family: var(--wp--preset--font-family--body); }
/* Link hover and focus: an underline plus a colour with at least 4.5:1 contrast (WCAG 1.4.1, 1.4.3).
   Red #9E1C32 on white is 7.88:1. On dark backgrounds use rose #F2B8C2: 9.74:1 on ink, 5.02:1 on #4F4C4D. */
:root { --jspa-link-on-dark: #f2b8c2; }
.site-main a:where(:hover, :focus-visible) { color: var(--wp--preset--color--red); text-decoration: underline; text-underline-offset: 3px; }
.site-main :is(.is-photo-bg, .faq-split, .wp-block-cover, .why-card) a:where(:hover, :focus-visible) { color: var(--jspa-link-on-dark); }

/* Headings: Plantin MT Pro with a tight line height (rendered 1.0). */
h1, h2, h3, h5, h6 { line-height: 1; }
h4 { line-height: 1.1; }

/* Buttons: red, Open Sans 600, 17 x 24 px at desktop; 14 px at tablet; 12 px at mobile (kit 51). */
.wp-element-button,
.wp-block-button__link { border-radius: 0; transition: background-color 0.3s, color 0.3s; }
.site-main .wp-block-button__link:hover,
.site-main .wp-block-button__link:focus { background: var(--wp--preset--color--light); color: var(--wp--preset--color--red); }
@media (max-width: 1024.98px) {
	.site-main .wp-block-button__link { font-size: 14px; padding: 14px 20px; }
}
@media (max-width: 767.98px) {
	.site-main .wp-block-button__link { font-size: 12px; padding: 11px 12px 10px; }
}

/* Short red separator (63 x 2 px), the divider under section titles. */
.wp-block-separator.is-style-jspa-short {
	width: 63px !important;
	margin: 20px auto;
	border: 0;
	border-top: 2px solid var(--wp--preset--color--red);
	opacity: 1;
}
/* Thin full-width line (an Elementor divider with no width), as the top line of the FAQ questions. */
.wp-block-separator.is-style-jspa-rule { width: 100% !important; margin: 0; border: 0; border-top: 1px solid #e1e1e1; opacity: 1; }
.faq-split .wp-block-separator.is-style-jspa-rule,
.is-photo-bg .wp-block-separator.is-style-jspa-rule { border-top-color: rgba(255, 255, 255, 0.25); }
.wp-block-separator.is-style-jspa-short.alignleft,
.has-text-align-left + .wp-block-separator.is-style-jspa-short { margin-left: 0; }

/* Page hero without a background image (404). */
.page-hero--plain { background: var(--wp--preset--color--ink); padding: 200px 25px 100px; }
.page-hero--plain h1 { color: var(--wp--preset--color--white); margin: 0; }
.site-404 { padding: 60px 25px; }