:root{--paper:#F7F3EA;--ink:#202A4D;--copper:#9A5B33;--faint:#6E7386;--edge:clamp(1rem,5vw,4rem);--air:clamp(2rem,4vw,3.4rem)}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{background:var(--paper);color:var(--ink);font-family:"Libre Baskerville",Georgia,serif;font-size:1rem;line-height:1.78}
h1,h2,h3,.titulus,.numerus,.caput,.linea span,.clavis{font-family:"Playfair Display",Georgia,serif}
h1{font-weight:700;font-size:clamp(2rem,5vw,3.4rem);line-height:1.12;margin:0 0 .5rem}
h2{font-weight:700;font-size:clamp(1.4rem,3vw,2rem);line-height:1.16;margin:0 0 .4rem}
p{margin:0 0 1.1rem;max-width:62ch}
a{color:var(--copper)}
a:focus-visible,button:focus-visible{outline:3px solid var(--copper);outline-offset:3px}
.folium{width:100%;max-width:64rem;margin-left:auto;margin-right:auto;padding-left:var(--edge);padding-right:var(--edge);padding-top:1.6rem;padding-bottom:3.2rem}
.caput{border-top:6px double var(--ink);border-bottom:6px double var(--ink);padding-top:.7rem;padding-bottom:.7rem;margin-bottom:var(--air);font-variant:small-caps;letter-spacing:.08em;font-size:.98rem;text-align:center}
.index{display:grid;grid-template-columns:100%;row-gap:.35rem;margin-top:.6rem;font-variant:small-caps;letter-spacing:.05em}
.index[data-open="false"]{display:none}
.clavis{display:none;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font-size:.95rem;padding:.4rem 1rem;margin-top:.6rem}
.linea{border-top:3px double var(--ink);line-height:0;text-align:center;margin-top:1.9rem;margin-bottom:1.1rem}
.linea span{background:var(--paper);padding-left:.9rem;padding-right:.9rem;font-variant:small-caps;letter-spacing:.06em;color:var(--copper);font-size:1rem;line-height:1}
.numerus{color:var(--copper);font-weight:700;font-size:clamp(1.6rem,3.6vw,2.4rem);letter-spacing:.06em;display:block;margin-bottom:.2rem}
.titulus{font-weight:700;font-size:clamp(1.5rem,3.4vw,2.2rem);line-height:1.16;margin-bottom:.15rem}
.imago{margin-top:1.6rem;margin-bottom:1.6rem;margin-left:0}
.imago img{display:block;width:100%;height:auto;aspect-ratio:11/9;object-fit:cover}
.pars img{display:block;width:100%;height:auto;aspect-ratio:9/4;object-fit:cover}
.dies{color:var(--faint);font-size:.88rem;font-variant:small-caps;letter-spacing:.05em}
.textus{margin-bottom:var(--air)}
.nota{border-top:3px double var(--ink);border-bottom:3px double var(--ink);padding-top:1.1rem;padding-bottom:1.1rem;margin-top:var(--air)}
.finis{border-top:6px double var(--ink);padding-top:1.1rem;margin-top:var(--air);font-size:.92rem}



.saltus{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.saltus:focus{position:static;width:auto;height:auto;overflow:visible;color:var(--copper)}
html[data-js="on"] .clavis{display:inline-block}
.caput a{text-decoration:none}
.caput a:hover{text-decoration:underline}
.titulus{display:block}
h2{margin-top:0}
.locus{color:var(--faint);margin-bottom:.4rem}
.textus{max-width:62ch}
.pars{margin-top:1.6rem;margin-bottom:var(--air);margin-left:0;margin-right:0}
.tabula{width:min(100%,14rem);margin-top:1.4rem;margin-bottom:var(--air);margin-left:0;margin-right:auto;padding:.4rem;border:6px double var(--ink);background:var(--paper)}
.tabula img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.imago{margin-right:0}
.ordo{display:grid;grid-template-columns:100%;row-gap:.4rem;margin-top:var(--air);margin-bottom:var(--air)}
.membrum{margin-top:1.4rem}
.membrum h3{font-weight:700;font-size:1.15rem;line-height:1.2;margin:0 0 .5rem;font-variant:small-caps;letter-spacing:.05em}
.catalogus{list-style:none;margin:0;padding:0}
.catalogus li{margin-bottom:.2rem;line-height:1.5}
.catalogus a{text-decoration:none}
.catalogus a:hover{text-decoration:underline}
.summa{margin-bottom:1.4rem}
.summa p{color:var(--faint);margin-bottom:0}
.nota p:last-child{margin-bottom:0}
.finis p:last-child{margin-bottom:0}
@media (min-width:900px){
.index{grid-template-columns:33% 33% 33%;column-gap:1%}
.index[data-open="false"]{display:grid}
.clavis{display:none}
.imago{margin-left:38%}
html[data-js="on"] .clavis{display:none}
.finis p{max-width:74ch}
.ordo{grid-template-columns:62% 38%;column-gap:0;row-gap:1.8rem}
.membrum{margin-top:0}
.summa{margin-bottom:0;padding-left:2.4rem}
.summa p{max-width:34ch}
}
@media (min-width:1280px){
.index{grid-template-columns:repeat(7,minmax(0,1fr));column-gap:.8%}
}
