/* =========================================================================
   Octuor Veronika — feuille de style du thème
   Direction : un programme de concert (papier, encre, filets de portée),
   et quand le rideau s'ouvre, du noir avec le vert anis des chemises.
   ========================================================================= */

:root {
	--encre: #141210;
	--papier: #F4F2EC;
	--blanc: #FFFFFF;
	--anis: #C3C94A;
	--anis-fonce: #6F7A17;
	--portee: #D7D3C7;
	--sourdine: #6B675E;
	--scene: #141210;
	--scene-2: #1E1B18;
	--scene-txt: #F1EEE6;
	--scene-sourdine: #ABA69A;
	--scene-portee: rgba(241, 238, 230, .16);

	--display: "Newsreader", Georgia, "Times New Roman", serif;
	--corps: "Archivo", "Helvetica Neue", Arial, sans-serif;

	--conteneur: 1180px;
	--gouttiere: clamp(1.1rem, 4vw, 2.5rem);
	--section: clamp(3.5rem, 8vw, 6.5rem);
}

/* ---- base ---- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body {
	margin: 0;
	overflow-x: clip;
	background: var(--papier);
	color: var(--encre);
	font-family: var(--corps);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
@media (min-width: 900px) { body { font-size: 17px; } }
body.ov-lecteur-ouvert { padding-bottom: 76px; }

img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 400; line-height: 1.1; margin: 0; text-wrap: balance; letter-spacing: -.01em; }
h1 { font-size: clamp(2.3rem, 6vw, 4rem); }
h2 { font-size: clamp(1.75rem, 4vw, 2.6rem); }
h3 { font-size: clamp(1.25rem, 2.4vw, 1.55rem); }
h1 em, h2 em, h3 em { font-style: italic; color: var(--sourdine); }
.ov-section--sombre h1 em, .ov-section--sombre h2 em { color: var(--scene-sourdine); }
p { margin: 0; }
p + p { margin-top: 1em; }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--anis-fonce); outline-offset: 3px; }
.ov-section--sombre :focus-visible, .ov-scene :focus-visible, .ov-pied :focus-visible, .ov-appel :focus-visible { outline-color: var(--anis); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.ov-saut { position: absolute; left: -999px; top: 0; background: var(--anis); color: var(--encre); padding: .6rem 1rem; z-index: 100; }
.ov-saut:focus { left: 1rem; top: 1rem; }

.ov-conteneur { max-width: var(--conteneur); margin-inline: auto; padding-inline: var(--gouttiere); }
.ov-section { padding-block: var(--section); }
.ov-section--haut { padding-top: clamp(1.5rem, 4vw, 3rem); }
.ov-section--sombre { background: var(--scene); color: var(--scene-txt); }
.ov-section__tete { display: flex; flex-direction: column; gap: .6rem; margin-bottom: clamp(1.6rem, 4vw, 2.6rem); max-width: 40ch; }
.ov-section__suite { margin-top: 1.6rem; }

.ov-oeil { font-family: var(--corps); font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--anis-fonce); margin: 0; }
.ov-section--sombre .ov-oeil, .ov-oeil--clair, .ov-scene .ov-oeil { color: var(--anis); }
.ov-oeil a { text-decoration: none; }
.ov-grand { font-family: var(--display); font-size: clamp(1.25rem, 2.6vw, 1.7rem); line-height: 1.35; text-wrap: pretty; }
.ov-legende { font-size: .82rem; color: var(--sourdine); margin-top: 1rem; }
.ov-a-confirmer { display: inline-block; font-family: var(--corps); font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--anis-fonce); border: 1px solid currentColor; padding: .05rem .4rem; margin-left: .35rem; vertical-align: middle; }

/* ---- la portée ---- */
.ov-portee { height: 17px; background: repeating-linear-gradient(to bottom, var(--portee) 0, var(--portee) 1px, transparent 1px, transparent 4px); }
.ov-portee.ov-conteneur { padding-inline: 0; margin-inline: auto; width: calc(100% - 2 * var(--gouttiere)); }

