/* Fiche de la vue Famille : colonne de droite agrandie pour la lecture à distance */
@media (min-width: 901px) {
  body.mode-famille aside { width: clamp(420px, 33vw, 820px); }
}
body.mode-famille aside { font-size: clamp(17px, 1.4vw, 30px); line-height: 1.5; padding: 1.1em 1.3em; }
body.mode-famille aside h2 { font-size: 1.55em; }
body.mode-famille aside dl { grid-template-columns: 6.5em 1fr; gap: .3em .6em; }
body.mode-famille aside .fait { font-size: 1em; }
body.mode-famille aside .src { font-size: .85em; }
body.mode-famille aside .src img { max-height: 14em; }

.fsec { margin: 1.1em 0; }
.fsec h3, .epoque summary { font: 600 1.1em Georgia, serif; margin: 0 0 .4em; }
.fsec .anec { font-size: 1.05em; padding: .7em .9em; margin: .5em 0; }
.fgrp { margin: .6em 0; }
.flbl { font: 600 .72em "Segoe UI", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: .3em; }
.chips { display: flex; flex-wrap: wrap; gap: .4em; }
.chip { font: inherit; font-size: .92em; padding: .3em .8em; border: 1.5px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); cursor: pointer; }
.chip.M { background: var(--m); } .chip.F { background: var(--f); }
.chip:hover { filter: brightness(.95); } .chip:focus-visible { outline: .2em solid #2b6cb0; }
.chip small { color: var(--muted); }

.epoque summary { cursor: pointer; padding: .4em .7em; border-radius: .5em; background: #efe8d8; list-style: none; user-select: none; }
.epoque summary::-webkit-details-marker { display: none; }
.epoque summary::before { content: "▾ "; } .epoque:not([open]) summary::before { content: "▸ "; }
.epoque summary:hover { background: #e6dcc4; }
.epoque .vecu { margin-top: .6em; }
body.mode-famille aside .vecu-t { font-size: 1.05em; } body.mode-famille aside .per-txt { font-size: .95em; }
body.mode-famille aside .vecu-s { font-size: .85em; } body.mode-famille aside .vecu ul { font-size: .92em; }
body.mode-famille aside .vecu li i { font-size: .85em; }
body.mode-famille .fc { width: clamp(180px, 14.5vw, 340px); } body.mode-famille .fc.focus { width: clamp(220px, 19vw, 420px); }
@media (max-width: 900px) { body.mode-famille .fc { width: clamp(150px, 30vw, 300px); } }

.pth { margin: .5em 0; } .pth figcaption { font-size: .85em; color: var(--muted); margin-top: .3em; }
.thumbbtn { display: block; padding: 0; border: 2px solid var(--line); border-radius: .5em; background: none; cursor: zoom-in; overflow: hidden; }
.thumbbtn img { display: block; width: 100%; max-height: 16em; object-fit: cover; object-position: top; }
.fc .ph { position: absolute; right: .4em; bottom: .3em; }

.photoview { position: fixed; inset: 0; z-index: 20; background: #000d; display: flex; align-items: center; justify-content: center; padding: 2vh 2vw; }
.photoview figure { margin: 0; text-align: center; color: #fff; }
.pv-img { position: relative; display: inline-block; }
.pv-img img { display: block; max-height: 84vh; max-width: 92vw; border-radius: .4em; }
.pv-tag { position: absolute; transform: translateX(-50%); font: 600 clamp(14px, 1.25vw, 26px) Georgia, serif; padding: .15em .6em; border: 2px solid #fff;
  border-radius: 999px; background: #000b; color: #fff; cursor: pointer; white-space: nowrap; }
.pv-tag:hover, .pv-tag:focus-visible { background: #2b6cb0; outline: none; }
.photoview figcaption { margin-top: .6em; font-size: clamp(15px, 1.4vw, 28px); }
.pv-close { position: fixed; top: 14px; right: 24px; }