/* Guide blocks (1.21.0): "En bref" box, checklist, FAQ. */

/* All three blocks keep to the 720 px text column. */
.sc-brief, .sc-checklist, .sc-faq { box-sizing: border-box; max-width: 720px; margin-left: auto; margin-right: auto; }

/* En bref: framed box, heading in the home-quote style (serif italic). */
.sc-brief { border: 1px solid #111; background: #f6f6f6; padding: 28px 32px 24px; margin: 36px auto 44px; }
.sc-brief .sc-brief__title { font-family: var(--sc-font-head); font-style: italic; font-weight: 500; font-variation-settings: "opsz" 12; font-size: 1.75rem; line-height: 1.2; margin: 0 0 14px; }
.sc-brief ul { margin: 0; padding: 0; list-style: none; }
.sc-brief li { position: relative; padding-left: 26px; margin: 0 0 10px; line-height: 1.6; }
.sc-brief li:last-child { margin-bottom: 0; }
.sc-brief li::before { content: ""; position: absolute; left: 2px; top: 0.72em; width: 12px; height: 1px; background: #111; }

/* Checklist: dark card with square boxes; a tap ticks an item (kept on this device only). */
.sc-checklist { background: #111; color: #fff; padding: 32px 32px 26px; margin: 44px auto; }
.sc-checklist .sc-checklist__title { font-family: var(--sc-font-head); font-size: 1.75rem; line-height: 1.2; margin: 0 0 6px; color: #fff; }
.sc-checklist .sc-checklist__hint { font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: #bdbdbd; margin: 0 0 20px; }
.sc-checklist ul { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.sc-checklist li { position: relative; padding: 12px 0 12px 40px; border-top: 1px solid rgba(255, 255, 255, 0.18); line-height: 1.5; cursor: pointer; user-select: none; transition: color 0.2s; }
.sc-checklist li:first-child { border-top: 0; }
.sc-checklist li::before { content: ""; position: absolute; left: 0; top: 13px; width: 20px; height: 20px; border: 1.5px solid #fff; box-sizing: border-box; }
.sc-checklist li::after { content: ""; position: absolute; left: 7px; top: 15px; width: 6px; height: 11px; border: solid #111; border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; }
.sc-checklist li.is-done { color: #9a9a9a; text-decoration: line-through; text-decoration-thickness: 1px; }
.sc-checklist li.is-done::before { background: #fff; }
.sc-checklist li.is-done::after { opacity: 1; }
.sc-checklist li:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* FAQ: questions as small serif headings with a rule between them. */
.sc-faq { margin: 56px auto 40px; }
.sc-faq h2 { margin: 0 0 8px; }
.sc-faq h3 { font-size: 1.25rem; line-height: 1.35; margin: 0; padding: 22px 0 8px; border-top: 1px solid var(--sc-line, #e5e5e5); }
.sc-faq h3:first-of-type { border-top: 0; }
.sc-faq p { margin: 0 0 4px; }

@media (max-width: 767px) {
	.sc-brief { padding: 22px 20px 20px; }
	.sc-brief .sc-brief__title, .sc-checklist .sc-checklist__title { font-size: 1.5rem; }
	.sc-checklist { padding: 26px 20px 20px; }
}
@media print {
	.sc-checklist { background: none; color: #000; border: 1px solid #000; }
	.sc-checklist li::before { border-color: #000; }
}