/* ---- boutons et liens ---- */
.ov-btn {
	display: inline-flex; align-items: center; justify-content: center; min-height: 48px;
	padding: .8rem 1.5rem; background: var(--anis); color: var(--encre);
	font-family: var(--corps); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	text-decoration: none; border: 1px solid var(--anis); cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.ov-btn:hover, .ov-btn:focus-visible { background: var(--encre); border-color: var(--encre); color: var(--papier); }
.ov-btn--ligne { background: transparent; border-color: var(--encre); color: var(--encre); }
.ov-btn--ligne:hover, .ov-btn--ligne:focus-visible { background: var(--encre); color: var(--papier); }
.ov-btn--clair { background: transparent; border-color: rgba(241, 238, 230, .55); color: var(--scene-txt); }
.ov-btn--clair:hover, .ov-btn--clair:focus-visible { background: var(--scene-txt); border-color: var(--scene-txt); color: var(--encre); }
.ov-section--sombre .ov-btn:hover, .ov-appel .ov-btn:hover, .ov-scene .ov-btn:hover { background: var(--scene-txt); border-color: var(--scene-txt); color: var(--encre); }
.ov-btn--petit { min-height: 40px; padding: .55rem 1.1rem; font-size: .7rem; }
.ov-actions { display: flex; flex-wrap: wrap; gap: .8rem 1.4rem; align-items: center; margin-top: 1.6rem; }
.ov-actions--serrees { margin-top: .6rem; }
.ov-lien { font-family: var(--corps); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--anis-fonce); text-decoration: none; border-bottom: 2px solid var(--anis); padding-bottom: .15rem; }
.ov-lien:hover, .ov-lien:focus-visible { color: var(--encre); border-color: var(--encre); }
.ov-section--sombre .ov-lien { color: var(--anis); }
.ov-section--sombre .ov-lien:hover { color: var(--scene-txt); border-color: var(--scene-txt); }

