/* top menu: the More dropdown */
.nav-more { position: relative; }
.nav-more { flex: none; }
.nav-more > summary { white-space: nowrap; list-style: none; cursor: pointer; position: relative; font: 500 11px/1 var(--label); letter-spacing: .28em; text-transform: uppercase; color: var(--text-2); padding: 12px 14px; transition: color .3s; }
.nav-more > summary::-webkit-details-marker { display: none; }
.nav-more > summary::before { content: ''; display: inline-block; width: 5px; height: 5px; margin: 0 8px 2px 0; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); vertical-align: middle; order: 2; }
.nav-more > summary:hover, .nav-more[open] > summary { color: var(--text); }
.nav-more > summary.on { color: var(--gold-hi); }
.nav-more-pop { position: fixed; z-index: 60; display: grid; gap: 2px; width: 300px; max-width: calc(100vw - 24px); padding: 8px; border-radius: 14px; background: rgba(16, 12, 9, .97); box-shadow: inset 0 0 0 1px rgba(236, 211, 154, .2), 0 24px 60px rgba(0, 0, 0, .6); backdrop-filter: blur(10px); }
.nav-more-pop a { text-decoration: none; display: flex !important; flex-direction: column; gap: 4px; padding: 11px 14px !important; border-radius: 9px; text-transform: none !important; letter-spacing: 0 !important; }
.nav-more-pop a::after { display: none; }
.nav-more-pop a strong { font: 500 16px/1.2 var(--body); color: var(--text); }
.nav-more-pop a span { font: italic 400 13.5px/1.3 var(--body); color: var(--text-2); }
.nav-more-pop a:hover, .nav-more-pop a.on { background: rgba(255, 240, 210, .06); }
.nav-more-pop a.on strong { color: var(--gold-hi); }

/* the Encyclopedia's four doors */
.enc-doors { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; margin: 0 0 18px; }
.enc-door { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 20px 20px 18px; text-align: left; cursor: pointer; border: 0; border-radius: 14px; color: var(--text); background: rgba(255, 240, 210, .03); box-shadow: inset 0 0 0 1px rgba(236, 211, 154, .14); transition: background .25s, box-shadow .25s, transform .25s; }
.enc-door:hover { background: rgba(255, 240, 210, .06); box-shadow: inset 0 0 0 1px rgba(236, 211, 154, .35); transform: translateY(-2px); }
.enc-door.on { background: linear-gradient(180deg, rgba(201, 163, 91, .18), rgba(201, 163, 91, .05)); box-shadow: inset 0 0 0 1px var(--gold-hi), 0 0 40px -10px rgba(201, 163, 91, .5); }
.enc-door .cat-n { font: 500 30px/1 var(--display, 'Cormorant', serif); color: var(--gold-hi); }
.enc-door strong { font: 500 12px/1.25 var(--label); letter-spacing: .2em; text-transform: uppercase; color: var(--text); }
.enc-door .cat-b { font: 400 14.5px/1.5 var(--body); color: var(--text-2); }
.enc-feats { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 28px; }
.enc-feats[hidden] { display: none; }
.enc-feat { display: grid; grid-template-columns: 1fr auto; column-gap: 14px; align-items: center; padding: 12px 16px; min-width: 230px; flex: 1 1 230px; max-width: 360px; border-radius: 11px; text-decoration: none; background: rgba(255, 240, 210, .04); box-shadow: inset 0 0 0 1px rgba(236, 211, 154, .16); transition: background .25s, box-shadow .25s; }
.enc-feat:hover { background: rgba(255, 240, 210, .08); box-shadow: inset 0 0 0 1px rgba(236, 211, 154, .4); }
.enc-feat strong { font: 500 16px/1.2 var(--body); color: var(--gold-hi); }
.enc-feat span { grid-column: 1; font: italic 400 13.5px/1.35 var(--body); color: var(--text-2); }
.enc-feat i { grid-row: 1 / span 2; grid-column: 2; font-style: normal; color: var(--gold-hi); }
.lgrid .enc-sub { font: 500 12px/1 var(--label) !important; letter-spacing: .24em; text-transform: uppercase; }
