/* Spread guides and contextual links use the site's existing semantic theme colours. */
.spread-page-intro{max-width:760px;margin:0 auto;padding:16px 0 24px}
.spread-page-intro h1{font-size:clamp(32px,4.3vw,48px);line-height:1.14;letter-spacing:-.035em;margin:18px 0 12px}
.spread-page-intro>p{max-width:58ch;margin-inline:auto;font-size:17px;line-height:1.65}
.spread-breadcrumb{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;color:var(--muted);font-size:12px;line-height:1.6}
.spread-breadcrumb a{color:var(--blue)}
.spread-page-intro .intro-context{font-size:13px;line-height:1.8}
.spread-page-intro .intro-context a{white-space:nowrap;margin-left:6px;color:var(--blue)}
.spread-page-guide,.spread-next-links{max-width:700px;margin:56px auto 0;padding-top:28px;border-top:1px solid var(--line)}
.spread-page-guide h2,.spread-next-links h2,.home-spreads h2,.guide-spread-options h2{font-size:clamp(25px,3vw,30px);line-height:1.25;margin:0 0 18px}
.spread-page-guide h3{font:500 17px/1.5 var(--sans);margin:28px 0 12px}
.spread-page-guide p{font-size:15px;line-height:1.8;color:var(--muted);margin:0 0 16px;overflow-wrap:anywhere}
.spread-example{padding:20px 24px;margin:24px 0 30px;border-radius:14px;background:var(--surface-soft)}
.spread-example h3{margin:0 0 10px;font-size:14px;color:var(--muted)}
.spread-example .spread-example-question{color:var(--ink);font:22px/1.4 var(--serif);margin-bottom:14px}
.spread-example a,.spread-library-link a{font-size:14px;color:var(--blue)}
.spread-positions{margin:0 0 28px;padding:0;list-style:none;counter-reset:spread-position;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 26px}
.spread-positions li{counter-increment:spread-position;position:relative;padding-left:30px;min-width:0}
.spread-positions li::before{content:counter(spread-position);position:absolute;left:0;top:2px;font:14px/1.5 var(--sans);color:var(--blue)}
.spread-positions li:only-child{grid-column:1/-1}
.spread-positions h4{font:500 15px/1.6 var(--sans);margin:0 0 5px;color:var(--ink)}
.spread-positions p{font-size:14px;margin:0}
.spread-page-guide .spread-limit{padding-left:16px;border-left:2px solid var(--border-strong);font-size:14px}
.spread-next-links ul,.guide-spread-options ul{padding:0;margin:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px}
.spread-next-links a,.guide-spread-options a{display:block;padding:5px 0;font-size:14px;line-height:1.6;color:var(--blue);overflow-wrap:anywhere}
.spread-next-links{margin-top:32px}
.home-spreads{max-width:880px;margin:56px auto 0;padding-top:28px;border-top:1px solid var(--line)}
.home-spreads>p,.guide-spread-options>p{font-size:15px;line-height:1.7;color:var(--muted);margin:0 0 20px}
.home-spreads ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0}
.home-spreads li{min-width:0}
.home-spreads li>a{display:block;height:100%;padding:17px 18px;border:1px solid var(--line);border-radius:12px;font-size:15px;line-height:1.5;text-decoration:none;color:var(--ink);background:var(--surface)}
.home-spreads li>a:hover{border-color:var(--border-strong);background:var(--surface-soft)}
.home-spreads li>a>span{display:block;font-size:13px;line-height:1.6;color:var(--muted);margin-top:7px}
.spread-context-link{padding:14px 16px;margin-top:24px!important;border-left:2px solid var(--border-strong);background:var(--surface-soft);font-size:15px;line-height:1.7}
.spread-context-link a{color:var(--blue)}
.guide-spread-options{margin:24px 0 0;padding:24px 0 0;border-top:1px solid var(--line);text-align:left}
.guide-spread-options h2{font-size:25px}
.reading-active .spread-page-guide,.reading-active .spread-next-links,.reading-active .home-spreads{display:none}
@media(max-width:760px){.home-spreads ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){
 .spread-page-intro{padding-top:10px}
 .spread-page-intro h1{font-size:34px}
 .spread-page-intro>p{font-size:16px}
 .spread-breadcrumb{font-size:11px}
 .spread-page-guide,.spread-next-links,.home-spreads{margin-top:36px;padding-top:24px}
 .spread-positions,.spread-next-links ul,.guide-spread-options ul,.home-spreads ul{grid-template-columns:1fr}
 .spread-example{padding:18px}
 .spread-example .spread-example-question{font-size:21px}
}