/* ---- en-tête ---- */
.ov-entete { background: var(--papier); border-bottom: 1px solid var(--portee); position: sticky; top: 0; z-index: 20; }
.admin-bar .ov-entete { top: 32px; }
@media (max-width: 782px) { .admin-bar .ov-entete { top: 46px; } }
@media (max-width: 600px) { .admin-bar .ov-entete { top: 0; } }
html { scroll-padding-top: 88px; }
.ov-accueil .ov-entete { background: var(--scene); color: var(--scene-txt); border-bottom-color: rgba(241, 238, 230, .12); }
.ov-entete__ligne { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 72px; }
.ov-entete__marque { display: flex; align-items: baseline; gap: .9rem; text-decoration: none; color: inherit; }
.ov-entete__lettrage { width: 132px; height: auto; flex: none; }
.ov-entete__sous { font-size: .66rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--sourdine); white-space: nowrap; }
.ov-accueil .ov-entete__sous { color: var(--scene-sourdine); }
.ov-nav__liste { display: flex; align-items: center; gap: 1.6rem; list-style: none; }
.ov-nav__liste a:not(.ov-btn) { font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; padding: .35rem 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.ov-nav__liste .ov-btn { white-space: nowrap; }
@media (max-width: 1180px) { .ov-entete__sous { display: none; } .ov-nav__liste { gap: 1.2rem; } }
.ov-nav__liste a:not(.ov-btn):hover, .ov-nav__liste a.est-actif { border-bottom-color: var(--anis); }
.ov-accueil .ov-nav__liste .ov-btn { border-color: var(--anis); }
.ov-burger { display: none; background: none; border: 1px solid currentColor; padding: .5rem .8rem; align-items: center; gap: .6rem; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.ov-burger__trait { width: 18px; height: 2px; background: currentColor; box-shadow: 0 -5px 0 currentColor, 0 5px 0 currentColor; }
@media (max-width: 1000px) {
	.ov-entete__sous { display: none; }
	.ov-burger { display: inline-flex; position: relative; z-index: 32; }
	.ov-nav { display: none; position: fixed; inset: 0; z-index: 30; background: var(--scene); color: var(--scene-txt); padding: 6rem var(--gouttiere) 3rem; overflow-y: auto; }
	.ov-nav.est-ouvert { display: block; }
	body.ov-menu-ouvert { overflow: hidden; }
	body.ov-menu-ouvert .ov-burger { color: var(--scene-txt); }
	.ov-nav__liste { flex-direction: column; align-items: flex-start; gap: .4rem; }
	.ov-nav__liste a:not(.ov-btn) { font-family: var(--display); font-size: 2.2rem; font-weight: 400; letter-spacing: 0; text-transform: none; border-bottom: 0; padding: .3rem 0; }
	.ov-nav__liste a.est-actif { color: var(--anis); }
	.ov-nav__appel { margin-top: 1.4rem; }
}

/* ---- accueil : la scène ---- */
.ov-scene { position: relative; background: var(--scene); color: var(--scene-txt); overflow: hidden; isolation: isolate; }
.ov-scene__photo { position: absolute; inset: 0; z-index: -2; }
.ov-scene__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 12%; opacity: .62; }
.ov-scene__voile { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(20, 18, 16, .92) 0%, rgba(20, 18, 16, .62) 48%, rgba(20, 18, 16, .12) 100%); }
.ov-scene__portee { position: absolute; left: -4%; top: 30%; width: 46%; height: 17px; background: repeating-linear-gradient(to bottom, var(--scene-portee) 0, var(--scene-portee) 1px, transparent 1px, transparent 4px); transform: rotate(-6deg); z-index: -1; }
.ov-scene__contenu { position: relative; padding-top: clamp(3.5rem, 9vw, 7rem); padding-bottom: clamp(3rem, 8vw, 6rem); display: flex; flex-direction: column; align-items: flex-start; gap: 1.3rem; }
.ov-scene__contenu > * { max-width: 760px; }
.ov-surtitre { font-size: .74rem; font-weight: 700; letter-spacing: .26em; text-transform: uppercase; color: var(--anis); }
.ov-scene__nom { line-height: 0; }
.ov-scene__lettrage { width: min(520px, 86vw); height: auto; }
.ov-scene__accroche { font-family: var(--display); font-size: clamp(1.25rem, 2.6vw, 1.7rem); line-height: 1.35; max-width: 32ch; color: #E9E5DB; text-wrap: pretty; }
.ov-scene .ov-actions { margin-top: .6rem; }
@media (max-width: 640px) {
	.ov-scene__photo img { object-position: 50% 30%; opacity: .5; }
	.ov-scene__voile { background: linear-gradient(180deg, rgba(20, 18, 16, .35) 0%, rgba(20, 18, 16, .9) 70%); }
	.ov-scene__contenu { padding-top: 300px; }
}

/* ---- le programme (extraits) ---- */
.ov-programme { list-style: none; border-top: 1px solid var(--portee); max-width: 860px; }
.ov-programme__ligne { display: grid; grid-template-columns: 2.4rem 1fr auto 48px; gap: 1rem; align-items: center; padding: .85rem 0; border-bottom: 1px solid var(--portee); }
.ov-programme__num { font-family: var(--display); font-size: 1.15rem; color: var(--sourdine); font-variant-numeric: tabular-nums; }
.ov-programme__titre { font-family: var(--display); font-size: clamp(1.15rem, 2vw, 1.4rem); line-height: 1.2; display: flex; flex-direction: column; gap: .15rem; }
.ov-programme__auteur { font-family: var(--corps); font-size: .8rem; color: var(--sourdine); }
.ov-programme__duree { font-size: .82rem; color: var(--sourdine); font-variant-numeric: tabular-nums; }
.ov-programme__jouer { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--encre); background: var(--encre); color: var(--papier); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .15s, transform .15s; }
.ov-programme__jouer:hover { background: var(--anis); border-color: var(--anis); color: var(--encre); }
.ov-programme__ligne.est-en-cours .ov-programme__jouer { background: var(--anis); border-color: var(--anis); color: var(--encre); }
.ov-programme__ligne.est-en-cours .ov-programme__num { color: var(--anis-fonce); }
.ov-ico-jouer { width: 0; height: 0; border-left: 12px solid currentColor; border-top: 7px solid transparent; border-bottom: 7px solid transparent; margin-left: 3px; }
.est-en-cours .ov-ico-jouer { width: 12px; height: 14px; border: 0; border-left: 4px solid currentColor; border-right: 4px solid currentColor; margin-left: 0; }
.ov-ico-pause { width: 12px; height: 14px; border-left: 4px solid currentColor; border-right: 4px solid currentColor; }
.est-en-pause .ov-ico-pause { width: 0; height: 0; border: 0; border-left: 12px solid currentColor; border-top: 7px solid transparent; border-bottom: 7px solid transparent; margin-left: 3px; }
.ov-ico-suivant { width: 0; height: 0; border-left: 10px solid currentColor; border-top: 6px solid transparent; border-bottom: 6px solid transparent; box-shadow: 3px 0 0 -1px currentColor; }
@media (max-width: 560px) {
	.ov-programme__ligne { grid-template-columns: 1.8rem 1fr 48px; }
	.ov-programme__duree { display: none; }
}

