:root {
  --cm-forest: #214b38;
  --cm-forest-dark: #163528;
  --cm-moss: #7c967b;
  --cm-sand: #f4efe5;
  --cm-paper: #fbfaf7;
  --cm-ink: #202b26;
  --cm-muted: #64716a;
  --cm-rust: #b45e3b;
  --cm-line: #d6d1c5;
  --cm-shadow: 0 18px 45px rgba(24, 47, 36, .13);
  --cm-max: 76rem;
  --cm-gutter: clamp(1rem, 4vw, 3.5rem);
  --cm-serif: Georgia, "Times New Roman", serif;
  --cm-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--cm-sand); color: var(--cm-ink); font-family: var(--cm-sans); font-size: 1rem; line-height: 1.65; overflow-wrap: anywhere; }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--cm-forest); text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover { color: var(--cm-rust); }
:focus-visible { outline: 3px solid var(--cm-rust); outline-offset: 3px; }
h1, h2, h3 { color: var(--cm-forest-dark); font-family: var(--cm-serif); line-height: 1.08; letter-spacing: -.025em; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(2.4rem, 6vw, 5.2rem); }
h2 { font-size: clamp(1.9rem, 3vw, 3rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.6rem); }

.cm-passe { width: min(100% - (var(--cm-gutter) * 2), var(--cm-max)); margin-inline: auto; }
.cm-skip { position: absolute; left: -9999px; top: 1rem; z-index: 20; background: var(--cm-forest-dark); color: white; padding: .65rem 1rem; }
.cm-skip:focus { left: 1rem; }

