body.presentation { background: #100d16; }
.presentation header {
  padding: 1.4rem 0 0;
  background: radial-gradient(ellipse at 76% 55%, #401a42, transparent 58%), #100d16;
  border-color: #58334c;
}
.presentation .hero {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 42%);
  align-items: center;
  gap: 2rem;
  padding-block: clamp(2rem, 6vw, 5rem);
}
.presentation .hero h1, .presentation h2.section-title {
  font-family: Georgia, serif;
  font-weight: normal;
}
.presentation .hero h1 {
  font-size: clamp(2.4rem, 5.5vw, 4.75rem);
  line-height: .95;
  margin: .6rem 0;
}
.presentation .eyebrow {
  color: #ffc48a;
  font-size: .8rem;
  font-weight: bold;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.presentation .hero .tagline { color: #ffc48a; font-size: clamp(1.2rem, 3vw, 2rem); }
.presentation .hero .hero-date { margin-top: .7rem; color: #ddd0c5; }
.presentation .hero .intro { line-height: 1.65; margin-top: 1.15rem; max-width: 34rem; }
.presentation .hero img { border: 1px solid #83536c; border-radius: 1rem; }
.presentation .actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.5rem; }
.presentation .actions a {
  display: inline-block;
  padding: .8rem 1rem;
  border: 1px solid #a86f6a;
  border-radius: .45rem;
  text-decoration: none;
}
.presentation .actions .primary { background: #ffbf82; color: #201020; font-weight: bold; }
.presentation .actions .primary:hover { background: #ffe4c7; }
.presentation h2.section-title { font-size: clamp(2rem, 4vw, 3rem); margin: .4rem 0 1.25rem; }
.presentation .gallery { padding-block: 2.5rem; }
.presentation .tableaux {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.presentation .tableaux a {
  display: block;
  height: 100%;
  overflow: hidden;
  border: 1px solid #523447;
  border-radius: .7rem;
  background: #1c1521;
  color: #f4eee8;
  text-decoration: none;
}
.presentation .tableaux a:hover { border-color: #ffc48a; background: #2b1b2e; }
.presentation .tableaux img { border: 0; border-radius: 0; }
.presentation .card-title { display: flex; align-items: baseline; gap: .65rem; padding: .8rem; }
.presentation .card-number { color: #ffc48a; font-size: .8rem; font-variant-numeric: tabular-nums; }
.presentation article { scroll-margin-top: 1rem; }
.presentation article:target h2 { color: #ffc48a; }
@media (max-width: 650px) {
  .presentation .hero { grid-template-columns: 1fr; }
  .presentation .hero img { width: min(100%, 320px); }
}

.presentation #ouvrir-diaporama {
  display: block;
  position: fixed;
  right: 1rem;
  bottom: 3.8rem;
  z-index: 2;
  padding: .7rem .95rem;
  border: 1px solid #a86f6a;
  border-radius: .45rem;
  background: #ffbf82;
  color: #201020;
  font: inherit;
  font-weight: bold;
  cursor: pointer;
}
.presentation #ouvrir-diaporama[hidden] { display: none; }
.presentation #diaporama {
  width: 100vw;
  height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: .65rem;
  border: 0;
  background: #050408;
  color: white;
}
.presentation #diaporama[open] { display: grid; grid-template-rows: minmax(0, 1fr) auto; }
.presentation #diaporama img {
  height: 100%;
  width: 100%;
  min-height: 0;
  object-fit: contain;
  border: 0;
  border-radius: 0;
}
.presentation .diaporama-controls {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: .5rem;
  padding-top: .65rem;
}
.presentation .diaporama-controls button {
  min-height: 2.5rem;
  padding: .45rem .7rem;
  border: 1px solid #866778;
  border-radius: .4rem;
  background: #231a28;
  color: #fff;
  font: inherit;
  cursor: pointer;
}
.presentation .diaporama-controls button:disabled { opacity: .45; cursor: default; }

.presentation .diaporama-stage {
  display: grid;
  place-items: center;
  min-height: 0;
  container-type: size;
}
.presentation #diaporama .diaporama-frame img {
  width: 100%;
  height: auto;
}

.presentation .slide-link,
.presentation .diaporama-frame {
  --cadre: clamp(1rem, 2.7vw, 2.3rem);
  padding: 0;
  border: var(--cadre) solid #ad7830;
  border-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22320%22%20viewBox%3D%220%200%20320%20320%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22gold%22%20x2%3D%221%22%20y2%3D%221%22%20gradientUnits%3D%22objectBoundingBox%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%235d2e09%22%2F%3E%3Cstop%20offset%3D%22.23%22%20stop-color%3D%22%23e1ac46%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.4%22%20stop-color%3D%22%23fff0a8%22%2F%3E%3Cstop%20offset%3D%22.53%22%20stop-color%3D%22%239b5b17%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.73%22%20stop-color%3D%22%23edc362%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2364370c%22%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22rail%22%20x2%3D%220%22%20y2%3D%221%22%3E%0A%20%20%20%20%20%20%3Cstop%20stop-color%3D%22%236d3d10%22%2F%3E%3Cstop%20offset%3D%22.08%22%20stop-color%3D%22%23f9d47a%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.16%22%20stop-color%3D%22%239b601d%22%2F%3E%3Cstop%20offset%3D%22.52%22%20stop-color%3D%22%2366400f%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.62%22%20stop-color%3D%22%23fff0a5%22%2F%3E%3Cstop%20offset%3D%22.73%22%20stop-color%3D%22%23c39337%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.81%22%20stop-color%3D%22%23552b09%22%2F%3E%3Cstop%20offset%3D%22.87%22%20stop-color%3D%22%23edc368%22%2F%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22.93%22%20stop-color%3D%22%23ffeca0%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2388541c%22%2F%3E%0A%20%20%20%20%3C%2FlinearGradient%3E%0A%20%20%20%20%3Cpattern%20id%3D%22vine%22%20width%3D%2232%22%20height%3D%2228%22%20patternUnits%3D%22userSpaceOnUse%22%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M-3%2025Q8%203%2019%2019T35%203%22%20fill%3D%22none%22%20stroke%3D%22%23d7a744%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M5%2018Q0%203%2017%204Q16%2015%205%2018ZM19%2019Q33%2015%2029%207Q19%208%2019%2019Z%22%20fill%3D%22url%28%23gold%29%22%20stroke%3D%22%23633b10%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22m6%2016%208-9m7%2010%206-7%22%20stroke%3D%22%23ffdf89%22%20fill%3D%22none%22%2F%3E%0A%20%20%20%20%20%20%3Ccircle%20cx%3D%2215%22%20cy%3D%2223%22%20r%3D%222.5%22%20fill%3D%22%23f7d47f%22%2F%3E%0A%20%20%20%20%3C%2Fpattern%3E%0A%20%20%20%20%3Cg%20id%3D%22edge%22%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M72%200h176v72H72z%22%20fill%3D%22url%28%23rail%29%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M72%2010h176v36H72z%22%20fill%3D%22%2379501d%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M72%2010h176v36H72z%22%20fill%3D%22url%28%23vine%29%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M72%207h176m-176%2042h176m-176%2013h176%22%20stroke%3D%22%23f6d887%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M72%2056h176%22%20stroke%3D%22%23593610%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3Cg%20id%3D%22corner%22%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M0%2072V5Q0%200%205%200h67v72Z%22%20fill%3D%22url%28%23gold%29%22%20stroke%3D%22%23624016%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M5%2072V5h67v60H65v7%22%20fill%3D%22%2379501d%22%20stroke%3D%22%23ffdd87%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M12%2072V12h60v36L48%2072Z%22%20fill%3D%22url%28%23vine%29%22%2F%3E%0A%20%20%20%20%20%20%3Cg%20fill%3D%22url%28%23gold%29%22%20stroke%3D%22%2356300d%22%20stroke-width%3D%221.2%22%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M64%2064C52%2047%2019%2054%2013%2018c13%204%2019%207%2022%2018C28%2018%2037%2012%2047%2012c-4%209-3%2019%200%2029C49%2021%2057%2014%2067%2012c-6%2010-11%2022-10%2032C63%2034%2068%2027%2076%2024c-4%2012-10%2019-17%2027Z%22%2F%3E%0A%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M64%2064C47%2052%2054%2019%2018%2013c4%2013%207%2019%2018%2022C18%2028%2012%2037%2012%2047c9-4%2019-3%2029%200C21%2049%2014%2057%2012%2067c10-6%2022-11%2032-10C34%2063%2027%2068%2024%2076c12-4%2019-10%2027-17Z%22%2F%3E%0A%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M17%2017Q35%2045%2064%2064M44%2016Q38%2039%2064%2064M16%2044Q39%2038%2064%2064M63%2018Q47%2041%2064%2064M18%2063Q41%2047%2064%2064%22%20fill%3D%22none%22%20stroke%3D%22%23f8db88%22%20stroke-width%3D%221.5%22%2F%3E%0A%20%20%20%20%20%20%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%225%22%20fill%3D%22url%28%23gold%29%22%20stroke%3D%22%23ffe49a%22%2F%3E%0A%20%20%20%20%20%20%3Cpath%20d%3D%22M55%2072V55h17m-10%2017V62h10m-4%2010v-4h4%22%20fill%3D%22none%22%20stroke%3D%22%23efd088%22%20stroke-width%3D%222%22%2F%3E%0A%20%20%20%20%3C%2Fg%3E%0A%20%20%3C%2Fdefs%3E%0A%20%20%3Cuse%20href%3D%22%23edge%22%2F%3E%3Cuse%20href%3D%22%23edge%22%20transform%3D%22rotate%2890%20160%20160%29%22%2F%3E%0A%20%20%3Cuse%20href%3D%22%23edge%22%20transform%3D%22rotate%28180%20160%20160%29%22%2F%3E%3Cuse%20href%3D%22%23edge%22%20transform%3D%22rotate%28270%20160%20160%29%22%2F%3E%0A%20%20%3Cuse%20href%3D%22%23corner%22%2F%3E%3Cuse%20href%3D%22%23corner%22%20transform%3D%22rotate%2890%20160%20160%29%22%2F%3E%0A%20%20%3Cuse%20href%3D%22%23corner%22%20transform%3D%22rotate%28180%20160%20160%29%22%2F%3E%3Cuse%20href%3D%22%23corner%22%20transform%3D%22rotate%28270%20160%20160%29%22%2F%3E%0A%3C%2Fsvg%3E") 72 round;
  border-radius: 0;
  background: #5d350e;
  box-shadow: 0 .3rem 1.2rem #0009;
}
.presentation .slide-link img,
.presentation #diaporama .diaporama-frame img {
  border: 0;
}
.presentation .diaporama-frame {
  width: min(100cqw, calc(177.78cqh - 1.56 * var(--cadre)));
}