/* ---- barre de lecture ---- */
.ov-lecteur { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; background: var(--scene); color: var(--scene-txt); border-top: 1px solid rgba(241, 238, 230, .12); display: grid; grid-template-columns: 48px 1fr auto 48px 40px; gap: 1rem; align-items: center; padding: .7rem var(--gouttiere); }
.ov-lecteur[hidden] { display: none; }
.ov-lecteur__bouton { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--anis); background: var(--anis); color: var(--encre); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.ov-lecteur__bouton--ligne { background: transparent; color: var(--scene-txt); border-color: rgba(241, 238, 230, .4); }
.ov-lecteur__infos { display: flex; flex-direction: column; min-width: 0; }
.ov-lecteur__surtitre { font-size: .62rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--anis); }
.ov-lecteur__titre { font-family: var(--display); font-style: italic; font-size: 1.1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov-lecteur__progression { grid-column: 1 / -1; grid-row: 2; height: 4px; background: rgba(241, 238, 230, .18); cursor: pointer; position: relative; }
.ov-lecteur__avance { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--anis); }
.ov-lecteur__temps { font-size: .78rem; color: var(--scene-sourdine); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ov-lecteur__fermer { background: none; border: 0; color: var(--scene-sourdine); font-size: 1.6rem; line-height: 1; cursor: pointer; width: 40px; height: 40px; }
.ov-lecteur__fermer:hover { color: var(--scene-txt); }
@media (min-width: 700px) {
	.ov-lecteur { grid-template-columns: 48px minmax(160px, 320px) 1fr auto 48px 40px; }
	.ov-lecteur__progression { grid-column: 3; grid-row: 1; }
}
@media (max-width: 699px) { .ov-lecteur__temps { display: none; } .ov-lecteur { grid-template-columns: 48px 1fr 48px 40px; } }

/* ---- les huit ---- */
.ov-huit { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1rem, 2.5vw, 2rem); }
.ov-pupitre { display: flex; flex-direction: column; gap: .8rem; }
.ov-pupitre__nom { font-size: .68rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--anis); border-bottom: 1px solid rgba(241, 238, 230, .2); padding-bottom: .5rem; }
.ov-les-huit--papier .ov-pupitre__nom { color: var(--anis-fonce); border-bottom-color: var(--portee); }
.ov-pupitre__paire { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.ov-chanteur { margin: 0; display: flex; flex-direction: column; gap: .5rem; }
.ov-chanteur img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; background: var(--scene-2); }
.ov-chanteur figcaption { font-family: var(--display); font-size: 1rem; line-height: 1.2; display: flex; flex-direction: column; }
.ov-chanteur__nom { color: var(--scene-sourdine); }
.ov-les-huit--papier .ov-chanteur__nom { color: var(--sourdine); }
.ov-chanteur__surnom { font-style: italic; color: var(--scene-sourdine); }
.ov-les-huit--papier .ov-chanteur__surnom { color: var(--sourdine); }
@media (max-width: 900px) { .ov-huit { grid-template-columns: repeat(2, 1fr); gap: 1.6rem 1.2rem; } }
@media (max-width: 480px) { .ov-huit { grid-template-columns: 1fr; } .ov-pupitre__paire { gap: .6rem; } }

/* ---- sans direction (accueil) ---- */
.ov-sans-direction__grille { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 2rem; align-items: start; }
.ov-sans-direction__texte { max-width: 62ch; display: flex; flex-direction: column; gap: 1.2rem; }
.ov-sans-direction__texte p + p { margin-top: 0; }
@media (max-width: 760px) { .ov-sans-direction__grille { grid-template-columns: 1fr; gap: .8rem; } }

