*{box-sizing:border-box;margin:0;padding:0}

/* Bandeau image */
#site-banner { max-width: 960px; max-height: 80px; overflow: hidden; opacity: 1; transition: max-height 0.6s ease-in-out, opacity 0.6s ease-in-out; margin: auto; position: relative; overflow-anchor: none; }
#site-banner div.site-banner-inner { background: white; }
#site-banner div.site-banner-inner img { height: 80px; display: block; }
#site-banner.banner-hidden { max-height: 0; opacity: 0; }
.banner-text { position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); z-index: 2; line-height: 1.3; padding: 0.5rem; }
.banner-title { font-family: Georgia, serif; font-size: 1.5rem; font-variant: small-caps; color: #2a2015; letter-spacing: 0.06em; }
.banner-subtitle { font-family: Georgia, serif; font-size: 0.72rem; font-variant: small-caps; color: #2a2015; letter-spacing: 0.08em; }

/* navbar */
.main-nav{font-family:Georgia,serif;border-bottom:1px solid #d9cfc0;background:#faf8f4;position:sticky;top:0;z-index:900;transition: transform 0.3s ease; overflow-anchor: none;}
.main-nav.nav-hidden { transform: translateY(-100%); }
.nav-inner{display:flex;align-items:stretch;max-width:960px;margin:0 auto}
.nav-items{display:flex;align-items:stretch;list-style:none;flex:1}
.nav-items>li>a{display:flex;align-items:center;padding:0 1.1rem;height:44px;font-family:Georgia,serif;font-size:0.85rem;color:#3a2e1e;text-decoration:none;transition:background 0.15s,color 0.15s}
.nav-items>li>a:hover{background:#f0ebe0;color:#8b6f47}
.nav-items>li.active>a{color:#8b6f47;border-bottom:2px solid #8b6f47}
.nav-burger{display:none;align-items:center;padding:0 1rem;height:44px;cursor:pointer;background:none;border:none;gap:5px;font-family:Georgia,serif;font-size:0.78rem;color:#6b5a3e}
.burger-lines{display:flex;flex-direction:column;gap:4px;width:16px}
.burger-lines span{display:block;height:1.5px;background:#8b6f47;border-radius:1px;transition:transform 0.22s,opacity 0.22s}
.main-nav.open .burger-lines span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.main-nav.open .burger-lines span:nth-child(2){opacity:0}
.main-nav.open .burger-lines span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
.mobile-menu{display:none;list-style:none;border-top:1px solid #d9cfc0}
.main-nav.open .mobile-menu{display:block}
.mobile-menu>li>a{display:flex;align-items:center;width:100%;padding:0.7rem 1.2rem;font-family:Georgia,serif;font-size:0.88rem;color:#3a2e1e;text-decoration:none;border-bottom:1px solid #ede8df}
.mobile-menu>li>a:hover{background:#f0ebe0;color:#8b6f47}

#mobile-toc-bar{display:none;background:#faf8f4;border-bottom:1px solid #d9cfc0;font-family:Georgia,serif;position:sticky;top:44px;z-index:850}
#mobile-toc-collapsed{overflow:hidden;max-height:calc(1.5em * 3 + 1.4rem);padding:0.5rem 1rem;position:relative;font-size:0.82rem;line-height:1.5;color:#3a2e1e}
#mobile-toc-collapsed::after{content:"";position:absolute;bottom:0;left:0;right:0;height:24px;background:linear-gradient(transparent,#faf8f4);pointer-events:none}
#mobile-toc-toggle{width:100%;background:#f0ebe0;border:none;border-top:1px solid #d9cfc0;padding:0.3rem;font-size:0.75rem;color:#6b5a3e;cursor:pointer;letter-spacing:0.04em;font-family:Georgia,serif}

#mobile-toc-overlay{display:none;position:fixed;inset:0;z-index:950;background:#faf8f4;overflow-y:auto;padding:1.5rem 1.2rem 2rem;font-family:Georgia,serif}
#mobile-toc-overlay h3{font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;color:#8b6f47;margin:0 0 1rem}
#mobile-toc-overlay ul{list-style:none}
#mobile-toc-overlay ul ul {list-style:none; margin: 0; padding: 0 5px 0 15px; }
#mobile-toc-overlay ul li{border-bottom:1px solid #e8e0d0}
#mobile-toc-overlay ul li a{display:block;padding:0.75rem 0;color:#2a2015;text-decoration:none;font-size:0.95rem;line-height:1.4}
#mobile-toc-overlay ul li a.toc-active{color:#8b6f47;border-left:2px solid #8b6f47;padding-left:8px}
#mobile-overlay-close{display:block;width:100%;background:none;border:1px solid #c9bfaa;border-radius:3px;padding:0.6rem;margin-top:1.5rem;color:#6b5a3e;font-family:Georgia,serif;cursor:pointer}


/* ── Sélecteur langue navbar (desktop) ── */
    .nav-lang {
	display: flex;
	align-items: center;
	padding: 0 0.8rem;
	border-left: 1px solid #d9cfc0;
	margin-left: auto;
    }
    .nav-lang-list {
	list-style: none;
	display: flex;
	gap: 3px;
	align-items: center;
    }
/* par défaut : seul l'item actif est visible */
    .nav-lang-list li {
	display: none;
    }
    .nav-lang-list li.active {
	display: block;
    }
/* quand ouvert : tous visibles */
    .nav-lang.open .nav-lang-list li {
	display: block;
    }
    .nav-lang-list li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid #d9cfc0;
	border-radius: 3px;
	font-family: Georgia, serif;
	font-size: 0.72rem;
	color: #6b5a3e;
	text-decoration: none;
	text-transform: lowercase;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
	cursor: pointer;
    }
    .nav-lang-list li a:hover {
	background: #f0ebe0;
	color: #8b6f47;
	border-color: #c9bfaa;
    }
    .nav-lang-list li.active a {
	background: #8b6f47;
	color: #faf8f4;
	border-color: #8b6f47;
	font-weight: 600;
    }

/* ── Mobile : toujours déployé ── */
    .mobile-lang-item {
	padding: 0.7rem 1.2rem;
	border-bottom: 1px solid #ede8df;
    }
    .mobile-lang-label {
	font-family: Georgia, serif;
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #8b6f47;
	margin-bottom: 0.5rem;
    }
    .mobile-lang-list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
    }
    .mobile-lang-list li a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid #d9cfc0;
	border-radius: 3px;
	font-family: Georgia, serif;
	font-size: 0.72rem;
	color: #6b5a3e;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
    }
    .mobile-lang-list li a:hover {
	background: #f0ebe0;
	color: #8b6f47;
    }
    .mobile-lang-list li.active a {
	background: #8b6f47;
	color: #faf8f4;
	border-color: #8b6f47;
	font-weight: 600;
    }

@media (max-width: 640px) {
	.nav-lang { display: none; }
}



.page-wrap{max-width:960px;margin:0 auto;background:#faf8f4}

/* layout sticky */

.layout{display:flex;align-items:flex-start}

/* toc-rail sticky sous le nav (44px) */

.toc-rail{
    width:28px;flex-shrink:0;
    background:#f0ebe0;border-right:1px solid #d9cfc0;
    cursor:pointer;
    display:flex;flex-direction:column;align-items:center;
    padding-top:1rem;gap:0.6rem;
    position:sticky;top:44px;
    height:calc(100vh - 44px);
    transition:background 0.15s;
    overflow:hidden;
}
.toc-rail:hover{background:#ece5d5}

/* croix de fermeture — visible uniquement quand ouvert */

.toc-close{
    font-size:0.9rem;color:#8b6f47;
    line-height:1;user-select:none;
    opacity:0;transition:opacity 0.2s;
    flex-shrink:0;
}
.toc-panel.open ~ * .toc-close,
.toc-rail.panel-open .toc-close{opacity:1}

.toc-label{
    writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);
    font-family:Georgia,serif;font-size:0.68rem;letter-spacing:0.18em;text-transform:uppercase;
    color:#8b6f47;white-space:nowrap;user-select:none;transition:opacity 0.2s;
}

.toc-panel{
    width:0;flex-shrink:0;overflow:hidden;
    transition:width 0.3s ease;
    background:#faf8f4;border-right:1px solid #d9cfc0;
    position:sticky;top:44px;
    height:calc(100vh - 44px);
    overflow-y:auto;
}
.toc-panel.open{width:270px}
.toc-panel-inner{width:270px;padding:1.2rem 1rem}
.toc-panel-inner h3{font-family:Georgia,serif;font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;color:#8b6f47;margin-bottom:1rem}
.toc-panel-inner ul {list-style:none; margin: 0; }
.toc-panel-inner ul ul {list-style:none; margin: 0; padding: 0 5px 0 15px; }
.toc-panel-inner ul li a{display:block;padding:0.3rem 0.5rem;font-family:Georgia,serif;font-size:0.82rem;color:#4a3e2e;text-decoration:none;border-radius:2px;line-height:1.4;transition:background 0.12s,color 0.12s}
.toc-panel-inner ul li a:hover{background:#f0ebe0;color:#8b6f47}
.toc-panel-inner ul li a.toc-link-active{background: #f0e8d8;color:#8b6f47;border-left:2px solid #8b6f47;padding-left:6px;}

.content-col{flex:1;padding:2rem 2.5rem;font-family:Georgia,serif;color:#3a2e1e;line-height:1.8;font-size:0.92rem}
.content-col h1{font-size:1.3rem;font-weight:normal;color:#2a2015;margin-bottom:1.5rem;padding-bottom:0.6rem;border-bottom:1px solid #d9cfc0}
.content-col h2{font-size:1.05rem;font-weight:normal;color:#2a2015;margin:2rem 0 0.8rem;padding-bottom:0.3rem;border-bottom:1px solid #ede8df}
.content-col p{margin-bottom:1rem;color:#4a3e2e}
a.see-footnote{color:#8b6f47;font-size:0.75em;vertical-align:super;text-decoration:none;cursor:pointer}
a.see-footnote:hover{text-decoration:underline}

ul.footnotes{border-top:2px solid #d9cfc0;padding:2rem 2.5rem;font-family:Georgia,serif;background:#faf8f4}
ul.footnotes h2{font-size:0.75rem;letter-spacing:0.12em;text-transform:uppercase;color:#8b6f47;margin-bottom:1.2rem}
ul.footnotes{padding-left:1.4rem;font-size:0.83rem;line-height:1.7;color:#4a3e2e}
ul.footnotes li{padding:0.2rem 0 0.2rem 0.4rem;border-bottom:1px solid #ede8df;list-style-type:none; text-indent:-1.1rem;}
ul.footnotes li a {text-decoration:none}
ul.footnotes li:last-child{border-bottom:none}

footer{background:#3a2e1e;color:#c9bfaa;font-family:Georgia,serif;font-size:0.82rem;line-height:1.7}
.footer-inner{max-width:960px;margin:0 auto;padding:2rem 2.5rem;display:grid;grid-template-columns:1fr 1fr 1fr;gap:2rem}
.footer-inner h4{font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;color:#faf8f4;margin-bottom:0.8rem;font-weight:normal}
.footer-inner p,.footer-inner a{color:#a09080;text-decoration:none;display:block;margin-bottom:0.3rem;font-size:0.8rem}
.footer-inner a:hover{color:#faf8f4}
.footer-bottom{border-top:1px solid #5a4e3e;text-align:center;padding:1rem 2rem;font-size:0.75rem;color:#6b5a4e;max-width:960px;margin:0 auto}

/* panneau dynamique */
.fn-panel{
    position:fixed;bottom:0;left:50%;transform:translateX(-50%);
    width:100%;max-width:960px;
    background:#faf8f4;border-top:2px solid #8b6f47;
    font-family:Georgia,serif;box-shadow:0 -2px 12px rgba(0,0,0,0.08);
    transition:height 0.3s ease,opacity 0.3s ease,transform 0.3s ease;
    z-index:800;
}
.fn-panel.fn-collapsed{height:2.4rem}
.fn-panel.fn-expanded{height:clamp(120px,26vh,240px)}
.fn-panel.fn-hidden{opacity:0;pointer-events:none;transform:translateX(-50%) translateY(100%)}
.fn-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:0 1rem;height:2.4rem;cursor:pointer;user-select:none;
    /* évite que le header masque le début de la note */
    position:relative;z-index:2;
}
.fn-header span{font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:#6b5a3e}
.fn-icon{font-size:0.8rem;color:#8b6f47;transition:transform 0.25s}
.fn-panel.fn-expanded .fn-icon{transform:rotate(180deg)}
.fn-body{
    height:calc(100% - 2.4rem);
    overflow-y:auto;
    padding:0.5rem 1rem 1rem;
    scroll-behavior:smooth;
}
/* scroll-padding-top = hauteur du header (2.4rem) pour que l'item ne soit pas masqué */
.fn-body ol{
    margin:0;padding:0 0 0 1.4rem;
    font-size:0.82rem;line-height:1.6;color:#3a2e1e;
    /* espace avant le premier item pour qu'il ne soit jamais sous le header */
}
.fn-body ol li{
    padding:0.2rem 0 0.2rem 0.4rem;
    border-bottom:1px solid #ede8df;
    /* border-left transparent par défaut pour éviter le décalage à l'activation */
    border-left:2px solid transparent;
    transition:background 0.3s,border-left-color 0.3s;
}
.fn-body ol li:last-child{border-bottom:none}
.fn-active{
    background:#f0e8d8;
    border-left-color:#8b6f47 !important;
}

@media(max-width:640px){
    .nav-items{display:none}
    .nav-burger{display:flex}
    .toc-rail,.toc-panel{display:none}
    #mobile-toc-bar{display:block}
    .content-col{padding:1.2rem}
    .static-notes{padding:1.2rem}
    .footer-inner{grid-template-columns:1fr;gap:1.2rem}
}
html{scroll-behavior:smooth}
body { background: #f5f0e8; color: #3a2e1e; font-family: Georgia, serif; }

/* Footnotes */

a.see-footnote span {
   display: none; 
   width: 400px;
   text-decoration: none;
   font-size: 12px;
   font-weight: normal;
   line-height: 1.2rem;
}

a.see-footnote:hover {
   background: none;
   z-index: 500; 
   text-decoration: none;
}

a.see-footnote:hover span {
   display: inline; 
   text-decoration: none;
   position: absolute;
   top: 30px; 
   left: 20px;
   background: #faf8f4;
   color: #758497;
   padding: 1em;
   border: 1px solid #d3d3d3;
   border-left: 2px solid #8b6f47;
}

[id^="chap_"] {
    scroll-margin-top: 52px; /* hauteur du nav (44px) + un peu d'air */
}


.doc-header {
    padding: 1.5rem 2.5rem 1.8rem;
    border-bottom: 2px solid #d9cfc0;
    background: #faf8f4;
}

/* Versions linguistiques */

.doc-langs {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.2rem;
}
.lang-list {
    list-style: none;
    display: flex;
    gap: 4px;
}
.lang-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 1px solid #d9cfc0;
    border-radius: 3px;
    font-family: Georgia, serif;
    font-size: 0.72rem;
    color: #6b5a3e;
    text-decoration: none;
    text-transform: lowercase;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.lang-list li a:hover {
    background: #f0ebe0;
    color: #8b6f47;
    border-color: #c9bfaa;
}
.lang-list li.active a {
    background: #8b6f47;
    color: #faf8f4;
    border-color: #8b6f47;
    font-weight: 600;
}

/* Titre & auteur */

.doc-title-block {
    margin-bottom: 1.2rem;
}
.doc-title {
    font-family: Georgia, serif;
    font-size: 1.35rem;
    font-weight: normal;
    color: #2a2015;
    line-height: 1.4;
    margin-bottom: 0.4rem;
}
.doc-author {
    font-family: Georgia, serif;
    font-size: 0.92rem;
    color: #6b5a3e;
    letter-spacing: 0.02em;
}
.doc-author strong {
    font-weight: 600;
    color: #3a2e1e;
}

/* Collaborations */

.doc-collab {
    list-style: none;
    font-family: Georgia, serif;
    font-size: 0.82rem;
    color: #6b5a3e;
    line-height: 1.7;
    border-top: 1px solid #e8e0d0;
        padding-top: 0.9rem;
}
.doc-collab li {
    padding: 0.1rem 0;
}
.doc-collab a {
    color: #8b6f47;
    text-decoration: none;
    border-bottom: 1px solid #d9cfc0;
    transition: color 0.15s, border-color 0.15s;
}
.doc-collab a:hover {
    color: #5a3e20;
    border-bottom-color: #8b6f47;
}
.doc-collab-role {
    color: #8b6f47;
    font-style: italic;
}

/* Responsive */
@media (max-width: 640px) {
    .doc-header {
        padding: 1rem 1.2rem 1.2rem;
    }
    .doc-title {
        font-size: 1.1rem;
    }
}


/* Document Footer */

.doc-footer {
border-top: 1px solid #d9cfc0;
padding: 1.5rem 2.5rem;
background: #faf8f4;
display: flex;
flex-direction: column;
gap: 1.2rem;
font-family: Georgia, serif;
font-size: 0.83rem;
color: #4a3e2e;
}

.doc-footer-label {
font-size: 0.7rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #8b6f47;
margin-bottom: 0.5rem;
}

/* Mots-clés  */

.doc-footer-keywords ul {
list-style: none;
display: flex;
flex-wrap: wrap;
gap: 6px;
margin-top: 0.4rem;
}
.doc-footer-keywords ul li a {
display: inline-block;
padding: 3px 10px;
border: 1px solid #c9bfaa;
border-radius: 3px;
font-family: Georgia, serif;
font-size: 0.8rem;
color: #4a3e2e;
text-decoration: none;
transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.doc-footer-keywords ul li a:hover {
background: #f0ebe0;
color: #8b6f47;
border-color: #8b6f47;
}

/* Info Archivage */

.doc-footer-archive ul {
list-style: none;
margin-top: 0.4rem;
display: flex;
flex-direction: column;
gap: 0.2rem;
}
.doc-footer-archive ul li {
line-height: 1.6;
}
.doc-footer-archive ul li span {
color: #8b6f47;
font-style: italic;
}
.doc-footer-archive ul li a {
color: #4a3e2e;
text-decoration: none;
border-bottom: 1px solid #d9cfc0;
transition: color 0.15s, border-color 0.15s;
}
.doc-footer-archive ul li a:hover {
color: #8b6f47;
border-bottom-color: #8b6f47;
}

/* Illustrations */

.doc-footer-pictures a {
display: inline-flex;
align-items: center;
gap: 0.5rem;
color: #4a3e2e;
text-decoration: none;
border: 1px solid #c9bfaa;
border-radius: 3px;
padding: 0.4rem 0.8rem;
transition: background 0.15s, color 0.15s;
}
.doc-footer-pictures a:hover {
background: #f0ebe0;
color: #8b6f47;
}
.doc-footer-pictures img {
width: 48px;
height: 36px;
object-fit: cover;
border-radius: 2px;
}
.doc-footer-pictures span {
font-size: 0.82rem;
}

@media (max-width: 640px) {
.doc-footer { padding: 1rem 1.2rem; }
}