@charset "utf-8";

:root { --paper: #f4f3ee; --paper2: #ecede6; --ink: #161d26; --bleu: #1f3b57; --or: #a9823b; --rule: #d6d3c6; --wash: #e9edf0; }

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

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: auto ease 0s 1 normal none running none !important; transition: none !important; }
}

body { background: var(--paper); color: var(--ink); font-family: "Libre Caslon Text", Georgia, serif; font-size: 17px; line-height: 1.65; min-height: 100vh; }

body.admin-bar .top { top: 32px; }

@media (max-width: 782px) {
  body.admin-bar .top { top: 46px; }
}

a { color: var(--bleu); text-decoration: none; }

a:hover { text-decoration: underline; }

a:focus-visible, button:focus-visible { outline: 2px solid var(--or); outline-offset: 3px; }

.mono { font-family: "IBM Plex Mono", monospace; }

.wrap { margin: 0px auto; max-width: 1080px; padding: 0px 24px; }

.screen-reader-text { border: 0px; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; overflow-wrap: normal !important; }

.top { background: rgba(244, 243, 238, 0.92); backdrop-filter: blur(6px); border-bottom: 1px solid var(--rule); position: sticky; top: 0px; z-index: 50; }

.nav { align-items: baseline; display: flex; justify-content: space-between; margin: 0px auto; max-width: 1080px; padding: 14px 24px; }

.nav .brand { color: var(--ink); font-family: "Libre Caslon Display", serif; font-size: 1.05rem; letter-spacing: 0.16em; text-transform: uppercase; }

.nav ul { display: flex; flex-wrap: wrap; gap: 26px; list-style: none; }

.nav a { color: var(--ink); font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; }

.nav a:hover { border-bottom: 1px solid var(--or); color: var(--bleu); text-decoration: none; }

.hero { padding: 72px 0px 26px; }

.hero .eyebrow, .sec-eyebrow { color: var(--or); display: block; font-family: "IBM Plex Mono", monospace; font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; }

.hero .eyebrow { font-size: 0.72rem; margin-bottom: 18px; }

.hero h1 { color: var(--ink); font-family: "Libre Caslon Display", serif; font-size: clamp(2.3rem, 5.4vw, 4rem); font-weight: 400; line-height: 1.08; max-width: 21ch; }

.hero h1 em { color: var(--bleu); font-style: italic; }

.hero .sub { color: rgb(58, 65, 75); font-size: 1.06rem; margin-top: 22px; max-width: 60ch; }

.trichotomie { display: flex; flex-wrap: wrap; gap: 0px; margin-top: 26px; }

.trichotomie span { background: var(--wash); border-top-color: ; border-top-style: ; border-top-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-right: 0px; color: var(--bleu); font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; letter-spacing: 0.14em; padding: 7px 16px; text-transform: uppercase; }

.trichotomie span:last-child { border-right: 1px solid var(--rule); }

.cadastre { padding: 30px 0px 8px; }

.cadastre svg { display: block; height: auto; width: 100%; }

.cad-legende { border-top: 1px solid var(--rule); color: rgb(90, 96, 104); display: flex; flex-wrap: wrap; font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; gap: 12px; justify-content: space-between; letter-spacing: 0.1em; margin-top: 4px; padding-top: 12px; }

.cad-legende b { color: var(--bleu); font-weight: 500; }

.digit { cursor: pointer; }

.digit text { fill: var(--ink); font-family: "Libre Caslon Display", serif; font-size: 44px; transition: fill 0.18s; }

.arc { fill: none; stroke: var(--rule); stroke-width: 1.4; transition: stroke 0.18s, stroke-width 0.18s; }

.pair-on .arc { stroke: var(--or); stroke-width: 2.2; }

.pair-on text { fill: var(--bleu); }

.somme { fill: var(--or); font-family: "IBM Plex Mono", monospace; font-size: 15px; opacity: 0; transition: opacity 0.18s; }

.pair-on .somme { opacity: 1; }

.bary line { stroke: var(--bleu); stroke-dasharray: 3, 4; stroke-width: 1.2; }

.bary text { fill: var(--bleu); font-family: "IBM Plex Mono", monospace; font-size: 13px; }

.neuf circle { fill: none; stroke: var(--or); stroke-width: 1.4; }

section { padding: 64px 0px; }

.band { background: var(--paper2); border-bottom: 1px solid var(--rule); border-top: 1px solid var(--rule); }

h2.sec, .entry-title { color: var(--ink); font-family: "Libre Caslon Display", serif; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 400; margin-bottom: 8px; }

.sec-eyebrow { margin-bottom: 10px; }

.sec-intro { color: rgb(58, 65, 75); margin-bottom: 34px; max-width: 66ch; }

.gram { background: var(--rule); border: 1px solid var(--rule); display: grid; gap: 1px; grid-template-columns: repeat(3, 1fr); }

.gram .cell { background: var(--paper); padding: 26px 22px; }

.gram h3 { color: var(--bleu); font-family: "Libre Caslon Text", serif; font-size: 1.02rem; font-weight: 700; margin-bottom: 8px; }

.gram .f { color: var(--or); display: block; font-family: "IBM Plex Mono", monospace; font-size: 0.86rem; margin-bottom: 10px; }

.gram p { color: rgb(58, 65, 75); font-size: 0.94rem; }