/* ---- prochaine date ---- */
.ov-prochaine .ov-oeil { margin-bottom: 1.2rem; }
.ov-date { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1.4rem, 4vw, 3.5rem); align-items: start; }
.ov-date__quand { display: flex; flex-direction: column; text-decoration: none; line-height: .9; }
.ov-date__jour { font-family: var(--display); font-size: clamp(4.5rem, 12vw, 8rem); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ov-date__jour--mois { font-size: clamp(2.6rem, 7vw, 4.6rem); letter-spacing: -.02em; line-height: 1; padding-top: .4rem; }
.ov-date__mois { font-size: .74rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--anis-fonce); margin-top: .5rem; }
.ov-date__quoi { max-width: 60ch; display: flex; flex-direction: column; gap: .6rem; padding-top: .6rem; }
.ov-date__quoi h2 a { text-decoration: none; }
.ov-date__quoi h2 a:hover { text-decoration: underline; text-decoration-color: var(--anis); text-underline-offset: 6px; }
.ov-date__ligne { font-size: .95rem; color: var(--sourdine); }
.ov-date--vide { grid-template-columns: 1fr; }
.ov-date__phrase { font-family: var(--display); font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.3; max-width: 30ch; }
@media (max-width: 560px) { .ov-date { grid-template-columns: 1fr; gap: 1rem; } }

/* ---- où ils ont chanté ---- */
.ov-ou__grille { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 2rem; align-items: start; }
.ov-ou__texte { font-family: var(--display); font-size: clamp(1.25rem, 2.6vw, 1.7rem); line-height: 1.4; max-width: 34ch; text-wrap: pretty; }
@media (max-width: 760px) { .ov-ou__grille { grid-template-columns: 1fr; gap: .8rem; } }

/* ---- appel ---- */
.ov-appel { background: var(--scene); color: var(--scene-txt); padding-block: var(--section); }
.ov-appel__grille { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.ov-appel__texte { display: flex; flex-direction: column; gap: 1.1rem; max-width: 46ch; }
.ov-appel__texte p { color: var(--scene-sourdine); font-size: 1.05rem; }
.ov-appel__texte .ov-btn { align-self: flex-start; margin-top: .4rem; }
.ov-appel__photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 760px) { .ov-appel__grille { grid-template-columns: 1fr; } .ov-appel__photo { display: none; } }

/* ---- pied de page ---- */
.ov-pied { background: var(--scene); color: var(--scene-txt); padding-block: 3.5rem 2rem; border-top: 1px solid rgba(241, 238, 230, .1); }
.ov-pied a { color: inherit; text-decoration: none; }
.ov-pied a:hover { text-decoration: underline; text-decoration-color: var(--anis); text-underline-offset: 4px; }
.ov-pied__grille { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.ov-pied__lettrage { width: 200px; height: auto; margin-bottom: .8rem; }
.ov-pied__marque p { font-size: .82rem; color: var(--scene-sourdine); }
.ov-pied__bloc { display: flex; flex-direction: column; gap: .35rem; font-size: .95rem; }
.ov-pied__bloc p + p { margin-top: 0; }
.ov-pied__bloc .ov-oeil { margin-bottom: .4rem; }
.ov-pied__menu { list-style: none; display: flex; flex-direction: column; gap: .35rem; }
.ov-pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid rgba(241, 238, 230, .12); font-size: .8rem; color: var(--scene-sourdine); }
@media (max-width: 760px) { .ov-pied__grille { grid-template-columns: 1fr; gap: 1.8rem; } }

/* ---- pages intérieures ---- */
.ov-titre-page { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: clamp(1.5rem, 4vw, 2.5rem); display: flex; flex-direction: column; gap: .9rem; }
.ov-titre-page h1 { max-width: 16ch; }
.ov-titre-page__sous { font-family: var(--display); font-size: clamp(1.1rem, 2.2vw, 1.4rem); color: var(--sourdine); max-width: 44ch; line-height: 1.4; }
.ov-photo-pleine { margin: 0 auto; display: flex; flex-direction: column; gap: .6rem; }
.ov-photo-pleine img { width: 100%; }
.ov-photo-pleine--avant-bande { margin-bottom: var(--section); }
.ov-photo-pleine figcaption { font-size: .82rem; color: var(--sourdine); text-align: right; }
.ov-photo-pleine--legende-gauche figcaption { text-align: left; font-family: var(--display); font-size: 1.05rem; color: var(--encre); }
.ov-prose { max-width: 66ch; font-size: 1.05rem; }
.ov-prose--page { padding-bottom: var(--section); }
.ov-prose h2 { margin-top: 2rem; margin-bottom: .6rem; font-size: 1.6rem; }
.ov-prose h3 { margin-top: 1.5rem; margin-bottom: .4rem; }
.ov-prose ul, .ov-prose ol { padding-left: 1.2rem; margin-top: .6rem; display: flex; flex-direction: column; gap: .3rem; }
.ov-prose a { color: var(--anis-fonce); }
.ov-prose img { margin-block: 1.2rem; }

