/* whymormonsleave.com — one stylesheet, no build step, no web fonts. */
:root {
  --ink: #1b1f2a; --ink-2: #4a5062; --ink-3: #7b8194;
  --paper: #fbfaf7; --paper-2: #f2efe8; --line: #e1ddd2;
  --navy: #1f2a44; --gold: #c9a227; --gold-2: #f0c75e; --link: #1a4f8b;
  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --max: 1080px; --measure: 78ch;
}
@media (prefers-color-scheme: dark) {
  :root { --ink:#ebe9e3; --ink-2:#c0bdb4; --ink-3:#8f8c84; --paper:#15181f; --paper-2:#1d212b; --line:#2c313d; --link:#8db4e8; --navy:#0f1523; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; font: 17px/1.6 var(--sans); color:var(--ink); background:var(--paper); }
a { color: var(--link); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }
h1,h2,h3 { font-family: var(--serif); line-height:1.15; color:var(--ink); margin: 0 0 .4em; letter-spacing:-.01em; }
h1 { font-size: clamp(2rem, 4.5vw, 3rem); }
h2 { font-size: clamp(1.45rem, 2.6vw, 1.9rem); margin-top:1.6em; }
h3 { font-size: 1.2rem; }
p { margin: 0 0 1em; }
img, iframe { max-width:100%; }
table { border-collapse: collapse; width:100%; margin: 1em 0 1.5em; font-size:.95rem; }
th, td { text-align:left; padding:.5em .6em; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-family: var(--sans); font-size:.8rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-2); }
td:last-child, th:last-child { text-align:right; white-space:nowrap; }
table.mini td:last-child { font-variant-numeric: tabular-nums; }
blockquote { margin: 0; padding: .2em 0 .2em 1em; border-left: 3px solid var(--gold); color: var(--ink-2); }
blockquote footer { font-size:.9rem; color: var(--ink-3); margin-top:.4em; }
hr { border:0; border-top:1px solid var(--line); margin:2em 0; }
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 1.25rem; }
.skip { position:absolute; left:-999px; } .skip:focus { left:1rem; top:1rem; background:var(--paper); padding:.5em 1em; z-index:10; }
.muted { color: var(--ink-3); } .small { font-size:.88rem; }
.plain { list-style:none; padding:0; margin:0; } .plain li { margin:.25em 0; }
.prose { max-width: var(--measure); }
.prose ul, .prose ol { padding-left: 1.3em; } .prose li { margin:.35em 0; }
.prose h2 { font-size: 1.5rem; } .prose h3 { margin-top:1.4em; }
.prose table { font-size:.92rem; }
/* masthead */
.masthead { background: var(--navy); color:#fff; border-bottom: 3px solid var(--gold); }
.masthead-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-top:.7rem; padding-bottom:.7rem; }
.brand { display:flex; align-items:center; gap:.6rem; color:#fff; text-decoration:none; font-family: var(--serif); font-size:1.35rem; }
.brand-mark { width:26px; height:26px; border-radius:6px; background: var(--navy); border:2px solid var(--gold-2); position:relative; }
.brand-mark::after { content:""; position:absolute; inset:5px 4px; border-bottom:3px solid var(--gold-2); border-left:3px solid var(--gold-2); border-right:3px solid var(--gold-2); transform: skewX(0); clip-path: polygon(0 100%, 30% 0, 50% 60%, 70% 0, 100% 100%, 85% 100%, 70% 40%, 50% 100%, 30% 40%, 15% 100%); background: var(--gold-2); border:0; }
.nav { display:flex; gap:.15rem 1.1rem; flex-wrap:wrap; font-size:.95rem; }
.nav a { color:#e9ecf3; text-decoration:none; padding:.35em 0; border-bottom:2px solid transparent; }
.nav a:hover, .nav a[aria-current] { border-bottom-color: var(--gold-2); color:#fff; }
/* hero */
.hero { background: linear-gradient(180deg, var(--paper-2), var(--paper)); padding: 3.5rem 0 2.5rem; border-bottom:1px solid var(--line); }
.kicker, .card-kicker, .myth-label, .databox-head, .footer-head, .myth-head { font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-3); margin:0 0 .6em; font-weight:600; }
.lede { font-size: 1.22rem; line-height:1.5; color: var(--ink-2); max-width: 62ch; }
.cta-row { display:flex; gap:.7rem; flex-wrap:wrap; margin-top:1.4rem; }
.btn { display:inline-block; padding:.65em 1.1em; border:1.5px solid var(--navy); border-radius:6px; text-decoration:none; color: var(--ink); font-weight:600; font-size:.95rem; background:transparent; }
.btn.primary { background: var(--navy); color:#fff; }
.btn:hover { border-color: var(--gold); }
@media (prefers-color-scheme: dark) { .btn { border-color: var(--gold); } .btn.primary { background: var(--gold); color:#15181f; } }
/* sections */
.section { padding: 2.2rem 0 .5rem; }
.section-head { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; flex-wrap:wrap; }
.section-head h2 { margin-top:0; } .section-head p { margin:0; }
.two-col { display:grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; }
@media (max-width: 800px) { .two-col { grid-template-columns: 1fr; } }
.stat-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap:1rem; margin:1rem 0; }
.stat { background: var(--paper-2); border-radius:10px; padding:1.1rem 1.2rem; }
.stat-num { font-family: var(--serif); font-size:2.4rem; line-height:1; margin:0 0 .3em; color: var(--ink); }
.stat-label { margin:0 0 .5em; line-height:1.35; }
.stat-src { margin:0; font-size:.82rem; color: var(--ink-3); }
.card-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap:1rem; margin:1rem 0 1.5rem; }
.card { display:block; background: var(--paper-2); border:1px solid var(--line); border-radius:10px; padding:1.1rem 1.2rem; text-decoration:none; color:inherit; transition: border-color .15s; }
.card:hover { border-color: var(--gold); }
.card h3 { margin:.1em 0 .4em; } .card p { margin:0 0 .5em; color: var(--ink-2); font-size:.97rem; }
.card-stat { font-weight:600; color: var(--ink) !important; font-size:.9rem !important; }
.story-list { list-style:none; padding:0; margin:0; }
.story-list li { padding: .9rem 0; border-bottom:1px solid var(--line); }
.story-list li p { margin:.3em 0 0; color: var(--ink-2); }
.story-list.big li { padding:1.2rem 0; }
.story-list .muted { margin-left:.5em; font-size:.9rem; }
.tags a { display:inline-block; font-size:.8rem; padding:.15em .6em; border:1px solid var(--line); border-radius:999px; margin:.4em .4em 0 0; text-decoration:none; color: var(--ink-2); }
.video { position:relative; aspect-ratio:16/9; background:#000; border-radius:8px; overflow:hidden; margin:.5rem 0 1rem; }
.video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
/* pages */
.page-head { padding: 2.5rem 1.25rem 1rem; }
.article { padding: 2.5rem 1.25rem 3rem; }
.crumbs { font-size:.88rem; color: var(--ink-3); margin-bottom:1em; }
.toc { display:flex; gap:.4rem .9rem; flex-wrap:wrap; font-size:.92rem; padding:.8rem 0 1.2rem; border-bottom:1px solid var(--line); margin-bottom:1rem; }
.group { padding: 1rem 0 .5rem; } .group-blurb { color: var(--ink-2); max-width: var(--measure); }
.databox { background: var(--paper-2); border-left: 4px solid var(--gold); border-radius: 0 10px 10px 0; padding:1rem 1.25rem; margin: 1.5rem 0 2rem; max-width: var(--measure); }
.databox-big { font-family: var(--serif); font-size:3rem; line-height:1; margin:0 0 .2em; }
.churchbox { background: var(--paper-2); border-radius:10px; padding:1rem 1.25rem; margin-top:2rem; }
.churchbox h2 { margin-top:0; }
.pager { display:flex; justify-content:space-between; gap:1rem; margin-top:3rem; padding-top:1rem; border-top:1px solid var(--line); font-size:.95rem; }
.study { padding: 1.5rem 0 1rem; border-bottom:1px solid var(--line); }
.study h2 { margin-top:.5em; }
.limits { background: var(--paper-2); padding:.8rem 1rem; border-radius:8px; font-size:.95rem; }
.myth { padding: 1.5rem 0 1rem; border-bottom:1px solid var(--line); }
.myth h2 { margin-top:0; font-style: italic; }
.myth-grid { display:grid; grid-template-columns: 1.2fr 1fr; gap:2rem; }
@media (max-width: 800px) { .myth-grid { grid-template-columns: 1fr; } }
.resource-list { list-style:none; padding:0; margin:0 0 1rem; }
.resource-list li { padding:.7rem 0; border-bottom:1px solid var(--line); }
.resource-list li p { margin:.25em 0 0; color: var(--ink-2); font-size:.97rem; }
.timeline { list-style:none; padding:0; margin:1rem 0 3rem; border-left:2px solid var(--line); }
.timeline li { position:relative; padding: 0 0 1.8rem 1.6rem; }
.timeline li::before { content:""; position:absolute; left:-7px; top:.45em; width:12px; height:12px; border-radius:50%; background: var(--gold); }
.timeline h2 { font-size:1.3rem; margin:.1em 0 .3em; }
.tl-date { font-size:.85rem; color: var(--ink-3); margin:0; font-weight:600; letter-spacing:.03em; }
/* footer */
.footer { margin-top:3rem; background: var(--navy); color:#d6dae5; font-size:.93rem; }
.footer a { color:#fff; }
.footer-grid { display:grid; grid-template-columns: 1.3fr 1fr 1.3fr; gap:2rem; padding:2.5rem 1.25rem 1rem; }
@media (max-width: 800px) { .footer-grid { grid-template-columns: 1fr; } }
.footer-brand { font-family: var(--serif); font-size:1.3rem; color:#fff; margin-bottom:.4em; }
.footer-head { color:#aeb6c8; }
.footer-legal { padding: .5rem 1.25rem 2rem; font-size:.82rem; color:#9aa3b8; }
/* charts (inline SVG built by maker/charts.py) */
:root { --viz-1:#2a78d6; --viz-2:#eb6834; --viz-3:#1baf7a; --viz-grid:#e6e3db; }
@media (prefers-color-scheme: dark) { :root { --viz-1:#3987e5; --viz-2:#d95926; --viz-3:#199e70; --viz-grid:#2c313d; } }
.viz { width:100%; height:auto; display:block; font-family: var(--sans); }
.viz-grid { stroke: var(--viz-grid); stroke-width:1; }
.viz-axis { fill: var(--ink-3); font-size:11px; }
.viz-label { fill: var(--ink); font-size:12.5px; }
.viz-value { fill: var(--ink-2); font-size:12px; font-weight:600; font-variant-numeric: tabular-nums; }
.viz-value.small { font-size:10.5px; }
.viz-bar { fill: var(--viz-1); }
.viz-mark:hover .viz-bar, .viz-mark:hover rect { opacity:.8; }
.viz-legend { display:flex; gap:1.2rem; flex-wrap:wrap; font-size:.85rem; color: var(--ink-2); margin:.4rem 0 .2rem; }
.viz-key i { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:.4em; vertical-align:-1px; }
.viz-wrap { background: var(--paper-2); border-radius:10px; padding:1rem 1.1rem .6rem; margin:1rem 0 1.5rem; }
.viz-wrap h3 { margin:0 0 .2em; font-family: var(--sans); font-size:1rem; }
.viz-wrap .viz-sub { margin:0 0 .6em; font-size:.88rem; color: var(--ink-3); }
.viz-wrap details { font-size:.85rem; margin-top:.4rem; } .viz-wrap summary { cursor:pointer; color: var(--ink-2); }
.viz-wrap details table { font-size:.85rem; margin:.5rem 0 0; }
/* three-layer format and voices */
.layers { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; margin: 1.5rem 0; }
@media (max-width: 800px) { .layers { grid-template-columns: 1fr; } }
.layer { border-radius:10px; padding:1rem 1.2rem; }
.layer p:last-child { margin:0; }
.layer-head { font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700; margin:0 0 .5em; }
.layer.taught { background: var(--paper-2); color: var(--ink-2); font-style: italic; }
.layer.taught .layer-head { color: var(--ink-3); font-style: normal; }
.layer.found { background: var(--navy); color:#eef1f7; }
.layer.found .layer-head { color: var(--gold-2); }
.voices { margin-top: 2.5rem; max-width: var(--measure); }
.voice { margin: 0 0 1.4rem; padding: 0 0 0 1.1rem; border-left: 3px solid var(--gold); }
.voice p { font-family: var(--serif); font-size:1.12rem; line-height:1.5; color: var(--ink); margin:0 0 .4em; }
.voice footer { font-size:.88rem; color: var(--ink-2); }
.voice footer .muted { margin: 0 .3em; }
/* audience paths */
.paths { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:.8rem; margin-top:1.6rem; }
.path { display:flex; flex-direction:column; gap:.2rem; padding:.9rem 1rem; border:1.5px solid var(--line); border-radius:10px; text-decoration:none; color:inherit; background: var(--paper); }
.path:hover { border-color: var(--gold); }
.path-who { font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-3); font-weight:700; }
.path-what { font-weight:600; line-height:1.3; }
/* the shelf */
.shelf-section { padding-bottom: 1.5rem; }
.shelf { display:flex; align-items:flex-end; gap:4px; overflow-x:auto; padding: 1.2rem .4rem 0; scrollbar-width: thin; }
.book { flex: 0 0 auto; width: 40px; height: 150px; border:0; border-radius: 3px 3px 0 0; cursor:pointer; position:relative; color:#fff; padding:0;
        box-shadow: inset -3px 0 0 rgba(0,0,0,.18), inset 2px 0 0 rgba(255,255,255,.18); transition: transform .15s; }
.book.mid { height: 180px; } .book.tall { height: 210px; }
.book:hover, .book:focus-visible { transform: translateY(-8px); outline:none; }
.book.open { transform: translateY(-12px); box-shadow: 0 0 0 3px var(--gold), inset -3px 0 0 rgba(0,0,0,.18); }
.spine { position:absolute; left:50%; bottom:12px; transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl; font-size:.78rem; font-weight:600; letter-spacing:.02em; white-space:nowrap; max-height: calc(100% - 24px); overflow:hidden; text-overflow:ellipsis; }
.shelf-board { height:14px; background: linear-gradient(180deg, #8b5e34, #6b4423); border-radius:2px; box-shadow: 0 6px 12px rgba(0,0,0,.15); margin-top:0; }
@media (prefers-color-scheme: dark) { .shelf-board { background: linear-gradient(180deg, #7a4f2a, #4d2f18); } }
.g-founding { background:#2f5d8a; } .g-history { background:#6a4c93; } .g-doctrine { background:#1f7a72; }
.g-people { background:#b4532a; } .g-experience { background:#8a7a2e; } .g-minor { background:#6d7480; }
.shelf-key { display:flex; gap:.5rem 1rem; flex-wrap:wrap; font-size:.82rem; margin:.9rem 0 0; align-items:center; }
.shelf-key .key { padding:.15em .6em; border-radius:999px; color:#fff; }
.shelf-panel { margin-top:1.2rem; background: var(--paper-2); border-radius:12px; padding:1.2rem 1.4rem; border:1px solid var(--line); }
.shelf-card h3 { font-size:1.5rem; margin:.1em 0 .3em; }
.shelf-card .layers { margin: .8rem 0 1rem; }
.shelf-meta { margin:0; color: var(--ink-2); }
.voice-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap:1.2rem 2rem; margin-top:.5rem; }
.tl-mini { list-style:none; padding:0; margin:0 0 .8rem; }
.tl-mini li { padding:.4rem 0; border-bottom:1px solid var(--line); }
.tl-mini .tl-date { display:block; }
/* guess-then-reveal */
.guess { background: var(--paper-2); border-radius:12px; padding:1.2rem 1.4rem 1rem; margin: 1rem 0 2rem; }
.guess h2 { margin-top:0; }
.guess-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap:.5rem; margin:.8rem 0; }
.guess-item { display:grid; grid-template-columns: 1fr auto; align-items:center; gap:.2rem .6rem; text-align:left; padding:.6rem .8rem; border:1.5px solid var(--line); border-radius:8px; background: var(--paper); color: var(--ink); cursor:pointer; font: inherit; }
.guess-item:hover { border-color: var(--gold); }
.guess-item.picked { border-color: var(--navy); box-shadow: inset 0 0 0 1px var(--navy); }
.guess-label { grid-column: 1; }
.guess-pct { grid-column: 2; grid-row: 1; font-weight:700; font-variant-numeric: tabular-nums; visibility:hidden; }
.guess-bar { grid-column: 1 / -1; height:6px; background: var(--line); border-radius:3px; overflow:hidden; visibility:hidden; }
.guess-bar i { display:block; height:100%; background: var(--viz-1); border-radius:3px; }
.revealed .guess-pct, .revealed .guess-bar { visibility:visible; }
.revealed .guess-item.top { border-color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.revealed .guess-item.picked:not(.top) { opacity:.75; }
.guess-actions { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
/* images: small, subordinate to the text */
.side-img { float:right; margin: .2rem 0 1rem 1.5rem; width: 32%; }
.side-img img { width:100%; height:auto; display:block; border-radius:8px; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.side-img figcaption { font-size:.72rem; color: var(--ink-3); margin-top:.35rem; line-height:1.35; }
.side-img figcaption a { color: var(--ink-3); }
@media (max-width: 640px) { .side-img { float:none; width:100%; max-width: 100% !important; margin: 1rem 0; } .side-img img { max-height: 260px; width:auto; max-width:100%; } }
.databox { clear: none; }
.banner { margin: 1rem 0 1.5rem; }
.banner img { width:100%; height:auto; max-height: 190px; object-fit: cover; border-radius:10px; display:block; }
.banner figcaption { font-size:.75rem; color: var(--ink-3); margin-top:.35rem; }
.banner figcaption a { color: var(--ink-3); }
.with-thumb { display:grid; grid-template-columns: 150px 1fr; gap: 1rem; align-items:start; }
@media (max-width: 560px) { .with-thumb { grid-template-columns: 96px 1fr; gap:.7rem; } }
.thumb img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:6px; display:block; background: var(--paper-2); }
.img-card { padding:0; overflow:hidden; }
.img-card img { width:100%; height:120px; object-fit:cover; object-position: center top; display:block; }
.img-card h3, .img-card p { margin-left:1.2rem; margin-right:1.2rem; }
.img-card h3 { margin-top:.8rem; } .img-card p:last-child { margin-bottom:1rem; }
.voice.has-still { display:grid; grid-template-columns: 120px 1fr; gap: .2rem 1rem; }
.voice.has-still p, .voice.has-still footer { grid-column: 2; }
.voice .still { grid-column: 1; grid-row: 1 / span 2; position:relative; display:block; }
.voice .still img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:6px; display:block; }
.voice .still .play { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem; text-shadow:0 1px 6px rgba(0,0,0,.6); }
@media (max-width: 560px) { .voice.has-still { grid-template-columns: 90px 1fr; } }
.shelf-card-head { display:grid; grid-template-columns: 160px 1fr; gap:1rem; align-items:center; }
.shelf-card-head img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; object-position:center top; border-radius:6px; display:block; }
@media (max-width: 640px) { .shelf-card-head { grid-template-columns: 1fr; } .shelf-card-head img { max-width: 240px; } }
/* home quotes: still sits small at top-left, text keeps the full width */
.voice-grid .voice.has-still { display:block; }
.voice-grid .voice .still { float:left; width:104px; margin: .25rem .9rem .2rem 0; }
.voice-grid .voice.has-still p, .voice-grid .voice.has-still footer { grid-column:auto; }
.voice-grid .voice footer { clear:both; }
/* timeline: church discipline */
.timeline li.discipline::before { background: #b4532a; }
.tl-tag { display:inline-block; font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:#b4532a; border-radius:999px; padding:.1em .6em; margin-left:.5em; vertical-align:middle; }
.tl-filter { margin: .5rem 0 0; } .small-btn { padding:.4em .8em; font-size:.85rem; }
.btn[aria-pressed="true"] { background: var(--navy); color:#fff; }
@media (prefers-color-scheme: dark) { .btn[aria-pressed="true"] { background: var(--gold); color:#15181f; } }

.rec-list li { padding:.6rem 0; }
.rec-list .small { margin:.2em 0 0; }
.recommended { margin-top:1.5rem; }
.whatnow .paths { margin-top:1rem; }
/* recommended episodes: cards with click-to-play video */
.rec-grid { list-style:none; padding:0; margin:.6rem 0 .8rem; display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap:1.1rem 1.2rem; }
.rec-card { border:1px solid var(--line); border-radius:10px; overflow:hidden; background: var(--paper-2); }
.rec-body { padding:.7rem .9rem .8rem; }
.rec-body strong { font-size:.97rem; line-height:1.3; display:block; }
.rec-body p { margin:.35em 0 0; }
.rec-thumb img, .yt img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; display:block; background:#000; }
.yt { position:relative; aspect-ratio:16/9; background:#000; }
.yt iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.yt-play { position:absolute; inset:0; width:100%; height:100%; border:0; background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.35)); cursor:pointer; padding:0; }
.yt-play span { position:absolute; left:50%; top:50%; width:54px; height:38px; margin:-19px 0 0 -27px; border-radius:10px; background: rgba(20,20,20,.82); }
.yt-play span::after { content:""; position:absolute; left:21px; top:10px; border-style:solid; border-width:9px 0 9px 16px; border-color: transparent transparent transparent #fff; }
.yt-play:hover span, .yt-play:focus-visible span { background:#e62117; }
.recommended h2 { margin-top:1.8em; }
/* timeline media */
.tl-media { float:right; width: 300px; margin: 0 0 .8rem 1.4rem; }
.tl-media img { width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:8px; display:block; background:#000; }
.tl-media .yt { border-radius:8px; overflow:hidden; }
.tl-media figcaption { font-size:.76rem; color: var(--ink-3); margin-top:.3rem; line-height:1.3; }
.timeline li { overflow:hidden; }
@media (max-width: 640px) { .tl-media { float:none; width:100%; max-width:360px; margin: .4rem 0 .8rem; } }
/* list rows never collapse into the thumbnail column when an image is missing */
.with-thumb > div { grid-column: 2; }
.with-thumb:not(:has(.thumb)) { grid-template-columns: 1fr; }
.with-thumb:not(:has(.thumb)) > div { grid-column: 1; }
/* common questions */
.faq { max-width: var(--measure); }
.faq-item { border-bottom:1px solid var(--line); padding:.6rem 0; }
.faq-item summary { cursor:pointer; list-style:none; display:flex; align-items:baseline; gap:.6rem; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::before { content:"+"; color: var(--gold); font-weight:700; font-size:1.3rem; line-height:1; }
.faq-item[open] summary::before { content:"–"; }
.faq-item summary h3 { margin:0; font-size:1.15rem; }
.faq-item .prose { padding: .4rem 0 .4rem 1.4rem; }
.prose img.portrait-right { float:right; width: 38%; max-width: 320px; margin: .2rem 0 1rem 1.5rem; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
@media (max-width: 640px) { .prose img.portrait-right { float:none; width:100%; max-width:360px; display:block; margin:1rem 0; } }