.cm-corniche { position: relative; z-index: 5; background: var(--cm-paper); border-bottom: 1px solid var(--cm-line); }
.cm-corniche__rang { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; min-height: 5.5rem; }
.cm-enseigne { display: grid; gap: .12rem; color: var(--cm-forest-dark); text-decoration: none; flex: 0 0 auto; }
.cm-enseigne strong { font-family: var(--cm-serif); font-size: clamp(1.3rem, 2.4vw, 2rem); letter-spacing: -.03em; }
.cm-enseigne span { color: var(--cm-muted); font-size: .72rem; letter-spacing: .11em; text-transform: uppercase; }
.cm-visite { min-width: 0; }
.cm-visite ul { display: flex; gap: .35rem .95rem; align-items: center; justify-content: flex-end; list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: thin; }
.cm-visite a { display: block; padding: .65rem .15rem; color: var(--cm-ink); font-size: .77rem; font-weight: 700; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.cm-visite a[aria-current="page"] { color: var(--cm-rust); box-shadow: inset 0 -3px 0 var(--cm-rust); }

.cm-accroche { position: relative; min-height: 20rem; overflow: hidden; background: var(--cm-forest-dark); color: white; }
.cm-accroche__vue { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cm-accroche__voile { position: absolute; inset: 0; background: rgba(22, 53, 40, .78); }
.cm-accroche__contenu { position: relative; display: grid; align-content: center; min-height: 20rem; padding-block: 3rem; }
.cm-accroche h1, .cm-accroche p { max-width: 42rem; color: white; }
.cm-accroche h1 { margin-bottom: .8rem; font-size: clamp(2.7rem, 7vw, 6rem); }
.cm-accroche__contenu > p:not(.cm-inventaire) { max-width: 40rem; margin-bottom: 1.25rem; font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
.cm-inventaire { margin-bottom: .55rem; color: var(--cm-rust); font-size: .73rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.cm-accroche .cm-inventaire { color: #e8c0a9; }
.cm-action { display: inline-flex; width: fit-content; align-items: center; justify-content: center; min-height: 2.8rem; padding: .7rem 1rem; background: var(--cm-rust); color: white; font-weight: 800; text-decoration: none; }
.cm-action:hover { background: white; color: var(--cm-forest-dark); }

.cm-salle { padding-block: clamp(2.2rem, 5vw, 4.5rem); }
.cm-salle + .cm-salle { border-top: 1px solid var(--cm-line); }
.cm-salle__bandeau { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; border-bottom: 3px solid var(--cm-forest); }
.cm-salle__bandeau h2 { margin-bottom: .55rem; }
.cm-salle__note { margin-bottom: .8rem; color: var(--cm-muted); font-size: .85rem; }
.cm-cimaise { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
.cm-tirage { min-width: 0; background: var(--cm-paper); box-shadow: var(--cm-shadow); }
.cm-tirage__media { display: block; overflow: hidden; background: var(--cm-moss); }
.cm-tirage__media img { width: 100%; aspect-ratio: 1.45; object-fit: cover; transition: transform .25s ease; }
.cm-tirage__media:hover img { transform: scale(1.035); }
.cm-tirage__cartel { padding: 1rem 1rem 1.15rem; }
.cm-tirage__cartel .cm-inventaire { margin-bottom: .35rem; font-size: .65rem; }
.cm-tirage h3 { margin-bottom: .5rem; font-size: 1.25rem; }
.cm-tirage h3 a { color: inherit; text-decoration: none; }
.cm-tirage h3 a:hover { color: var(--cm-rust); text-decoration: underline; }
.cm-tirage__cartel p:not(.cm-inventaire) { margin-bottom: .7rem; color: var(--cm-muted); font-size: .92rem; line-height: 1.5; }
.cm-tirage time { color: var(--cm-muted); font-size: .76rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.cm-cimaise--section { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.cm-repertoire { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
.cm-repertoire__entry { position: relative; min-width: 0; overflow: hidden; background: var(--cm-forest-dark); }
.cm-repertoire__entry img { width: 100%; aspect-ratio: 1.25; object-fit: cover; opacity: .72; transition: transform .25s ease, opacity .25s ease; }
.cm-repertoire__entry a:hover img { opacity: .9; transform: scale(1.04); }
.cm-repertoire__entry a { display: block; color: white; text-decoration: none; }
.cm-repertoire__entry span, .cm-repertoire__entry small { position: absolute; left: 1rem; right: 1rem; }
.cm-repertoire__entry span { bottom: 2.1rem; font-family: var(--cm-serif); font-size: 1.45rem; line-height: 1.05; }
.cm-repertoire__entry small { bottom: 1rem; color: #e6d9c6; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; }
.cm-dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 2rem; list-style: none; margin: 0; padding: 0; }
.cm-dates li { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--cm-line); }
.cm-dates time { color: var(--cm-muted); font-size: .78rem; font-weight: 700; text-transform: uppercase; }
.cm-dates a { font-weight: 700; }

.cm-fil { padding-block: 1.2rem; color: var(--cm-muted); font-size: .78rem; }
.cm-fil ol { display: flex; flex-wrap: wrap; gap: .35rem .65rem; list-style: none; margin: 0; padding: 0; }
.cm-fil li + li::before { content: ">"; margin-right: .65rem; color: var(--cm-line); }
.cm-fil a { color: inherit; }
.cm-section-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr); align-items: stretch; margin-bottom: 1rem; background: var(--cm-paper); box-shadow: var(--cm-shadow); }
.cm-section-hero img { width: 100%; height: 100%; min-height: 18rem; object-fit: cover; }
.cm-section-hero > div { align-self: center; padding: clamp(1.4rem, 4vw, 3.2rem); }
.cm-section-hero h1 { margin-bottom: .8rem; font-size: clamp(2.3rem, 5vw, 4.5rem); }
.cm-section-hero p:last-child { margin-bottom: 0; color: var(--cm-muted); }

.cm-article { max-width: 58rem; margin-inline: auto; }
.cm-ouverture { max-width: 48rem; padding-block: 1.4rem 1.6rem; }
.cm-ouverture h1 { margin-bottom: .9rem; font-size: clamp(2.5rem, 6vw, 4.8rem); }
.cm-ouverture__chapo { color: var(--cm-muted); font-size: clamp(1.1rem, 2vw, 1.35rem); }
.cm-indications { display: flex; flex-wrap: wrap; gap: .45rem 1.1rem; list-style: none; margin: 0; padding: 0; color: var(--cm-muted); font-size: .78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.cm-planche { margin: 0 0 2rem; }
.cm-planche img { width: 100%; max-height: 34rem; object-fit: cover; box-shadow: var(--cm-shadow); }
.cm-planche figcaption, .cm-diptyque figcaption { padding-top: .45rem; color: var(--cm-muted); font-size: .78rem; }
.cm-article-body { max-width: 42rem; font-family: var(--cm-serif); font-size: 1.08rem; }
.cm-article-body h2 { margin-top: 2.4rem; font-size: 1.8rem; }
.cm-article-body p, .cm-article-body li { line-height: 1.78; }
.cm-article-body ul, .cm-article-body ol { padding-left: 1.35rem; }
.cm-diptyque { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 2rem 0; }
.cm-diptyque img { width: 100%; aspect-ratio: 1.2; object-fit: cover; }
.cm-diptyque figcaption { grid-column: 1 / -1; }
.cm-exergue { margin: 2rem 0; border-left: 4px solid var(--cm-rust); padding: .5rem 0 .5rem 1.2rem; color: var(--cm-forest); font-family: var(--cm-serif); font-size: 1.35rem; line-height: 1.35; }
.cm-article-meta { margin-top: 2.2rem; border-top: 1px solid var(--cm-line); padding-top: 1rem; font-family: var(--cm-sans); font-size: .9rem; }
.cm-simple { max-width: 52rem; margin-inline: auto; padding-bottom: 4rem; }
.cm-simple .cm-article-body { max-width: 44rem; }
.cm-simple .cm-ouverture { padding-top: 2.5rem; }

.cm-socle { background: var(--cm-forest-dark); color: #ecf0e9; }
.cm-socle__rang { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 2rem; padding-block: 3rem; }
.cm-socle p { color: #c9d4ca; }
.cm-socle__kicker { color: white !important; font-family: var(--cm-serif); font-size: 1.4rem; }
.cm-socle h2 { color: white; font-family: var(--cm-sans); font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; }
.cm-socle ul { list-style: none; margin: 0; padding: 0; }
.cm-socle li { margin-bottom: .35rem; }
.cm-socle a { color: #d8e6d6; }
.cm-socle__bas { margin: 0; border-top: 1px solid rgba(255,255,255,.2); padding-block: 1rem; font-size: .78rem; }

.cm-error { display: grid; align-content: center; min-height: 100vh; width: min(100% - 2rem, 42rem); margin-inline: auto; }
.cm-error h1 { margin-bottom: .8rem; }

@media (max-width: 68rem) {
  .cm-cimaise { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm-repertoire { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 50rem) {
  .cm-corniche__rang { display: block; padding-block: .8rem; }
  .cm-enseigne { margin-bottom: .65rem; }
  .cm-visite ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .15rem .4rem;
    align-items: stretch;
    overflow: visible;
    padding-bottom: .15rem;
  }
  .cm-visite a {
    height: 100%;
    padding: .5rem .2rem;
    text-align: center;
    white-space: normal;
  }
  .cm-accroche, .cm-accroche__contenu { min-height: 18rem; }
  .cm-section-hero { grid-template-columns: 1fr; }
  .cm-section-hero img { min-height: 12rem; max-height: 20rem; }
  .cm-socle__rang { grid-template-columns: 1fr 1fr; }
  .cm-socle__rang > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 36rem) {
  body { font-size: .96rem; }
  .cm-cimaise, .cm-cimaise--section, .cm-repertoire, .cm-dates { grid-template-columns: 1fr; }
  .cm-salle__bandeau { display: block; }
  .cm-salle__note { margin-bottom: .7rem; }
  .cm-dates li { grid-template-columns: 7rem minmax(0, 1fr); gap: .65rem; }
  .cm-diptyque { grid-template-columns: 1fr; }
  .cm-diptyque figcaption { grid-column: auto; }
  .cm-socle__rang { grid-template-columns: 1fr; }
  .cm-socle__rang > div:first-child { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

@media print {
  .cm-corniche, .cm-socle, .cm-accroche__voile { background: white; color: black; }
  .cm-visite, .cm-socle { display: none; }
}