/* histoire */
.ov-histoire__grille { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.ov-histoire__texte { max-width: 62ch; display: flex; flex-direction: column; gap: 1.1rem; }
.ov-histoire__texte h2 { margin-bottom: .4rem; }
.ov-histoire__texte p + p { margin-top: 0; }
.ov-jalons { margin: 1rem 0 0; display: flex; flex-direction: column; border-top: 1px solid var(--portee); }
.ov-jalons > div { padding: .9rem 0; border-bottom: 1px solid var(--portee); display: flex; flex-direction: column; gap: .2rem; }
.ov-jalons dt { font-family: var(--display); font-size: 1.5rem; line-height: 1.1; }
.ov-jalons dd { margin: 0; font-size: .9rem; color: var(--sourdine); }
@media (max-width: 760px) { .ov-histoire__grille { grid-template-columns: 1fr; } }

/* sans direction (page) + disposition */
.ov-direction__grille { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.ov-direction__texte { display: flex; flex-direction: column; gap: 1.1rem; max-width: 56ch; }
.ov-direction__texte p { color: #D9D4C8; }
.ov-direction__texte p + p { margin-top: 0; }
.ov-disposition { margin: 0; display: flex; flex-direction: column; gap: 1.2rem; position: relative; padding: 2.5rem 0 0; }
.ov-disposition__portee { position: absolute; left: 0; right: 0; top: 2.9rem; height: 17px; background: repeating-linear-gradient(to bottom, var(--scene-portee) 0, var(--scene-portee) 1px, transparent 1px, transparent 4px); }
.ov-disposition__voix { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.ov-disposition__pupitre { display: flex; flex-direction: column; align-items: center; gap: .9rem; }
.ov-disposition__points { display: flex; gap: .55rem; }
.ov-disposition__points i { width: 18px; height: 18px; border-radius: 50%; background: var(--anis); box-shadow: 0 0 0 4px var(--scene); }
.ov-disposition__pupitre:nth-child(2) .ov-disposition__points { transform: translateY(-6px); }
.ov-disposition__pupitre:nth-child(3) .ov-disposition__points { transform: translateY(-12px); }
.ov-disposition__pupitre:nth-child(4) .ov-disposition__points { transform: translateY(-18px); }
.ov-disposition__nom { font-size: .66rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--scene-sourdine); text-align: center; }
.ov-disposition figcaption { font-size: .8rem; color: var(--scene-sourdine); text-align: center; }
@media (max-width: 760px) { .ov-direction__grille { grid-template-columns: 1fr; } }

/* vidéos (façade, iframe au clic) */
.ov-section__intro { max-width: 58ch; color: var(--sourdine); }
.ov-videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.ov-video { display: flex; flex-direction: column; gap: .6rem; min-width: 0; }
.ov-video__lancer { position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: .25rem; aspect-ratio: 16 / 9; width: 100%; padding: 1.4rem; background: var(--scene); color: var(--scene-txt); border: 0; text-align: left; cursor: pointer; overflow: hidden; }
.ov-video__lancer:hover .ov-video__bouton, .ov-video__lancer:focus-visible .ov-video__bouton { background: var(--anis); color: var(--encre); }
.ov-video__portee { position: absolute; left: -6%; right: -6%; top: 34%; display: block; height: 17px; background: repeating-linear-gradient(to bottom, var(--scene-portee) 0, var(--scene-portee) 1px, transparent 1px, transparent 4px); transform: rotate(-5deg); pointer-events: none; }
.ov-video__bouton { position: absolute; top: 1.4rem; right: 1.4rem; width: 56px; height: 56px; border-radius: 50%; background: var(--scene-txt); color: var(--encre); display: inline-flex; align-items: center; justify-content: center; transition: background .15s; }
.ov-video__titre { font-family: var(--display); font-size: clamp(1.4rem, 3vw, 1.9rem); line-height: 1.1; }
.ov-video__sous { font-size: .7rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--anis); }
.ov-video__cadre { aspect-ratio: 16 / 9; width: 100%; background: var(--scene); }
.ov-video__cadre iframe { width: 100%; height: 100%; border: 0; display: block; }
.ov-video__hote { font-size: .8rem; color: var(--sourdine); }
.ov-video__hote a { color: var(--anis-fonce); }

/* galerie + visionneuse */
.ov-galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1px; background: var(--portee); border: 1px solid var(--portee); }
.ov-galerie__vignette { display: block; background: var(--blanc); overflow: hidden; }
.ov-galerie__vignette img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .3s; }
.ov-galerie__vignette:hover img { transform: scale(1.03); }
.ov-galerie__vignette:focus-visible { outline-offset: -3px; }
.ov-galerie { grid-auto-rows: clamp(220px, 26vw, 330px); }
.ov-galerie__vignette img { aspect-ratio: auto; height: 100%; }
@media (min-width: 600px) { .ov-galerie__vignette:first-child { grid-column: span 2; } }
.ov-visionneuse { position: fixed; inset: 0; z-index: 90; background: rgba(20, 18, 16, .92); display: none; align-items: center; justify-content: center; padding: 3.5rem 1rem 3rem; max-width: none !important; }
.ov-visionneuse.est-ouverte { display: flex; }
.ov-visionneuse img { max-width: 100%; max-height: calc(100vh - 7rem); width: auto; height: auto; object-fit: contain; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.ov-visionneuse__bouton { position: fixed; z-index: 91; background: rgba(241, 238, 230, .1); border: 1px solid rgba(241, 238, 230, .35); color: var(--scene-txt); width: 48px; height: 48px; border-radius: 50%; font-size: 1.6rem; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.ov-visionneuse__bouton:hover { background: var(--anis); color: var(--encre); border-color: var(--anis); }
.ov-visionneuse__fermer { top: 1rem; right: 1rem; }
.ov-visionneuse__prec { left: .6rem; top: 50%; transform: translateY(-50%); }
.ov-visionneuse__suiv { right: .6rem; top: 50%; transform: translateY(-50%); }
.ov-visionneuse__legende { position: fixed; left: 0; right: 0; bottom: .9rem; text-align: center; font-size: .82rem; color: var(--scene-sourdine); padding-inline: 4rem; }
body.ov-visionneuse-ouverte { overflow: hidden; }
.ov-visionneuse.est-seule .ov-visionneuse__prec, .ov-visionneuse.est-seule .ov-visionneuse__suiv { display: none; }
.ov-prose img.ov-agrandissable { cursor: zoom-in; transition: opacity .2s; }
.ov-prose img.ov-agrandissable:hover { opacity: .88; }
.ov-prose img.ov-agrandissable:focus-visible { outline: 2px solid var(--anis-fonce); outline-offset: 3px; }

/* agenda */
.ov-liste-annonces { display: flex; flex-direction: column; border-top: 1px solid var(--portee); margin-top: 1.2rem; }
.ov-annonce { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 1rem clamp(1.2rem, 3vw, 2.5rem); padding: 1.5rem 0; border-bottom: 1px solid var(--portee); align-items: start; }
.ov-annonce:has(.ov-annonce__photo) { grid-template-columns: 5.5rem 1fr 220px; }
.ov-annonce__quand { display: flex; flex-direction: column; line-height: .95; text-decoration: none; }
.ov-annonce__jour { font-family: var(--display); font-size: 3rem; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ov-annonce__jour--mois { font-size: 1.9rem; letter-spacing: -.01em; padding-top: .3rem; }
.ov-annonce__mois, .ov-annonce__annee { font-size: .66rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--anis-fonce); margin-top: .35rem; }
.ov-annonce__annee { color: var(--sourdine); }
.ov-annonce__quand--actu { font-family: var(--display); font-size: 2rem; color: var(--sourdine); }
.ov-annonce__quand--actu small { display: block; font-family: var(--corps); font-size: .66rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; margin-top: .35rem; }
.ov-annonce__corps { display: flex; flex-direction: column; gap: .5rem; max-width: 62ch; }
.ov-annonce__corps h3 a { text-decoration: none; }
.ov-annonce__corps h3 a:hover { text-decoration: underline; text-decoration-color: var(--anis); text-underline-offset: 5px; }
.ov-annonce__ligne { font-size: .92rem; color: var(--sourdine); }
.ov-annonce__entree { font-size: .85rem; color: var(--sourdine); }
.ov-annonce__photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.ov-annonce--passe { padding: .9rem 0; }
.ov-annonce--passe .ov-annonce__jour { font-size: 1.8rem; color: var(--sourdine); }
.ov-annonce--passe h3 { font-size: 1.15rem; }
.ov-vide-agenda { margin-top: 1.2rem; display: flex; flex-direction: column; gap: .8rem; max-width: 52ch; }
@media (max-width: 700px) { .ov-annonce, .ov-annonce:has(.ov-annonce__photo) { grid-template-columns: 4.5rem 1fr; } .ov-annonce__photo { grid-column: 2; } }

/* annonce seule */
.ov-annonce-seule { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: var(--section); display: flex; flex-direction: column; gap: 1.4rem; }
.ov-annonce-seule h1 { max-width: 20ch; }
.ov-annonce-seule__quand { display: flex; flex-direction: column; gap: .3rem; padding: 1.2rem 0; border-top: 1px solid var(--portee); border-bottom: 1px solid var(--portee); max-width: 66ch; }
.ov-annonce-seule__date { font-family: var(--display); font-size: 1.5rem; }
.ov-annonce-seule__lieu a, .ov-annonce-seule__entree { color: var(--sourdine); }
.ov-annonce-seule__quand .ov-actions { margin-top: .8rem; }
.ov-annonce-seule .ov-photo-pleine { max-width: 66ch; }

/* contact */
.ov-contact__grille { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.ov-contact__coord { display: flex; flex-direction: column; gap: 1rem; padding-top: .4rem; }
.ov-contact__mail a { font-family: var(--display); font-size: clamp(1.2rem, 2.4vw, 1.5rem); text-decoration: none; border-bottom: 2px solid var(--anis); }
.ov-contact__zone { font-size: .9rem; color: var(--sourdine); }
@media (max-width: 800px) { .ov-contact__grille { grid-template-columns: 1fr; } }

.ov-form { display: flex; flex-direction: column; gap: 1.4rem; }
.ov-form__hp { position: absolute; left: -9999px; }
.ov-form__grille { display: grid; grid-template-columns: 1fr 1fr; gap: 1.3rem 1.6rem; align-items: end; }
.ov-champ { display: flex; flex-direction: column; gap: .4rem; }
.ov-champ--large { grid-column: 1 / -1; }
.ov-champ label { font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--sourdine); }
.ov-champ label span { font-weight: 400; letter-spacing: .04em; text-transform: none; }
.ov-champ input, .ov-champ select, .ov-champ textarea { width: 100%; font: inherit; color: var(--encre); background: var(--blanc); border: 1px solid var(--portee); border-bottom: 2px solid var(--encre); padding: .75rem .9rem; border-radius: 0; -webkit-appearance: none; appearance: none; }
.ov-champ select { background-image: linear-gradient(45deg, transparent 50%, var(--encre) 50%), linear-gradient(135deg, var(--encre) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 2.4rem; }
.ov-champ textarea { resize: vertical; min-height: 9rem; }
.ov-champ input:focus, .ov-champ select:focus, .ov-champ textarea:focus { outline: none; border-color: var(--anis-fonce); border-bottom-color: var(--anis-fonce); box-shadow: 0 0 0 3px rgba(195, 201, 74, .35); }
.ov-champ ::placeholder { color: #9A958A; }
.ov-form__pied { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.ov-form__note { font-size: .82rem; color: var(--sourdine); max-width: 40ch; }
.ov-message { padding: 1.1rem 1.3rem; border-left: 4px solid var(--anis); background: var(--blanc); margin-bottom: 1.4rem; max-width: 60ch; }
.ov-message--erreur { border-left-color: #9A2B2B; }
@media (max-width: 560px) { .ov-form__grille { grid-template-columns: 1fr; } }

/* 404 */
.ov-404 .ov-conteneur { display: flex; flex-direction: column; gap: 1.2rem; }
.ov-404__liens { list-style: none; display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; }
.ov-404__liens a { font-family: var(--display); font-size: 1.3rem; text-decoration: none; border-bottom: 2px solid var(--anis); }