.pub-grid { display: grid; gap: 22px; grid-template-columns: repeat(2, 1fr); }

.pub { background: var(--paper); border: 1px solid var(--rule); display: flex; flex-direction: column; gap: 10px; padding: 22px 22px 18px; transition: border-color 0.18s, transform 0.18s; }

.pub:hover { border-color: var(--or); transform: translateY(-2px); }

.pub .tag { color: var(--or); font-family: "IBM Plex Mono", monospace; font-size: 0.66rem; letter-spacing: 0.18em; text-transform: uppercase; }

.pub h3 { font-family: "Libre Caslon Text", serif; font-size: 1.08rem; font-weight: 700; line-height: 1.35; }

.pub p { color: rgb(58, 65, 75); flex: 1 1 0%; font-size: 0.92rem; }

.pub .foot { align-items: center; border-top: 1px solid var(--rule); display: flex; justify-content: space-between; padding-top: 12px; }

.pub .ver { color: rgb(90, 96, 104); font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; }

.pub .lien, .volet .lien { color: var(--bleu); font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; letter-spacing: 0.1em; }

.pub .lien:hover, .volet .lien:hover { color: var(--or); text-decoration: none; }

.volets { border-top: 1px solid var(--ink); }

.volet { align-items: baseline; border-bottom: 1px solid var(--rule); display: grid; gap: 8px 24px; grid-template-columns: 1fr auto; padding: 22px 4px; }

.volet h3 { font-family: "Libre Caslon Display", serif; font-size: 1.35rem; font-weight: 400; }

.volet .ep { color: rgb(74, 80, 90); font-size: 0.96rem; font-style: italic; grid-column: 1 / -1; max-width: 70ch; }

.volet .lien { white-space: nowrap; }

.apropos { align-items: start; display: grid; gap: 48px; grid-template-columns: 1.2fr 0.8fr; }

.apropos p { color: rgb(44, 51, 60); margin-bottom: 16px; }

.fiche { background: var(--paper2); border: 1px solid var(--rule); padding: 24px; }

.fiche dt { color: var(--or); font-family: "IBM Plex Mono", monospace; font-size: 0.68rem; letter-spacing: 0.18em; margin-top: 14px; text-transform: uppercase; }

.fiche dt:first-child { margin-top: 0px; }

.fiche dd { font-size: 0.95rem; margin-top: 3px; }

.site-footer { border-top: 1px solid var(--ink); margin-top: 40px; padding: 34px 0px 44px; }

.footgrid { align-items: baseline; display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; }

.site-footer .sceau { font-family: "Libre Caslon Display", serif; font-size: 0.95rem; letter-spacing: 0.16em; text-transform: uppercase; }

.site-footer p { color: rgb(90, 96, 104); font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; }

.page-shell { padding: 72px 0px; }

.entry-content { max-width: 72ch; }

.entry-content > * + * { margin-top: 1em; }

@media (max-width: 820px) {
  .gram, .pub-grid, .apropos { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .nav { align-items: flex-start; flex-direction: column; gap: 8px; }
  .nav ul { gap: 16px; }
}

@media (max-width: 520px) {
  .trichotomie { flex-direction: column; max-width: 260px; }
  .trichotomie span { border-bottom: 0px; border-right: 1px solid var(--rule); }
  .trichotomie span:last-child { border-bottom: 1px solid var(--rule); }
  .volet { grid-template-columns: 1fr; }
  .volet .lien { white-space: normal; }
}

:root { --page-gutter: clamp(20px, 4vw, 40px); }

.wrap, .nav { padding-inline: var(--page-gutter); }

.hero { padding-top: clamp(36px, 6vw, 72px); }

.page-shell { padding-block: clamp(36px, 6vw, 72px); }

.entry-title { margin-bottom: 24px; overflow-wrap: anywhere; }

.entry-content:has(.bdh-shell) { max-width: none; }

.bdh-shell { margin: 24px 0px 0px; padding-bottom: clamp(24px, 4vw, 40px); }

.bdh-main, .bdh-hero, .bdh-record-topbar { padding-inline: clamp(16px, 3vw, 28px); }

.entry-content .arcb { padding-inline: 0px; }

.pub, .gram .cell, .apropos > *, .bdh-record-layout > *, .bdh-record-main, .bdh-card { min-width: 0px; overflow-wrap: anywhere; }

.bdh-record-layout { grid-template-columns: minmax(0px, 1fr) minmax(240px, 30%); }

@media (max-width: 900px) {
  .bdh-record-layout { grid-template-columns: minmax(0px, 1fr); }
  .bdh-record-sidebar { position: static; }
}

@media (max-width: 700px) {
  section { padding-block: 40px; }
  .nav ul { gap: 10px 20px; }
  .apropos { gap: 28px; }
  .bdh-section { margin-bottom: 24px; }
  .bdh-author-group { padding-block: 24px; }
}

@media (max-width: 520px) {
  .bdh-record-topbar { flex-wrap: wrap; gap: 16px; }
  .bdh-record-brand { flex-wrap: wrap; min-width: 0px; }
  .bdh-facts dl { grid-template-columns: minmax(0px, 1fr); }
  .bdh-single-document h1 { font-size: clamp(1.5rem, 6vw, 2rem); overflow-wrap: anywhere; }
}