/*
 * SEO content sections (the editable "sb-seo" block groups added to the ten main pages).
 * Reuses the site's navy, gold and ivory tokens; sits below each page's approved hero and sections.
 */

.page-content > .sb-seo.sb-seo,
.sb-seo { max-width: none; margin: 0; padding: var(--sb-section-sm, clamp(2.25rem, 4.5vw, 3.75rem)) 0; background: var(--sb-ivory, #f8f7f3); }

/* Same container as the other page sections (.bs-wrap), so every block shares one left edge. */
.sb-seo__inner { max-width: 1340px; margin-inline: auto; padding-inline: clamp(1.1rem, 3.6vw, 3.4rem); }
.sb-seo__block + .sb-seo__block { margin-top: clamp(2.2rem, 4vw, 3.4rem); padding-top: clamp(2.2rem, 4vw, 3.4rem); border-top: 1px solid rgba(7, 27, 64, 0.1); }

.sb-seo .sb-kicker { display: flex; align-items: center; gap: 0.8rem; margin: 0 0 0.9rem; color: #8a6422; font-size: 0.76rem; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; }
.sb-seo .sb-kicker::before { content: ""; width: 2rem; height: 1.5px; background: currentColor; }

.sb-seo h2 { max-width: 34ch; margin: 0 0 1.1rem; font-family: "Playfair Display", var(--sb-serif, serif); font-size: clamp(1.5rem, 2.4vw, 2.1rem); font-weight: 600; line-height: 1.2; color: #071b40; }
.sb-seo h3 { margin: 0 0 0.6rem; font-size: 1.05rem; font-weight: 600; line-height: 1.35; color: #071b40; }
.sb-seo p { max-width: 54rem; margin: 0 0 1rem; color: #3b4d68; font-size: 1rem; line-height: 1.75; }
.sb-seo a { color: #8a6422; font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }
.sb-seo a:hover, .sb-seo a:focus-visible { color: #071b40; }
.sb-seo strong { color: #071b40; font-weight: 600; }

.sb-seo__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: var(--sb-gap, 1.25rem); margin: 1.6rem 0; }
.sb-seo__card { position: relative; padding: var(--sb-card-pad, 1.4rem); border: 1px solid rgba(7, 27, 64, 0.08); border-top: 3px solid #b88635; border-radius: 12px; background: #fff; box-shadow: 0 18px 40px -32px rgba(7, 27, 64, 0.45); }
.sb-seo__card p { margin-bottom: 0.4rem; font-size: 0.95rem; line-height: 1.65; }

.sb-seo ul, .sb-seo ol { margin: 0 0 1.1rem; padding: 0; list-style: none; max-width: 54rem; }
.sb-seo ul li, .sb-seo ol li { position: relative; margin: 0 0 0.55rem; padding-left: 1.5rem; color: #3b4d68; font-size: 0.98rem; line-height: 1.65; }
.sb-seo ul li::before { content: ""; position: absolute; left: 0.1rem; top: 0.72em; width: 0.45rem; height: 0.45rem; border-radius: 50%; background: #b88635; }
.sb-seo ol { counter-reset: sbseo; }
.sb-seo ol li { counter-increment: sbseo; padding-left: 2.2rem; }
.sb-seo ol li::before { content: counter(sbseo); position: absolute; left: 0; top: 0.1em; display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; background: #071b40; color: #fff; font-size: 0.74rem; font-weight: 600; line-height: 1; }
.sb-seo__card ul { margin: 0.2rem 0 0.4rem; }
.sb-seo__card li { font-size: 0.93rem; }

@media (max-width: 599px) {
	.sb-seo__card { padding: 1.15rem 1.1rem; }
	.sb-seo h2 { font-size: 1.45rem; }
}

@media (min-width: 700px) {
	/* Four cards sit best as 2 x 2 rather than 3 + 1. */
	.sb-seo__grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
